@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter_18pt-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
.purchase-path{display:flex;align-items:center;gap:10px;margin:0 0 18px;padding:14px 18px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:16px}.purchase-path>div{display:grid;grid-template-columns:26px 1fr;column-gap:8px;align-items:center;min-width:0}.purchase-path-step{display:grid;grid-row:1/3;place-items:center;width:26px;height:26px;border-radius:50%;background:#EDF2F7;color:#293A50;font-size:11px;font-weight:800}.purchase-path-step.is-done{background:#14243A;color:#FFFFFF}.purchase-path strong{font-size:11px;color:#14243A}.purchase-path small{color:#627083;font-size:10px}.purchase-path i{flex:1;height:1px;background:#EDF2F7}.purchase-action{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:20px;padding:14px 16px;background:linear-gradient(110deg,#EDF2F7,#EDF2F7);border:1px solid #EDF2F7;border-radius:12px}.purchase-action>div{display:grid;gap:4px}.purchase-action strong{font-size:13px;color:#14243A}.purchase-action small{color:#627083;font-size:11px}.purchase-action form{margin:0}.purchase-action .button{white-space:nowrap}.purchase-action.is-complete{background:#FFFFFF}.purchase-action.is-complete a,.purchase-action.is-pending a{font-size:11px;font-weight:750;color:#14243A}.purchase-action.is-pending{background:#EDF2F7;border-color:#FFE4DF}
.purchase-quick-start{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px;padding:12px 14px;background:var(--na-coral);border:1px solid #EDF2F7;border-radius:11px;color:var(--na-white)!important;}.purchase-quick-start>div{display:grid;gap:3px}.purchase-quick-start span{color:#14243A;font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.purchase-quick-start strong{color:#14243A;font-size:13px}.purchase-quick-start form{margin:0}.purchase-quick-start .button{white-space:nowrap;padding:9px 12px}.purchase-quick-start.is-complete{background:#FFFFFF;border-color:#EDF2F7}.purchase-quick-start.is-complete a{color:#14243A;font-size:11px;font-weight:750}@media(max-width:600px){.purchase-quick-start{align-items:flex-start;flex-direction:column}.purchase-quick-start form,.purchase-quick-start .button{width:100%}}

/* Premium gallery images are event media, not portrait substitutes. */
.premium-public-gallery { display: block; }
.premium-gallery-heading { margin: 2px 4px 12px; }
.premium-gallery-heading h2 { margin: 3px 0 0; font-size: 18px; }
.premium-gallery-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.premium-gallery-grid figure { margin: 0; }
.premium-gallery-grid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; }
.premium-gallery-grid figcaption { padding: 5px; color: var(--muted); font-size: 10px; }
@media (max-width: 720px) {
  .premium-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Premium listings, local location resolution, and support */
.premium-tag {
  min-height: 22px;
  padding: 0 7px;
  color: #14243A;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  font-size: 9px;
}

.premium-tag img {
  width: 12px;
  height: 12px;
}

.job-listing-card.is-premium,
.compact-listing.is-premium {
  box-shadow: inset 3px 0 0 #14243A;
}

.field-pincode {
  max-width: 140px;
}

.location-resolved {
  display: block;
  margin-top: 4px;
  color: #14243A;
  font-size: 10px;
  line-height: 1.35;
}

.postal-location-picker {
  grid-column: 1 / -1;
  overflow: hidden;
  margin-top: -5px;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  box-shadow: 0 10px 26px rgba(20,36,58, .08);
}

.postal-picker-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
  padding: 9px 12px;
  background: #FFFFFF;
  border-bottom: 1px solid var(--line);
}

.postal-picker-head > span:first-child,
.postal-option-main,
.postal-option-detail {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.postal-picker-head strong {
  color: #14243A;
  font-size: 11px;
}

.postal-picker-head small {
  overflow: hidden;
  color: var(--muted);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.postal-picker-loader {
  display: none;
  width: 15px;
  height: 15px;
  border: 2px solid #EDF2F7;
  border-top-color: var(--brand);
  border-radius: 50%;
  animation: postal-spin .65s linear infinite;
}

.postal-location-picker.is-loading .postal-picker-loader {
  display: block;
}

.postal-location-picker.has-selection {
  border-color: #627083;
  box-shadow: none;
}

.postal-location-picker.has-selection .postal-picker-head {
  background: #EDF2F7;
  border-bottom: 0;
}

.postal-location-options {
  display: grid;
  max-height: 310px;
  overflow-y: auto;
}

.postal-location-option {
  display: grid;
  grid-template-columns: 13px minmax(150px, 1.5fr) minmax(110px, 1fr) minmax(110px, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 8px 12px;
  color: inherit;
  text-align: left;
  background: #FFFFFF;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  cursor: pointer;
}

.postal-location-option:last-child {
  border-bottom: 0;
}

.postal-location-option:hover,
.postal-location-option:focus-visible {
  background: #FFFFFF;
  outline: none;
}

.postal-option-mark {
  width: 10px;
  height: 10px;
  border: 2px solid #293A50;
  border-radius: 50%;
}

.postal-location-option:hover .postal-option-mark,
.postal-location-option:focus-visible .postal-option-mark {
  border-color: var(--brand);
  box-shadow: inset 0 0 0 2px #FFFFFF;
  background: var(--brand);
}

.postal-option-main strong {
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.postal-option-main small,
.postal-option-detail small {
  color: var(--muted);
  font-size: 8px;
}

.postal-option-detail b {
  overflow: hidden;
  color: #14243A;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.postal-selected-details {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  align-items: end;
  gap: 9px 14px;
  padding: 11px 12px;
}

.postal-selected-details > span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.postal-selected-details small {
  color: var(--muted);
  font-size: 8px;
  text-transform: uppercase;
}

.postal-selected-details b {
  overflow: hidden;
  color: #14243A;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.postal-change-button {
  min-height: 30px;
  padding: 0 10px;
  color: var(--brand-dark);
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  font-size: 9px;
  font-weight: 700;
}

@keyframes postal-spin {
  to { transform: rotate(360deg); }
}

.premium-workspace,
.premium-analytics,
.contact-page {
  display: grid;
  gap: 20px;
}

.premium-plans-section,
.premium-campaign-section,
.analytics-table-section {
  padding: 18px 0;
  border-top: 1px solid var(--line);
}

.premium-plan-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.premium-plan-card {
  display: grid;
  gap: 13px;
  padding: 17px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 3px solid #14243A;
  border-radius: 7px;
}

.premium-plan-card > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.premium-plan-card h3,
.premium-campaign-table h3 {
  margin: 0;
  font-size: 15px;
}

.premium-plan-card > div > strong {
  color: #14243A;
  font-size: 20px;
}

.premium-plan-icon {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  background: #EDF2F7;
  border-radius: 6px;
}

.premium-plan-icon img {
  width: 16px;
}

.premium-plan-card dl,
.premium-campaign-table dl,
.contact-layout dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.premium-plan-card dl div,
.premium-campaign-table dl div,
.contact-layout dl div {
  display: grid;
  gap: 2px;
}

.premium-plan-card dt,
.premium-campaign-table dt,
.contact-layout dt {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
}

.premium-plan-card dd,
.premium-campaign-table dd,
.contact-layout dd {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
}

.premium-plan-card > label {
  margin-bottom: -8px;
  font-size: 10px;
  font-weight: 700;
}

.premium-job-selection-form {
  display: grid;
  gap: 11px;
}

.premium-job-checklist {
  display: grid;
  max-height: 230px;
  overflow-y: auto;
  gap: 7px;
  margin: 0;
  padding: 0;
  border: 0;
}

.premium-job-checklist legend {
  margin-bottom: 1px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}

.premium-job-checklist label {
  display: grid;
  grid-template-columns: 17px minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  min-height: 48px;
  padding: 9px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.premium-job-checklist input {
  width: 15px;
  height: 15px;
  margin-top: 2px;
  accent-color: #14243A;
}

.premium-job-checklist span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.premium-job-checklist strong {
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.premium-job-checklist small {
  overflow: hidden;
  color: var(--muted);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.premium-campaign-table {
  display: grid;
  gap: 8px;
}

.premium-campaign-table article {
  display: grid;
  grid-template-columns: minmax(220px, 1.5fr) minmax(260px, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 13px 15px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.premium-campaign-table article > div:first-child {
  display: grid;
  gap: 4px;
}

.campaign-actions {
  display: grid;
  justify-items: end;
  gap: 4px;
}

.premium-metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.premium-metric-grid article {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 15px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.premium-metric-grid img {
  width: 20px;
  height: 20px;
}

.premium-metric-grid span {
  display: grid;
}

.premium-metric-grid strong {
  font-size: 22px;
}

.responsive-data-table {
  overflow: hidden;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.responsive-data-table > div {
  display: grid;
  grid-template-columns: minmax(180px, 2fr) repeat(3, minmax(90px, 1fr));
  gap: 12px;
  padding: 10px 13px;
  border-bottom: 1px solid var(--line);
  font-size: 11px;
}

.responsive-data-table > div:last-child {
  border-bottom: 0;
}

.responsive-data-table .data-table-head {
  color: var(--muted);
  background: #FFFFFF;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
}

.contact-layout {
  display: grid;
  grid-template-columns: minmax(230px, .7fr) minmax(0, 1.5fr);
  overflow: hidden;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.contact-layout aside {
  padding: 25px;
  color: #FFFFFF;
  background: #14243A;
}

.contact-layout aside > span {
  display: grid;
  width: 36px;
  height: 36px;
  margin-bottom: 22px;
  place-items: center;
  background: #FFFFFF;
  border-radius: 6px;
}

.contact-layout aside img {
  width: 18px;
}

.contact-layout aside h2 {
  margin: 0 0 8px;
  font-size: 20px;
}

.contact-layout aside p {
  color: #EDF2F7;
  font-size: 12px;
  line-height: 1.55;
}

.contact-layout aside dl {
  margin-top: 28px;
}

.contact-layout aside dt {
  color: #EDF2F7;
}

.contact-form {
  display: grid;
  gap: 15px;
  padding: 25px;
}

.contact-form label {
  display: grid;
  gap: 6px;
  min-width: 0;
  font-size: 11px;
  font-weight: 700;
}

.contact-form label small,
.contact-submit small {
  color: var(--muted);
  font-weight: 400;
}

.contact-form input,
.contact-form select,
.contact-form textarea {
  width: 100%;
  font-size: 12px;
}

.contact-honeypot {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.contact-submit {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}

.site-footer {
  padding: 18px 20px;
  border-top: 1px solid var(--line);
}

.site-footer > div {
  display: flex;
  max-width: 1180px;
  margin: 0 auto;
  gap: 18px;
  color: var(--muted);
  font-size: 11px;
}

.site-footer a {
  color: var(--brand-dark);
}

@media (max-width: 800px) {
  .premium-plan-grid,
  .premium-metric-grid {
    grid-template-columns: 1fr;
  }

  .premium-campaign-table article {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .campaign-actions {
    justify-items: start;
  }

  .contact-layout {
    grid-template-columns: 1fr;
  }

  .contact-layout aside,
  .contact-form {
    padding: 18px;
  }

  .responsive-data-table {
    overflow-x: auto;
  }

  .responsive-data-table > div {
    min-width: 620px;
  }

  .field-pincode {
    max-width: none;
  }

  .postal-location-option {
    grid-template-columns: 13px minmax(0, 1fr);
    gap: 8px;
    min-height: 58px;
  }

  .postal-option-detail {
    grid-column: 2;
    display: flex;
    align-items: baseline;
    gap: 5px;
  }

  .postal-option-detail + .postal-option-detail {
    margin-top: -5px;
  }

  .postal-selected-details {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .postal-change-button {
    grid-column: 1 / -1;
  }

  .contact-submit {
    align-items: flex-start;
    flex-direction: column;
  }
}

@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter_18pt-Medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter_18pt-SemiBold.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter_18pt-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins-SemiBold.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

:root {
  --ink: #0B1423;
  --muted: #627083;
  --soft: #EDF2F7;
  --paper: #FFFFFF;
  --line: #EDF2F7;
  --line-strong: #EDF2F7;
  --brand: #14243A;
  --brand-dark: #14243A;
  --brand-soft: #EDF2F7;
  --navy: #14243A;
  --orange: #FF6B61;
  --orange-soft: #EDF2F7;
  --danger: #BA3C38;
  --shadow-sm: 0 4px 14px rgba(20,36,58, .06);
  --shadow-md: 0 18px 50px rgba(20,36,58, .10);
  --container: 1200px;
}

[hidden] {
  display: none !important;
}

* {
  box-sizing: border-box;
}

html {
  min-width: 320px;
  scroll-behavior: smooth;
}

body {
  min-width: 320px;
  margin: 0;
  color: var(--ink);
  background: var(--soft);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
p {
  overflow-wrap: anywhere;
}

h1,
h2,
h3,
.brand {
  font-family: "Poppins", "Inter", sans-serif;
  letter-spacing: 0;
}

.site-brand-logo {
  display: block;
  width: auto;
  max-width: 168px;
  height: auto;
  max-height: 38px;
  object-fit: contain;
}

.auth-brand {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 8px;
  min-height: 34px;
  margin-bottom: 14px;
  color: var(--brand-dark);
  font-family: "Poppins", "Inter", sans-serif;
  font-size: 15px;
  font-weight: 600;
}

.auth-brand > img {
  display: block;
  width: auto;
  max-width: 190px;
  height: auto;
  max-height: 46px;
  object-fit: contain;
}

.auth-brand .brand-mark {
  width: 30px;
  height: 30px;
  font-size: 14px;
}

@media (max-width: 480px) {
  .site-brand-logo {
    max-width: 132px;
    max-height: 32px;
  }

  .auth-brand > img {
    max-width: 158px;
    max-height: 40px;
  }
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select,
textarea {
  font-family: "Inter", sans-serif;
  letter-spacing: 0;
}

button,
summary,
a,
label[for] {
  -webkit-tap-highlight-color: transparent;
}

:focus-visible {
  outline: 3px solid rgba(20,36,58, .28);
  outline-offset: 2px;
}

.container {
  width: min(var(--container), calc(100% - 40px));
  margin-inline: auto;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 100;
  padding: 9px 12px;
  color: var(--paper);
  background: var(--navy);
  border-radius: 6px;
  transform: translateY(-150%);
}

.skip-link:focus {
  transform: translateY(0);
}

/* Header */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  min-height: 58px;
  background: rgba(255,255,255, .97);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
}

.header-inner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  width: min(1440px, calc(100% - 40px));
  min-height: 58px;
  margin-inline: auto;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  width: max-content;
  font-size: 18px;
  font-weight: 600;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  color: var(--paper);
  background: var(--brand);
  border-radius: 7px;
  font-family: "Inter", sans-serif;
  font-size: 15px;
  font-weight: 700;
}

.desktop-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-width: 0;
}

.desktop-nav a,
.desktop-account > a,
.text-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 10px;
  color: #454B54;
  border: 0;
  border-radius: 6px;
  background: transparent;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.desktop-nav a:hover,
.desktop-nav a.active,
.desktop-account > a:hover,
.text-button:hover {

  background: var(--na-coral);
;color:var(--na-white)!important;}

.desktop-nav a.active {
  box-shadow: inset 0 -2px 0 var(--brand);
  border-radius: 6px 6px 0 0;
}

.desktop-jobs-menu {
  position: relative;
}

.desktop-jobs-menu > summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 10px;
  color: #454B54;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  list-style: none;
  white-space: nowrap;
}

.desktop-jobs-menu > summary::-webkit-details-marker {
  display: none;
}

.desktop-jobs-menu > summary img {
  width: 13px;
  height: 13px;
  opacity: .68;
}

.desktop-jobs-menu > summary .desktop-jobs-chevron {
  width: 11px;
  height: 11px;
  margin-left: 1px;
  opacity: .45;
  transform: rotate(90deg);
  transition: transform .16s ease;
}

.desktop-jobs-menu > summary:hover,
.desktop-jobs-menu.active > summary,
.desktop-jobs-menu[open] > summary {

  background: var(--na-coral);
;color:var(--na-white)!important;}

.desktop-jobs-menu.active > summary {
  box-shadow: inset 0 -2px 0 var(--brand);
  border-radius: 6px 6px 0 0;
}

.desktop-jobs-menu[open] .desktop-jobs-chevron {
  transform: rotate(-90deg);
}

.desktop-jobs-popover {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 20;
  display: grid;
  width: 205px;
  padding: 6px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow-md);
}

.desktop-nav .desktop-jobs-popover a {
  justify-content: flex-start;
  gap: 9px;
  min-height: 38px;
  padding: 0 10px;
  border-radius: 5px;
  box-shadow: none;
  font-size: 11px;
}

.desktop-jobs-popover a img {
  width: 13px;
  height: 13px;
  opacity: .65;
}

.desktop-jobs-popover .job-dot {
  flex: 0 0 auto;
}

.desktop-account {
  display: flex;
  align-items: center;
  gap: 4px;
}

.desktop-account > a {
  gap: 6px;
}

.desktop-account img {
  width: 14px;
  height: 14px;
}

.desktop-account form {
  margin: 0;
}

.desktop-user-menu {
  position: relative;
}

.desktop-user-menu > summary {
  display: grid;
  grid-template-columns: auto auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 40px;
  padding: 4px 6px;
  border: 1px solid var(--line);
  border-radius: 7px;
  cursor: pointer;
  list-style: none;
}

.desktop-user-menu > summary::-webkit-details-marker {
  display: none;
}

.account-avatar {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 30px;
  height: 30px;

  background: var(--na-coral);
  border: 1px solid #EDF2F7;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 700;
;color:var(--na-white)!important;}

.desktop-user-menu .account-avatar {
  overflow: hidden;
  width: 30px;
  height: 30px;
}

.desktop-user-menu .account-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.desktop-user-menu .account-profile-icon {
  width: 14px;
  height: 14px;
  opacity: .72;
}

.account-chevron {
  width: 12px !important;
  height: 12px !important;
  opacity: .45;
  transform: rotate(90deg);
  transition: transform .16s ease;
}

.desktop-user-menu[open] .account-chevron {
  transform: rotate(-90deg);
}

.desktop-user-popover {
  position: absolute;
  top: calc(100% + 7px);
  right: 0;
  z-index: 20;
  display: grid;
  width: 205px;
  padding: 6px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow-md);
}

.desktop-user-popover a,
.desktop-user-popover button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 37px;
  padding: 0 9px;
  color: #14243A;
  background: transparent;
  border: 0;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 650;
}

.desktop-user-popover a:hover,
.desktop-user-popover button:hover {

  background: var(--na-coral);
;color:var(--na-white)!important;}

.desktop-user-popover img {
  width: 13px;
  height: 13px;
  opacity: .7;
}

.desktop-user-popover form {
  padding-top: 4px;
  border-top: 1px solid var(--line);
}

.desktop-account .header-action {
  min-height: 36px;
  padding-inline: 14px;
  color: var(--paper);
  background: var(--navy);
}

.desktop-account .header-action:hover {
  color: var(--paper);
  background: #14243A;
}

.desktop-account .header-action img {
  filter: brightness(0) invert(1);
}

.desktop-account .header-employer-action {
  min-height: 36px;
  padding-inline: 12px;
  color: var(--navy);
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
}

.desktop-account .header-employer-action:hover {
  color: var(--paper);
  background: var(--navy);
  border-color: var(--navy);
}

.desktop-account .header-employer-action:hover img {
  filter: brightness(0) invert(1);
}

.mobile-nav {
  display: none;
  position: relative;
  justify-self: end;
}

.mobile-nav > summary {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 7px;
  cursor: pointer;
  list-style: none;
}

.mobile-nav > summary::-webkit-details-marker {
  display: none;
}

.mobile-nav > summary > span,
.mobile-nav > summary > span::before,
.mobile-nav > summary > span::after {
  display: block;
  width: 18px;
  height: 2px;
  background: var(--ink);
  border-radius: 2px;
  content: "";
  transition: transform .18s ease;
}

.mobile-nav > summary > span::before {
  transform: translateY(-6px);
}

.mobile-nav > summary > span::after {
  transform: translateY(4px);
}

.mobile-nav[open] > summary > span {
  background: transparent;
}

.mobile-nav[open] > summary > span::before {
  transform: translateY(0) rotate(45deg);
}

.mobile-nav[open] > summary > span::after {
  transform: translateY(-2px) rotate(-45deg);
}

.mobile-nav[open]::before {
  position: fixed;
  inset: 58px 0 0;
  z-index: 1;
  background: rgba(20,36,58, .28);
  content: "";
}

.mobile-nav-panel {
  position: fixed;
  top: 72px;
  right: 16px;
  left: 16px;
  z-index: 2;
  display: grid;
  gap: 2px;
  max-height: calc(100vh - 88px);
  padding: 8px;
  overflow-y: auto;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow-md);
}

.mobile-nav-panel a,
.mobile-logout {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 46px;
  padding: 0 13px;
  color: #14243A;
  background: transparent;
  border: 0;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
}

.mobile-nav-panel a:hover,
.mobile-logout:hover {

  background: var(--na-coral);
;color:var(--na-white)!important;}

.mobile-nav-panel .mobile-primary {
  justify-content: center;
  color: var(--paper);
  background: var(--navy);
}

.mobile-registration-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 4px;
}

.mobile-nav-panel .mobile-registration-actions a {
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  padding: 0 8px;
  font-size: 11px;
  text-align: center;
}

.mobile-nav-panel .mobile-employer-primary {
  color: var(--navy);
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
}

.mobile-registration-actions img {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}

.mobile-registration-actions .mobile-primary img {
  filter: brightness(0) invert(1);
}

.mobile-nav-panel form {
  margin: 0;
}

.mobile-account-card {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 2px 2px 6px;
  padding: 10px;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
}

.mobile-account-card > span:last-child {
  display: grid;
  min-width: 0;
}

.mobile-account-card strong {
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mobile-account-card small {
  color: var(--muted);
  font-size: 9px;
}

.mobile-personal-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  margin-bottom: 6px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.mobile-nav-panel .mobile-personal-links a {
  justify-content: center;
  gap: 5px;
  min-height: 37px;
  padding: 0 5px;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  font-size: 9px;
}

.mobile-personal-links img,
.mobile-logout img {
  width: 12px;
  height: 12px;
  opacity: .7;
}

.mobile-jobs-submenu {
  border-radius: 6px;
}

.mobile-jobs-submenu > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 43px;
  padding: 0 13px;
  color: #14243A;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  list-style: none;
}

.mobile-jobs-submenu > summary::-webkit-details-marker {
  display: none;
}

.mobile-jobs-submenu > summary span {
  display: flex;
  align-items: center;
  gap: 8px;
}

.mobile-jobs-submenu > summary img {
  width: 14px;
  height: 14px;
  opacity: .65;
}

.mobile-jobs-submenu > summary > img {
  width: 12px;
  height: 12px;
  transform: rotate(90deg);
  transition: transform .16s ease;
}

.mobile-jobs-submenu[open] > summary {

  background: var(--na-coral);
;color:var(--na-white)!important;}

.mobile-jobs-submenu[open] > summary > img {
  transform: rotate(-90deg);
}

.mobile-jobs-submenu > div {
  display: grid;
  margin: 2px 7px 7px 20px;
  padding-left: 9px;
  border-left: 1px solid #EDF2F7;
}

.mobile-nav-panel .mobile-jobs-submenu a {
  gap: 8px;
  min-height: 36px;
  font-size: 11px;
  font-weight: 600;
}

.job-dot {
  width: 6px;
  height: 6px;
  background: var(--brand);
  border-radius: 50%;
}

.job-dot.government {
  background: #293A50;
}

.job-dot.private {
  background: #14243A;
}

.job-dot.freelance {
  background: #BA3C38;
}

.mobile-logout-form {
  margin-top: 4px !important;
  padding-top: 5px;
  border-top: 1px solid var(--line);
}

.mobile-logout {
  gap: 8px;
  color: #BA3C38;
}

/* Controls */
input,
select,
textarea,
button {
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  font-size: 13px;
}

input,
select {
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 0 11px;
  color: var(--ink);
  background: var(--paper);
}

textarea {
  width: 100%;
  min-height: 132px;
  padding: 12px 13px;
  color: var(--ink);
  background: var(--paper);
  resize: vertical;
}

input::placeholder,
textarea::placeholder {
  color: #627083;
  opacity: 1;
}

input:hover,
select:hover,
textarea:hover {
  border-color: #EDF2F7;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--brand);
  outline: 3px solid rgba(20,36,58, .11);
}

button {
  min-height: 40px;
  padding: 0 14px;
  color: var(--paper);
  background: var(--brand);
  border-color: var(--brand);
  font-weight: 700;
  cursor: pointer;
}

button:hover {
  background: var(--brand-dark);
  border-color: var(--brand-dark);
}

/* Search-first home */
.home-search {
  padding: 32px 0 28px;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}

.search-hub {
  position: relative;
  max-width: 1040px;
  margin-inline: auto;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow-md);
}

.search-mode {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.search-hub-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  padding: 6px;
  background: #EDF2F7;
  border-bottom: 1px solid var(--line);
  border-radius: 8px 8px 0 0;
}

.search-hub-tabs.two-tabs {
  grid-template-columns: repeat(2, 1fr);
}

.search-hub-tabs label {
  display: grid;
  place-items: center;
  min-height: 38px;
  color: #454B54;
  border-radius: 6px;
  font-weight: 700;
  cursor: pointer;
}

#search-jobs:checked ~ .search-hub-tabs label[for="search-jobs"],
#search-cne:checked ~ .search-hub-tabs label[for="search-cne"],
#search-nurses:checked ~ .search-hub-tabs label[for="search-nurses"] {
  color: var(--paper);
  background: var(--navy);
  box-shadow: var(--shadow-sm);
}

#search-cne:checked ~ .search-hub-tabs label[for="search-cne"] {
  background: #14243A;
}

#search-cne:checked ~ .search-panels .cne-form .button-primary {
  background: #14243A;
  border-color: #14243A;
}

#search-jobs:focus-visible ~ .search-hub-tabs label[for="search-jobs"],
#search-cne:focus-visible ~ .search-hub-tabs label[for="search-cne"],
#search-nurses:focus-visible ~ .search-hub-tabs label[for="search-nurses"] {
  outline: 3px solid rgba(20,36,58, .28);
  outline-offset: 2px;
}

.search-panels {
  padding: 14px;
}

.hub-form {
  display: none;
  grid-template-columns: minmax(220px, 1.5fr) minmax(180px, 1fr) minmax(160px, .75fr) auto;
  gap: 8px;
}

.cne-form,
.nurse-form {
  grid-template-columns: minmax(240px, 1.5fr) minmax(200px, 1fr) auto;
}

#search-jobs:checked ~ .search-panels .jobs-form,
#search-cne:checked ~ .search-panels .cne-form,
#search-nurses:checked ~ .search-panels .nurse-form {
  display: grid;
}

.hub-form button {
  min-width: 124px;
}

.home-results {
  padding: 26px 0 52px;
}

.result-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.result-section {
  min-width: 0;
}

.home-result-panel[hidden] {
  display: none;
}

.home-feed-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.home-result-panel {
  min-width: 0;
}

.compact-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 13px;
}

.compact-heading h2 {
  margin: 0;
  font-size: 17px;
  font-weight: 600;
}

.compact-heading a {
  color: var(--brand-dark);
  font-size: 13px;
  font-weight: 700;
}

/* Shared page layout */
.page-shell,
.detail-shell {
  width: min(var(--container), calc(100% - 40px));
  margin-inline: auto;
  padding: 28px 0 56px;
}

.section-head {
  max-width: 760px;
  margin-bottom: 16px;
}

.section-head h1,
.detail-header h1,
.profile-identity h1 {
  margin: 0;
  font-size: 28px;
  font-weight: 600;
  line-height: 1.18;
}

.section-head h2 {
  margin: 0;
  font-size: 26px;
  line-height: 1.25;
}

.eyebrow {
  margin: 0 0 7px;
  color: var(--brand);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.filter-bar {
  display: grid;
  grid-template-columns: minmax(220px, 1.5fr) minmax(160px, 1fr) 170px auto;
  gap: 8px;
  margin-bottom: 16px;
  padding: 9px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.filter-bar.three-fields {
  grid-template-columns: minmax(220px, 1.5fr) minmax(170px, 1fr) auto;
}

.filter-bar button {
  min-width: 96px;
}

.nurse-filter-panel {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
  margin-bottom: 16px;
  padding: 11px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-top: 3px solid #14243A;
  border-radius: 8px;
}

.nurse-filter-panel > label {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.nurse-filter-panel > label > span {
  color: #454B54;
  font-size: 8px;
  font-weight: 700;
}

.nurse-filter-panel input,
.nurse-filter-panel select {
  min-width: 0;
  min-height: 34px;
  padding-inline: 8px;
  font-size: 9px;
}

.nurse-filter-keyword {
  grid-column: span 2;
}

.nurse-filter-actions {
  display: flex;
  align-items: end;
  justify-content: flex-end;
  gap: 6px;
}

.nurse-filter-actions .button {
  min-height: 34px;
  padding-inline: 10px;
  font-size: 9px;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 7px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.button img,
.text-action img,
.provider-button img,
.session-state img {
  width: 15px;
  height: 15px;
}

.button-primary {
  color: #FFFFFF;
  background: var(--brand);
  border: 1px solid var(--brand);
  box-shadow: 0 2px 7px rgba(20,36,58, .18);
}

.button-primary:hover {
  color: #FFFFFF;
  background: var(--brand-dark);
  border-color: var(--brand-dark);
  box-shadow: 0 4px 11px rgba(20,36,58, .2);
}

.button-primary img,
.provider-dark img {
  filter: brightness(0) invert(1);
}

.button-ghost {
  color: var(--brand-dark);
  background: transparent;
  border-color: #EDF2F7;
}

.button-ghost:hover {
  color: var(--paper);
  background: var(--brand-dark);
}

.field-with-icon {
  position: relative;
  min-width: 0;
}

.field-with-icon > img,
.auth-input > img {
  position: absolute;
  top: 50%;
  left: 11px;
  z-index: 1;
  width: 15px;
  height: 15px;
  opacity: .55;
  transform: translateY(-50%);
  pointer-events: none;
}

.field-with-icon input,
.auth-input input {
  padding-left: 34px;
}

.search-hub-tabs label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  line-height: 1;
}

.search-hub-tabs label img {
  display: block;
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  opacity: .68;
}

#search-jobs:checked ~ .search-hub-tabs label[for="search-jobs"] img,
#search-cne:checked ~ .search-hub-tabs label[for="search-cne"] img,
#search-nurses:checked ~ .search-hub-tabs label[for="search-nurses"] img {
  filter: brightness(0) invert(1);
  opacity: 1;
}

.text-action {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--brand-dark);
  font-size: 12px;
  font-weight: 700;
}

.page-title-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
}

.page-title-row .section-head {
  margin-bottom: 14px;
}

.listing-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.listing-card {
  position: relative;
  display: grid;
  gap: 11px;
  min-width: 0;
  padding: 14px;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: inset 3px 0 0 var(--brand);
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

a.listing-card:hover {
  border-color: #EDF2F7;
  box-shadow: inset 3px 0 0 var(--brand), var(--shadow-sm);
  transform: translateY(-1px);
}

.listing-card.job-government {
  box-shadow: inset 3px 0 0 #293A50;
}

.listing-card.job-private {
  box-shadow: inset 3px 0 0 #14243A;
}

.listing-card.job-freelance {
  box-shadow: inset 3px 0 0 #BA3C38;
}

.listing-card-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px;
  min-width: 0;
}

.org-mark,
.nurse-avatar {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;

  background: var(--na-coral);
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  font-family: "Poppins", "Inter", sans-serif;
  font-size: 14px;
  font-weight: 600;
;color:var(--na-white)!important;}

.job-government .org-mark {
  color: #293A50;
  background: #EDF2F7;
  border-color: #EDF2F7;
}

.job-private .org-mark {
  color: #14243A;
  background: #EDF2F7;
  border-color: #EDF2F7;
}

.job-freelance .org-mark {
  color: #BA3C38;
  background: #EDF2F7;
  border-color: #FFE4DF;
}

.training-mark {
  color: #14243A;
  background: #EDF2F7;
  border-color: #EDF2F7;
}

.training-mark img {
  width: 18px;
  height: 18px;
}

.listing-card.training-card {
  box-shadow: inset 3px 0 0 #14243A;
}

a.listing-card.training-card:hover {
  border-color: #EDF2F7;
  box-shadow: inset 3px 0 0 #14243A, var(--shadow-sm);
}

.training-card .listing-kicker,
.training-card .listing-meta-grid,
.cne-listing-page .eyebrow {
  color: #14243A;
}

.training-card .listing-card-foot {
  gap: 6px;
}

.training-card .skill-chips {
  gap: 3px;
}

.training-card .skill-chips span {
  padding: 3px 5px;
  font-size: 9px;
}

.training-card .session-state {
  gap: 4px;
  color: #14243A;
  font-size: 10px;
}

.cne-listing-page .filter-bar .button-primary {
  background: #14243A;
  border-color: #14243A;
}

.nurse-avatar {
  color: var(--navy);
  background: #EDF2F7;
  border-color: #EDF2F7;
  overflow: hidden;
}

.nurse-avatar img,
.nurse-feed-mark img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.listing-title {
  min-width: 0;
}

.listing-title h2 {
  margin: 2px 0 1px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
}

.listing-title p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-headline {
  font-family: "Inter", sans-serif;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.public-profile-page .profile-headline {
  font-size: 12px;
}

.compact-listing-body .profile-headline {
  font-size: 10px;
  font-weight: 500;
}

.listing-kicker {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 20px;
  color: var(--brand-dark);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.listing-kicker em {
  min-height: 20px;
  padding-inline: 7px;
  font-size: 9px;
  text-transform: none;
}

.listing-kicker .verified {
  gap: 3px;
  color: #293A50;
  background: #EDF2F7;
}

.listing-kicker .nuid-pending,
.listing-kicker .nuid-missing {
  display: inline-flex;
  align-items: center;

  background: var(--na-coral);
;color:var(--na-white)!important;}

.nurse-card .listing-kicker {
  flex-wrap: wrap;
}

.listing-kicker .nuid-pending {
  max-width: 100%;
  line-height: 1.25;
  white-space: normal;
}

.listing-kicker .nuid-missing {
  color: #454B54;
  background: #EDF2F7;
}

.nurse-filter-error {
  grid-column: 1 / -1;
  padding: 8px 10px;
  color: #BA3C38;
  font-size: 11px;
  font-weight: 700;
  background: #EDF2F7;
  border: 1px solid #FFE4DF;
  border-radius: 6px;
}

.verified img {
  width: 12px;
  height: 12px;
}

.card-arrow {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  color: var(--brand-dark);
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 50%;
}

.card-arrow img {
  width: 14px;
  height: 14px;
  opacity: .65;
}

.listing-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px 12px;
  padding: 9px 0;
  border-block: 1px solid #EDF2F7;
}

.listing-meta-grid > span,
.deadline,
.session-state {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: #454B54;
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.listing-meta-grid img,
.deadline img {
  flex: 0 0 auto;
  width: 13px;
  height: 13px;
  opacity: .6;
}

.listing-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.skill-chips {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  overflow: hidden;
}

.skill-chips span {
  flex: 0 0 auto;
  padding: 4px 7px;
  color: #14243A;
  background: #EDF2F7;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 600;
  white-space: nowrap;
}

.deadline,
.session-state {
  flex: 0 0 auto;
  font-weight: 600;
}

.session-state {
  color: var(--brand-dark);
}

.availability-dot {
  flex: 0 0 auto;
  color: var(--brand-dark);
  font-size: 10px;
  font-weight: 700;
}

.availability-dot::before {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 5px;
  background: #293A50;
  border-radius: 50%;
  content: "";
}

.compact-listing {
  --job-accent: var(--brand);
  --job-soft: var(--brand-soft);
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 86px;
  padding: 10px 11px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

a.compact-listing:hover {
  border-color: color-mix(in srgb, var(--job-accent) 35%, var(--line));
  box-shadow: 0 8px 22px rgba(20,36,58, .08);
  transform: translateY(-1px);
}

.compact-listing[class*="job-"]::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--job-accent);
  content: "";
}

.compact-listing.job-government {
  --job-accent: #293A50;
  --job-soft: #EDF2F7;
}

.compact-listing.job-private {
  --job-accent: #14243A;
  --job-soft: #EDF2F7;
}

.compact-listing.job-freelance {
  --job-accent: #BA3C38;
  --job-soft: #EDF2F7;
}

.compact-mark {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;

  background: var(--na-coral);
  border-radius: 7px;
;color:var(--na-white)!important;}

.job-government .compact-mark {
  color: #293A50;
  background: #EDF2F7;
}

.job-private .compact-mark {
  color: #14243A;
  background: #EDF2F7;
}

.job-freelance .compact-mark {
  color: #BA3C38;
  background: #EDF2F7;
}

.training-row .compact-mark {
  color: #14243A;
  background: #EDF2F7;
}

.training-row {
  --job-accent: #14243A;
  --job-soft: #EDF2F7;
}

.nurse-feed-row {
  --job-accent: #14243A;
  --job-soft: #EDF2F7;
}

.nurse-feed-mark {
  color: var(--brand-dark);
  font-size: 11px;
  font-weight: 800;
}

.compact-verified {
  color: #14243A;
  background: #EDF2F7;
}

.compact-availability {
  color: #14243A;
}

.compact-availability i {
  width: 5px;
  height: 5px;
  background: #293A50;
  border-radius: 50%;
}

.compact-mark img {
  width: 16px;
  height: 16px;
  opacity: .75;
}

.compact-mark img.organization-logo {
  width: 100%;
  height: 100%;
  padding: 4px;
  object-fit: contain;
  background: #FFFFFF;
  border-radius: 6px;
  opacity: 1;
}

.compact-listing-body {
  min-width: 0;
}

.compact-listing-body strong,
.compact-listing-body small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compact-listing-body strong {
  font-size: 13px;
}

.compact-listing-body small {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 1px;
  color: var(--muted);
  font-size: 10px;
}

.compact-listing-body small img,
.compact-meta img {
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  opacity: .58;
}

.compact-title-line {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.compact-title-line strong {
  min-width: 0;
}

.compact-title-line em {
  flex: 0 0 auto;
  gap: 3px;
  min-height: 18px;
  padding: 0 6px;
  font-size: 8px;
}

.compact-title-line em img {
  width: 9px;
  height: 9px;
}

.compact-meta {
  display: flex;
  gap: 10px;
  margin-top: 5px;
  color: #454B54;
  font-size: 9px;
  font-weight: 600;
}

.compact-meta span {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  min-width: 0;
  white-space: nowrap;
}

.compact-meta .compact-job-type {
  color: var(--job-accent);
  font-weight: 800;
}

.compact-job-type i {
  width: 5px;
  height: 5px;
  background: var(--job-accent);
  border-radius: 50%;
}

.compact-meta span:not(:last-child)::after {
  position: absolute;
  top: 50%;
  right: -6px;
  width: 2px;
  height: 2px;
  background: #627083;
  border-radius: 50%;
  content: "";
}

/* Job listing cards */
.job-listing-card {
  --job-accent: #14243A;
  --job-soft: #EDF2F7;
  gap: 0;
  padding: 0;
  overflow: hidden;
  box-shadow: none;
}

.job-listing-card.job-government {
  --job-accent: #293A50;
  --job-soft: #EDF2F7;
  box-shadow: none;
}

.job-listing-card.job-private {
  --job-accent: #14243A;
  --job-soft: #EDF2F7;
  box-shadow: none;
}

.job-listing-card.job-freelance {
  --job-accent: #BA3C38;
  --job-soft: #EDF2F7;
  box-shadow: none;
}

.job-listing-card::before {
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: var(--job-accent);
  content: "";
}

a.job-listing-card:hover {
  border-color: color-mix(in srgb, var(--job-accent) 40%, var(--line));
  box-shadow: 0 10px 28px rgba(20,36,58, .09);
  transform: translateY(-2px);
}

.job-listing-card .listing-card-head {
  align-items: center;
  padding: 15px 15px 11px;
}

.job-listing-card .org-mark {
  width: 42px;
  height: 42px;
  color: var(--job-accent);
  background: var(--job-soft);
  border-color: color-mix(in srgb, var(--job-accent) 18%, white);
  font-size: 15px;
}

.job-listing-card .listing-title h2 {
  margin: 0 0 3px;
  color: #0B1423;
  font-size: 16px;
}

.job-listing-card .listing-title p {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
}

.job-listing-card .listing-title p > img {
  display: block;
  flex: 0 0 auto;
  width: 12px;
  height: 12px;
  opacity: .58;
}

.job-listing-card .listing-title p > .employer-verified {
  width: 13px;
  height: 13px;
  opacity: .8;
}

.job-type-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--job-accent);
}

.job-type-label i {
  width: 6px;
  height: 6px;
  background: var(--job-accent);
  border-radius: 50%;
}

.job-listing-card .listing-kicker em {
  display: inline-flex;
  align-items: center;
  gap: 3px;

  background: var(--na-coral);
;color:var(--na-white)!important;}

.job-listing-card .listing-kicker em img {
  display: block;
  width: 11px;
  height: 11px;
  opacity: .72;
}

.job-listing-card .card-arrow {
  border-color: color-mix(in srgb, var(--job-accent) 22%, var(--line));
  transition: background .16s ease, border-color .16s ease, transform .16s ease;
}

a.job-listing-card:hover .card-arrow {
  background: var(--job-accent);
  border-color: var(--job-accent);
  transform: translateX(2px);
}

a.job-listing-card:hover .card-arrow img {
  filter: brightness(0) invert(1);
  opacity: 1;
}

.job-listing-card .listing-meta-grid {
  gap: 8px 10px;
  margin: 0 15px;
  padding: 10px;
  background: #FFFFFF;
  border: 0;
  border-radius: 7px;
}

.job-listing-card .listing-meta-grid > span {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 1px 6px;
  line-height: 1.25;
}

.job-listing-card .listing-meta-grid > span > img {
  grid-row: 1 / 3;
  align-self: center;
  width: 14px;
  height: 14px;
}

.job-listing-card .listing-meta-grid b {
  color: #627083;
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
}

.job-listing-card .listing-meta-grid span span {
  overflow: hidden;
  color: #14243A;
  font-size: 10px;
  font-weight: 600;
  text-overflow: ellipsis;
}

.job-listing-card .salary-meta span {
  color: var(--job-accent);
}

.job-listing-card .listing-card-foot {
  padding: 10px 15px 13px;
}

.job-listing-card .skill-chips span {
  color: color-mix(in srgb, var(--job-accent) 75%, #14243A);
  background: var(--job-soft);
}

.job-card-timing {
  display: flex;
  align-items: center;
  gap: 9px;
  flex: 0 0 auto;
}

.posted-time {
  color: #627083;
  font-size: 9px;
  white-space: nowrap;
}

.job-listing-card .deadline {
  padding-left: 9px;
  border-left: 1px solid var(--line);
  font-size: 10px;
}

.job-grid,
.module-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.module-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.job-card,
.module-grid article,
.row-card,
.detail-body,
.facts,
.profile-form,
.credential-panel,
.auth-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.job-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 208px;
  padding: 19px;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

a.job-card:hover {
  border-color: #EDF2F7;
  box-shadow: var(--shadow-sm);
  transform: translateY(-2px);
}

.job-card h2 {
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.35;
}

.job-card p {
  margin: 0 0 12px;
  color: var(--muted);
}

.job-card small {
  margin-top: auto;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 28px;
  margin-bottom: 18px;
  color: var(--brand-dark);
  font-size: 12px;
  font-weight: 700;
}

em {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  min-height: 26px;
  padding: 0 9px;
  color: #BA3C38;
  background: var(--orange-soft);
  border-radius: 999px;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.list-stack {
  display: grid;
  gap: 9px;
}

.row-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-width: 0;
  min-height: 76px;
  padding: 14px 15px;
}

a.row-card:hover {
  border-color: #EDF2F7;
  box-shadow: var(--shadow-sm);
}

.row-card > span {
  min-width: 0;
}

.row-card strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.row-card small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  overflow-wrap: anywhere;
}

.empty-state {
  grid-column: 1 / -1;
  padding: 18px;
  color: var(--muted);
  background: var(--paper);
  border: 1px dashed var(--line-strong);
  border-radius: 8px;
}

.directory-employer-prompt {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 16px;
  padding: 13px 0;
  border-top: 1px solid var(--line);
}

.directory-employer-prompt p {
  margin: 0;
  color: #454B54;
  font-family: "Inter", sans-serif;
  font-size: 11px;
  font-weight: 500;
}

.directory-employer-prompt a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--brand-dark);
  font-size: 11px;
  font-weight: 700;
}

.directory-employer-prompt a img {
  width: 13px;
  height: 13px;
}

@media (max-width: 520px) {
  .directory-employer-prompt {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }
}

.module-grid article {
  min-width: 0;
  padding: 15px;
}

.module-grid h3 {
  margin: 10px 0 5px;
  font-size: 15px;
  font-weight: 600;
}

.module-grid p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.module-icon {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  background: var(--na-coral);
  border-radius: 7px;
;color:var(--na-white)!important;}

.module-icon img {
  width: 15px;
  height: 15px;
  opacity: .75;
}

.module-icon.blue {
  background: #EDF2F7;
}

.module-icon.orange {
  background: var(--orange-soft);
}

/* Personal dashboard */
.dashboard-page {
  max-width: 980px;
}

.dashboard-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 14px;
}

.dashboard-heading h1 {
  margin: 0;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.25;
}

.dashboard-profile {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 3px solid var(--brand);
  border-radius: 8px;
}

.dashboard-profile-main {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.dashboard-avatar {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 58px;
  height: 58px;

  background: var(--na-coral);
  border: 1px solid #EDF2F7;
  border-radius: 8px;
  font-family: "Poppins", "Inter", sans-serif;
  font-size: 20px;
  font-weight: 600;
  overflow: hidden;
;color:var(--na-white)!important;}

.dashboard-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.dashboard-profile-copy {
  min-width: 0;
}

.dashboard-profile-title {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.dashboard-profile-title h2 {
  margin: 0;
  font-size: 17px;
  font-weight: 600;
}

.visibility-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 23px;
  padding: 0 8px;
  color: #14243A;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 700;
}

.visibility-chip i {
  width: 6px;
  height: 6px;
  background: #293A50;
  border-radius: 50%;
}

.visibility-chip.is-hidden {
  color: #BA3C38;
  background: #EDF2F7;
  border-color: #FFE4DF;
}

.visibility-chip.is-hidden i {
  background: #BA3C38;
}

.dashboard-profile-copy > p {
  margin: 5px 0 8px;
  color: var(--muted);
  font-size: 12px;
}

.dashboard-profile-copy > .profile-headline {
  font-size: 11px;
  font-weight: 500;
  line-height: 1.45;
}

.dashboard-profile-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 14px;
}

.dashboard-profile-meta span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #454B54;
  font-size: 11px;
}

.dashboard-profile-meta img {
  width: 13px;
  height: 13px;
  opacity: .65;
}

.dashboard-profile-actions {
  display: flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
}

.dashboard-primary-action,
.dashboard-icon-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  color: #FFFFFF;
  background: var(--brand-dark);
  border: 1px solid var(--brand-dark);
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
}

.dashboard-primary-action {
  gap: 6px;
  padding: 0 11px;
}

.dashboard-primary-action img {
  width: 13px;
  height: 13px;
  filter: brightness(0) invert(1);
}

.dashboard-icon-action {
  width: 34px;
  color: var(--brand-dark);
  background: transparent;
  border-color: var(--line-strong);
}

.dashboard-icon-action img {
  width: 14px;
  height: 14px;
  opacity: .7;
}

.dashboard-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 0;
}

.dashboard-actions-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin: 24px 0 9px;
}

.dashboard-actions-heading h2 {
  margin: 1px 0 0;
  color: var(--ink);
  font-size: 16px;
  font-weight: 650;
}

.dashboard-actions-heading small {
  padding-bottom: 2px;
  color: var(--muted);
  font-size: 10px;
}

.dashboard-actions > a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 58px;
  padding: 8px 10px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 9px;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.dashboard-actions > a:hover {
  border-color: #EDF2F7;
  box-shadow: var(--shadow-sm);
  transform: translateY(-1px);
}

.dashboard-action-icon {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  background: var(--na-coral);
  border-radius: 6px;
;color:var(--na-white)!important;}

.dashboard-action-icon.saved {
  background: #EDF2F7;
}

.dashboard-action-icon.cne {
  background: #EDF2F7;
}

.dashboard-action-icon.saved-cne {
  background: #EDF2F7;
}

.training-detail-page {
  --job-accent: #14243A;
  --job-soft: #EDF2F7;
}

.training-detail-page .detail-org-mark img {
  width: 21px;
  height: 21px;
  opacity: .75;
}

.training-tool-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.training-tool-grid > span {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1px 7px;
  align-items: center;
  min-width: 0;
  padding: 10px;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 6px;
}

.training-tool-grid img {
  grid-row: 1 / 3;
  width: 15px;
  height: 15px;
  opacity: .65;
}

.training-tool-grid strong {
  font-size: 10px;
}

.training-tool-grid small {
  color: var(--muted);
  font-size: 8px;
}

.saved-training-item {
  --saved-accent: #14243A;
  --saved-soft: #EDF2F7;
  border-left: 3px solid var(--saved-accent);
}

.saved-training-item .saved-job-mark img {
  width: 16px;
  height: 16px;
  opacity: .72;
}

/* CNE management and registration */
.cne-filter-bar {
  grid-template-columns: minmax(220px, 1.4fr) minmax(170px, .8fr) minmax(130px, .55fr) auto;
}

.console-heading,
.registration-ticket-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
}

.console-heading h1,
.registration-heading h1,
.registration-ticket-head h1 {
  margin: 0;
  font-size: 25px;
  line-height: 1.25;
}

.console-heading p,
.registration-heading > p:last-child,
.registration-ticket-head p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.console-heading-actions,
.table-actions,
.registration-review-actions,
.form-submit-bar,
.cne-resource-links {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}

.console-table-wrap {
  overflow-x: auto;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.console-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
}

.console-table th,
.console-table td {
  padding: 12px 14px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
}

.console-table th {
  color: #454B54;
  background: #FFFFFF;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.console-table td {
  font-size: 12px;
}

.console-table td > small,
.console-table td > strong + small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
}

.table-actions a,
.table-actions button {
  padding: 0;
  color: var(--brand-dark);
  background: transparent;
  border: 0;
  cursor: pointer;
  font-size: 10px;
  font-weight: 700;
}

.cne-status {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  color: #454B54;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
}

.cne-status.status-approved {
  color: #14243A;
  background: #EDF2F7;
  border-color: #EDF2F7;
}

.cne-status.status-pending {

  background: var(--na-coral);
  border-color: #FFE4DF;
;color:var(--na-white)!important;}

.cne-status.status-rejected,
.cne-status.status-cancelled {
  color: #BA3C38;
  background: #EDF2F7;
  border-color: #FFE4DF;
}

.cne-status.status-draft {
  color: #14243A;
  background: #EDF2F7;
  border-color: #EDF2F7;
}

.registration-decision-note,
.registration-review-note {
  color: #BA3C38;
  background: #EDF2F7;
  border: 1px solid #FFE4DF;
  border-radius: 8px;
}

.registration-decision-note {
  padding: 15px 16px;
  margin-bottom: 12px;
}

.registration-decision-note h2 {
  margin: 0 0 5px;
  font-size: 14px;
}

.registration-decision-note p,
.registration-review-note {
  margin: 0;
  font-size: 10px;
  line-height: 1.55;
}

.registration-review-note {
  padding: 9px 10px;
}

.cne-program-form,
.registration-form {
  display: grid;
  gap: 12px;
}

.form-section,
.registration-form,
.registration-ticket,
.qr-ticket,
.submitted-answer-list,
.privacy-notice,
.privacy-lock-notice,
.privacy-closeout-notice,
.camera-scanner,
.manual-scan-form,
.attendance-days {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.form-section {
  padding: 16px;
}

.cne-logo-editor {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  padding: 12px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.cne-logo-preview {
  display: grid;
  place-items: center;
  width: 126px;
  height: 126px;
  padding: 8px;
  overflow: hidden;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 8px;
}

.cne-logo-preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cne-logo-preview img.is-placeholder {
  width: 30px;
  height: 30px;
  opacity: .42;
}

.cne-logo-actions {
  display: grid;
  justify-items: start;
  gap: 6px;
}

.cne-logo-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.cne-logo-actions #id_organizer_logo {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.cne-logo-select {
  min-height: 34px;
  padding-inline: 11px;
  font-size: 11px;
  cursor: pointer;
}

.cne-logo-select img,
.cne-logo-adjust img {
  width: 13px;
  height: 13px;
}

.cne-logo-actions small,
.cne-logo-cropper small {
  color: var(--muted);
  font-size: 9px;
}

.cne-logo-status {
  color: #14243A !important;
  font-weight: 700;
}

.cne-logo-status:empty {
  display: none;
}

.cne-logo-editor .cne-logo-cropper {
  grid-column: 1 / -1;
  width: 100%;
}

.form-section-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 12px;
  margin-bottom: 13px;
  border-bottom: 1px solid var(--line);
}

.form-section-heading > span {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 29px;
  height: 29px;
  color: var(--paper);
  background: #14243A;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
}

.form-section-heading h2,
.submitted-answer-list h2,
.manual-scan-form h2 {
  margin: 0;
  font-size: 15px;
}

.form-section-heading p,
.manual-scan-form p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 10px;
}

.form-grid,
.registration-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
}

.form-grid > label,
.registration-field-grid > label,
.registration-field-grid > .registration-field,
.manual-scan-form label,
.review-dialog label {
  display: grid;
  align-content: start;
  gap: 5px;
  min-width: 0;
  color: #454B54;
  font-size: 10px;
  font-weight: 700;
}

.same-as-mobile-control {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: 6px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 600;
  cursor: pointer;
}

.same-as-mobile-control input {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: var(--brand);
}

.form-grid .span-all,
.registration-field-grid .privacy-consent {
  grid-column: 1 / -1;
}

.form-grid input,
.form-grid select,
.form-grid textarea,
.registration-field-grid input:not([type="checkbox"]):not([type="radio"]),
.registration-field-grid select,
.registration-field-grid textarea,
.manual-scan-form input,
.review-dialog textarea {
  width: 100%;
  min-width: 0;
  min-height: 39px;
  padding: 8px 10px;
  color: var(--ink);
  background: #FFFFFF;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  font: inherit;
  font-size: 12px;
}

.form-grid textarea,
.registration-field-grid textarea {
  resize: vertical;
}

.form-grid .checkbox-field,
.privacy-consent {
  display: flex;
  align-items: center;
  align-self: end;
  min-height: 39px;
  padding: 8px 10px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.checkbox-field input,
.privacy-consent input {
  flex: 0 0 auto;
}

.field-selector-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.field-selector-grid fieldset {
  min-width: 0;
  padding: 12px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.field-selector-grid legend {
  padding: 0 5px;
  font-size: 11px;
  font-weight: 700;
}

.field-selector-grid ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.field-selector-grid label {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  font-size: 10px;
}

.form-submit-bar {
  justify-content: flex-end;
  position: sticky;
  bottom: 10px;
  z-index: 3;
  padding: 10px;
  background: rgba(255,255,255, .96);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow-sm);
}

.registration-heading {
  margin-bottom: 14px;
}

.registration-form {
  max-width: 760px;
  padding: 18px;
}

.registration-field-grid small {
  color: var(--muted);
  font-weight: 400;
}

.registration-field-grid ul {
  padding: 0;
  margin: 2px 0 0;
  list-style: none;
}

.registration-field-grid ul label {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
}

.registration-ticket-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 12px;
}

.registration-ticket,
.qr-ticket,
.submitted-answer-list {
  padding: 16px;
}

.registration-ticket dl,
.submitted-answer-list {
  display: grid;
  gap: 0;
}

.registration-ticket dl {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0 0 14px;
}

.registration-ticket dl div,
.submitted-answer-list > div {
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.registration-ticket dt,
.submitted-answer-list span {
  display: block;
  color: var(--muted);
  font-size: 9px;
}

.registration-ticket dd {
  margin: 3px 0 0;
  font-size: 12px;
  font-weight: 700;
}

.qr-ticket {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 7px;
  text-align: center;
}

.qr-ticket canvas,
.qr-ticket img {
  width: 192px;
  height: 192px;
}

.qr-ticket small {
  max-width: 210px;
  color: var(--muted);
  font-size: 9px;
}

.submitted-answer-list {
  margin-top: 12px;
}

.submitted-answer-list > div {
  display: grid;
  grid-template-columns: minmax(130px, .5fr) minmax(0, 1fr);
  gap: 12px;
}

.private-registration-page {
  min-width: 0;
}

.privacy-notice,
.privacy-lock-notice,
.privacy-closeout-notice {
  padding: 11px 13px;
  margin-bottom: 12px;
  color: #14243A;
  background: #EDF2F7;
  border-color: #EDF2F7;
  font-size: 10px;
  line-height: 1.55;
}

.privacy-lock-notice {

  background: var(--na-coral);
  border-color: #FFE4DF;
;color:var(--na-white)!important;}

.privacy-closeout-notice {

  background: var(--na-coral);
  border-color: #FF6B61;
  font-size: 10px;
  line-height: 1.55;
;color:var(--na-white)!important;}

.privacy-closeout-notice time {
  font-weight: 700;
}

.privacy-closeout-countdown {
  display: inline-block;
  margin-left: 4px;
  color: #14243A;
  font-weight: 800;
}

.privacy-closeout-notice small {
  display: block;
  margin-top: 3px;
  color: #BA3C38;
}

.registrant-privacy-guidance {
  border: 1px solid #EDF2F7;
}

.registrant-privacy-guidance summary {
  cursor: pointer;
  font-weight: 700;
}

.registrant-privacy-guidance p {
  margin: 7px 0 0;
}

.registrant-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 92px auto auto;
  align-items: end;
  gap: 8px;
  padding: 10px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 7px 7px 0 0;
}

.registrant-toolbar label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
}

.registrant-toolbar input,
.registrant-toolbar select {
  width: 100%;
  min-height: 36px;
  padding: 7px 9px;
  color: var(--ink);
  background: #FFFFFF;
  border: 1px solid var(--line-strong);
  border-radius: 5px;
  font: inherit;
  font-size: 11px;
}

.registrant-toolbar .button {
  min-height: 36px;
}

.registrant-status-tabs {
  display: flex;
  overflow-x: auto;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-top: 0;
}

.registrant-status-tabs a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 7px 12px;
  color: #454B54;
  border-right: 1px solid var(--line);
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

.registrant-status-tabs a.is-active {
  color: var(--brand-dark);
  background: #FFFFFF;
  box-shadow: inset 0 -2px 0 var(--brand);
}

.registrant-status-tabs strong {
  min-width: 18px;
  padding: 2px 5px;
  text-align: center;
  background: #EDF2F7;
  border-radius: 999px;
  font-size: 8px;
}

.registrant-table-wrap {
  max-height: min(68vh, 760px);
  border-top: 0;
  border-radius: 0 0 7px 7px;
  user-select: none;
}

.registrant-table {
  min-width: 1020px;
}

.registrant-table th {
  position: sticky;
  top: 0;
  z-index: 3;
}

.registrant-table th,
.registrant-table td {
  padding: 9px 11px;
  vertical-align: middle;
}

.registrant-summary-row > td {
  background: #FFFFFF;
}

.registrant-summary-row:hover > td {
  background: #FFFFFF;
}

.registrant-table .registrant-number-column {
  position: sticky;
  left: 0;
  z-index: 2;
  width: 46px;
  min-width: 46px;
  color: var(--muted);
  text-align: center;
}

.registrant-table .registrant-person-column {
  position: sticky;
  left: 46px;
  z-index: 2;
  width: 230px;
  min-width: 230px;
  box-shadow: 7px 0 9px -10px #14243A;
}

.registrant-table th.registrant-number-column,
.registrant-table th.registrant-person-column {
  z-index: 5;
  background: #FFFFFF;
}

.registrant-person-column strong,
.registrant-person-column small,
.registrant-contact span,
.registrant-contact small {
  display: block;
}

.registrant-person-column small,
.registrant-contact small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
}

.registrant-registration-meta {
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: 24px;
  margin-top: 1px;
  color: var(--muted);
  font-size: 9px;
  white-space: nowrap;
}

.registrant-registration-meta code {
  color: #454B54;
  font: inherit;
  font-weight: 700;
}

.registrant-copy-code {
  display: inline-grid;
  place-items: center;
  width: 24px;
  min-width: 24px;
  min-height: 24px;
  height: 24px;
  padding: 0;
  color: var(--brand-dark);
  background: transparent;
  border: 1px solid transparent;
  border-radius: 4px;
}

.registrant-copy-code:hover,
.registrant-copy-code:focus-visible {
  color: var(--brand-dark);
  background: #EDF2F7;
  border-color: #627083;
}

.registrant-copy-code:focus-visible {
  outline: 3px solid rgba(20,36,58, .14);
  outline-offset: 1px;
}

.registrant-copy-code.is-copied {
  color: #14243A;
  background: #EDF2F7;
  border-color: #EDF2F7;
}

.registrant-copy-code img {
  width: 13px;
  height: 13px;
}

.registrant-contact span {
  font-size: 10px;
  font-weight: 700;
}

.privacy-locked-value,
.registrant-muted-value {
  color: var(--muted);
  font-size: 9px;
}

.registrant-missing {
  color: #BA3C38;
  font-size: 9px;
  font-weight: 700;
}

.registrant-file-link {
  color: var(--brand-dark);
  font-size: 10px;
  font-weight: 700;
}

.registrant-row-actions {
  display: flex;
  align-items: center;
  gap: 5px;
}

.registrant-details-toggle,
.registrant-review-button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 28px;
  padding: 4px 7px;
  border: 1px solid var(--line-strong);
  border-radius: 5px;
  cursor: pointer;
  font: inherit;
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
}

.registrant-details-toggle {
  color: #14243A;
  background: #FFFFFF;
}

.registrant-details-toggle:hover,
.registrant-details-toggle:focus-visible {
  color: var(--brand-dark);
  background: #EDF2F7;
  border-color: #627083;
}

.registrant-details-toggle:focus-visible {
  outline: 3px solid rgba(20,36,58, .14);
  outline-offset: 1px;
}

.registrant-details-toggle img {
  width: 11px;
  height: 11px;
  transition: transform .16s ease;
}

.registrant-details-toggle[aria-expanded="true"] img {
  transform: rotate(90deg);
}

.registrant-review-button {
  color: #FFFFFF;
  background: var(--brand);
  border-color: var(--brand);
}

.registrant-detail-row > td {
  padding: 0;
  background: #FFFFFF;
}

.registrant-detail-panel {
  padding: 14px 16px 16px 57px;
  border-bottom: 1px solid var(--line);
}

.registrant-detail-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 9px;
}

.registrant-detail-heading strong,
.registrant-detail-heading small {
  display: block;
}

.registrant-detail-heading small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
}

.registrant-detail-heading p {
  max-width: 540px;
  margin: 0;
  color: #BA3C38;
  font-size: 10px;
}

.registrant-answer-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--line);
}

.registrant-answer-list > div {
  min-width: 0;
  padding: 8px 10px 8px 0;
  border-bottom: 1px solid var(--line);
}

.registrant-answer-list dt {
  color: var(--muted);
  font-size: 8px;
}

.registrant-answer-list dd {
  margin: 2px 0 0;
  overflow-wrap: anywhere;
  font-size: 10px;
  font-weight: 700;
}

.registrant-answer-list .sensitive-answer {
  box-shadow: inset 2px 0 0 #FF6B61;
  padding-left: 8px;
}

.registrant-pagination {
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 0;
  border-radius: 0 0 7px 7px;
}

.review-decision-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  padding: 0;
  border: 0;
}

.review-decision-options legend {
  margin-bottom: 5px;
  color: #454B54;
  font-size: 10px;
  font-weight: 700;
}

.review-decision-options label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 8px 10px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
  cursor: pointer;
}

.review-decision-options input {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: var(--brand);
}

.button-danger {
  color: #BA3C38;
  background: #FFFFFF;
  border-color: #FF6B61;
}

.review-dialog,
.meeting-warning-dialog {
  width: min(430px, calc(100vw - 30px));
  padding: 0;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow-md);
}

.review-dialog::backdrop,
.meeting-warning-dialog::backdrop {
  background: rgba(20,36,58, .5);
}

.review-dialog form,
.meeting-warning-dialog > div {
  display: grid;
  gap: 13px;
  padding: 18px;
}

.review-dialog h2,
.meeting-warning-dialog h2 {
  margin: 0;
  font-size: 17px;
}

.review-dialog p,
.meeting-warning-dialog p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}

.review-dialog form > div,
.meeting-warning-dialog > div > div {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
}

.meeting-link-button {
  width: 100%;
  margin-top: 7px;
  color: var(--brand-dark);
  background: #EDF2F7;
  border-color: #EDF2F7;
}

.meeting-link-button:hover,
.meeting-link-button:focus-visible {
  color: #FFFFFF;
  background: var(--brand-dark);
  border-color: var(--brand-dark);
  outline: 3px solid rgba(20,36,58, .14);
}

.meeting-link-locked {
  padding: 9px 10px;
  margin: 7px 0 0;
  color: #454B54;
  background: #EDF2F7;
  border: 1px solid var(--line);
  border-radius: 7px;
  font-size: 10px;
  line-height: 1.45;
  text-align: center;
}

.cne-disclaimer {
  padding: 14px 0 0;
  margin-top: 18px;
  color: #627083;
  border-top: 1px solid var(--line);
  font-size: 9px;
  line-height: 1.55;
}

.cne-disclaimer strong {
  display: block;
  color: #454B54;
}

.cne-disclaimer p {
  margin: 4px 0 0;
}

.qr-ticket code {
  padding: 5px 8px;

  background: var(--na-coral);
  border-radius: 5px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
;color:var(--na-white)!important;}

.scanner-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, .6fr);
  gap: 12px;
}

.attendance-capture-controls {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  margin-bottom: 12px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.attendance-capture-controls label {
  display: grid;
  gap: 5px;
  color: #454B54;
  font-size: 10px;
  font-weight: 700;
}

.attendance-capture-controls .attendance-day-auto {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #14243A;
  font-size: 9px;
  font-weight: 600;
}

.attendance-day-auto img {
  width: 12px;
  height: 12px;
}

.attendance-capture-controls select {
  min-width: 230px;
  min-height: 39px;
  padding: 8px 10px;
  color: var(--ink);
  background: #FFFFFF;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  font: inherit;
  font-size: 12px;
}

.capture-session-count {
  display: grid;
  grid-template-columns: auto auto;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 10px;
}

.capture-session-count strong {
  color: var(--brand-dark);
  font-size: 24px;
  line-height: 1;
}

.camera-scanner,
.manual-scan-form,
.attendance-candidate-search {
  padding: 16px;
}

.camera-scanner {
  position: relative;
  display: grid;
  place-items: center;
  gap: 10px;
  min-height: 430px;
  overflow: hidden;
  background: #0B1423;
}

.camera-scanner video {
  width: 100%;
  max-height: 380px;
  object-fit: cover;
}

.scanner-frame {
  position: absolute;
  width: min(240px, 60%);
  aspect-ratio: 1;
  pointer-events: none;
  border: 2px solid #FFE4DF;
}

.camera-scanner p {
  color: #EDF2F7;
  font-size: 10px;
  text-align: center;
}

.scanner-actions {
  display: flex;
  justify-content: center;
  gap: 8px;
}

.scanner-side-panel {
  display: grid;
  align-content: start;
  gap: 12px;
}

.manual-scan-form {
  display: grid;
  align-content: start;
  gap: 11px;
}

.attendance-candidate-search {
  display: grid;
  gap: 10px;
  background: var(--paper);
  border: 1px solid #EDF2F7;
  border-left: 3px solid #14243A;
  border-radius: 8px;
}

.candidate-search-heading {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
}

.candidate-search-heading > span {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  background: #EDF2F7;
  border-radius: 6px;
}

.candidate-search-heading img,
.candidate-search-field > img {
  width: 14px;
  height: 14px;
}

.candidate-search-heading h2,
.candidate-search-heading p {
  margin: 0;
}

.candidate-search-heading h2 {
  font-size: 14px;
}

.candidate-search-heading p {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.4;
}

.candidate-search-field {
  position: relative;
}

.candidate-search-field > img {
  position: absolute;
  top: 50%;
  left: 10px;
  pointer-events: none;
  opacity: .55;
  transform: translateY(-50%);
}

.candidate-search-field input {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px 8px 32px;
  color: var(--ink);
  background: #FFFFFF;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  font: inherit;
  font-size: 11px;
}

.candidate-search-status {
  min-height: 14px;
  color: var(--muted);
  font-size: 9px;
}

.candidate-search-results {
  display: grid;
  gap: 5px;
  max-height: 260px;
  padding: 0;
  margin: 0;
  overflow: auto;
  list-style: none;
}

.candidate-search-results li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 7px;
  padding: 8px;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 6px;
}

.candidate-result-identity {
  min-width: 0;
}

.candidate-result-identity strong,
.candidate-result-identity small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.candidate-result-identity strong {
  font-size: 11px;
}

.candidate-result-identity small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 8px;
}

.candidate-attendance {
  color: #BA3C38;
  font-size: 8px;
  font-weight: 700;
  white-space: nowrap;
}

.candidate-attendance.is-present {
  color: #14243A;
}

.candidate-use-button {
  min-height: 28px;
  padding: 5px 8px;
  color: #14243A;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  font: inherit;
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
}

.candidate-use-button:hover,
.candidate-use-button:focus-visible {
  color: #FFFFFF;
  background: #14243A;
  border-color: #14243A;
}

.scan-results {
  padding: 15px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.scan-results h2 {
  margin: 0 0 10px;
  font-size: 15px;
}

.scan-results ol {
  display: grid;
  gap: 7px;
  max-height: 260px;
  padding: 0;
  margin: 0;
  overflow: auto;
  list-style: none;
}

.scan-results li {
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  border-left: 3px solid var(--line-strong);
  background: #FFFFFF;
  font-size: 10px;
}

.scan-results li strong,
.scan-results li span {
  overflow-wrap: anywhere;
}

.scan-results li span {
  color: var(--muted);
}

.scan-results .scan-result-success {
  border-left-color: #293A50;
  background: #EDF2F7;
}

.scan-results .scan-result-error {
  border-left-color: #BA3C38;
  background: #EDF2F7;
}

.attendance-days {
  display: grid;
  gap: 0;
  max-width: 760px;
  padding: 5px 14px;
  margin-bottom: 12px;
}

.attendance-days form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 70px;
  border-bottom: 1px solid var(--line);
}

.attendance-days form:last-child {
  border-bottom: 0;
}

.attendance-days strong,
.attendance-days span {
  display: block;
}

.attendance-days strong {
  font-size: 12px;
}

.attendance-days div span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
}

.attendance-recorded {
  color: #14243A;
  font-size: 10px;
  font-weight: 700;
}

.dashboard-cne-registrations {
  margin-top: 18px;
}

.dashboard-cne-registrations > div:last-child {
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.dashboard-cne-registrations > div:last-child > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 58px;
  padding: 10px 13px;
  border-bottom: 1px solid var(--line);
}

.dashboard-cne-registrations > div:last-child > a:last-child {
  border-bottom: 0;
}

.dashboard-cne-registrations a strong,
.dashboard-cne-registrations a small {
  display: block;
}

.dashboard-cne-registrations a strong {
  font-size: 11px;
}

.dashboard-cne-registrations a small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
}

@media (max-width: 820px) {
  .cne-filter-bar,
  .form-grid,
  .field-selector-grid,
  .registration-field-grid,
  .registration-ticket-layout,
  .scanner-layout {
    grid-template-columns: 1fr;
  }

  .form-grid .span-all,
  .registration-field-grid .privacy-consent {
    grid-column: auto;
  }

  .attendance-capture-controls {
    align-items: stretch;
  }

  .registrant-toolbar {
    grid-template-columns: minmax(200px, 1fr) 86px auto;
  }

  .registrant-toolbar .button-ghost {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .registrant-answer-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .console-heading {
    align-items: flex-start;
  }

  .console-heading-actions {
    justify-content: flex-end;
  }

  .form-submit-bar {
    position: static;
  }
}

@media (max-width: 540px) {
  .console-heading,
  .registration-ticket-head {
    align-items: stretch;
    flex-direction: column;
  }

  .console-heading-actions {
    justify-content: flex-start;
  }

  .field-selector-grid ul,
  .registration-ticket dl {
    grid-template-columns: 1fr;
  }

  .candidate-search-results li {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .candidate-attendance {
    grid-column: 1;
  }

  .registrant-toolbar,
  .registrant-answer-list {
    grid-template-columns: 1fr;
  }

  .registrant-toolbar .button,
  .registrant-toolbar .button-ghost {
    width: 100%;
    grid-column: auto;
  }

  .registrant-detail-panel {
    padding: 12px;
  }

  .registrant-detail-heading {
    flex-direction: column;
    gap: 7px;
  }

  .form-section,
  .registration-form,
  .registration-ticket,
  .qr-ticket,
  .submitted-answer-list {
    padding: 13px;
  }

  .submitted-answer-list > div {
    grid-template-columns: 1fr;
    gap: 3px;
  }

  .camera-scanner {
    min-height: 330px;
  }

  .attendance-capture-controls {
    flex-direction: column;
  }

  .attendance-capture-controls select {
    width: 100%;
    min-width: 0;
  }
}

.dashboard-action-icon img {
  width: 15px;
  height: 15px;
  opacity: .72;
}

.dashboard-actions strong,
.dashboard-actions small {
  display: block;
  min-width: 0;
}

.dashboard-actions strong {
  color: var(--ink);
  font-size: 11px;
  font-weight: 700;
}

.dashboard-actions small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.35;
}

.dashboard-action-arrow {
  width: 12px;
  height: 12px;
  opacity: .45;
}

.dashboard-account-summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.dashboard-account-summary small,
.dashboard-account-summary strong {
  display: block;
}

.dashboard-account-summary small {
  color: var(--muted);
  font-size: 10px;
}

.dashboard-account-summary strong {
  margin-top: 2px;
  font-size: 13px;
}

.inline-action,
.secondary-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  margin-top: 15px;
  padding: 0 14px;

  background: var(--na-coral);
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  font-weight: 700;
;color:var(--na-white)!important;}

/* Detail pages */
.back-link {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  margin-bottom: 14px;
  color: var(--brand-dark);
  font-weight: 700;
}

.back-link img {
  width: 14px;
  height: 14px;
  margin-right: 6px;
  transform: rotate(180deg);
}

.detail-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 30px;
  color: var(--paper);
  background: var(--navy);
  border-radius: 8px;
}

.detail-apply {
  flex: 0 0 auto;
  color: var(--navy);
  background: var(--paper);
  border-color: var(--paper);
}

.detail-apply img {
  width: 14px;
  height: 14px;
}

.detail-header span {
  display: block;
  margin-bottom: 7px;
  color: #627083;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.detail-header p {
  margin: 10px 0 0;
  color: rgba(255,255,255, .75);
  font-size: 16px;
}

.detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 16px;
  margin-top: 16px;
}

.detail-body,
.facts {
  padding: 22px;
}

.detail-body h2 {
  margin: 0 0 12px;
  font-size: 19px;
  font-weight: 600;
}

.detail-body h2:not(:first-child) {
  margin-top: 28px;
}

.detail-body p {
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
}

.facts {
  display: grid;
  gap: 0;
  align-self: start;
}

.facts div {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 8px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
}

.facts div > img {
  width: 15px;
  height: 15px;
  margin-top: 2px;
  opacity: .6;
}

.facts div > span {
  display: grid;
  gap: 2px;
}

.facts div:first-child {
  padding-top: 0;
}

.facts div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.facts strong {
  font-size: 13px;
}

.facts span {
  color: var(--muted);
  overflow-wrap: anywhere;
}

/* Job detail */
.job-detail-page {
  --job-accent: #14243A;
  --job-soft: #EDF2F7;
}

.job-detail-page.job-government {
  --job-accent: #293A50;
  --job-soft: #EDF2F7;
}

.job-detail-page.job-private {
  --job-accent: #14243A;
  --job-soft: #EDF2F7;
}

.job-detail-page.job-freelance {
  --job-accent: #BA3C38;
  --job-soft: #EDF2F7;
}

.job-detail-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  padding: 20px;
  overflow: visible;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow-sm);
}

.job-detail-hero::before {
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: var(--job-accent);
  content: "";
}

.job-detail-identity {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
}

.detail-org-mark {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 50px;
  height: 50px;
  color: var(--job-accent);
  background: var(--job-soft);
  border: 1px solid color-mix(in srgb, var(--job-accent) 18%, white);
  border-radius: 8px;
  font-family: "Poppins", "Inter", sans-serif;
  font-size: 18px;
  font-weight: 600;
}

.job-detail-title {
  min-width: 0;
}

.job-detail-title h1 {
  margin: 0 0 5px;
  font-size: 25px;
  font-weight: 600;
  line-height: 1.25;
}

.job-detail-title > p {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.job-detail-title > p img {
  display: block;
  width: 13px;
  height: 13px;
  opacity: .62;
}

.job-detail-title > p .employer-verified {
  width: 14px;
  height: 14px;
  opacity: .85;
}

.detail-tags {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 3px;
}

.detail-type {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--job-accent);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.detail-type i {
  width: 6px;
  height: 6px;
  background: var(--job-accent);
  border-radius: 50%;
}

.detail-tags em {
  gap: 4px;
  min-height: 21px;
  padding-inline: 7px;
  font-size: 9px;
}

.detail-tags em img {
  width: 11px;
  height: 11px;
  opacity: .72;
}

.job-code-tag {
  padding-left: 7px;
  color: #627083;
  border-left: 1px solid var(--line);
  font-size: 9px;
  font-weight: 650;
  letter-spacing: 0;
}

.job-detail-action {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.job-action-tools {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}

.job-action-tools form {
  margin: 0;
}

.job-tool-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 34px;
  padding: 0 10px;
  color: #14243A;
  background: var(--paper);
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
}

button.job-tool-button:hover,
a.job-tool-button:hover,
.job-share-menu summary:hover {
  color: var(--job-accent);
  background: var(--job-soft);
  border-color: color-mix(in srgb, var(--job-accent) 25%, var(--line));
}

.job-tool-button img {
  width: 13px;
  height: 13px;
}

.job-tool-button.is-saved {
  color: var(--job-accent);
  background: var(--job-soft);
  border-color: color-mix(in srgb, var(--job-accent) 25%, var(--line));
}

.job-tool-button.is-saved img {
  filter: none;
}

.job-share-menu {
  position: relative;
}

.job-share-menu summary {
  list-style: none;
}

.job-share-menu summary::-webkit-details-marker {
  display: none;
}

.share-popover {
  position: absolute;
  top: calc(100% + 7px);
  right: 0;
  z-index: 8;
  display: grid;
  width: 190px;
  padding: 6px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 7px;
  box-shadow: var(--shadow-md);
}

.share-popover a,
.share-popover button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
  min-height: 34px;
  padding: 0 8px;
  color: #14243A;
  background: transparent;
  border: 0;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 650;
  text-align: left;
}

.share-popover a:hover,
.share-popover button:hover {
  color: var(--brand-dark);
  background: #EDF2F7;
}

.share-popover button[hidden] {
  display: none;
}

.share-popover button > img {
  width: 15px;
  height: 15px;
  opacity: .65;
}

.share-platform {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 18px;
  height: 18px;
  color: white;
  border-radius: 4px;
  font-size: 9px;
  font-weight: 800;
}

.share-platform.whatsapp {
  background: #293A50;
}

.share-platform.linkedin {
  background: #627083;
}

.share-platform.facebook {
  background: #EDF2F7;
}

.share-platform.x-platform {
  background: #0B1423;
}

.job-detail-page .detail-apply,
.application-button {
  color: var(--paper);
  background: var(--job-accent);
  border-color: var(--job-accent);
}

.job-detail-page .detail-apply img,
.application-button img {
  filter: brightness(0) invert(1);
}

.application-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 11px;
  color: var(--job-accent);
  background: var(--job-soft);
  border: 1px solid color-mix(in srgb, var(--job-accent) 18%, white);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}

.application-status img {
  width: 14px;
  height: 14px;
}

.detail-quick-facts {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 11px 0;
  background: #FFFFFF;
  border-radius: 7px;
}

.detail-quick-facts > div {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 0 13px;
  border-right: 1px solid var(--line);
}

.detail-quick-facts > div:last-child {
  border-right: 0;
}

.detail-quick-facts > div > img {
  width: 15px;
  height: 15px;
  margin-left: 7px;
  opacity: .62;
}

.detail-quick-facts span {
  display: grid;
  min-width: 0;
}

.detail-quick-facts small {
  color: #627083;
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
}

.detail-quick-facts strong {
  overflow: hidden;
  color: #14243A;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.detail-quick-facts > div:last-child strong {
  color: var(--job-accent);
}

.job-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 14px;
  margin-top: 14px;
}

.job-description-panel,
.application-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.job-description-panel {
  padding: 20px;
}

.application-panel {
  align-self: start;
  padding: 17px;
  border-top: 3px solid var(--job-accent);
}

.panel-heading {
  display: flex;
  align-items: center;
  gap: 9px;
}

.panel-heading > span {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 34px;
  height: 34px;
  color: var(--job-accent);
  background: var(--job-soft);
  border-radius: 7px;
}

.panel-heading > span img {
  width: 16px;
  height: 16px;
  opacity: .75;
}

.panel-heading .eyebrow {
  margin-bottom: 1px;
  color: var(--job-accent);
  font-size: 8px;
}

.panel-heading h2 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.compact-panel-heading > span {
  width: 30px;
  height: 30px;
}

.job-description-copy {
  margin-top: 16px;
  color: #454B54;
  font-size: 13px;
  line-height: 1.7;
}

.job-description-copy p {
  margin: 0 0 12px;
}

.job-description-copy p:last-child {
  margin-bottom: 0;
}

.required-skills {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.detail-skill-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}

.detail-skill-chips span {
  padding: 5px 9px;
  color: var(--job-accent);
  background: var(--job-soft);
  border: 1px solid color-mix(in srgb, var(--job-accent) 12%, white);
  border-radius: 5px;
  font-size: 10px;
  font-weight: 700;
}

.application-facts {
  display: grid;
  margin-top: 15px;
  border-block: 1px solid var(--line);
}

.application-facts > div {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px solid #EDF2F7;
}

.application-facts > div:last-child {
  border-bottom: 0;
}

.application-facts span {
  color: #627083;
  font-size: 10px;
}

.application-facts strong {
  overflow-wrap: anywhere;
  color: #14243A;
  font-size: 10px;
  text-align: right;
}

.application-button {
  width: 100%;
  margin-top: 14px;
}

.application-form {
  margin: 0;
}

.application-form .application-button {
  justify-content: center;
}

.application-confirmation-content {
  display: grid;
  gap: 0;
  padding: 12px 16px;
}

.application-confirmation-content > div {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
}

.application-confirmation-content span {
  color: var(--muted);
  font-size: 9px;
}

.application-confirmation-content strong {
  color: #14243A;
  font-size: 10px;
  text-align: right;
}

.application-confirmation-content p {
  margin: 11px 0 0;
  padding: 9px;
  color: #14243A;
  background: #FFFFFF;
  border-radius: 6px;
  font-size: 9px;
  line-height: 1.5;
}

.application-status.is-applied,
.application-note.application-complete {
  color: #14243A;
  background: #EDF2F7;
  border-color: #EDF2F7;
}

.application-note {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 8px;
  margin-top: 14px;
  padding: 10px;
  color: #BA3C38;
  background: #EDF2F7;
  border: 1px solid #FFE4DF;
  border-radius: 7px;
}

.application-note > img {
  width: 15px;
  height: 15px;
  margin-top: 1px;
  opacity: .7;
}

.application-note span {
  display: grid;
  gap: 2px;
  font-size: 10px;
  line-height: 1.45;
}

.application-note strong {
  font-size: 10px;
}

.similar-jobs-section {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.similar-jobs-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}

.similar-jobs-heading .panel-heading > span {
  color: var(--job-accent);
  background: var(--job-soft);
}

.similar-job-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.similar-job-card {
  --similar-accent: #14243A;
  --similar-soft: #EDF2F7;
  position: relative;
  min-width: 0;
  padding: 13px;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.similar-job-card.job-government {
  --similar-accent: #293A50;
  --similar-soft: #EDF2F7;
}

.similar-job-card.job-private {
  --similar-accent: #14243A;
  --similar-soft: #EDF2F7;
}

.similar-job-card.job-freelance {
  --similar-accent: #BA3C38;
  --similar-soft: #EDF2F7;
}

.similar-job-card:hover {
  border-color: color-mix(in srgb, var(--similar-accent) 35%, var(--line));
  box-shadow: 0 8px 22px rgba(20,36,58, .08);
  transform: translateY(-2px);
}

.similar-job-accent {
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: var(--similar-accent);
}

.similar-job-topline {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
}

.similar-job-mark {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  color: var(--similar-accent);
  background: var(--similar-soft);
  border-radius: 6px;
  font-size: 11px;
  font-weight: 800;
}

.similar-job-type {
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--similar-accent);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.similar-job-type i {
  width: 5px;
  height: 5px;
  background: var(--similar-accent);
  border-radius: 50%;
}

.similar-job-card .card-arrow {
  width: 25px;
  height: 25px;
  border-color: color-mix(in srgb, var(--similar-accent) 20%, var(--line));
}

.similar-job-card h3 {
  margin: 0;
  overflow: hidden;
  font-size: 13px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.similar-job-card > .similar-job-type {
  margin-top: 8px;
}

.similar-job-card > p,
.similar-job-meta span {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  color: var(--muted);
  font-size: 9px;
}

.similar-job-card > p {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.similar-job-card > p img,
.similar-job-meta img {
  flex: 0 0 auto;
  width: 11px;
  height: 11px;
  opacity: .55;
}

.similar-job-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px 8px;
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid #EDF2F7;
}

.similar-job-meta span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.similar-job-meta span:last-child {
  grid-column: 1 / -1;
}

/* Saved jobs */
.saved-job-list {
  display: grid;
  gap: 8px;
}

.saved-job-item {
  --saved-accent: #14243A;
  --saved-soft: #EDF2F7;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 3px solid var(--saved-accent);
  border-radius: 8px;
}

.saved-job-item.job-government {
  --saved-accent: #293A50;
  --saved-soft: #EDF2F7;
}

.saved-job-item.job-private {
  --saved-accent: #14243A;
  --saved-soft: #EDF2F7;
}

.saved-job-item.job-freelance {
  --saved-accent: #BA3C38;
  --saved-soft: #EDF2F7;
}

.saved-job-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 11px 12px;
}

.saved-job-mark {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  color: var(--saved-accent);
  background: var(--saved-soft);
  border-radius: 7px;
  font-size: 13px;
  font-weight: 800;
}

.saved-job-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.saved-job-kicker {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--saved-accent);
  font-size: 8px;
  font-weight: 800;
  text-transform: uppercase;
}

.saved-job-kicker i {
  width: 5px;
  height: 5px;
  background: var(--saved-accent);
  border-radius: 50%;
}

.saved-job-copy strong {
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.saved-job-copy small {
  display: flex;
  align-items: center;
  gap: 5px;
  overflow: hidden;
  color: var(--muted);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.saved-job-copy small img {
  width: 11px;
  height: 11px;
  opacity: .55;
}

.saved-job-item > form {
  display: grid;
  place-items: center;
  margin: 0;
  padding: 0 11px;
  border-left: 1px solid var(--line);
}

.saved-job-item > form button {
  display: grid;
  place-items: center;
  width: 31px;
  min-height: 31px;
  padding: 0;
  color: var(--saved-accent);
  background: var(--saved-soft);
  border-color: transparent;
}

.saved-job-item > form button img {
  width: 14px;
  height: 14px;
}

/* Forms and account screens */
.auth-shell {
  max-width: 560px;
}

.auth-card,
.profile-form,
.credential-panel {
  padding: 22px;
  box-shadow: var(--shadow-sm);
}

.auth-card {
  display: grid;
  gap: 16px;
}

.form-grid,
.credential-panel form,
.credential-list {
  display: grid;
  gap: 15px;
}

.form-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.auth-card label,
.form-grid > label,
.credential-panel form > label {
  display: grid;
  gap: 7px;
  min-width: 0;
  color: #454B54;
  font-size: 13px;
  font-weight: 600;
}

.form-grid .span-two {
  grid-column: 1 / -1;
}

.form-grid small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 400;
}

.field-error,
.errorlist {
  color: var(--danger);
  font-size: 12px;
}

.errorlist {
  margin: 0;
  padding-left: 18px;
}

input[type="checkbox"] {
  width: 19px;
  height: 19px;
  min-height: 19px;
  accent-color: var(--brand);
}

input[type="file"] {
  min-height: auto;
  padding: 10px;
}

input::file-selector-button {
  min-height: 34px;
  margin-right: 10px;
  padding: 0 11px;

  background: var(--na-coral);
  border: 1px solid #EDF2F7;
  border-radius: 6px;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  cursor: pointer;
;color:var(--na-white)!important;}

.profile-topline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.profile-topline .secondary-action {
  flex: 0 0 auto;
  margin-top: 0;
}

.edit-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 350px;
  gap: 16px;
}

.profile-form > button {
  margin-top: 18px;
}

.credential-panel {
  display: grid;
  gap: 18px;
  align-self: start;
}

.credential-panel h2 {
  margin: 0;
  font-size: 20px;
}

.credential-list div {
  display: grid;
  gap: 4px;
  padding: 12px;
  background: var(--soft);
  border: 1px solid var(--line);
  border-radius: 7px;
}

.credential-list span,
.credential-list p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

/* Authentication */
.auth-page {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(520px, 1.28fr);
  min-height: calc(100vh - 58px);
  background: var(--paper);
}

.auth-aside {
  display: grid;
  place-items: center;
  padding: 44px;
  color: var(--paper);
  background: var(--navy);
}

.signup-aside {
  background: #14243A;
}

.auth-aside-inner {
  width: min(360px, 100%);
}

.auth-aside .eyebrow {
  margin-top: 20px;
  color: #627083;
}

.auth-aside h1 {
  margin: 0;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.28;
}

.auth-symbol {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  background: rgba(255,255,255, .12);
  border: 1px solid rgba(255,255,255, .18);
  border-radius: 8px;
}

.auth-symbol img {
  width: 21px;
  height: 21px;
  filter: brightness(0) invert(1);
}

.auth-trust-list {
  display: grid;
  gap: 12px;
  margin-top: 32px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255, .14);
}

.auth-trust-list span {
  display: flex;
  align-items: center;
  gap: 9px;
  color: rgba(255,255,255, .78);
  font-size: 12px;
  font-weight: 600;
}

.auth-trust-list img {
  width: 16px;
  height: 16px;
  filter: brightness(0) invert(1);
  opacity: .82;
}

.auth-stage {
  display: grid;
  place-items: center;
  padding: 34px;
  background: #FFFFFF;
}

.auth-panel {
  width: min(450px, 100%);
  padding: 26px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow-md);
}

.signup-panel {
  width: min(620px, 100%);
}

.auth-heading {
  margin-bottom: 18px;
}

.auth-heading .eyebrow {
  margin-bottom: 5px;
}

.auth-heading h2 {
  margin: 0;
  font-size: 23px;
  font-weight: 600;
}

.auth-heading p:not(.eyebrow) {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.provider-actions {
  display: grid;
  gap: 8px;
}

.provider-actions-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.provider-actions-login {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.provider-actions-login form,
.provider-actions-login .passkey-button {
  min-width: 0;
}

.provider-actions-login form .provider-button,
.provider-actions-login .passkey-button {
  width: 100%;
}

.provider-actions-login .passkey-button {
  grid-column: 1 / -1;
}

.provider-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 12px;
  color: #14243A;
  background: transparent;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  font-size: 12px;
  font-weight: 700;
  transition: background .16s ease, border-color .16s ease;
}

.provider-button:hover {
  background: var(--soft);
  border-color: #627083;
}

.provider-button:disabled,
.provider-button:disabled:hover {
  color: #627083;
  background: #EDF2F7;
  border-color: #EDF2F7;
  cursor: not-allowed;
  opacity: .72;
}

.provider-dark {
  color: var(--paper);
  background: #0B1423;
  border-color: #0B1423;
}

.provider-dark:hover {
  background: #454B54;
  border-color: #454B54;
}

.auth-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 16px 0;
  color: #627083;
  font-size: 10px;
  white-space: nowrap;
}

.auth-divider::before,
.auth-divider::after {
  flex: 1;
  height: 1px;
  background: var(--line);
  content: "";
}

.auth-form {
  display: grid;
  gap: 13px;
}

.allauth-page main {
  width: min(620px, calc(100% - 32px));
  min-height: calc(100vh - 132px);
  margin: 0 auto;
  padding: 56px 0;
}

.allauth-page main > h1 {
  margin: 0 0 10px;
  font-size: 28px;
}

.allauth-page main > h2 {
  margin: 28px 0 10px;
  font-size: 18px;
}

.allauth-page main > p {
  color: var(--muted);
}

.allauth-page main > form {
  display: grid;
  gap: 14px;
  margin-top: 24px;
  padding: 24px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 7px;
  box-shadow: var(--shadow-sm);
}

.allauth-page main > form p {
  display: grid;
  gap: 6px;
  margin: 0;
}

.allauth-page main > form button,
.allauth-page main > a[href*="webauthn/add"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 16px;
  color: #FFFFFF;
  background: var(--brand);
  border: 1px solid var(--brand);
  border-radius: 7px;
  font-weight: 700;
}

.allauth-page main > table {
  width: 100%;
  margin: 22px 0;
  border-collapse: collapse;
  background: var(--paper);
  border: 1px solid var(--line);
}

.allauth-page main > table th,
.allauth-page main > table td {
  padding: 12px;
  border-bottom: 1px solid var(--line);
  text-align: left;
}

.auth-form > label,
.auth-form-grid > label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #454B54;
  font-size: 11px;
  font-weight: 700;
}

.auth-input {
  position: relative;
  display: block;
}

.auth-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.auth-span-two {
  grid-column: 1 / -1;
}

.auth-submit {
  justify-self: start;
  min-width: 132px;
  margin-top: 2px;
}

.auth-switch {
  margin: 17px 0 0;
  padding-top: 15px;
  color: var(--muted);
  border-top: 1px solid var(--line);
  font-size: 11px;
}

.auth-switch a {
  color: var(--brand-dark);
  font-weight: 700;
}

.provider-setup-page {
  display: grid;
  min-height: calc(100vh - 58px);
  place-items: center;
  padding: 32px 16px;
}

.provider-setup-panel {
  width: min(480px, 100%);
  padding: 28px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow-md);
}

.provider-setup-panel .light-symbol {
  background: var(--soft);
  border-color: var(--line);
}

.provider-setup-panel .light-symbol img {
  filter: none;
}

.provider-setup-panel .eyebrow {
  margin-top: 18px;
}

.provider-setup-panel h1 {
  margin: 0;
  font-size: 23px;
  line-height: 1.35;
}

.provider-setup-panel > p:not(.eyebrow) {
  margin: 9px 0 18px;
  color: var(--muted);
}

/* Public nurse profile */
.public-profile-page {
  background: #FFFFFF;
}

.public-profile-page .profile-hero {
  padding: 29px max(20px, calc((100vw - var(--container)) / 2));
  color: var(--paper);
  background: #14243A;
  border-bottom: 4px solid var(--brand);
}

.profile-hero-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.profile-identity {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.avatar {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 78px;
  height: 78px;
  overflow: hidden;
  color: #14243A;
  background: #EDF2F7;
  border: 3px solid rgba(255,255,255, .22);
  border-radius: 8px;
  font-size: 25px;
  font-weight: 700;
}

.avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.profile-identity-copy {
  min-width: 0;
}

.profile-verification {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 4px;
  color: #627083;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
}

.profile-verification img {
  width: 13px;
  height: 13px;
  filter: brightness(0) invert(1);
  opacity: .82;
}

.profile-identity h1 {
  overflow-wrap: anywhere;
}

.profile-identity-copy > p {
  margin: 4px 0 0;
  color: rgba(255,255,255, .76);
  font-size: 12px;
}

.profile-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 14px;
  margin-top: 12px;
}

.profile-hero-meta span {
  display: flex;
  align-items: center;
  gap: 5px;
  color: rgba(255,255,255, .82);
  font-size: 10px;
  font-weight: 600;
}

.profile-hero-meta img {
  width: 12px;
  height: 12px;
  filter: brightness(0) invert(1);
  opacity: .65;
}

.profile-availability {
  display: flex;
  align-items: center;
  gap: 9px;
  flex: 0 0 auto;
  min-width: 190px;
  padding: 10px 12px;
  background: rgba(255,255,255, .08);
  border: 1px solid rgba(255,255,255, .14);
  border-radius: 7px;
}

.availability-indicator {
  width: 9px;
  height: 9px;
  background: #627083;
  border: 2px solid rgba(255,255,255, .3);
  border-radius: 50%;
}

.profile-availability div {
  display: grid;
  gap: 1px;
}

.profile-availability small {
  color: rgba(255,255,255, .62);
  font-size: 9px;
}

.profile-availability strong {
  font-size: 12px;
}

.profile-content-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 14px;
  width: min(var(--container), calc(100% - 40px));
  margin-inline: auto;
  padding: 20px 0;
}

.profile-main-column {
  display: grid;
  gap: 14px;
  align-content: start;
}

.profile-panel {
  min-width: 0;
  padding: 17px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.profile-section-title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.profile-section-icon,
.credential-icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 32px;
  height: 32px;
  background: var(--na-coral);
  border-radius: 6px;
;color:var(--na-white)!important;}

.profile-section-icon img,
.credential-icon img {
  width: 15px;
  height: 15px;
  opacity: .7;
}

.profile-section-title div {
  min-width: 0;
}

.profile-section-title small {
  display: block;
  margin-bottom: 1px;
  color: var(--brand);
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
}

.profile-section-title h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 650;
}

.profile-about > p {
  margin: 13px 0 0;
  color: #454B54;
  font-size: 12px;
  line-height: 1.65;
}

.profile-skill-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-top: 13px;
}

.profile-skill-grid > span {
  display: grid;
  grid-template-columns: 15px minmax(0, 1fr);
  align-items: center;
  gap: 1px 6px;
  min-width: 0;
  padding: 8px 9px;
  color: #14243A;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
}

.profile-skill-grid > span > img {
  grid-row: 1 / 3;
  width: 14px;
  height: 14px;
  opacity: .7;
}

.profile-skill-grid small {
  color: #627083;
  font-size: 8px;
  font-weight: 500;
}

.profile-facts-panel {
  align-self: start;
}

.profile-fact-list {
  margin: 12px 0 0;
}

.profile-fact-list > div {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 10px;
  padding: 10px 0;
  border-top: 1px solid #EDF2F7;
}

.profile-fact-list dt {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  color: #627083;
  font-size: 9px;
  font-weight: 700;
}

.profile-fact-list dt img {
  flex: 0 0 auto;
  width: 12px;
  height: 12px;
  opacity: .55;
}

.profile-fact-list dd {
  min-width: 0;
  margin: 0;
  color: #14243A;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.profile-fact-list .registration-value {
  display: grid;
  gap: 3px;
}

.registration-value > span {
  letter-spacing: 0;
}

.registration-value.is-masked > span {
  color: #454B54;
}

.registration-value.is-unlocked > span {
  color: #14243A;
}

.registration-value small {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #BA3C38;
  font-size: 8px;
  font-weight: 600;
}

.registration-value small img {
  width: 9px;
  height: 9px;
  opacity: .65;
}

.nuid-value {
  display: grid;
  gap: 3px;
}

.nuid-value.is-unlocked > span {
  color: #14243A;
}

.nuid-value.is-masked > span {
  color: #454B54;
}

.nuid-status-pill {
  display: inline-flex;
  align-items: center;
  width: max-content;
  gap: 5px;
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 800;
  border-radius: 999px;
}

.nuid-status-pill.is-verified {
  color: #14243A;
  background: rgba(20,36,58, .1);
  border: 1px solid rgba(20,36,58, .24);
}

.nuid-status-pill.is-unverified {
  color: #BA3C38;
  background: rgba(20,36,58, .08);
  border: 1px solid rgba(20,36,58, .2);
}

.nuid-status-pill.is-pending {
  width: fit-content;
  max-width: 100%;
  line-height: 1.25;
  white-space: normal;

  background: var(--na-coral);
  border: 1px solid #FFE4DF;
;color:var(--na-white)!important;}

.nuid-value small {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #627083;
  font-size: 8px;
  font-weight: 600;
}

.nuid-value small img,
.nuid-value a img {
  width: 9px;
  height: 9px;
  opacity: .65;
}

.nuid-value a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  width: max-content;
  margin-top: 3px;
  color: var(--brand-dark);
  font-size: 8px;
  font-weight: 700;
}

.nuid-document-meta small,
.auth-form-grid label > small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 400;
}

.nuid-document-field > label {
  display: grid;
  gap: 5px;
  color: #454B54;
  font-size: 9px;
  font-weight: 700;
}

.nuid-document-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 5px;
}

.nuid-document-meta a {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 5px;
  color: var(--brand-dark);
  font-size: 8px;
  font-weight: 700;
}

.nuid-document-meta a img {
  width: 11px;
  height: 11px;
  opacity: .72;
}

.profile-contact-access {
  margin-top: 12px;
  padding: 12px;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
}

.profile-contact-heading {
  display: flex;
  align-items: center;
  gap: 8px;
}

.profile-contact-heading > span {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 29px;
  height: 29px;
  background: var(--na-coral);
  border-radius: 5px;
;color:var(--na-white)!important;}

.profile-contact-heading img {
  width: 13px;
  height: 13px;
  opacity: .7;
}

.profile-contact-heading h3,
.profile-contact-heading p {
  margin: 0;
}

.profile-contact-heading h3 {
  font-size: 11px;
  font-weight: 700;
}

.profile-contact-heading p {
  margin-top: 1px;
  color: var(--muted);
  font-size: 8px;
}

.profile-contact-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  min-height: 35px;
  margin-top: 10px;
  padding: 0 10px;
  color: #FFFFFF;
  background: var(--brand-dark);
  border: 1px solid var(--brand-dark);
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
}

.profile-contact-button img {
  width: 12px;
  height: 12px;
  filter: brightness(0) invert(1);
}

.profile-contact-button.is-locked {
  color: #627083;
  background: #EDF2F7;
  border-color: #EDF2F7;
  cursor: not-allowed;
}

.profile-contact-button.is-locked img {
  filter: none;
  opacity: .6;
}

.profile-contact-access > small {
  display: block;
  margin-top: 6px;
  color: #627083;
  font-size: 8px;
  text-align: center;
}

.profile-contact-details {
  display: grid;
  gap: 6px;
  margin: 10px 0 0;
  padding-top: 9px;
  border-top: 1px solid #EDF2F7;
}

.profile-contact-details > div {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 8px;
}

.profile-contact-details dt {
  color: var(--muted);
  font-size: 8px;
  font-weight: 600;
}

.profile-contact-details dd {
  min-width: 0;
  margin: 0;
  color: var(--ink);
  font-size: 9px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.profile-contact-restricted {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 34px;
  margin-top: 10px;
  color: #454B54;
  background: #EDF2F7;
  border-radius: 6px;
  font-size: 9px;
  font-weight: 700;
}

.profile-contact-restricted img {
  width: 12px;
  height: 12px;
  opacity: .6;
}

.profile-credentials-band {
  padding: 19px max(20px, calc((100vw - var(--container)) / 2)) 46px;
  background: var(--paper);
  border-top: 1px solid var(--line);
}

.profile-credentials-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}

.credential-count {
  flex: 0 0 auto;
  padding: 5px 8px;
  color: #454B54;
  background: #EDF2F7;
  border-radius: 5px;
  font-size: 9px;
  font-weight: 700;
}

.profile-credential-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.profile-credential-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 11px;
  border: 1px solid var(--line);
  border-left: 3px solid #FF6B61;
  border-radius: 7px;
}

.profile-credential-card.status-verified {
  border-left-color: #293A50;
}

.profile-credential-card h3 {
  margin: 0;
  font-size: 12px;
}

.profile-credential-card p,
.profile-credential-card small {
  display: block;
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 9px;
}

.profile-credential-card em {
  gap: 3px;
  min-height: 21px;
  padding-inline: 7px;
  font-size: 8px;
}

.profile-credential-card em img {
  width: 10px;
  height: 10px;
}

.profile-empty-credentials {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 68px;
  padding: 13px;
  color: #627083;
  background: #FFFFFF;
  border: 1px dashed var(--line-strong);
  border-radius: 7px;
}

.profile-empty-credentials > img {
  width: 23px;
  height: 23px;
  opacity: .45;
}

.profile-empty-credentials span {
  display: grid;
  gap: 2px;
}

.profile-empty-credentials strong {
  color: #14243A;
  font-size: 11px;
}

.profile-empty-credentials small {
  font-size: 9px;
}

.public-experience-list {
  display: grid;
  gap: 8px;
}

.public-experience-list > div {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr);
  gap: 8px;
  padding: 9px;
  background: #FFFFFF;
  border-radius: 6px;
}

.public-experience-list i {
  width: 7px;
  height: 7px;
  margin-top: 4px;
  background: #14243A;
  border-radius: 50%;
}

.public-experience-list span {
  display: grid;
  gap: 2px;
}

.public-experience-list strong {
  font-size: 10px;
}

.public-experience-list small,
.public-experience-list > p {
  margin: 0;
  color: var(--muted);
  font-size: 8px;
}

/* Nurse profile editor */
.profile-editor-page {
  padding-top: 22px;
}

.profile-editor-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.profile-editor-topline h1 {
  margin: 0;
  font-size: 25px;
  font-weight: 650;
}

.profile-editor-topline .eyebrow {
  margin-bottom: 3px;
}

.profile-editor-topline .secondary-action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 10px;
  color: var(--brand-dark);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
}

.profile-editor-topline .secondary-action img {
  width: 12px;
  height: 12px;
}

.profile-editor-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  align-items: start;
  gap: 14px;
}

.profile-editor-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 0;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.editor-section {
  min-width: 0;
  padding: 14px;
  border-bottom: 1px solid var(--line);
}

.compact-full-section,
.photo-editor-section,
.profile-save-bar {
  grid-column: 1 / -1;
}

.compact-half-section:nth-of-type(even) {
  border-left: 1px solid var(--line);
}

.editor-section-heading,
.side-panel-heading {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 14px;
}

.editor-section-heading > span,
.side-panel-heading > span {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 31px;
  height: 31px;
  background: var(--na-coral);
  border-radius: 6px;
;color:var(--na-white)!important;}

.editor-section-heading > span img,
.side-panel-heading > span img {
  width: 15px;
  height: 15px;
  opacity: .7;
}

.editor-section-heading small,
.side-panel-heading small {
  display: block;
  margin-bottom: 1px;
  color: var(--brand);
  font-size: 8px;
  font-weight: 750;
  text-transform: uppercase;
}

.editor-section-heading h2,
.side-panel-heading h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 650;
}

.photo-editor-row {
  display: flex;
  align-items: center;
  gap: 14px;
}

.photo-preview {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 74px;
  height: 74px;
  overflow: hidden;

  background: var(--na-coral);
  border: 1px solid #EDF2F7;
  border-radius: 8px;
  font-size: 21px;
  font-weight: 750;
;color:var(--na-white)!important;}

.photo-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.photo-actions {
  display: grid;
  justify-items: start;
  gap: 5px;
}

.photo-actions #id_profile_photo {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.photo-select-button {
  gap: 6px;
  min-height: 34px;
  padding-inline: 11px;
  font-size: 11px;
  cursor: pointer;
}
.account-card label.photo-select-button{display:inline-flex;align-items:center;color:#FFFFFF;background:#14243A;border-color:#14243A}.account-card label.photo-select-button:hover{color:#FFFFFF;background:#14243A}

.photo-select-button img {
  width: 13px;
  height: 13px;
  filter: brightness(0) invert(1);
}

.photo-actions > small {
  color: var(--muted);
  font-size: 9px;
}

.photo-cropper {
  display: grid;
  grid-template-columns: minmax(180px, 260px) minmax(180px, 1fr);
  align-items: center;
  gap: 16px;
  margin-top: 14px;
  padding: 13px;
  background: #EDF2F7;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.photo-cropper[hidden] {
  display: none;
}

.photo-cropper canvas {
  width: 100%;
  max-width: 260px;
  aspect-ratio: 1;
  background: #EDF2F7;
  border-radius: 7px;
  cursor: grab;
  touch-action: none;
}

.photo-cropper canvas:active {
  cursor: grabbing;
}

.cropper-controls {
  display: grid;
  gap: 14px;
}

.cropper-controls > label {
  display: grid;
  gap: 7px;
  color: #14243A;
  font-size: 10px;
  font-weight: 700;
}

.cropper-controls > div {
  display: flex;
  gap: 7px;
}

.cropper-controls button {
  min-height: 34px;
  font-size: 10px;
}

.editor-field-grid {
  display: grid;
  gap: 12px;
  align-items: start;
}

.editor-field-grid.two-columns {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.editor-field-grid > label,
.credential-panel form > label {
  position: relative;
  display: grid;
  gap: 5px;
  min-width: 0;
  align-content: start;
  color: #454B54;
  font-size: 10px;
  font-weight: 700;
}

.editor-field-grid input:not([type="checkbox"]):not([type="range"]),
.editor-field-grid select,
.editor-field-grid textarea,
.credential-panel form input,
.credential-panel form select {
  box-sizing: border-box;
  height: 38px;
  min-height: 38px;
  font-size: 12px;
  font-weight: 450;
  line-height: 1.2;
}

.editor-field-grid textarea {
  height: auto;
  min-height: 104px;
  line-height: 1.55;
}

.editor-field-grid input[type="file"],
.credential-panel form input[type="file"] {
  height: auto;
  min-height: 38px;
  padding: 4px 6px;
}

.editor-field-grid input[type="file"]::file-selector-button,
.credential-panel form input[type="file"]::file-selector-button {
  min-height: 28px;
  margin-right: 8px;
  padding: 0 9px;
}

.span-all {
  grid-column: 1 / -1;
}

.field-meta {
  position: absolute;
  right: 8px;
  bottom: 7px;
  color: #627083;
  font-size: 8px;
  font-weight: 500;
}

.experience-field > span:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.experience-field output {
  color: var(--brand-dark);
  font-size: 10px;
  font-weight: 750;
}

.experience-field input[type="range"],
.cropper-controls input[type="range"] {
  width: 100%;
  height: 20px;
  min-height: 20px;
  padding: 0;
  accent-color: var(--brand);
  border: 0;
}

.range-scale {
  display: flex;
  justify-content: space-between;
  color: #627083;
  font-weight: 500;
}

.range-scale small {
  font-size: 8px;
}

.choice-fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.choice-fieldset legend {
  margin-bottom: 7px;
  color: #454B54;
  font-size: 10px;
  font-weight: 700;
}

.choice-fieldset ul,
.choice-fieldset > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.choice-fieldset li label,
.choice-fieldset > div > div > label {
  display: flex;
  align-items: center;
  gap: 5px;
  min-height: 29px;
  padding: 0 8px;
  color: #14243A;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  font-size: 9px;
  font-weight: 650;
  cursor: pointer;
}

.choice-fieldset input[type="checkbox"] {
  width: 13px;
  height: 13px;
  accent-color: var(--brand);
}

.language-fieldset ul,
.language-fieldset > div {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.qualification-fieldset > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.location-heading {
  padding-right: 150px;
  position: relative;
}

.location-button {
  position: absolute;
  top: 0;
  right: 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 31px;
  padding: 0 9px;
  color: var(--brand-dark);
  background: transparent;
  border-color: #EDF2F7;
  font-size: 9px;
}

.location-button img {
  width: 11px;
  height: 11px;
}

.location-button:hover {
  color: var(--paper);
}

.location-button:hover img {
  filter: brightness(0) invert(1);
}

.location-status {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: -3px 0 12px;
  color: #627083;
  font-size: 9px;
}

.location-status-dot {
  width: 6px;
  height: 6px;
  background: #FF6B61;
  border-radius: 50%;
;color:var(--na-white)!important;}

.location-status.is-captured .location-status-dot {
  background: #293A50;
}

.location-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.consent-control {
  display: flex !important;
  align-items: center;
  gap: 8px !important;
  min-height: 42px;
  padding: 8px 10px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
  cursor: pointer;
}

.consent-control input {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  accent-color: var(--brand);
}

.consent-control > span {
  display: grid;
  gap: 1px;
}

.consent-control strong {
  color: #14243A;
  font-size: 10px;
}

.consent-control small {
  color: var(--muted);
  font-size: 8px;
  font-weight: 500;
}

.trainer-privilege-control {
  position: relative;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 6px 8px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.trainer-privilege-control.is-enabled {
  background: #FFFFFF;
  border-color: #EDF2F7;
}

.trainer-privilege-mark {
  display: grid;
  width: 22px;
  height: 22px;
  color: #14243A;
  background: #EDF2F7;
  border-radius: 5px;
  font-size: 9px;
  font-weight: 800;
  place-items: center;
}

.trainer-privilege-control.is-enabled .trainer-privilege-mark {
  color: #FFFFFF;
  background: #293A50;
}

.trainer-privilege-copy {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.trainer-privilege-copy strong {
  color: #14243A;
  font-size: 9px;
  line-height: 1.2;
}

.trainer-privilege-copy small,
.trainer-content-unavailable {
  color: var(--muted);
  font-size: 7px;
  font-weight: 500;
  line-height: 1.25;
}

.trainer-info-button,
.trainer-remove-button {
  width: auto;
  min-height: 24px;
  padding: 0 7px;
  border-radius: 5px;
  font-size: 7px;
  line-height: 1;
}

.trainer-info-button {
  color: #14243A;
  background: #EDF2F7;
  border-color: #EDF2F7;
}

.trainer-info-button:hover {
  color: #FFFFFF;
  background: #14243A;
  border-color: #14243A;
}

.trainer-remove-button {
  color: #BA3C38;
  background: transparent;
  border-color: transparent;
}

.trainer-remove-button:hover {
  color: #BA3C38;
  background: #EDF2F7;
  border-color: #FFE4DF;
}

.trainer-modal {
  position: fixed;
  z-index: 120;
  inset: 0;
  display: grid;
  padding: 20px;
  place-items: center;
}

.trainer-modal[hidden] {
  display: none;
}

.trainer-modal-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0;
  background: rgb(14 29 25 / 58%);
  border: 0;
  border-radius: 0;
}

.trainer-modal-dialog {
  position: relative;
  width: min(520px, 100%);
  max-height: min(620px, calc(100vh - 40px));
  overflow: auto;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 8px;
  box-shadow: 0 24px 64px rgb(6 35 29 / 24%);
}

.trainer-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px 10px;
  border-bottom: 1px solid var(--line);
}

.trainer-modal-head small {
  color: #14243A;
  font-size: 7px;
  font-weight: 800;
  text-transform: uppercase;
}

.trainer-modal-head h2 {
  margin: 2px 0 0;
  font-size: 16px;
}

.trainer-modal-head > button {
  width: 26px;
  min-height: 26px;
  padding: 0;
  color: #454B54;
  background: #EDF2F7;
  border-color: #EDF2F7;
  font-size: 18px;
  line-height: 1;
}

.trainer-modal-content {
  padding: 12px 16px;
  color: #14243A;
  font-size: 9px;
  line-height: 1.55;
}

.trainer-modal-content h2,
.trainer-modal-content h3 {
  margin: 12px 0 4px;
  font-size: 11px;
}

.trainer-modal-content p,
.trainer-modal-content ul,
.trainer-modal-content ol {
  margin: 0 0 8px;
}

.trainer-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  padding: 10px 16px 14px;
  border-top: 1px solid var(--line);
}

.trainer-modal-actions .button {
  min-height: 30px;
  padding: 0 11px;
  font-size: 8px;
}

body.has-open-modal {
  overflow: hidden;
}

/* Employer authentication and workspace */
.auth-role-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 14px;
  padding: 3px;
  background: #EDF2F7;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.auth-role-tabs a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 31px;
  color: #627083;
  border-radius: 5px;
  font-size: 9px;
  font-weight: 700;
}

.auth-role-tabs a.active {
  color: #14243A;
  background: #FFFFFF;
  box-shadow: 0 1px 4px rgb(20 45 39 / 9%);
}

.auth-role-tabs img {
  width: 12px;
  height: 12px;
  opacity: .7;
}

.employer-dashboard-page,
.employer-profile-page {
  max-width: 1120px;
}

.employer-dashboard-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 13px;
}

.employer-dashboard-heading h1 {
  margin: 0;
  font-size: 22px;
  font-weight: 600;
}

.employer-heading-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.employer-heading-actions .button,
.employer-dashboard-heading > .button {
  min-height: 34px;
  padding: 0 10px;
  font-size: 9px;
}

.employer-heading-actions .button img,
.employer-dashboard-heading > .button img,
.employer-profile-save .button img {
  width: 12px;
  height: 12px;
}

.employer-identity-band {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 13px 15px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-left: 3px solid #14243A;
  border-radius: 7px;
}

.employer-identity-mark {
  display: grid;
  width: 48px;
  height: 48px;
  color: #FFFFFF;
  background: #14243A;
  border-radius: 7px;
  font-size: 17px;
  font-weight: 700;
  place-items: center;
}

.employer-identity-copy {
  min-width: 0;
}

.employer-identity-copy > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}

.employer-identity-copy h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 650;
}

.employer-identity-copy p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 9px;
}

.employer-verification-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 21px;
  padding: 0 7px;
  color: #14243A;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  font-size: 7px;
  font-weight: 750;
}

.employer-verification-chip i {
  width: 5px;
  height: 5px;
  background: #293A50;
  border-radius: 50%;
}

.employer-verification-chip.is-pending {

  background: var(--na-coral);
  border-color: #FFE4DF;
;color:var(--na-white)!important;}

.employer-verification-chip.is-pending i {
  background: #FF6B61;
;color:var(--na-white)!important;}

.employer-identity-contact {
  display: grid;
  min-width: 190px;
  padding-left: 14px;
  border-left: 1px solid var(--line);
}

.employer-identity-contact small {
  color: var(--muted);
  font-size: 7px;
  text-transform: uppercase;
}

.employer-identity-contact strong {
  margin-top: 2px;
  font-size: 9px;
}

.employer-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.employer-metrics > div {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-height: 58px;
  padding: 9px 10px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.employer-metric-icon {
  display: grid;
  width: 32px;
  height: 32px;
  background: #EDF2F7;
  border-radius: 6px;
  place-items: center;
}

.employer-metric-icon.applications {
  background: #EDF2F7;
}

.employer-metric-icon.shortlisted {
  background: var(--na-coral);
;color:var(--na-white)!important;}

.employer-metric-icon.unlocked {
  background: #EDF2F7;
}

.employer-metric-icon img {
  width: 14px;
  height: 14px;
  opacity: .72;
}

.employer-metrics small,
.employer-metrics strong {
  display: block;
}

.employer-metrics small {
  color: var(--muted);
  font-size: 8px;
}

.employer-metrics strong {
  margin-top: 1px;
  color: #14243A;
  font-size: 16px;
  font-weight: 650;
}

.employer-workspace-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  gap: 10px;
  margin-top: 10px;
}

.employer-work-panel {
  min-width: 0;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.employer-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 52px;
  padding: 9px 11px;
  border-bottom: 1px solid var(--line);
}

.employer-panel-head small {
  color: #14243A;
  font-size: 7px;
  font-weight: 750;
  text-transform: uppercase;
}

.employer-panel-head h2 {
  margin: 1px 0 0;
  font-size: 13px;
}

.employer-panel-head > a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #14243A;
  font-size: 9px;
  font-weight: 700;
}

.employer-panel-head > a img {
  width: 10px;
  height: 10px;
}

.employer-job-list,
.employer-applicant-list {
  display: grid;
}

.employer-job-list > a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 68px 48px 12px;
  align-items: center;
  gap: 8px;
  min-height: 58px;
  padding: 8px 11px;
  border-bottom: 1px solid #EDF2F7;
}

.employer-job-list > a:last-child,
.employer-applicant-list > a:last-child {
  border-bottom: 0;
}

.employer-job-list > a:hover,
.employer-applicant-list > a:hover {
  background: #FFFFFF;
}

.employer-job-status,
.application-pipeline-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 21px;
  padding: 0 6px;
  color: #454B54;
  background: #EDF2F7;
  border-radius: 4px;
  font-size: 8px;
  font-weight: 700;
}

.employer-job-status i {
  width: 5px;
  height: 5px;
  background: #627083;
  border-radius: 50%;
}

.employer-job-status.status-published {
  color: #14243A;
  background: #EDF2F7;
}

.employer-job-status.status-published i {
  background: #293A50;
}

.employer-job-status.status-closed {
  color: #BA3C38;
  background: #EDF2F7;
}

.employer-job-status.status-closed i {
  background: #BA3C38;
}

.employer-job-copy,
.employer-applicant-list a > span:nth-child(2) {
  min-width: 0;
}

.employer-job-copy strong,
.employer-job-copy small,
.employer-applicant-list a > span:nth-child(2) strong,
.employer-applicant-list a > span:nth-child(2) small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.employer-job-copy strong,
.employer-applicant-list a > span:nth-child(2) strong {
  color: #14243A;
  font-size: 11px;
}

.employer-job-copy small,
.employer-applicant-list a > span:nth-child(2) small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
}

.employer-job-applicants {
  text-align: right;
}

.employer-job-applicants strong,
.employer-job-applicants small {
  display: block;
}

.employer-job-applicants strong {
  color: #14243A;
  font-size: 12px;
}

.employer-job-applicants small {
  color: var(--muted);
  font-size: 8px;
}

.employer-job-list > a > img {
  width: 11px;
  height: 11px;
  opacity: .42;
}

.employer-applicant-list > a {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 58px;
  padding: 8px 11px;
  border-bottom: 1px solid #EDF2F7;
}

.employer-applicant-avatar {
  display: grid;
  width: 34px;
  height: 34px;
  overflow: hidden;
  color: #14243A;
  background: #EDF2F7;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
  place-items: center;
}

.employer-applicant-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.application-pipeline-status.status-shortlisted,
.application-pipeline-status.status-interview,
.application-pipeline-status.status-hired {
  color: #14243A;
  background: #EDF2F7;
}

.application-pipeline-status.status-rejected {
  color: #BA3C38;
  background: #EDF2F7;
}

.employer-empty-state {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 82px;
  padding: 14px;
  color: var(--muted);
}

.employer-empty-state > img {
  width: 18px;
  height: 18px;
  opacity: .45;
}

.employer-empty-state strong,
.employer-empty-state small {
  display: block;
}

.employer-empty-state strong {
  color: #454B54;
  font-size: 9px;
}

.employer-empty-state small {
  margin-top: 2px;
  font-size: 7px;
}

.employer-setup-state {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 18px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-left: 3px solid #14243A;
  border-radius: 7px;
}

.employer-setup-state > span,
.employer-profile-form-head > span:first-child {
  display: grid;
  width: 42px;
  height: 42px;
  background: #EDF2F7;
  border-radius: 7px;
  place-items: center;
}

.employer-setup-state img,
.employer-profile-form-head > span:first-child img {
  width: 18px;
  height: 18px;
  opacity: .7;
}

.employer-setup-state h2 {
  margin: 0;
  font-size: 14px;
}

.employer-setup-state p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 9px;
}

.employer-setup-state .button {
  min-height: 34px;
  font-size: 9px;
}

.employer-profile-page {
  max-width: 820px;
}

.employer-profile-form {
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-top: 3px solid #14243A;
  border-radius: 7px;
}

.employer-profile-form-head {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
}

.employer-profile-form-head small {
  color: #14243A;
  font-size: 7px;
  font-weight: 750;
  text-transform: uppercase;
}

.employer-profile-form-head h2 {
  margin: 1px 0 0;
  font-size: 14px;
}

.employer-profile-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  padding: 14px;
}

.employer-profile-fields label {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: #454B54;
  font-size: 9px;
  font-weight: 700;
}

.employer-profile-fields .span-all {
  grid-column: 1 / -1;
}

.employer-logo-editor {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-bottom: 13px;
  border-bottom: 1px solid var(--line);
}

.employer-logo-preview {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 78px;
  height: 78px;
  padding: 5px;
  overflow: hidden;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 8px;
}

.employer-logo-preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.employer-logo-preview img.is-placeholder {
  width: 28px;
  height: 28px;
  opacity: .45;
}

.employer-logo-actions {
  display: grid;
  justify-items: start;
  gap: 5px;
}

.employer-logo-actions #id_logo {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.employer-logo-select {
  min-height: 34px;
  padding-inline: 11px;
  font-size: 11px;
  cursor: pointer;
}

.employer-logo-select img {
  width: 13px;
  height: 13px;
}

.employer-profile-fields input,
.employer-profile-fields select,
.employer-profile-fields textarea {
  min-height: 36px;
  font-size: 10px;
}

.employer-profile-fields textarea {
  min-height: 92px;
}

.employer-profile-save {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  background: #FFFFFF;
  border-top: 1px solid var(--line);
}

.employer-profile-save small {
  color: var(--muted);
  font-size: 7px;
}

.employer-profile-save .button {
  min-height: 34px;
  font-size: 9px;
}

@media (max-width: 760px) {
  .employer-dashboard-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .employer-heading-actions {
    width: 100%;
  }

  .employer-heading-actions .button {
    flex: 1 1 0;
  }

  .employer-identity-band {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .employer-identity-mark {
    width: 42px;
    height: 42px;
  }

  .employer-identity-contact {
    grid-column: 1 / -1;
    min-width: 0;
    padding: 8px 0 0;
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .employer-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .employer-workspace-grid {
    grid-template-columns: 1fr;
  }

  .employer-profile-fields {
    grid-template-columns: 1fr;
  }

  .employer-profile-fields .span-all {
    grid-column: 1;
  }

  .employer-setup-state {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .employer-setup-state .button {
    grid-column: 1 / -1;
  }
}

/* Nursing student workspace */
.desktop-account .header-student-action {
  min-height: 36px;
  padding-inline: 12px;
  color: #14243A;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
}

.desktop-account .header-student-action:hover {
  color: #FFFFFF;
  background: #14243A;
  border-color: #14243A;
}

.desktop-account .header-student-action:hover img {
  filter: brightness(0) invert(1);
}

.mobile-nav-panel .mobile-student-primary {
  color: #14243A;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
}

.student-signup-panel {
  max-width: 720px;
}

.student-college-select {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 6px 10px;
}

.student-college-select > label {
  display: grid;
  gap: 6px;
}

.student-college-select > button {
  min-height: 38px;
  padding: 0 10px;
  color: var(--brand-dark);
  background: transparent;
  border: 1px solid #EDF2F7;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
}

.manual-college-field {
  display: grid;
  gap: 5px;
}

.pending-college-review {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  color: #BA3C38;
  background: #EDF2F7;
  border-left: 3px solid #FF6B61;
}

.pending-college-review strong {
  font-size: 10px;
}

.pending-college-review span {
  font-size: 9px;
}

.student-dashboard-page,
.student-settings-page,
.compact-decision-page {
  padding-top: 22px;
}

.student-progression-alert,
.student-identity-band,
.student-conversion-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 15px 17px;
  border: 1px solid var(--line);
}

.student-progression-alert {
  margin-bottom: 13px;
  background: #EDF2F7;
  border-color: #FFE4DF;
}

.student-progression-alert > div,
.student-identity-band > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.student-progression-alert span,
.student-identity-band p,
.student-identity-band div > span,
.student-conversion-band p {
  margin: 0;
  color: var(--muted);
  font-size: 10px;
}

.student-identity-band {
  justify-content: start;
  background: var(--paper);
  border-left: 3px solid #14243A;
}

.student-identity-band > div {
  flex: 1;
}

.student-identity-band h2,
.student-conversion-band h2 {
  margin: 0;
  font-size: 17px;
}

.student-identity-band small {
  color: #14243A;
  font-size: 9px;
  font-weight: 750;
  text-transform: uppercase;
}

.student-course-mark {
  display: grid;
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  place-items: center;
  background: #EDF2F7;
}

.student-course-mark img {
  width: 20px;
  height: 20px;
}

.student-dashboard-metrics,
.student-record-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 13px;
  border: 1px solid var(--line);
  background: var(--paper);
}

.student-dashboard-metrics > div,
.student-record-summary > div {
  display: grid;
  gap: 4px;
  padding: 14px;
  border-right: 1px solid var(--line);
}

.student-dashboard-metrics > div:last-child,
.student-record-summary > div:last-child {
  border-right: 0;
}

.student-dashboard-metrics small,
.student-record-summary small {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
}

.student-dashboard-metrics strong,
.student-record-summary strong {
  font-size: 15px;
}

.student-dashboard-metrics a,
.student-dashboard-metrics span {
  color: var(--brand-dark);
  font-size: 9px;
}

.student-conversion-band {
  margin-top: 13px;
  background: #FFFFFF;
  border-left: 3px solid #14243A;
}

.student-cne-history {
  margin-top: 16px;
}

.student-settings-form,
.decision-form {
  margin-top: 14px;
  padding: 18px;
  background: var(--paper);
  border: 1px solid var(--line);
}

.compact-decision-page {
  max-width: 720px;
}

.compact-decision-page > header h1 {
  margin: 2px 0 4px;
  font-size: 25px;
}

.compact-decision-page > header p:last-child {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.decision-form {
  display: grid;
  gap: 14px;
}

.decision-form > label,
.decision-form fieldset {
  display: grid;
  gap: 7px;
}

.decision-form fieldset {
  margin: 0;
  padding: 13px;
  border: 1px solid var(--line);
}

.decision-form fieldset label {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px;
}

.decision-form fieldset ul {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.decision-form input[type="radio"],
.decision-form input[type="checkbox"] {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  min-height: 16px;
  margin: 0;
  padding: 0;
}

.decision-form > .checkbox-field {
  display: flex;
  align-items: flex-start;
  grid-template-columns: none;
}

.decision-form > div:last-child {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

@media (max-width: 760px) {
  .student-college-select {
    grid-template-columns: 1fr;
  }

  .student-college-select > button {
    width: 100%;
  }

  .student-progression-alert,
  .student-identity-band,
  .student-conversion-band {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .student-dashboard-metrics,
  .student-record-summary {
    grid-template-columns: 1fr;
  }

  .student-dashboard-metrics > div,
  .student-record-summary > div {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .student-dashboard-metrics > div:last-child,
  .student-record-summary > div:last-child {
    border-bottom: 0;
  }
}

@media (max-width: 430px) {
  .employer-heading-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .employer-job-list > a {
    grid-template-columns: minmax(0, 1fr) 64px 12px;
  }

  .employer-job-applicants {
    display: none;
  }

  .employer-applicant-list > a {
    grid-template-columns: 32px minmax(0, 1fr);
  }

  .application-pipeline-status {
    grid-column: 2;
    justify-self: start;
  }

  .employer-profile-form-head {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .employer-profile-form-head > .employer-verification-chip {
    grid-column: 2;
    justify-self: start;
  }

  .employer-profile-save {
    align-items: stretch;
    flex-direction: column;
  }
}

.profile-save-bar {
  position: sticky;
  bottom: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 18px;
  background: rgba(255,255,255, .96);
  border-radius: 0 0 8px 8px;
  box-shadow: 0 -6px 16px rgba(20,36,58, .05);
}

.profile-save-bar > span {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #627083;
  font-size: 9px;
}

.profile-save-bar > span img {
  width: 12px;
  height: 12px;
  opacity: .65;
}

.profile-save-bar button {
  min-width: 112px;
  min-height: 34px;
  font-size: 11px;
}

.profile-editor-sidebar {
  position: sticky;
  top: 82px;
  display: grid;
  gap: 12px;
}

.experience-editor-panel {
  margin-bottom: 14px;
  padding: 14px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 3px solid #14243A;
  border-radius: 8px;
}

.experience-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 11px;
}

.experience-panel-head .editor-section-heading {
  margin: 0;
}

.experience-panel-head > strong {
  padding: 6px 9px;
  color: #14243A;
  background: #EDF2F7;
  border-radius: 6px;
  font-size: 11px;
}

.experience-editor-grid {
  display: grid;
  grid-template-columns: minmax(260px, .8fr) minmax(0, 1.5fr);
  gap: 14px;
}

.experience-timeline {
  display: grid;
  align-content: start;
  gap: 7px;
}

.experience-timeline > article {
  position: relative;
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  gap: 8px;
  padding: 9px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.experience-dot {
  width: 7px;
  height: 7px;
  margin-top: 4px;
  background: #14243A;
  border-radius: 50%;
}

.experience-timeline article > div:nth-child(2) {
  display: grid;
  min-width: 0;
  gap: 1px;
}

.experience-timeline strong {
  font-size: 10px;
}

.experience-timeline small,
.experience-timeline article > div:nth-child(2) > span,
.experience-timeline > p {
  margin: 0;
  color: var(--muted);
  font-size: 8px;
}

.experience-actions {
  display: flex;
  align-self: start;
  align-items: center;
  gap: 4px;
}

.experience-actions form {
  margin: 0;
}

.experience-action-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 30px;
  min-height: 28px;
  height: 28px;
  padding: 0 7px;
  color: #14243A;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  font-size: 8px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}

.experience-action-button:hover {
  background: #EDF2F7;
  border-color: #EDF2F7;
}

.experience-action-button img {
  width: 11px;
  height: 11px;
  opacity: .78;
}

.experience-action-button.is-delete {
  color: #BA3C38;
  background: #EDF2F7;
  border-color: #FFE4DF;
}

.experience-action-button.is-delete:hover {
  background: #EDF2F7;
  border-color: #EDF2F7;
}

.experience-form-actions > a {
  padding: 0;
  color: #14243A;
  background: transparent;
  border: 0;
  font-size: 8px;
  font-weight: 700;
  cursor: pointer;
}

.experience-entry-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  align-items: end;
}

.experience-entry-form > label:not(.working-still-control) {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: #454B54;
  font-size: 9px;
  font-weight: 700;
}

.experience-entry-form input:not([type="checkbox"]) {
  width: 100%;
  min-height: 36px;
  font-size: 10px;
}

.working-still-control {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 9px;
  background: #EDF2F7;
  border-radius: 6px;
  color: #14243A;
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
}

.working-still-control input {
  width: 14px;
  height: 14px;
  accent-color: #14243A;
}

.experience-entry-form [data-experience-end].is-disabled {
  opacity: .45;
}

.experience-form-actions {
  grid-column: span 3;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.experience-form-actions .button {
  min-height: 34px;
  font-size: 9px;
}

.privacy-consent-control,
.trainer-privilege-control {
  display: flex !important;
  align-items: center;
  gap: 8px;
  padding: 9px 10px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
  cursor: pointer;
}

.privacy-consent-control input,
.trainer-privilege-control input {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  accent-color: var(--brand);
}

.privacy-consent-control > span,
.trainer-privilege-control > span {
  font-size: 10px;
  font-weight: 650;
}

.privacy-consent-control a {
  color: var(--brand-dark);
  text-decoration: underline;
}

.privacy-consent-control small {
  color: var(--muted);
  font-size: 8px;
}

.policy-page {
  width: min(900px, calc(100% - 32px));
  margin: 0 auto;
  padding: 34px 0 60px;
}

.policy-header {
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.policy-header h1 {
  margin: 3px 0 5px;
  font-size: 30px;
}

.policy-header > span {
  color: var(--muted);
  font-size: 10px;
}

.policy-content {
  padding-top: 20px;
  color: #14243A;
  font-size: 13px;
  line-height: 1.75;
}

.policy-content h2,
.policy-content h3 {
  margin: 22px 0 7px;
  color: var(--ink);
}

.policy-content h2 {
  font-size: 18px;
}

.policy-content h3 {
  font-size: 15px;
}

.editor-side-panel {
  padding: 15px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.completion-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #454B54;
  font-size: 10px;
  font-weight: 650;
}

.completion-head strong {
  color: var(--brand-dark);
  font-size: 15px;
}

.completion-track {
  height: 6px;
  margin-top: 9px;
  overflow: hidden;
  background: #EDF2F7;
  border-radius: 6px;
}

.completion-track span {
  display: block;
  height: 100%;
  background: var(--brand);
  border-radius: inherit;
}

.completion-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  margin-top: 12px;
  border-top: 1px solid var(--line);
}

.completion-stat-grid span {
  display: grid;
  gap: 1px;
  padding-top: 9px;
  color: var(--muted);
  font-size: 8px;
}

.completion-stat-grid strong {
  color: #14243A;
  font-size: 12px;
}

.profile-editor-sidebar .credential-panel {
  width: 100%;
  padding: 15px;
}

.profile-editor-sidebar .credential-panel form {
  display: grid;
  gap: 9px;
}

.profile-editor-sidebar .credential-panel form button {
  width: 100%;
  min-height: 34px;
  font-size: 10px;
}

.profile-editor-sidebar .credential-panel form > .no-expiry-control {
  display: flex;
  align-items: center;
  gap: 6px;
  width: max-content;
  min-height: 28px;
  padding: 0 7px;
  color: #454B54;
  background: #EDF2F7;
  border: 1px solid var(--line);
  border-radius: 5px;
  font-size: 9px;
  cursor: pointer;
}

.no-expiry-control input {
  width: 13px;
  height: 13px;
  accent-color: var(--brand);
}

.credential-panel [data-expiry-field] {
  transition: opacity .15s ease;
}

.credential-panel [data-expiry-field].is-disabled {
  opacity: .45;
}

.credential-panel form label > small {
  color: var(--muted);
  font-size: 8px;
  font-weight: 500;
}

.credential-list {
  display: grid;
  gap: 7px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.credential-list > div {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  padding: 7px;
  background: #FFFFFF;
  border-radius: 6px;
}

.credential-list > div > span:last-child {
  display: grid;
  min-width: 0;
}

.credential-list strong,
.credential-list small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.credential-list strong {
  font-size: 9px;
}

.credential-list small,
.credential-list > p {
  margin: 0;
  color: var(--muted);
  font-size: 8px;
}

.credential-file-icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 27px;
  height: 27px;
  background: var(--na-coral);
  border-radius: 5px;
;color:var(--na-white)!important;}

.credential-file-icon img {
  width: 13px;
  height: 13px;
  opacity: .65;
}

@media (max-width: 1120px) {
  .header-inner {
    gap: 14px;
  }

  .desktop-nav a,
  .desktop-account > a,
  .text-button {
    padding-inline: 8px;
    font-size: 12px;
  }

  .desktop-jobs-menu > summary {
    padding-inline: 8px;
  }

  .module-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 920px) {
  .profile-editor-layout {
    grid-template-columns: 1fr;
  }

  .profile-editor-sidebar {
    position: static;
    grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr);
  }

  .header-inner {
    grid-template-columns: 1fr auto;
  }

  .desktop-nav,
  .desktop-account {
    display: none;
  }

  .mobile-nav {
    display: block;
  }

  .home-search {
    padding: 36px 0 32px;
  }

  .hub-form,
  .cne-form,
  .nurse-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hub-form button {
    width: 100%;
  }

  .job-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .detail-grid,
  .edit-grid,
  .profile-layout {
    grid-template-columns: 1fr;
  }

  .job-detail-layout {
    grid-template-columns: 1fr;
  }

  .similar-job-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .credential-panel,
  .facts {
    width: 100%;
  }

  .auth-page {
    grid-template-columns: 1fr;
  }

  .auth-aside {
    padding: 26px 32px;
  }

  .auth-aside-inner {
    width: min(720px, 100%);
  }

  .auth-aside h1 {
    font-size: 23px;
  }

  .auth-trust-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 20px;
    padding-top: 16px;
  }
}

@media (max-width: 760px) {
  .profile-editor-sidebar {
    grid-template-columns: 1fr;
  }

  .location-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .language-fieldset ul,
  .language-fieldset > div {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .qualification-fieldset > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .container,
  .page-shell,
  .detail-shell,
  .profile-layout {
    width: min(100% - 32px, var(--container));
  }

  .home-search {
    padding: 24px 0;
  }

  .search-panels {
    padding: 14px;
  }

  .result-columns {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .home-feed-grid {
    grid-template-columns: 1fr;
  }

  .home-results {
    padding: 28px 0 48px;
  }

  .page-shell,
  .detail-shell {
    padding: 28px 0 52px;
  }

  .section-head {
    margin-bottom: 18px;
  }

  .section-head h1,
  .detail-header h1,
  .profile-identity h1 {
    font-size: 28px;
  }

  .filter-bar,
  .filter-bar.three-fields {
    grid-template-columns: 1fr;
    padding: 12px;
  }

  .filter-bar button {
    width: 100%;
  }

  .listing-grid {
    grid-template-columns: 1fr;
  }

  .auth-stage {
    padding: 24px 16px 40px;
  }

  .profile-topline {
    display: grid;
  }

  .profile-topline .secondary-action {
    width: 100%;
    margin-bottom: 18px;
  }

  .profile-hero {
    align-items: stretch;
    flex-direction: column;
    padding: 30px 16px;
  }

  .detail-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .detail-apply {
    width: 100%;
  }

  .job-detail-hero {
    grid-template-columns: 1fr;
  }

  .job-detail-action {
    justify-content: flex-start;
  }

  .job-action-tools {
    justify-content: flex-start;
    width: 100%;
  }

  .share-popover {
    right: auto;
    left: 0;
  }

  .detail-quick-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .detail-quick-facts > div:nth-child(2) {
    border-right: 0;
  }

  .detail-quick-facts > div:nth-child(n + 3) {
    padding-top: 10px;
    border-top: 1px solid var(--line);
  }

  .detail-quick-facts > div:nth-child(-n + 2) {
    padding-bottom: 10px;
  }

  .profile-status {
    min-width: 0;
  }

  .band {
    padding: 32px 16px 52px;
  }
}

@media (max-width: 760px) {
  .dashboard-actions {
    grid-template-columns: 1fr;
  }

  .training-tool-grid {
    grid-template-columns: 1fr;
  }

  .public-profile-page .profile-hero {
    padding: 20px 16px;
  }

  .profile-hero-inner {
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }

  .profile-availability {
    width: 100%;
    min-width: 0;
  }

  .profile-content-shell {
    grid-template-columns: 1fr;
    width: calc(100% - 32px);
    padding: 14px 0;
  }

  .profile-skill-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .profile-credential-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 580px) {
  body {
    font-size: 14px;
  }

  .header-inner {
    width: calc(100% - 32px);
  }

  .hub-form,
  .cne-form,
  .nurse-form,
  .job-grid,
  .module-grid,
  .form-grid.two {
    grid-template-columns: 1fr;
  }

  .dashboard-page {
    padding-top: 20px;
  }

  .dashboard-heading h1 {
    font-size: 21px;
  }

  .dashboard-profile {
    align-items: stretch;
    flex-direction: column;
    gap: 13px;
    padding: 14px;
  }

  .dashboard-profile-main {
    align-items: flex-start;
  }

  .dashboard-avatar {
    width: 48px;
    height: 48px;
    font-size: 17px;
  }

  .dashboard-profile-actions {
    padding-top: 11px;
    border-top: 1px solid var(--line);
  }

  .dashboard-primary-action {
    flex: 1;
  }

  .search-hub-tabs label {
    min-height: 42px;
    font-size: 13px;
  }

  .search-panels {
    padding: 12px;
  }

  .hub-form {
    gap: 9px;
  }

  input,
  select {
    min-height: 42px;
    font-size: 16px;
  }

  button,
  .button {
    min-height: 40px;
    font-size: 13px;
  }

  .listing-page .filter-bar {
    gap: 6px;
    padding: 8px;
  }

  .listing-page .filter-bar input,
  .listing-page .filter-bar select {
    min-height: 37px;
    font-size: 13px;
  }

  .listing-page .filter-bar input::placeholder {
    font-size: 12px;
  }

  .listing-page .filter-bar .field-with-icon > img {
    left: 10px;
    width: 13px;
    height: 13px;
  }

  .listing-page .filter-bar .field-with-icon input {
    padding-left: 31px;
  }

  .listing-page .filter-bar button {
    min-height: 37px;
    font-size: 12px;
  }

  .job-card {
    min-height: 184px;
  }

  .row-card {
    align-items: flex-start;
  }

  .row-card strong {
    white-space: normal;
  }

  .row-card em {
    flex: 0 0 auto;
  }

  .detail-header,
  .detail-body,
  .facts,
  .auth-card,
  .profile-form,
  .credential-panel {
    padding: 18px;
  }

  .profile-identity {
    align-items: flex-start;
    flex-direction: column;
  }

  .avatar {
    width: 68px;
    height: 68px;
    font-size: 23px;
  }

  .page-title-row {
    align-items: flex-start;
  }

  .listing-card {
    gap: 8px;
    padding: 12px;
  }

  .job-listing-card {
    gap: 0;
    padding: 0;
  }

  .job-listing-card .listing-card-head {
    padding: 14px 12px 10px;
  }

  .job-listing-card .listing-meta-grid {
    margin-inline: 12px;
  }

  .job-listing-card .listing-card-foot {
    padding: 9px 12px 11px;
  }

  .job-listing-card .posted-time {
    display: none;
  }

  .job-detail-hero {
    gap: 14px;
    padding: 15px;
  }

  .job-detail-identity {
    align-items: flex-start;
  }

  .detail-org-mark {
    width: 44px;
    height: 44px;
    font-size: 16px;
  }

  .job-detail-title h1 {
    font-size: 21px;
  }

  .application-status {
    min-height: 30px;
  }

  .detail-quick-facts > div {
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 5px;
    padding-inline: 9px;
  }

  .detail-quick-facts > div > img {
    margin-left: 4px;
  }

  .detail-quick-facts strong {
    overflow: visible;
    line-height: 1.3;
    text-overflow: clip;
    white-space: normal;
  }

  .job-description-panel,
  .application-panel {
    padding: 15px;
  }

  .listing-meta-grid {
    gap: 6px 8px;
  }

  .listing-card-foot {
    align-items: center;
  }

  .skill-chips {
    width: auto;
  }

  .compact-listing {
    min-height: 80px;
  }

  .compact-meta span:nth-child(3) {
    display: none;
  }

  .auth-aside {
    padding: 13px 16px 14px;
  }

  .auth-aside h1 {
    font-size: 17px;
  }

  .auth-symbol {
    display: none;
  }

  .auth-aside .eyebrow {
    margin: 0 0 3px;
  }

  .auth-trust-list {
    display: none;
  }

  .auth-stage {
    align-items: start;
    padding: 16px;
  }

  .auth-panel {
    padding: 20px;
    box-shadow: var(--shadow-sm);
  }

  .provider-actions-two,
  .provider-actions-login,
  .auth-form-grid {
    grid-template-columns: 1fr;
  }

  .auth-span-two {
    grid-column: auto;
  }

  .auth-submit {
    width: 100%;
  }

  .public-profile-page .profile-hero {
    padding: 20px 16px;
  }

  .profile-hero-inner {
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }

  .profile-availability {
    width: 100%;
    min-width: 0;
  }

  .profile-content-shell {
    grid-template-columns: 1fr;
    width: calc(100% - 32px);
    padding: 14px 0;
  }

  .profile-skill-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .profile-credential-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 580px) {
  .job-detail-title .job-code-tag {
    display: none;
  }

  .saved-job-main {
    gap: 8px;
    padding: 9px;
  }

  .saved-job-mark {
    width: 34px;
    height: 34px;
  }

  .saved-job-item > form {
    padding-inline: 8px;
  }

  .profile-editor-page {
    padding-top: 17px;
  }

  .profile-editor-topline {
    align-items: flex-start;
  }

  .profile-editor-topline h1 {
    font-size: 21px;
  }

  .profile-editor-topline .secondary-action {
    flex: 0 0 auto;
    min-height: 31px;
    font-size: 9px;
  }

  .editor-section {
    padding: 14px;
  }

  .editor-field-grid.two-columns,
  .location-grid,
  .photo-cropper {
    grid-template-columns: 1fr;
  }

  .profile-editor-page .editor-field-grid input:not([type="checkbox"]):not([type="range"]),
  .profile-editor-page .editor-field-grid select,
  .profile-editor-page .credential-panel form input,
  .profile-editor-page .credential-panel form select {
    height: 38px;
    min-height: 38px;
    font-size: 12px;
    line-height: 1.2;
  }

  .cne-logo-editor {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .cne-logo-preview {
    width: 112px;
    height: 112px;
  }

  .language-fieldset ul,
  .language-fieldset > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .qualification-fieldset > div {
    grid-template-columns: 1fr;
  }

  .location-heading {
    padding-right: 0;
    padding-bottom: 37px;
  }

  .location-button {
    top: auto;
    right: auto;
    bottom: 0;
    left: 0;
  }

  .photo-cropper canvas {
    max-width: 230px;
  }

  .profile-save-bar {
    padding: 10px 14px;
  }

  .profile-save-bar > span {
    max-width: 155px;
  }

  .similar-job-grid {
    grid-template-columns: 1fr;
  }

  .similar-jobs-heading {
    align-items: flex-start;
  }

  .home-search .hub-form input,
  .home-search .hub-form select {
    min-height: 37px;
    font-size: 13px;
  }

  .home-search .hub-form input::placeholder {
    font-size: 12px;
  }

  .home-search .hub-form select option {
    font-size: 13px;
  }

  .home-search .hub-form .field-with-icon > img {
    left: 10px;
    width: 13px;
    height: 13px;
  }

  .home-search .hub-form .field-with-icon input {
    padding-left: 31px;
  }

  .compact-listing {
    gap: 8px;
    min-height: 76px;
    padding: 8px 9px;
  }

  .compact-listing .compact-mark {
    width: 31px;
    height: 31px;
  }

  .compact-title-line em {
    display: none;
  }

  .compact-meta {
    gap: 8px;
  }

  .compact-meta span:nth-child(3) {
    display: inline-flex;
  }

  .compact-meta span:nth-child(4) {
    display: none;
  }

  .public-profile-page .profile-identity {
    align-items: center;
    flex-direction: row;
    gap: 11px;
  }

  .public-profile-page .avatar {
    width: 58px;
    height: 58px;
    font-size: 19px;
  }

  .public-profile-page .profile-identity h1 {
    font-size: 21px;
  }

  .profile-identity-copy > p {
    font-size: 11px;
  }

  .profile-hero-meta {
    gap: 5px 10px;
    margin-top: 8px;
  }

  .profile-hero-meta span {
    font-size: 9px;
  }

  .profile-panel {
    padding: 14px;
  }

  .profile-skill-grid {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .profile-fact-list > div {
    grid-template-columns: 108px minmax(0, 1fr);
    padding: 9px 0;
  }

  .profile-credentials-band {
    padding: 15px 16px 34px;
  }

  .profile-credentials-heading {
    align-items: flex-start;
  }

  .profile-credential-card {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .profile-credential-card em {
    grid-column: 2;
  }
}

.calendar-control {
  position: relative;
  display: flex;
  width: 100%;
}

.split-datetime-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 112px;
  gap: 8px;
  width: 100%;
}

.split-datetime-part {
  display: block;
  min-width: 0;
}

.split-datetime-time > input {
  width: 100%;
}

.calendar-control > input {
  width: 100%;
  padding-right: 42px !important;
  cursor: pointer;
}

.calendar-trigger {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 5px;
  display: grid;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  place-items: center;
  transform: translateY(-50%);
  cursor: pointer;
}

.calendar-trigger:hover,
.calendar-trigger[aria-expanded="true"] {
  background: #EDF2F7;
}

.calendar-trigger:disabled {
  cursor: not-allowed;
  opacity: .45;
}

.calendar-trigger img {
  width: 17px;
  height: 17px;
}

.calendar-popup {
  position: absolute;
  z-index: 70;
  top: calc(100% + 7px);
  left: 0;
  width: min(294px, calc(100vw - 34px));
  padding: 12px;
  border: 1px solid #EDF2F7;
  border-radius: 8px;
  background: #FFFFFF;
  box-shadow: 0 16px 38px rgb(15 44 39 / 16%);
  color: #14243A;
}

.calendar-popup[hidden] {
  display: none;
}

.calendar-head,
.calendar-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.calendar-jump {
  display: grid;
  grid-template-columns: minmax(84px, 1fr) 72px;
  gap: 5px;
  min-width: 0;
}

.calendar-jump select {
  width: 100%;
  min-height: 30px;
  padding: 0 24px 0 7px;
  border: 1px solid #EDF2F7;
  border-radius: 6px;
  background-color: #FFFFFF;
  color: #14243A;
  font-size: 10px;
  font-weight: 700;
}

.calendar-head button {
  display: grid;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid #EDF2F7;
  border-radius: 6px;
  background: #FFFFFF;
  color: #14243A;
  place-items: center;
  cursor: pointer;
}

.calendar-head > button:disabled {
  cursor: not-allowed;
  opacity: .4;
}

.calendar-weekdays,
.calendar-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 3px;
}

.calendar-weekdays {
  margin: 11px 0 4px;
}

.calendar-weekdays span {
  color: #627083;
  font-size: 9px;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
}

.calendar-days > span,
.calendar-days button {
  width: 100%;
  aspect-ratio: 1;
}

.calendar-days button {
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #14243A;
  font: 600 11px/1 Inter, sans-serif;
  cursor: pointer;
}

.calendar-days button:hover:not(:disabled) {
  background: #EDF2F7;
}

.calendar-days button.is-today {
  box-shadow: inset 0 0 0 1px #293A50;
}

.calendar-days button.is-selected {
  background: #293A50;
  box-shadow: none;
  color: #FFFFFF;
}

.calendar-days button:disabled {
  color: #EDF2F7;
  cursor: not-allowed;
}

.calendar-footer {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid #EDF2F7;
}

.calendar-footer button {
  padding: 5px 7px;
  border: 0;
  background: transparent;
  color: #14243A;
  font: 700 10px/1 Inter, sans-serif;
  cursor: pointer;
}

@media (max-width: 480px) {
  .calendar-popup {
    right: 0;
    left: auto;
  }

  .split-datetime-control {
    grid-template-columns: minmax(0, 1fr) 104px;
  }
}

@media (max-width: 1120px) {
  .experience-editor-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .profile-editor-form {
    grid-template-columns: 1fr;
  }

  .compact-half-section,
  .compact-full-section,
  .photo-editor-section,
  .profile-save-bar {
    grid-column: 1;
  }

  .compact-half-section:nth-of-type(even) {
    border-left: 0;
  }

  .experience-entry-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .experience-form-actions {
    grid-column: span 1;
  }
}

@media (max-width: 580px) {
  .experience-editor-panel {
    padding: 12px;
  }

  .experience-panel-head {
    align-items: flex-start;
  }

  .experience-entry-form {
    grid-template-columns: 1fr;
  }

  .experience-form-actions {
    grid-column: 1;
  }

  .experience-timeline > article {
    grid-template-columns: 8px minmax(0, 1fr) auto;
    gap: 6px;
  }

  .experience-actions {
    grid-column: auto;
  }

  .experience-action-button {
    width: 28px;
    min-width: 28px;
    padding: 0;
  }

  .experience-action-button span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
  }

  .trainer-privilege-control {
    grid-template-columns: 22px minmax(0, 1fr) auto;
  }

  .trainer-remove-button {
    grid-column: 3;
  }

.trainer-modal {
    padding: 12px;
  }
}

.message-stack {
  position: fixed;
  z-index: 150;
  top: 66px;
  right: 16px;
  display: grid;
  gap: 6px;
  width: min(360px, calc(100vw - 32px));
}

.message-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24px;
  align-items: center;
  gap: 8px;
  padding: 9px 11px;
  color: #14243A;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-left: 3px solid #293A50;
  border-radius: 6px;
  box-shadow: var(--shadow-sm);
  font-size: 9px;
  font-weight: 650;
  transition: opacity .18s ease, transform .18s ease;
}

.message-item.is-hiding {
  opacity: 0;
  transform: translateY(-5px);
}

.message-item [data-dismiss-message] {
  display: grid;
  width: 24px;
  min-height: 24px;
  padding: 0;
  color: #454B54;
  background: transparent;
  border: 0;
  border-radius: 4px;
  font-size: 18px;
  font-weight: 400;
  line-height: 1;
  place-items: center;
}

.message-item [data-dismiss-message]:hover {
  color: #0B1423;
  background: #EDF2F7;
}

.message-item.error {
  border-left-color: #BA3C38;
}

.employer-identity-mark img {
  width: 100%;
  height: 100%;
  padding: 3px;
  object-fit: contain;
  background: #FFFFFF;
}

.org-mark img,
.detail-org-mark img,
.similar-job-mark img,
.saved-job-mark img {
  width: 100%;
  height: 100%;
  padding: 3px;
  object-fit: contain;
  background: #FFFFFF;
}

.logo-surface {
  background: #FFFFFF !important;
  border-color: #FFFFFF !important;
  box-shadow: none !important;
}

.logo-surface img,
.desktop-user-menu .logo-surface .account-photo {
  object-fit: contain;
  background: #FFFFFF;
}

.employer-verification-alert {
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr) 12px;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding: 7px 10px;
  color: #BA3C38;
  background: #EDF2F7;
  border: 1px solid #FFE4DF;
  border-radius: 6px;
}

.employer-verification-alert > img:first-child {
  width: 14px;
  height: 14px;
}

.employer-verification-alert > img:last-child {
  width: 11px;
  height: 11px;
}

.employer-verification-alert strong,
.employer-verification-alert small {
  display: block;
}

.employer-verification-alert strong {
  font-size: 8px;
}

.employer-verification-alert small {
  margin-top: 1px;
  font-size: 7px;
}

.cne-verification-alert {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 14px;
  align-items: center;
  gap: 10px;
  margin: 10px 0;
  padding: 10px 12px;
  color: #14243A;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-left: 3px solid #14243A;
  border-radius: 6px;
}

.cne-verification-alert > img {
  width: 15px;
  height: 15px;
}

.cne-verification-alert strong,
.cne-verification-alert small {
  display: block;
}

.cne-verification-alert strong {
  font-size: 12px;
}

.cne-verification-alert small {
  margin-top: 2px;
  color: #14243A;
  font-size: 10px;
  line-height: 1.4;
}

.employer-console-page {
  max-width: 1120px;
}

.employer-dashboard-heading > .recruitment-primary-action {
  min-height: 38px;
  padding-inline: 14px;
  color: #FFFFFF;
  background: #14243A;
  border-color: #14243A;
  box-shadow: 0 3px 9px rgba(20,36,58, .2);
  font-size: 11px;
}

.employer-dashboard-heading > .recruitment-primary-action:hover {
  background: #293A50;
  border-color: #293A50;
  box-shadow: 0 5px 13px rgba(20,36,58, .24);
}

.employer-console-list,
.applicant-console-list {
  display: grid;
  gap: 7px;
}

.employer-console-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 70px 50px auto;
  align-items: center;
  gap: 10px;
  padding: 10px 11px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-left: 3px solid var(--job-accent, #14243A);
  border-radius: 7px;
}

.employer-console-job-copy strong,
.employer-console-job-copy small {
  display: block;
}

.employer-console-job-copy strong {
  font-size: 12px;
}

.employer-console-job-copy small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
}

.employer-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}

.employer-row-actions form {
  margin: 0;
}

.employer-row-actions a,
.employer-row-actions button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  width: auto;
  min-height: 27px;
  padding: 0 7px;
  color: #14243A;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  font-size: 9px;
  font-weight: 700;
}

.employer-row-actions img {
  width: 10px;
  height: 10px;
}

.employer-job-form {
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-top: 3px solid #14243A;
  border-radius: 7px;
}

.employer-job-fields {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  padding: 14px;
}

.employer-job-fields > label {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: #454B54;
  font-size: 10px;
  font-weight: 700;
}

.employer-job-fields > .span-all {
  grid-column: 1 / -1;
}

.employer-job-fields input,
.employer-job-fields select,
.employer-job-fields textarea {
  font-size: 10px;
}

.employer-job-fields #id_required_qualifications,
.employer-job-fields #id_required_skills {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.employer-job-fields #id_required_qualifications label,
.employer-job-fields #id_required_skills label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 7px;
  background: #EDF2F7;
  border: 1px solid var(--line);
  border-radius: 5px;
  font-size: 9px;
}

.employer-job-fields #id_required_qualifications input,
.employer-job-fields #id_required_skills input {
  width: 13px;
  min-height: 13px;
}

.applicant-console-list > article {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto auto auto;
  align-items: center;
  gap: 9px;
  min-height: 62px;
  padding: 9px 11px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.applicant-console-list article > div strong,
.applicant-console-list article > div small {
  display: block;
}

.applicant-console-list article > div strong {
  font-size: 12px;
}

.applicant-console-list article > div small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
}

.profile-lock-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 7px;

  background: var(--na-coral);
  border-radius: 4px;
  font-size: 9px;
  font-weight: 700;
;color:var(--na-white)!important;}

.profile-lock-chip.unlocked {
  color: #14243A;
  background: #EDF2F7;
}

.profile-lock-chip img {
  width: 9px;
  height: 9px;
}

.applicant-console-list .button {
  min-height: 28px;
  padding: 0 8px;
  font-size: 9px;
}

.credit-balance {
  display: grid;
  min-width: 110px;
  padding: 7px 10px;
  color: #FFFFFF;
  background: #14243A;
  border-radius: 6px;
}

.credit-balance small {
  font-size: 7px;
}

.credit-balance strong {
  font-size: 15px;
}

.credit-pack-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.credit-pack-grid > article {
  padding: 14px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-top: 3px solid #14243A;
  border-radius: 7px;
}

.credit-pack-grid span,
.credit-pack-grid strong,
.credit-pack-grid small {
  display: block;
}

.credit-pack-grid span {
  color: var(--muted);
  font-size: 8px;
}

.credit-pack-grid strong {
  margin-top: 5px;
  font-size: 13px;
}

.credit-pack-grid h2 {
  margin: 8px 0 2px;
  color: #14243A;
  font-size: 20px;
}

.credit-pack-grid small {
  color: var(--muted);
  font-size: 7px;
}

.credit-pack-grid form,
.credit-pack-grid > article > .button {
  display: flex;
  margin-top: 10px;
}

.credit-pack-grid .button {
  width: 100%;
  min-height: 32px;
  font-size: 8px;
}

.credit-orders {
  margin-top: 10px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.credit-orders > div:not(.employer-panel-head):not(.employer-empty-state) {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr) auto;
  gap: 10px;
  padding: 8px 11px;
  border-top: 1px solid var(--line);
  font-size: 8px;
}

.credit-ledger,
.notification-settings-form,
.checkout-summary {
  margin-top: 12px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.credit-ledger-list > a {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  color: inherit;
  border-top: 1px solid var(--line);
  text-decoration: none;
}

.credit-ledger-list > a:hover {
  background: #FFFFFF;
}

.credit-ledger-list span > strong,
.credit-ledger-list span > small {
  display: block;
}

.credit-ledger-list span > strong {
  font-size: 9px;
}

.credit-ledger-list span > small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 7px;
}

.credit-ledger-avatar {
  display: grid;
  width: 34px;
  height: 34px;
  overflow: hidden;
  color: #FFFFFF;
  background: #14243A;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 700;
  place-items: center;
}

.credit-ledger-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.credit-orders-head {
  align-items: end;
}

.credit-date-filter {
  display: flex;
  align-items: end;
  gap: 6px;
}

.credit-date-filter label {
  display: grid;
  gap: 3px;
  color: var(--muted);
  font-size: 7px;
}

.credit-date-filter input {
  width: 112px;
  min-height: 31px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 4px;
  font: inherit;
}

.credit-date-filter .button {
  min-height: 31px;
}

.credit-date-filter > a {
  padding: 8px 3px;
  color: #14243A;
  font-size: 8px;
  font-weight: 700;
}

.credit-order-row span:first-child b,
.credit-order-row span:first-child small {
  display: block;
}

.credit-order-row span:first-child small {
  margin-top: 2px;
  color: var(--muted);
}

.compact-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding: 9px 12px;
  border-top: 1px solid var(--line);
  font-size: 8px;
}

.compact-pagination a {
  color: #14243A;
  font-weight: 700;
}

.status-expired,
.status-payment_failed {
  color: #BA3C38;
  background: #EDF2F7;
}

.compact-checkout-page {
  max-width: 620px;
}

.compact-checkout-page > header h1 {
  margin: 3px 0 0;
  font-size: 22px;
}

.checkout-summary {
  padding: 18px;
  border-top: 3px solid #14243A;
}

.checkout-summary > div > small,
.checkout-summary > div > strong {
  display: block;
}

.checkout-summary > div > small {
  color: var(--muted);
  font-size: 8px;
}

.checkout-summary > div > strong {
  margin-top: 3px;
  font-size: 15px;
}

.checkout-summary dl {
  margin: 14px 0;
  border-top: 1px solid var(--line);
}

.checkout-summary dl > div {
  display: flex;
  justify-content: space-between;
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
  font-size: 9px;
}

.checkout-summary dd {
  margin: 0;
  font-weight: 700;
}

.checkout-summary > p {
  color: var(--muted);
  font-size: 8px;
  line-height: 1.55;
}

.checkout-summary form {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  margin-top: 14px;
}

.notification-settings-page {
  max-width: 760px;
}

.notification-settings-form > section {
  padding: 4px 16px;
}

.notification-toggle,
.notification-threshold {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
}

.notification-toggle input {
  position: relative;
  width: 32px;
  height: 18px;
  margin: 0;
  appearance: none;
  background: #EDF2F7;
  border: 0;
  border-radius: 10px;
  cursor: pointer;
  transition: background .16s ease;
}

.notification-toggle input::after {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  background: #FFFFFF;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(20,36,58, .24);
  content: "";
  transition: transform .16s ease;
}

.notification-toggle input:checked {
  background: #293A50;
}

.notification-toggle input:checked::after {
  transform: translateX(14px);
}

.notification-toggle input:focus-visible {
  outline: 2px solid #14243A;
  outline-offset: 2px;
}

.notification-toggle strong,
.notification-toggle small,
.notification-threshold strong,
.notification-threshold small {
  display: block;
}

.notification-toggle strong,
.notification-threshold strong {
  font-size: 10px;
}

.notification-toggle small,
.notification-threshold small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 8px;
  line-height: 1.45;
}

.notification-threshold {
  grid-template-columns: minmax(0, 1fr) 80px;
}

.notification-threshold input {
  width: 100%;
  min-height: 34px;
  box-sizing: border-box;
  border: 1px solid var(--line);
  border-radius: 4px;
}

.notification-settings-actions {
  display: flex;
  justify-content: flex-end;
  padding: 12px 16px;
}

.credit-unlock-dialog {
  width: min(420px, calc(100vw - 28px));
  padding: 0;
  border: 0;
  border-radius: 7px;
  box-shadow: 0 18px 60px rgba(20,36,58, .24);
}

.credit-unlock-dialog::backdrop {
  background: rgba(20,36,58, .55);
}

.credit-unlock-dialog > div {
  padding: 20px;
  text-align: center;
}

.credit-unlock-dialog > div > span {
  display: grid;
  width: 42px;
  height: 42px;
  margin: 0 auto 10px;
  background: #EDF2F7;
  border-radius: 50%;
  place-items: center;
}

.credit-unlock-dialog.has-verification-warning > div > span {
  background: var(--na-coral);
;color:var(--na-white)!important;}

.credit-unlock-dialog.has-verification-warning h3 {
  color: #BA3C38;
}

.credit-unlock-dialog img {
  width: 18px;
  height: 18px;
}

.credit-unlock-dialog h3 {
  margin: 0;
  font-size: 16px;
}

.credit-unlock-dialog p {
  margin: 8px 0;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.55;
}

.credit-unlock-dialog > div > small {
  color: #14243A;
  font-size: 8px;
  font-weight: 700;
}

.credit-unlock-dialog > div > div {
  display: flex;
  justify-content: center;
  gap: 7px;
  margin-top: 15px;
}

.nuid-value .nuid-unverified-warning {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  width: fit-content;
  margin-top: 4px;
  padding: 4px 6px;

  background: var(--na-coral);
  border-radius: 4px;
  font-size: 8px;
  font-weight: 700;
;color:var(--na-white)!important;}

.nuid-value .nuid-unverified-warning img {
  width: 10px;
  height: 10px;
}

.verification-page {
  max-width: 800px;
}

.verification-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.verification-channel {
  padding: 13px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-top: 3px solid #FF6B61;
  border-radius: 7px;
}

.verification-channel.verified {
  border-top-color: #293A50;
}

.verification-head {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.verification-head > span {
  display: grid;
  width: 32px;
  height: 32px;
  background: #EDF2F7;
  border-radius: 6px;
  place-items: center;
}

.verification-head img {
  width: 14px;
  height: 14px;
}

.verification-head small,
.verification-head strong {
  display: block;
}

.verification-head small {
  color: var(--muted);
  font-size: 7px;
}

.verification-head strong {
  margin-top: 2px;
  font-size: 9px;
}

.verification-head em {
  padding: 5px 7px;

  background: var(--na-coral);
  border-radius: 4px;
  font-size: 7px;
  font-style: normal;
  font-weight: 700;
;color:var(--na-white)!important;}

.verification-channel.verified em {
  color: #14243A;
  background: #EDF2F7;
}

.verification-destination-form,
.verification-otp-form {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.verification-destination-form {
  display: grid;
  gap: 5px;
}

.verification-destination-form > label,
.verification-destination-form > small {
  color: var(--muted);
  font-size: 7px;
}

.verification-destination-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
}

.verification-destination-row input,
.verification-destination-row .button {
  min-height: 32px;
  font-size: 8px;
}

.verification-destination-form .errorlist {
  margin: 0;
  padding: 0;
  color: #BA3C38;
  font-size: 8px;
  list-style: none;
}

.verification-otp-form {
  display: grid;
  grid-template-columns: auto minmax(100px, 1fr) auto;
  align-items: end;
  gap: 6px;
}

.verification-otp-form label {
  display: grid;
  gap: 3px;
  color: var(--muted);
  font-size: 7px;
}

.verification-otp-form input,
.verification-otp-form .button {
  min-height: 32px;
  font-size: 8px;
}

.profile-contact-access form .profile-contact-button.is-locked {
  cursor: pointer;
}

@media (max-width: 760px) {
  .employer-console-row {
    grid-template-columns: minmax(0, 1fr) 64px 42px;
  }

  .employer-row-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }

  .employer-job-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .applicant-console-list > article {
    grid-template-columns: 34px minmax(0, 1fr) auto;
  }

  .profile-lock-chip {
    grid-column: 2;
    justify-self: start;
  }

  .applicant-console-list .button {
    grid-column: 3;
    grid-row: 1 / 3;
  }

  .credit-pack-grid,
  .verification-grid {
    grid-template-columns: 1fr;
  }

  .credit-orders-head {
    align-items: stretch;
    flex-direction: column;
  }

  .credit-date-filter {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
  }

  .credit-date-filter input {
    width: 100%;
    box-sizing: border-box;
  }
}

@media (max-width: 480px) {
  .employer-dashboard-heading > .recruitment-primary-action {
    width: 100%;
  }

  .employer-job-fields {
    grid-template-columns: 1fr;
  }

  .employer-job-fields > .span-all {
    grid-column: 1;
  }

  .verification-destination-row,
  .verification-otp-form {
    grid-template-columns: 1fr;
  }

  .credit-ledger-list > a {
    grid-template-columns: 34px minmax(0, 1fr);
  }

  .credit-ledger-list > a > span:last-child {
    grid-column: 2;
  }

  .credit-date-filter {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 920px) {
  .nurse-filter-panel {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 580px) {
  .nurse-filter-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nurse-filter-keyword,
  .nurse-filter-actions {
    grid-column: 1 / -1;
  }

  .nurse-filter-actions .button {
    flex: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    transition-duration: .01ms !important;
  }
}

.catalog-request-control {
  display: grid !important;
  flex: 1 0 100%;
  gap: 6px !important;
  margin-top: 8px !important;
  padding-top: 10px !important;
  border-top: 1px solid var(--line);
}

.catalog-request-control > label,
.catalog-request-control > small {
  color: var(--muted);
  font-size: 10px;
}

.catalog-request-control > div {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px !important;
}

.catalog-request-control input {
  min-width: 0;
}

.job-recommendation-settings {
  display: grid;
  gap: 18px;
  margin-top: 24px;
  padding: 20px 0;
  background: #FFFFFF;
  border-top: 2px solid #EDF2F7;
  border-bottom: 1px solid var(--line);
}

.job-recommendation-settings > * {
  margin-inline: 20px;
}

.job-recommendation-settings-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.job-recommendation-settings-head .editor-section-heading {
  margin: 0;
}

.recommendation-mode-label {
  padding: 6px 9px;
  color: #14243A;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 750;
}

.recommendation-settings-grid {
  display: grid;
  grid-template-columns: minmax(210px, .65fr) minmax(0, 1.35fr);
  border-block: 1px solid var(--line);
}

.recommendation-profile-location,
.recommendation-selected-locations {
  min-width: 0;
  padding: 16px 0;
}

.recommendation-profile-location {
  padding-right: 20px;
  border-right: 1px solid var(--line);
}

.recommendation-selected-locations {
  padding-left: 20px;
}

.recommendation-profile-location > small,
.recommendation-selected-heading small,
.recommendation-profile-location > strong,
.recommendation-selected-heading strong {
  display: block;
}

.recommendation-profile-location > small,
.recommendation-selected-heading small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 750;
  text-transform: uppercase;
}

.recommendation-profile-location > strong,
.recommendation-selected-heading strong {
  margin-top: 4px;
  font-size: 13px;
}

.recommendation-profile-location p,
.recommendation-selected-heading p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 10px;
}

.recommendation-selected-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}

.recommendation-selected-heading p {
  max-width: 320px;
  text-align: right;
}

.recommendation-location-list,
.recommendation-basis {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}

.recommendation-location-list > span,
.recommendation-basis b {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 0 8px;
  color: #14243A;
  background: #EDF2F7;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  font-size: 10px;
}

.recommendation-location-list button {
  display: inline-grid;
  width: 22px;
  height: 22px;
  padding: 0;
  place-items: center;
  background: transparent;
  border: 0;
}

.recommendation-location-list button img {
  width: 13px;
  height: 13px;
}

.recommendation-location-list p {
  margin: 0;
  color: var(--muted);
  font-size: 10px;
}

.recommendation-location-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  align-items: end;
  gap: 9px;
}

.recommendation-location-fields label {
  display: grid;
  gap: 5px;
  color: #454B54;
  font-size: 10px;
  font-weight: 700;
}

.dashboard-recommendations {
  margin-top: 18px;
}

.recommendation-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
}

.recommendation-heading > a,
.recommendation-basis > a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--brand-dark);
  font-size: 10px;
  font-weight: 700;
}

.recommendation-heading > a img {
  width: 13px;
  height: 13px;
}

.recommendation-basis {
  margin: 9px 0;
  color: var(--muted);
  font-size: 10px;
}

.recommendation-basis > a {
  margin-left: auto;
}

.dashboard-recommendation-list {
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 7px;
}

.dashboard-recommendation-list > a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 16px;
  align-items: center;
  gap: 12px;
  min-height: 58px;
  padding: 10px 13px;
  border-bottom: 1px solid var(--line);
}

.dashboard-recommendation-list > a:last-child {
  border-bottom: 0;
}

.dashboard-recommendation-list strong,
.dashboard-recommendation-list small {
  display: block;
}

.dashboard-recommendation-list strong {
  font-size: 11px;
}

.dashboard-recommendation-list small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 9px;
}

.dashboard-recommendation-list > a > img {
  width: 14px;
}

.listing-recommendation-basis {
  margin-bottom: 14px;
  padding: 9px 12px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.employer-skill-request {
  display: grid;
  grid-template-columns: minmax(220px, .7fr) minmax(320px, 1fr);
  gap: 14px;
  margin-top: 14px;
  padding: 14px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 7px;
}

.employer-skill-request h2 {
  margin: 2px 0 4px;
  font-size: 15px;
}

.employer-skill-request small,
.employer-skill-request > p {
  color: var(--muted);
  font-size: 10px;
}

.employer-skill-request form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

@media (max-width: 680px) {
  .job-recommendation-settings {
    margin-top: 18px;
    padding-block: 16px;
  }

  .job-recommendation-settings > * {
    margin-inline: 14px;
  }

  .job-recommendation-settings-head,
  .recommendation-selected-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .recommendation-settings-grid {
    grid-template-columns: 1fr;
  }

  .recommendation-profile-location {
    padding-right: 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .recommendation-selected-locations {
    padding-left: 0;
  }

  .recommendation-selected-heading p {
    max-width: none;
    text-align: left;
  }

  .recommendation-location-fields,
  .employer-skill-request,
  .employer-skill-request form,
  .catalog-request-control > div {
    grid-template-columns: 1fr;
  }

  .recommendation-location-fields .button,
  .employer-skill-request .button,
  .catalog-request-control .button {
    width: 100%;
  }

  .recommendation-basis > a {
    margin-left: 0;
  }
}

.campus-manager-page {
  max-width: 1120px;
}

.campus-manager-layout {
  display: grid;
  grid-template-columns: minmax(340px, .8fr) minmax(0, 1.2fr);
  gap: 14px;
}

.campus-form-panel,
.campus-list-panel {
  align-self: start;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 3px solid var(--navy);
  border-radius: 7px;
}

.campus-form-panel {
  padding: 14px;
}

.campus-panel-heading {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 12px;
}

.campus-panel-heading > span,
.campus-location-icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 32px;
  height: 32px;
  color: var(--navy);
  background: #EDF2F7;
  border-radius: 6px;
}

.campus-panel-heading img,
.campus-location-icon img {
  width: 14px;
  height: 14px;
  opacity: .72;
}

.campus-panel-heading small {
  color: var(--muted);
  font-size: 8px;
}

.campus-panel-heading h2 {
  margin: 1px 0 0;
  font-size: 14px;
}

.campus-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin-bottom: 11px;
}

.campus-form-grid > label {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: #454B54;
  font-size: 9px;
  font-weight: 700;
}

.campus-form-grid .span-all {
  grid-column: 1 / -1;
}

.campus-form-grid input:not([type="checkbox"]) {
  min-height: 36px;
  font-size: 10px;
}

.campus-form-grid .campus-head-office {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 9px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.campus-head-office input {
  flex: 0 0 auto;
  width: 15px;
  min-height: 15px;
}

.campus-head-office span {
  display: grid;
}

.campus-head-office small,
.campus-review-note {
  color: var(--muted);
  font-size: 8px;
}

.campus-list-panel {
  padding: 14px;
}

.campus-list {
  display: grid;
  gap: 6px;
}

.campus-list article {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 9px;
  min-height: 58px;
  padding: 8px;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 6px;
}

.campus-list article > div > div {
  display: flex;
  align-items: center;
  gap: 5px;
}

.campus-list article strong {
  font-size: 11px;
}

.campus-list article small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 8px;
}

.campus-list article em,
.campus-status {
  padding: 3px 5px;
  border-radius: 4px;
  font-size: 7px;
  font-style: normal;
  font-weight: 750;
}

.campus-list article em {
  color: #14243A;
  background: #EDF2F7;
}

.campus-status.status-approved {
  color: #14243A;
  background: #EDF2F7;
}

.campus-status.status-pending {

  background: var(--na-coral);
;color:var(--na-white)!important;}

.campus-status.status-rejected {
  color: #BA3C38;
  background: #EDF2F7;
}

.campus-list form,
.campus-list form button {
  margin: 0;
}

.campus-list form button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 28px;
  padding: 0 7px;
  color: #14243A;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 5px;
  font-size: 8px;
  font-weight: 700;
}

.campus-list form img,
.campus-review-note img {
  width: 11px;
  height: 11px;
}

.campus-review-note {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 10px 0 0;
}

.job-location-guidance {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 9px 14px;
  color: #14243A;
  background: #EDF2F7;
  border-bottom: 1px solid #EDF2F7;
}

.job-location-guidance.needs-location {
  color: #BA3C38;
  background: #EDF2F7;
  border-color: #FFE4DF;
}

.job-location-guidance > img {
  width: 16px;
  height: 16px;
}

.job-location-guidance > span {
  display: grid;
}

.job-location-guidance strong {
  font-size: 10px;
}

.job-location-guidance small,
.field-help {
  color: var(--muted);
  font-size: 8px;
  font-weight: 500;
}

.job-location-guidance a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--navy);
  font-size: 9px;
  font-weight: 750;
}

.job-location-guidance a img {
  width: 11px;
  height: 11px;
}

.employer-job-fields #id_campuses {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.employer-job-fields #id_campuses label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 6px 8px;
  background: #FFFFFF;
  border: 1px solid #EDF2F7;
  border-radius: 6px;
  font-size: 9px;
  line-height: 1.3;
}

.employer-job-fields #id_campuses input {
  flex: 0 0 auto;
  width: 14px;
  min-height: 14px;
}

.job-campus-locations {
  margin-top: 17px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.job-campus-locations > div:last-child {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.job-campus-locations > div:last-child > span {
  display: grid;
  padding: 8px 9px;
  background: #FFFFFF;
  border-left: 3px solid #14243A;
  border-radius: 4px;
}

.job-campus-locations strong {
  font-size: 10px;
}

.job-campus-locations small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 8px;
}

.private-job-disclaimer,
.private-job-detail-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: #454B54;
  background: #FFFFFF;
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 9px;
}

.private-job-disclaimer {
  margin: 14px 0 0;
  padding: 9px 11px;
}

.private-job-disclaimer span {
  display: grid;
  gap: 1px;
}

.private-job-disclaimer strong {
  font-size: 9px;
}

.private-job-detail-note {
  margin: 10px 0 0;
  padding: 8px;
  line-height: 1.45;
}

.private-job-disclaimer img,
.private-job-detail-note img {
  flex: 0 0 auto;
  width: 13px;
  height: 13px;
  opacity: .65;
}

@media (max-width: 760px) {
  .campus-manager-layout,
  .employer-job-fields #id_campuses {
    grid-template-columns: 1fr;
  }

  .campus-list article {
    grid-template-columns: 32px minmax(0, 1fr) auto;
  }

  .campus-list article form {
    grid-column: 2 / -1;
    justify-self: start;
  }

  .job-location-guidance {
    grid-template-columns: 26px minmax(0, 1fr);
  }

  .job-location-guidance > a {
    grid-column: 2;
  }

  .job-campus-locations > div:last-child {
    grid-template-columns: 1fr;
  }
}
/* Mock tests */
.mock-tests-surface {
  background: #FFFFFF;
}

.mock-hub,
.mock-result,
.mock-checkout,
.answer-review {
  max-width: 1180px;
  padding-top: 28px;
  padding-bottom: 56px;
}

.mock-hub-header,
.result-heading,
.review-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
}

.mock-hub-header h1,
.result-heading h1,
.review-header h1,
.mock-checkout h1 {
  margin: 3px 0 5px;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 30px;
  line-height: 1.2;
  letter-spacing: 0;
}

.mock-hub-header p:last-child,
.result-heading span,
.review-header span {
  margin: 0;
  color: #293A50;
  font-size: 13px;
}

.mock-history-link,
.checkout-back {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #14243A;
  font-size: 13px;
  font-weight: 600;
}

.mock-history-link img,
.checkout-back img {
  width: 16px;
  height: 16px;
}

.checkout-back img {
  transform: rotate(180deg);
}

.mock-setup-message,
.mock-empty {
  padding: 18px;
  border: 1px solid #EDF2F7;
  background: #FFFFFF;
  color: #14243A;
  font-size: 13px;
  border-radius: 6px;
}

.daily-mock-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 32px;
  min-height: 190px;
  padding: 28px 32px;
  overflow: hidden;
  border: 1px solid #627083;
  border-left: 5px solid #293A50;
  border-radius: 8px;
  background: #FFFFFF;
  box-shadow: 0 10px 30px rgba(20,36,58, .07);
}

.daily-label,
.premium-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #14243A;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.daily-label img,
.premium-kicker img {
  width: 15px;
  height: 15px;
}

.daily-mock-copy h2,
.mock-section-heading h2,
.subject-performance h2,
.review-access-panel h2 {
  margin: 8px 0 5px;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 20px;
  line-height: 1.25;
  letter-spacing: 0;
}

.daily-mock-copy > p {
  max-width: 660px;
  margin: 0;
  color: #293A50;
  font-size: 13px;
}

.mock-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

.mock-facts span {
  padding: 7px 10px;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  background: #FFFFFF;
  color: #14243A;
  font-size: 11px;
}

.mock-facts strong {
  color: #14243A;
  font-size: 13px;
}

.daily-mock-action {
  display: flex;
  min-width: 190px;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}
.daily-mock-panel{min-height:0;padding:24px 28px;border-left:4px solid #14243A;border-color:#EDF2F7;border-radius:16px;background:linear-gradient(120deg,#FFFFFF 0%,#FFFFFF 100%);box-shadow:0 14px 34px rgba(20,36,58,.08)}.daily-label{padding:6px 9px;background:#EDF2F7;border-radius:999px;font-size:9px;letter-spacing:.08em}.daily-mock-copy h2{margin:12px 0 6px;font-size:25px;letter-spacing:-.025em}.daily-mock-copy>p{max-width:580px;font-size:12px;line-height:1.55}.mock-facts{display:grid;grid-template-columns:repeat(4,minmax(90px,1fr));gap:8px;margin-top:18px;max-width:620px}.mock-facts span{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:5px;min-height:48px;padding:8px 10px;border:1px solid #EDF2F7;border-radius:10px;background:#FFFFFF;color:#14243A;font-size:9px}.mock-facts strong{font-size:18px;line-height:1;color:#14243A}.mock-facts .dashboard-timer-badge{display:grid;grid-template-columns:15px 1fr;column-gap:5px}.dashboard-timer-badge img{width:14px;height:14px;grid-row:1/3}.dashboard-timer-badge strong{font-size:12px}.daily-mock-action{min-width:180px;align-items:stretch;padding-left:18px;border-left:1px solid #EDF2F7}.daily-mock-action .button{justify-content:center;white-space:nowrap}.daily-mock-action>small{text-align:center;color:#627083;font-size:10px}@media(max-width:760px){.daily-mock-panel{padding:20px}.mock-facts{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}.daily-mock-action{padding:16px 0 0;border-top:1px solid #EDF2F7;border-left:0}.daily-mock-action .button{width:100%}}

.daily-mock-action form {
  width: 100%;
}

.daily-mock-action small,
.daily-progress {
  color: #293A50;
  font-size: 10px;
}

.daily-complete {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #14243A;
  font-size: 12px;
  font-weight: 700;
}

.daily-complete img {
  width: 16px;
}

.daily-mock-action > strong {
  color: #14243A;
  font-size: 24px;
}

.mock-primary-action,
.premium-pack-action {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 15px;
  border: 1px solid #14243A;
  border-radius: 5px;
  background: #14243A;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 700;
}

.mock-primary-action:hover {
  background: #14243A;
  color: #FFFFFF;
}

.mock-primary-action img,
.premium-pack-action img,
.runner-button img {
  width: 15px;
  filter: brightness(0) invert(1);
}

.premium-test-centre,
.mock-attempt-history,
.subject-performance {
  margin-top: 34px;
}

.mock-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 15px;
}

.mock-section-heading > p {
  max-width: 480px;
  margin: 0 0 3px;
  color: #293A50;
  font-size: 12px;
  text-align: right;
}

.premium-kicker {
  color: #BA3C38;
}

.premium-pack-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.premium-pack-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 18px;
  border: 1px solid #FF6B61;
  border-top: 4px solid #BA3C38;
  border-radius: 7px;
  background: #FFFFFF;
  box-shadow: 0 8px 22px rgba(20,36,58, .07);
}

.premium-pack-card > header,
.premium-pack-card > footer,
.entitlement-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.premium-pack-card > header > span {
  padding: 3px 7px;
  border-radius: 3px;
  background: var(--na-coral);

  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
;color:var(--na-white)!important;}

.premium-pack-card > header small,
.premium-pack-card > p,
.entitlement-line small {
  color: #293A50;
  font-size: 10px;
}

.premium-pack-card h3 {
  margin: 14px 0 5px;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  line-height: 1.3;
  letter-spacing: 0;
}

.premium-pack-card > p {
  min-height: 39px;
  margin: 0 0 13px;
  line-height: 1.45;
}

.premium-subject-mix {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-height: 48px;
  align-content: flex-start;
}

.premium-subject-mix span {
  padding: 4px 7px;
  border: 1px solid #EDF2F7;
  border-radius: 3px;
  color: #14243A;
  font-size: 9px;
}

.premium-subject-mix strong {
  color: #14243A;
}

.premium-pack-facts {
  display: flex;
  gap: 0;
  margin: 14px 0;
  padding: 10px 0;
  border-top: 1px solid #EDF2F7;
  border-bottom: 1px solid #EDF2F7;
}

.premium-pack-facts span {
  flex: 1;
  color: #14243A;
  font-size: 9px;
  text-align: center;
}

.premium-pack-facts span + span {
  border-left: 1px solid #EDF2F7;
}

.premium-pack-card > footer {
  margin-top: auto;
}

.premium-pack-card > footer > strong {
  color: #14243A;
  font-size: 20px;
}

.premium-pack-action {
  border-color: #14243A;
  background: #14243A;
  font-size: 11px;
}

.entitlement-line {
  color: #14243A;
  font-size: 10px;
  font-weight: 700;
}

.premium-start-form {
  display: grid;
  gap: 9px;
  margin-top: 10px;
}

.compact-toggle,
.review-toggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #14243A;
  font-size: 10px;
  cursor: pointer;
}

.compact-toggle input,
.review-toggle input {
  position: absolute;
  opacity: 0;
}

.compact-toggle span,
.review-toggle > span {
  width: 28px;
  height: 16px;
  padding: 2px;
  border: 1px solid #EDF2F7;
  border-radius: 10px;
  background: #EDF2F7;
}

.compact-toggle span::after,
.review-toggle > span::after {
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #FFFFFF;
  box-shadow: 0 1px 2px rgba(20,36,58, .2);
  content: "";
  transition: transform .18s ease;
}

.compact-toggle input:checked + span,
.review-toggle input:checked + span {
  border-color: #14243A;
  background: #14243A;
}

.compact-toggle input:checked + span::after,
.review-toggle input:checked + span::after {
  transform: translateX(12px);
}

.attempt-history-list {
  overflow: hidden;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
}

.attempt-history-list > a {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) 90px 18px;
  align-items: center;
  gap: 14px;
  min-height: 70px;
  padding: 10px 16px;
  color: #14243A;
}

.attempt-history-list > a + a {
  border-top: 1px solid #EDF2F7;
}

.attempt-history-list > a:hover {
  background: #FFFFFF;
}

.history-date {
  display: grid;
  justify-items: center;
  padding-right: 12px;
  border-right: 1px solid #EDF2F7;
}

.history-date strong {
  font-size: 18px;
}

.history-date small,
.history-main small,
.history-score small {
  color: #293A50;
  font-size: 9px;
}

.history-main,
.history-score {
  display: grid;
  gap: 2px;
}

.history-main strong,
.history-score strong {
  font-size: 12px;
}

.history-score {
  text-align: right;
}

.attempt-history-list > a > img {
  width: 15px;
}

/* Test runner */
.mock-runner-page {
  background: #FFFFFF;
}

.mock-runner-page .site-footer {
  display: none;
}

.mock-runner {
  min-height: calc(100vh - 64px);
}

.mock-runner-header {
  position: sticky;
  z-index: 20;
  top: 0;
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(240px, 420px) minmax(150px, 1fr);
  align-items: center;
  gap: 28px;
  min-height: 68px;
  padding: 10px max(20px, calc((100vw - 1180px) / 2));
  border-bottom: 1px solid #EDF2F7;
  background: rgba(255,255,255, .97);
  box-shadow: 0 3px 12px rgba(20,36,58, .05);
}

.runner-title,
.runner-timer,
.runner-progress > span {
  display: flex;
  align-items: center;
}

.runner-title {
  gap: 10px;
}

.runner-title > a {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
}

.runner-title > a img {
  width: 15px;
  transform: rotate(180deg);
}

.runner-title > span,
.runner-timer > span {
  display: grid;
}

.runner-title small,
.runner-timer small {
  color: #293A50;
  font-size: 8px;
  text-transform: uppercase;
}

.runner-title strong {
  overflow: hidden;
  max-width: 270px;
  color: #14243A;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.runner-progress > span {
  justify-content: center;
  margin-bottom: 5px;
  color: #14243A;
  font-size: 9px;
}

.runner-progress > div,
.review-progress > div {
  height: 5px;
  overflow: hidden;
  border-radius: 3px;
  background: #EDF2F7;
}

.runner-progress i,
.review-progress i {
  display: block;
  height: 100%;
  background: #293A50;
  transition: width .2s ease;
}

.runner-timer {
  justify-self: end;
  gap: 8px;
  min-width: 118px;
  padding: 6px 10px;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  background: #FFFFFF;
}

.runner-timer img {
  width: 17px;
}

.runner-timer strong {
  color: #14243A;
  font-variant-numeric: tabular-nums;
  font-size: 15px;
}

.runner-timer.ending {
  border-color: #FFE4DF;
  background: #EDF2F7;
}

.runner-timer.ending strong {
  color: #BA3C38;
}

.mock-runner-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 230px;
  gap: 22px;
  width: min(1180px, calc(100% - 40px));
  margin: 22px auto 40px;
}

.question-workspace {
  min-width: 0;
}

.question-meta,
.question-topic {
  display: flex;
  align-items: center;
  gap: 7px;
}

.question-meta {
  justify-content: space-between;
  margin-bottom: 9px;
  color: #14243A;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.difficulty {
  padding: 3px 7px;
  border-radius: 3px;
  background: #EDF2F7;
  color: #14243A;
  font-size: 8px;
  font-weight: 800;
  text-transform: uppercase;
}

.difficulty-easy { background: #EDF2F7; color: #14243A; }
.difficulty-moderate { background: var(--na-coral);  ;color:var(--na-white)!important;}
.difficulty-hard { background: var(--na-coral);  ;color:var(--na-white)!important;}
.difficulty-very_hard { background: var(--na-coral);  ;color:var(--na-white)!important;}

.question-topic {
  margin-bottom: 8px;
  color: #293A50;
  font-size: 10px;
}

.question-topic img {
  width: 12px;
}

.question-topic strong {
  color: #14243A;
}

.question-card {
  padding: 24px;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
  box-shadow: 0 7px 22px rgba(20,36,58, .05);
}

.question-card h1 {
  margin: 0 0 20px;
  color: #14243A;
  font-family: "Inter", sans-serif;
  font-size: 17px;
  line-height: 1.55;
  letter-spacing: 0;
}

.question-image-button {
  display: block;
  max-width: 100%;
  margin: 0 0 20px;
  padding: 5px;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  background: #FFFFFF;
  cursor: zoom-in;
}

.question-image-button img {
  display: block;
  max-width: 100%;
  max-height: 360px;
  object-fit: contain;
}

.question-image-button > span,
.option-image-button > span {
  display: block;
  padding: 6px 8px 2px;
  color: #14243A;
  font-size: 9px;
  font-weight: 750;
  text-align: center;
}

.answer-options {
  display: grid;
  gap: 9px;
}

.answer-option {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 11px;
  min-height: 52px;
  padding: 9px 12px;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  background: #FFFFFF;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.answer-option:hover {
  border-color: #627083;
  background: #FFFFFF;
}

.answer-option.selected {
  border-color: #293A50;
  background: #EDF2F7;
  box-shadow: inset 3px 0 #293A50;
}

.answer-option input {
  position: absolute;
  opacity: 0;
}

.option-letter {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid #EDF2F7;
  border-radius: 50%;
  color: #14243A;
  font-size: 11px;
  font-weight: 700;
}

.answer-option.selected .option-letter {
  border-color: #293A50;
  background: #293A50;
  color: #FFFFFF;
}

.option-content {
  color: #14243A;
  font-size: 13px;
  line-height: 1.45;
}

.option-content img,
.review-option img {
  display: block;
  max-width: 240px;
  max-height: 150px;
  margin-top: 6px;
  object-fit: contain;
}

.option-image-button {
  display: inline-block;
  max-width: 100%;
  margin-top: 6px;
  padding: 5px;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
  cursor: zoom-in;
}

.option-image-button:hover,
.option-image-button:focus-visible,
.question-image-button:hover,
.question-image-button:focus-visible {
  border-color: #293A50;
  outline: 3px solid rgba(20,36,58, .12);
}

.option-image-button img {
  width: min(240px, 100%);
  max-width: 100%;
  max-height: 170px;
  margin: 0;
  object-fit: contain;
}

.option-check {
  visibility: hidden;
}

.option-check img {
  width: 18px;
}

.answer-option.selected .option-check {
  visibility: visible;
}

.review-toggle {
  width: max-content;
  margin-top: 7px;
  font-size: 11px;
}

.answer-save-status {
  min-height: 16px;
  color: #293A50;
  font-size: 9px;
  text-align: right;
}

.answer-save-status.error {
  color: #BA3C38;
}

.runner-controls {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
}

.runner-button {
  display: inline-flex;
  min-width: 115px;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 14px;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 700;
}

.runner-button.primary {
  border-color: #14243A;
  background: #14243A;
  color: #FFFFFF;
}

.runner-button.secondary {
  background: #FFFFFF;
  color: #14243A;
}

.runner-button.secondary img {
  filter: none;
  transform: rotate(180deg);
}

.question-navigator {
  position: sticky;
  top: 90px;
  align-self: start;
  padding: 16px;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
}

.question-navigator h2 {
  margin: 0 0 12px;
  color: #14243A;
  font-size: 13px;
}

.navigator-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 7px;
}

.navigator-grid a {
  display: grid;
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  background: #FFFFFF;
  color: #14243A;
  font-size: 10px;
  font-weight: 700;
}

.navigator-grid a.answered { border-color: #627083; background: #EDF2F7; color: #14243A; }
.navigator-grid a.review { border-color: #FF6B61; background: var(--na-coral);  ;color:var(--na-white)!important;}
.navigator-grid a.current { border-color: #14243A; background: #14243A; color: #FFFFFF; }

.navigator-legend {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  margin: 14px 0;
  color: #293A50;
  font-size: 8px;
}

.navigator-legend span {
  display: flex;
  align-items: center;
  gap: 5px;
}

.navigator-legend i {
  width: 9px;
  height: 9px;
  border: 1px solid #EDF2F7;
  border-radius: 2px;
  background: #FFFFFF;
}

.navigator-legend i.answered { border-color: #627083; background: #EDF2F7; }
.navigator-legend i.review { border-color: #FF6B61; background: var(--na-coral); ;color:var(--na-white)!important;}

.navigator-submit {
  width: 100%;
  min-height: 36px;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  background: #FFFFFF;
  color: #14243A;
  font-size: 10px;
  font-weight: 700;
}

.mobile-question-navigator {
  display: none;
}

.mock-dialog,
.image-dialog {
  max-width: min(460px, calc(100% - 30px));
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: #FFFFFF;
  box-shadow: 0 20px 60px rgba(20,36,58, .25);
}

.mock-dialog::backdrop,
.image-dialog::backdrop {
  background: rgba(20,36,58, .62);
}

.mock-dialog form {
  position: relative;
  display: grid;
  justify-items: center;
  padding: 28px;
  text-align: center;
}

.dialog-close,
.image-dialog > button {
  position: absolute;
  top: 9px;
  right: 10px;
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 0;
  background: transparent;
  color: #14243A;
  font-size: 21px;
}

.dialog-icon {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 50%;
  background: #EDF2F7;
}

.dialog-icon img {
  width: 21px;
}

.mock-dialog h2 {
  margin: 13px 0 5px;
  color: #14243A;
  font-size: 18px;
}

.mock-dialog p {
  margin: 0 0 20px;
  color: #293A50;
  font-size: 12px;
  line-height: 1.5;
}

.mock-dialog form > div {
  display: flex;
  gap: 9px;
}

.image-dialog {
  inset: 0;
  width: 100vw;
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 54px 24px 24px;
  border-radius: 0;
  background: rgba(20,36,58, .97);
}

.image-dialog img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: calc(100dvh - 78px);
  object-fit: contain;
}

.image-dialog > button {
  z-index: 2;
  top: 12px;
  right: 14px;
  display: flex;
  width: auto;
  height: 36px;
  align-items: center;
  gap: 7px;
  padding: 0 12px;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  color: #FFFFFF;
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
}

.image-dialog > button b {
  font-size: 20px;
  font-weight: 400;
  line-height: 1;
}

/* Results and review */
.score-hero {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) auto;
  align-items: center;
  gap: 28px;
  padding: 25px 28px;
  border: 1px solid #627083;
  border-radius: 8px;
  background: #FFFFFF;
  box-shadow: 0 10px 28px rgba(20,36,58, .07);
}

.score-hero.premium {
  border-color: #FF6B61;
  border-left: 5px solid #BA3C38;
}

.score-ring {
  position: relative;
  display: grid;
  width: 132px;
  height: 132px;
  place-items: center;
  background: conic-gradient(from -90deg, #293A50 var(--score, 0%), #EDF2F7 0);
  border-radius: 50%;
}

.score-ring::before {
  position: absolute;
  inset: 10px;
  content: "";
  background: #FFFFFF;
  border-radius: 50%;
}

.score-ring span {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  text-align: center;
}

.score-ring strong {
  color: #14243A;
  font-size: 28px;
}

.score-ring small {
  color: #293A50;
  font-size: 9px;
}

.score-summary > span {
  color: #14243A;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.score-summary h2 {
  margin: 5px 0 2px;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 30px;
  letter-spacing: 0;
}

.score-summary p {
  margin: 0;
  color: #293A50;
  font-size: 11px;
}

.score-actions {
  display: grid;
  gap: 8px;
}

.result-download,
.result-share {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border-radius: 4px;
  font-size: 10px;
}

.result-download img,
.result-share img {
  width: 15px;
}

.result-download {
  border-color: #14243A;
  background: #14243A;
  color: #FFFFFF;
}

.result-download img {
  filter: brightness(0) invert(1);
}

.result-share {
  border: 1px solid #EDF2F7;
  background: #FFFFFF;
  color: #14243A;
}

.result-share:hover,
.result-share:focus-visible {
  border-color: #14243A;
  background: #14243A;
  color: #FFFFFF;
}

.result-share:hover img,
.result-share:focus-visible img {
  filter: brightness(0) invert(1);
}

.result-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 14px;
  overflow: hidden;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
}

/* Premium nurse profiles */
.premium-profile-studio { padding-top: 28px; padding-bottom: 64px; }
.premium-studio-hero { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:30px; color:#FFFFFF; background:linear-gradient(135deg,#14243A,#14243A 68%,#BA3C38); border-radius:14px; box-shadow:0 18px 46px rgba(20,36,58,.2); }
.premium-studio-hero h1 { max-width:720px; margin:4px 0 8px; color:#FFFFFF; font-size:30px; }
.premium-studio-hero p { margin:0; color:rgba(255,255,255,.78); }
.premium-studio-hero .button { color:#FFFFFF; border-color:rgba(255,255,255,.45); }
.premium-status-card,.premium-settings-card,.premium-history,.premium-plan-section { margin-top:18px; padding:22px; background:#FFFFFF; border:1px solid #EDF2F7; border-radius:12px; box-shadow:var(--shadow-sm); }
.premium-status-card { display:grid; grid-template-columns:1fr auto; gap:5px 20px; border-left:5px solid #BA3C38; }
.premium-status-card span { color:#BA3C38; font-size:10px; font-weight:800; text-transform:uppercase; }
.premium-status-card strong { font-size:20px; }
.premium-status-card p { grid-column:2; grid-row:1/3; margin:0; color:var(--muted); }
.premium-status-card div { grid-column:1/-1; height:5px; overflow:hidden; background:#EDF2F7; border-radius:5px; }.premium-status-card i{display:block;height:100%;background:var(--na-coral);color:var(--na-white)!important;}
.premium-settings-card { display:flex; align-items:center; justify-content:space-between; gap:24px; }.premium-settings-card h2{margin:0 0 4px}.premium-settings-card p{margin:0;color:var(--muted)}.premium-settings-card form{display:grid;gap:10px}.premium-settings-card label{display:flex;align-items:center;gap:8px;font-size:12px}
.premium-studio-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:16px; align-items:start; }
.premium-studio-card { padding:20px; background:#FFFFFF; border:1px solid #EDF2F7; border-radius:12px; box-shadow:var(--shadow-sm); }.premium-studio-card h2{margin:0 0 4px;font-size:18px}.premium-studio-card>p{margin:0 0 14px;color:var(--muted);font-size:11px}.premium-studio-card form{display:grid;gap:9px}.premium-studio-card form p{display:grid;gap:5px;margin:0;font-size:11px}.premium-studio-card input,.premium-studio-card select,.premium-studio-card textarea{width:100%}.premium-editor-card{grid-column:1/-1}.premium-editor-card form>label{font-size:11px;font-weight:700}
.premium-editor-toolbar{display:flex;gap:5px;padding:7px;background:#EDF2F7;border:1px solid var(--line);border-bottom:0;border-radius:7px 7px 0 0}.premium-editor-toolbar button{min-width:34px;height:30px;background:#FFFFFF;border:1px solid var(--line);border-radius:4px}.premium-rich-editor{min-height:220px;padding:16px;border:1px solid var(--line);border-radius:0 0 7px 7px;line-height:1.7;outline:none}.premium-rich-editor:focus{border-color:var(--brand)}
.premium-item { display:flex; justify-content:space-between; gap:12px; margin-top:8px; padding:9px 10px; background:#FFFFFF; border-radius:6px; font-size:10px }.premium-item em{color:#BA3C38;font-style:normal;font-weight:700}
.premium-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:16px}.premium-plan-grid article{padding:20px;border:1px solid #EDF2F7;border-top:4px solid #BA3C38;border-radius:10px}.premium-plan-grid article>span{color:#BA3C38;font-size:9px;font-weight:800;text-transform:uppercase}.premium-plan-grid h3{margin:5px 0}.premium-plan-grid strong{font-size:24px;color:#14243A}.premium-plan-grid p{min-height:42px;color:var(--muted);font-size:11px}.premium-history>div{display:grid;grid-template-columns:1fr auto auto;gap:15px;padding:9px 0;border-top:1px solid var(--line);font-size:11px}
.premium-profile-actions{display:flex;align-items:center;gap:10px;margin-top:12px}.premium-profile-actions span{font-size:10px;color:rgba(255,255,255,.72)}.premium-profile-actions form{margin:0}.premium-profile-actions button,.premium-link-list a{padding:6px 11px;color:#FFFFFF;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);border-radius:999px;font-size:10px;font-weight:700}.premium-verified-pill{color:#FFFFFF!important;background:#BA3C38;padding:4px 7px;border-radius:999px}
.premium-showcase{display:grid;gap:18px;max-width:1180px;margin:20px auto 50px;padding:0 22px}.premium-showcase>section,.premium-gallery,.premium-link-list{padding:22px;background:#FFFFFF;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-sm)}.premium-showcase h2{margin:3px 0 15px}.premium-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.premium-gallery figure{margin:0}.premium-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px}.premium-gallery figcaption{margin-top:5px;color:var(--muted);font-size:10px}
.premium-achievement-grid,.premium-video-grid,.premium-post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.premium-achievement-grid article,.premium-video-grid a{padding:15px;background:#FFFFFF;border:1px solid var(--line);border-radius:8px}.premium-achievement-grid span{color:#BA3C38;font-size:9px;font-weight:800;text-transform:uppercase}.premium-achievement-grid h3{margin:5px 0}.premium-achievement-grid p,.premium-achievement-grid small{color:var(--muted)}.premium-video-grid a{display:grid;gap:5px;color:var(--ink)}.premium-video-grid span{color:var(--muted);font-size:10px}.premium-link-list{display:flex;flex-wrap:wrap;gap:8px}.premium-link-list a{background:var(--na-coral);border-color:#EDF2F7;color:var(--na-white)!important;}
.premium-post-grid article{overflow:hidden;border:1px solid var(--line);border-radius:9px}.premium-post-grid article>img{width:100%;aspect-ratio:16/9;object-fit:cover}.premium-post-grid article>div{padding:14px}.premium-post-grid span{color:#BA3C38;font-size:8px;font-weight:800;text-transform:uppercase}.premium-post-grid h3{margin:5px 0}.premium-post-grid p{color:var(--muted);font-size:10px}.premium-post-author{display:flex;align-items:center;gap:10px;margin:14px 0}.premium-post-author img{width:42px;height:42px;object-fit:cover;border-radius:50%}.premium-post-author span{display:grid}.premium-post-author small{color:var(--muted)}.premium-post-page{max-width:900px;padding-top:30px;padding-bottom:60px}.premium-post-page article{margin-top:16px;padding:30px;background:#FFFFFF;border:1px solid var(--line);border-radius:12px}.premium-post-cover{width:100%;max-height:440px;object-fit:cover;border-radius:9px}.premium-post-page h1{font-size:34px}.premium-post-summary{font-size:17px;color:var(--muted)}.premium-post-body{line-height:1.8}.premium-post-body img{max-width:100%}

@media (max-width: 720px) {
  .premium-studio-hero,.premium-settings-card{align-items:flex-start;flex-direction:column}.premium-studio-hero{padding:22px}.premium-studio-hero h1{font-size:24px}.premium-studio-grid,.premium-plan-grid,.premium-gallery,.premium-achievement-grid,.premium-video-grid,.premium-post-grid{grid-template-columns:1fr}.premium-editor-card{grid-column:auto}.premium-status-card{grid-template-columns:1fr}.premium-status-card p{grid-column:1;grid-row:auto}.premium-history>div{grid-template-columns:1fr auto}.premium-history small{grid-column:1/-1}.premium-showcase{padding:0 12px}.premium-post-page article{padding:18px}.premium-post-page h1{font-size:25px}
}

/* Friendly standalone Premium Profile */
.premium-public-page { padding-bottom:60px; background:#FFFFFF; }
.premium-public-hero { display:flex; justify-content:space-between; gap:20px; align-items:center; padding:42px max(22px,calc((100% - 1180px)/2)); color:#FFFFFF; background:linear-gradient(135deg,#14243A,#14243A 68%,#BA3C38); }
.premium-public-identity { display:flex; align-items:center; gap:20px; }
.premium-public-identity>img,.premium-public-identity>span { width:112px; height:112px; display:grid; place-items:center; object-fit:cover; border:4px solid rgba(255,255,255,.35); border-radius:50%; background:#EDF2F7; color:#14243A; font-size:28px; font-weight:800; }
.premium-public-hero h1 { margin:4px 0 5px; color:#FFFFFF; font-size:38px; }.premium-public-hero p { margin:0; color:rgba(255,255,255,.78); }.premium-public-meta { display:flex; gap:12px; flex-wrap:wrap; margin-top:12px; font-size:11px; }.premium-public-actions { display:flex; align-items:center; gap:10px; }.premium-public-actions button { padding:9px 15px; color:#FFFFFF; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.5); border-radius:999px; font-weight:700; }
.premium-public-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(260px,1fr); gap:18px; max-width:1180px; margin:18px auto; padding:0 22px; }.premium-public-layout>div,.premium-public-layout>aside { display:grid; gap:18px; align-content:start; }.premium-public-section { padding:22px; background:#FFFFFF; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-sm); }.premium-public-section>h2 { margin:3px 0 15px; }.premium-public-gallery { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; max-width:1180px; margin:18px auto 0; padding:12px; background:#FFFFFF; border:1px solid var(--line); border-radius:12px; }.premium-public-gallery figure { margin:0; }.premium-public-gallery img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:8px; }.premium-public-gallery figcaption { padding:5px; color:var(--muted); font-size:10px; }.premium-public-note { background:#EDF2F7; border-color:#FFE4DF; }.premium-public-note p { color:var(--muted); font-size:11px; }.premium-public-page .premium-post-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.premium-item a,.premium-item button { padding:4px 7px; color:#14243A; background:#FFFFFF; border:1px solid #EDF2F7; border-radius:4px; font-size:9px; font-weight:700; }.premium-item form { display:inline; }.premium-item { align-items:center; }.premium-cover-upload { display:grid; gap:6px; padding:10px; background:#FFFFFF; border:1px dashed #EDF2F7; border-radius:7px; font-size:11px; font-weight:700; }
.premium-profile-callout{display:flex;align-items:center;justify-content:space-between;gap:22px;max-width:1180px;margin:20px auto 50px;padding:22px;background:linear-gradient(120deg,#EDF2F7,#EDF2F7);border:1px solid #EDF2F7;border-radius:12px;box-shadow:var(--shadow-sm)}.premium-profile-callout h2{margin:3px 0 6px}.premium-profile-callout p{margin:0;color:var(--muted)}

/* Premium Profile workspace and public portfolio */
.premium-studio-hero-actions{display:flex;gap:10px;flex-wrap:wrap}.premium-studio-hero .button-light{background:#FFFFFF;color:#14243A;border-color:#FFFFFF}.premium-studio-nav{display:flex;gap:6px;margin-top:18px;padding:7px;overflow-x:auto;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:12px;box-shadow:var(--shadow-sm);scrollbar-width:thin}.premium-studio-nav a{flex:0 0 auto;padding:10px 14px;color:#14243A;border-radius:8px;font-size:11px;font-weight:750}.premium-studio-nav a:hover,.premium-studio-nav a.active{color:#FFFFFF;background:#14243A}.premium-overview-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-top:16px}.premium-overview-grid article{display:grid;gap:3px;padding:18px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:10px;box-shadow:var(--shadow-sm)}.premium-overview-grid strong{font-size:26px;color:#14243A}.premium-overview-grid span{color:var(--muted);font-size:10px}.premium-manage-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:18px;margin-top:18px;align-items:start}.premium-compose-card,.premium-library-card{padding:24px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:14px;box-shadow:var(--shadow-sm)}.premium-section-heading{display:flex;justify-content:space-between;gap:16px;align-items:start;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid #EDF2F7}.premium-section-heading h2{margin:3px 0 0;font-size:21px}.premium-section-heading>a{font-size:11px;font-weight:700}.premium-compose-card form{display:grid;gap:12px}.premium-compose-card form>p{display:grid;gap:6px;margin:0}.premium-compose-card label{font-size:11px;font-weight:700;color:#14243A}.premium-compose-card input,.premium-compose-card select,.premium-compose-card textarea{width:100%}.premium-form-note{margin:-4px 0 16px;padding:11px 13px;color:#14243A;background:#EDF2F7;border-radius:7px;font-size:11px}.premium-form-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:4px}.premium-form-actions span{color:#BA3C38;font-size:10px}.premium-library-list{display:grid;gap:8px}.premium-content-row,.premium-auto-records article{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:8px}.premium-content-row>div:first-child,.premium-auto-records article>div{display:grid;gap:5px;min-width:0}.premium-content-row strong,.premium-auto-records strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.premium-content-actions{display:flex;align-items:center;gap:7px}.premium-content-actions form{margin:0}.premium-content-actions a,.premium-content-actions button{padding:6px 9px;color:#14243A;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:6px;font-size:10px;font-weight:700}.premium-content-actions button{color:#BA3C38}.premium-review-status{width:max-content;padding:3px 7px;border-radius:999px;background:var(--na-coral);font-size:8px;font-weight:800;text-transform:uppercase;color:var(--na-white)!important;}.premium-review-status.status-approved{background:#EDF2F7;color:#14243A}.premium-review-status.status-rejected,.premium-review-status.status-suspended{background:#EDF2F7;color:#BA3C38}.premium-auto-records{display:grid;gap:8px;margin-bottom:16px}.premium-auto-records h3{margin:0 0 3px;font-size:13px}.premium-auto-records span{color:var(--muted);font-size:10px}.premium-auto-records em{color:#14243A;font-size:9px;font-style:normal;font-weight:750}.premium-empty{padding:24px;text-align:center;color:var(--muted);background:#FFFFFF;border:1px dashed #EDF2F7;border-radius:8px}.premium-cover-upload small{font-weight:400;color:var(--muted)}.premium-editor-toolbar{flex-wrap:wrap}.premium-editor-toolbar button{display:flex;align-items:center;gap:6px;width:auto;padding:0 10px}.premium-editor-toolbar button span{font-size:10px}.premium-rich-editor:empty:before{content:attr(data-placeholder);color:#627083}.premium-compose-card .errorlist{margin:0;color:#BA3C38;font-size:10px}
.premium-public-hero{padding:0}.premium-public-hero-inner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:22px;width:100%;max-width:1180px;margin:auto;padding:42px 22px}.premium-public-portrait{width:118px;height:118px;overflow:hidden;border:4px solid rgba(255,255,255,.45);border-radius:50%;background:#EDF2F7;box-shadow:0 10px 28px rgba(20,36,58,.2)}.premium-public-portrait img{width:100%;height:100%;object-fit:cover}.premium-public-portrait span{display:grid;width:100%;height:100%;place-items:center;color:#14243A;font-size:28px;font-weight:800}.premium-public-identity{display:block}.premium-public-headline{font-size:15px}.premium-public-main,.premium-public-aside{display:grid;gap:18px;align-content:start}.premium-public-gallery{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));}.premium-public-gallery img{aspect-ratio:4/3}.premium-timeline{display:grid;gap:0}.premium-timeline article{display:grid;grid-template-columns:14px 1fr;gap:12px;padding-bottom:18px}.premium-timeline article:last-child{padding-bottom:0}.premium-timeline i{position:relative;width:10px;height:10px;margin-top:5px;border-radius:50%;background:#BA3C38}.premium-timeline i:after{content:"";position:absolute;top:12px;bottom:-20px;left:4px;width:2px;background:#EDF2F7}.premium-timeline article:last-child i:after{display:none}.premium-timeline article div{display:grid;gap:3px}.premium-timeline h3{margin:0}.premium-timeline strong{color:#14243A;font-size:11px}.premium-timeline span{color:var(--muted);font-size:10px}.premium-cne-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.premium-cne-grid article{padding:16px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:9px}.premium-cne-grid article>span{color:#BA3C38;font-size:8px;font-weight:800;text-transform:uppercase}.premium-cne-grid h3{margin:6px 0}.premium-cne-grid p{margin:0 0 5px;color:#14243A;font-size:11px}.premium-cne-grid small{color:var(--muted)}.premium-source-badge{color:#14243A!important}.premium-publication-list{display:grid;gap:10px}.premium-publication-list article{display:flex;justify-content:space-between;gap:18px;padding:14px 0;border-top:1px solid #EDF2F7}.premium-publication-list article:first-child{border-top:0}.premium-publication-list h3{margin:0 0 4px}.premium-publication-list p{margin:0;color:#14243A;font-size:11px}.premium-publication-list small{display:block;margin-top:5px;color:var(--muted)}.premium-publication-list>a{align-self:center;white-space:nowrap;font-size:10px;font-weight:750}.premium-read-more{font-size:10px;font-weight:750}.premium-video-list{display:grid;gap:10px}.premium-video-list>a{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:10px;padding:12px;color:#14243A;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:9px}.premium-video-play{display:grid;width:38px;height:38px;place-items:center;color:#FFFFFF;background:#14243A;border-radius:50%;font-size:12px}.premium-video-list>a>span:last-child{display:grid;gap:4px;min-width:0}.premium-video-list strong{line-height:1.3;overflow-wrap:anywhere}.premium-video-list small{color:var(--muted);line-height:1.45;overflow-wrap:anywhere}.premium-public-aside .premium-link-list{display:grid;padding:0;border:0;box-shadow:none}.premium-public-aside .premium-link-list a{display:flex;justify-content:space-between;background:#FFFFFF}.premium-owner-note{background:#EDF2F7}.premium-owner-note p{color:var(--muted);font-size:10px}.premium-owner-note a{font-size:10px;font-weight:750}
.photo-action-buttons{display:flex;gap:8px;flex-wrap:wrap}.photo-editor-status{display:block;max-width:360px;color:#14243A;font-size:10px;line-height:1.45}.photo-cropper:not([hidden]){display:grid}.photo-cropper canvas{touch-action:none}
@media (max-width:900px){.premium-overview-grid{grid-template-columns:repeat(3,1fr)}.premium-manage-layout{grid-template-columns:1fr}.premium-public-layout{grid-template-columns:1fr}.premium-public-aside{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px) { .premium-studio-hero-actions{width:100%}.premium-studio-hero-actions .button{flex:1}.premium-overview-grid{grid-template-columns:repeat(2,1fr)}.premium-compose-card,.premium-library-card{padding:17px}.premium-content-row{align-items:flex-start;flex-direction:column}.premium-content-actions{width:100%}.premium-content-actions a,.premium-content-actions form,.premium-content-actions button{flex:1}.premium-content-actions button{width:100%}.premium-editor-toolbar button span{display:none}.premium-public-hero-inner{grid-template-columns:78px 1fr;padding:28px 18px}.premium-public-portrait{width:78px;height:78px}.premium-public-actions{grid-column:1/-1}.premium-public-hero h1 { font-size:27px; }.premium-public-layout { grid-template-columns:1fr; padding:0 12px; }.premium-public-gallery { grid-template-columns:repeat(2,1fr); margin-inline:12px; }.premium-public-page .premium-post-grid,.premium-cne-grid,.premium-public-aside { grid-template-columns:1fr; }.premium-profile-callout{align-items:flex-start;flex-direction:column;margin:16px 12px 40px;} }

.result-metrics > div {
  display: grid;
  grid-template-columns: 10px 1fr auto;
  align-items: center;
  gap: 8px;
  min-height: 68px;
  padding: 13px 18px;
}

.result-metrics > div + div {
  border-left: 1px solid #EDF2F7;
}

.result-metrics span,
.result-metrics img {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.result-metrics .correct { background: #293A50; }
.result-metrics .wrong { background: #BA3C38; }
.result-metrics .skipped { background: #293A50; }
.result-metrics img { border-radius: 0; }
.result-metrics small { color: #293A50; font-size: 9px; }
.result-metrics strong { color: #14243A; font-size: 17px; }

.subject-result-list {
  overflow: hidden;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
}

.subject-result-list > div {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(180px, 2fr) 55px;
  align-items: center;
  gap: 18px;
  min-height: 61px;
  padding: 10px 16px;
}

.subject-result-list > div + div {
  border-top: 1px solid #EDF2F7;
}

.subject-result-list span {
  display: grid;
}

.subject-result-list strong,
.subject-result-list b {
  color: #14243A;
  font-size: 11px;
}

.subject-result-list small {
  color: #293A50;
  font-size: 8px;
}

.subject-result-list div > div {
  height: 6px;
  overflow: hidden;
  border-radius: 3px;
  background: #EDF2F7;
}

.subject-result-list i {
  display: block;
  height: 100%;
  background: #293A50;
}

.subject-result-list b {
  text-align: right;
}

.review-access-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  margin-top: 16px;
  padding: 17px 20px;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
}

.review-access-panel > div {
  display: flex;
  align-items: center;
  gap: 13px;
}

.review-access-panel > div > img {
  width: 26px;
}

.review-access-panel h2 {
  margin: 0 0 2px;
  font-size: 14px;
}

.review-access-panel p {
  margin: 0;
  color: #293A50;
  font-size: 10px;
}

.mock-review-page {
  background: #FFFFFF;
}

.answer-review {
  position: relative;
}

.review-watermark {
  position: fixed;
  z-index: 0;
  inset: 45% auto auto 50%;
  width: 680px;
  transform: translate(-50%, -50%) rotate(-27deg);
  color: rgba(20,36,58, .055);
  font-size: 22px;
  font-weight: 700;
  text-align: center;
  pointer-events: none;
}

.review-header,
.review-question-card,
.review-progress,
.review-footer {
  position: relative;
  z-index: 1;
}

.review-progress {
  display: grid;
  grid-template-columns: auto minmax(180px, 1fr);
  align-items: center;
  gap: 16px;
  margin-bottom: 12px;
  color: #14243A;
  font-size: 10px;
  font-weight: 700;
}

.review-question-card {
  padding: 24px;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: rgba(255,255,255, .96);
}

.review-question-card h2 {
  margin: 13px 0 18px;
  color: #14243A;
  font-family: "Inter", sans-serif;
  font-size: 17px;
  line-height: 1.5;
  letter-spacing: 0;
}

.review-question-image {
  display: block;
  max-width: 100%;
  max-height: 340px;
  margin-bottom: 18px;
  object-fit: contain;
}

.review-options {
  display: grid;
  gap: 8px;
}

.review-option {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 8px 11px;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  color: #14243A;
  font-size: 12px;
}

.review-option.correct {
  border-color: #627083;
  background: #EDF2F7;
}

.review-option.incorrect {
  border-color: #FFE4DF;
  background: #EDF2F7;
}

.review-option > strong {
  color: #14243A;
  font-size: 9px;
}

.review-option.incorrect > strong {
  color: #BA3C38;
}

.answer-explanation {
  margin-top: 16px;
  padding: 14px 16px;
  border-left: 3px solid #14243A;
  background: #FFFFFF;
}

.answer-explanation > span {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #14243A;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.answer-explanation img {
  width: 15px;
}

.answer-explanation p {
  margin: 8px 0 5px;
  color: #14243A;
  font-size: 12px;
  line-height: 1.55;
}

.answer-explanation small {
  color: #293A50;
  font-size: 9px;
}

.review-footer {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-top: 13px;
}

.review-footer nav {
  display: flex;
  gap: 8px;
}

.report-question {
  width: min(360px, 100%);
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  background: #FFFFFF;
}

.report-question summary {
  padding: 10px 12px;
  color: #BA3C38;
  font-size: 10px;
  font-weight: 700;
  cursor: pointer;
}

.report-question form {
  padding: 0 12px 12px;
}

.report-question form p {
  display: grid;
  gap: 4px;
  margin: 8px 0;
  color: #14243A;
  font-size: 9px;
}

.report-question select,
.report-question textarea {
  width: 100%;
  padding: 7px 8px;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  font: 11px "Inter", sans-serif;
}

.reported-label {
  color: #14243A;
  font-size: 10px;
  font-weight: 700;
}

/* Mock checkout */
.mock-checkout-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 28px;
  margin-top: 25px;
}

.mock-checkout-layout > div,
.mock-checkout-layout > aside {
  padding: 25px;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
}

.mock-checkout-layout > div > p {
  color: #293A50;
  font-size: 12px;
}

.checkout-pack-details {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: 22px 0;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
}

.checkout-pack-details span {
  display: grid;
  gap: 3px;
  padding: 13px;
  color: #293A50;
  font-size: 9px;
}

.checkout-pack-details span + span {
  border-left: 1px solid #EDF2F7;
}

.checkout-pack-details strong {
  color: #14243A;
  font-size: 18px;
}

.mock-checkout-layout h2 {
  color: #14243A;
  font-size: 14px;
}

.checkout-subjects {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 7px;
}

.checkout-subjects span {
  display: flex;
  justify-content: space-between;
  padding: 8px 10px;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  color: #14243A;
  font-size: 10px;
}

.mock-checkout-layout > aside {
  align-self: start;
  border-color: #FF6B61;
  border-top: 4px solid #BA3C38;
}

.mock-checkout-layout > aside > span,
.mock-checkout-layout > aside > strong,
.mock-checkout-layout > aside > small {
  display: block;
}

.mock-checkout-layout > aside > span {
  color: #293A50;
  font-size: 10px;
  text-transform: uppercase;
}

.mock-checkout-layout > aside > strong {
  margin: 6px 0;
  color: #14243A;
  font-size: 30px;
}

.mock-checkout-layout > aside > small,
.mock-checkout-layout > aside > p {
  color: #293A50;
  font-size: 9px;
  line-height: 1.5;
}

.mock-checkout-layout > aside form {
  margin: 18px 0 10px;
}

.mock-checkout-layout > aside button {
  width: 100%;
}

.custom-mix-instruction {
  margin: -4px 0 12px;
  color: #293A50;
  font-size: 9px;
}

.custom-subject-builder {
  overflow: hidden;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
}

.custom-subject-builder label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 70px 56px;
  align-items: center;
  gap: 8px;
  min-height: 46px;
  padding: 7px 10px;
  color: #14243A;
  font-size: 11px;
}

.custom-subject-builder label + label {
  border-top: 1px solid #EDF2F7;
}

.custom-subject-builder input {
  width: 70px;
  min-height: 32px;
  padding: 5px 7px;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  color: #14243A;
  font: 600 12px "Inter", sans-serif;
  text-align: center;
}

.custom-subject-builder label small {
  color: #293A50;
  font-size: 8px;
}

.custom-mix-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 12px;
  border-top: 1px solid #EDF2F7;
  background: #FFFFFF;
  color: #14243A;
  font-size: 10px;
}

.custom-mix-total strong {
  color: #14243A;
}

.custom-subject-builder.complete .custom-mix-total {
  background: #EDF2F7;
  color: #14243A;
}

.custom-subject-builder.over .custom-mix-total {
  background: #EDF2F7;
  color: #BA3C38;
}

@media (max-width: 900px) {
  .premium-pack-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mock-runner-header { grid-template-columns: 1fr auto; gap: 10px; padding: 8px 16px; }
  .runner-progress { grid-column: 1 / -1; grid-row: 2; }
  .mock-runner-layout { grid-template-columns: 1fr; }
  .question-navigator { display: none; }
  .mobile-question-navigator { display: block; width: min(100% - 32px, 760px); margin: -24px auto 80px; border: 1px solid #EDF2F7; border-radius: 5px; background: #FFFFFF; }
  .mobile-question-navigator summary { display: flex; justify-content: space-between; padding: 11px 13px; color: #14243A; font-size: 10px; font-weight: 700; }
  .mobile-question-navigator .navigator-grid { grid-template-columns: repeat(8, 1fr); padding: 0 13px 13px; }
  .score-hero { grid-template-columns: 135px 1fr; }
  .score-actions { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; }
  .mock-checkout-layout { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .mock-hub, .mock-result, .mock-checkout, .answer-review { padding-top: 18px; padding-bottom: 36px; }
  .mock-hub-header, .result-heading, .review-header { align-items: flex-start; margin-bottom: 16px; }
  .mock-hub-header h1, .result-heading h1, .review-header h1, .mock-checkout h1 { font-size: 23px; }
  .mock-hub-header > p, .mock-history-link { font-size: 10px; }
  .daily-mock-panel { grid-template-columns: 1fr; gap: 20px; min-height: 0; padding: 20px; }
  .daily-mock-action { min-width: 0; align-items: stretch; }
  .daily-mock-copy h2, .mock-section-heading h2 { font-size: 17px; }
  .premium-test-centre, .mock-attempt-history, .subject-performance { margin-top: 26px; }
  .mock-section-heading { align-items: flex-start; }
  .mock-section-heading > p { display: none; }
  .premium-pack-grid { grid-template-columns: 1fr; }
  .premium-pack-card > p { min-height: 0; }
  .attempt-history-list > a { grid-template-columns: 44px minmax(0, 1fr) 52px 13px; gap: 9px; padding: 9px 11px; }
  .history-score small { display: none; }
  .mock-runner-page .site-header { display: none; }
  .mock-runner { min-height: 100vh; }
  .mock-runner-header { top: 0; min-height: 74px; padding: 7px 12px; }
  .runner-title > a { width: 28px; height: 28px; }
  .runner-title strong { max-width: 160px; font-size: 10px; }
  .runner-timer { min-width: 100px; padding: 5px 8px; }
  .runner-timer strong { font-size: 13px; }
  .mock-runner-layout { width: calc(100% - 20px); margin: 14px auto 32px; }
  .question-card { padding: 16px 13px; }
  .question-card h1 { margin-bottom: 15px; font-size: 15px; line-height: 1.5; }
  .answer-options { gap: 7px; }
  .answer-option { grid-template-columns: 29px minmax(0, 1fr) 17px; gap: 8px; min-height: 48px; padding: 7px 9px; }
  .option-letter { width: 27px; height: 27px; }
  .option-content { font-size: 12px; }
  .runner-controls { position: fixed; z-index: 18; right: 0; bottom: 0; left: 0; margin: 0; padding: 9px 11px max(9px, env(safe-area-inset-bottom)); border-top: 1px solid #EDF2F7; background: rgba(255,255,255,.98); }
  .runner-controls .runner-button { flex: 1; min-height: 42px; }
  .mobile-question-navigator { width: calc(100% - 20px); margin: -18px auto 84px; }
  .mobile-question-navigator .navigator-grid { grid-template-columns: repeat(6, 1fr); }
  .mock-dialog form { padding: 25px 18px 19px; }
  .mock-dialog form > div { width: 100%; }
  .mock-dialog form > div .button { flex: 1; padding: 8px; }
  .score-hero { grid-template-columns: 104px 1fr; gap: 16px; padding: 18px 15px; }
  .score-ring { width: 100px; height: 100px; border-width: 8px; }
  .score-ring strong { font-size: 22px; }
  .score-summary h2 { font-size: 24px; }
  .result-metrics { grid-template-columns: 1fr 1fr; }
  .result-metrics > div + div { border-left: 0; }
  .result-metrics > div:nth-child(even) { border-left: 1px solid #EDF2F7; }
  .result-metrics > div:nth-child(n+3) { border-top: 1px solid #EDF2F7; }
  .result-metrics > div { min-height: 58px; padding: 10px 13px; }
  .subject-result-list > div { grid-template-columns: minmax(125px, 1fr) 80px 42px; gap: 10px; padding: 9px 11px; }
  .review-access-panel { align-items: stretch; flex-direction: column; }
  .review-access-panel > a { width: 100%; }
  .review-question-card { padding: 16px 13px; }
  .review-question-card h2 { font-size: 15px; }
  .review-option { grid-template-columns: 27px minmax(0, 1fr); font-size: 11px; }
  .review-option > strong { grid-column: 2; }
  .review-footer { align-items: stretch; flex-direction: column; }
  .review-footer nav .runner-button { flex: 1; }
  .checkout-pack-details { grid-template-columns: 1fr 1fr; }
  .checkout-pack-details span:nth-child(3) { border-left: 0; border-top: 1px solid #EDF2F7; }
  .checkout-pack-details span:nth-child(4) { border-top: 1px solid #EDF2F7; }
  .checkout-subjects { grid-template-columns: 1fr; }
  .mock-checkout-layout > div, .mock-checkout-layout > aside { padding: 18px; }
}

/* Mock marking choices */
.negative-marking-selector {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 4px;
  margin: 0;
  padding: 0;
  border: 0;
}

.negative-marking-selector legend {
  grid-column: 1 / -1;
  margin-bottom: 2px;
  color: #14243A;
  font-size: 9px;
  font-weight: 700;
}

.negative-marking-selector label {
  cursor: pointer;
}

.negative-marking-selector input {
  position: absolute;
  opacity: 0;
}

.negative-marking-selector label span {
  display: grid;
  min-height: 30px;
  place-items: center;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  background: #FFFFFF;
  color: #14243A;
  font-size: 9px;
  font-weight: 700;
}

.negative-marking-selector input:checked + span {
  border-color: #BA3C38;
  background: var(--na-coral);

  box-shadow: inset 0 0 0 1px #BA3C38;
;color:var(--na-white)!important;}

.timer-selector{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;margin:0;padding:0;border:0}.timer-selector legend{grid-column:1/-1;margin:0 0 2px;color:#14243A;font-size:9px;font-weight:700}.timer-selector label{cursor:pointer}.timer-selector input{position:absolute;opacity:0}.timer-selector label span{display:grid;min-height:30px;place-items:center;padding:0 4px;border:1px solid #EDF2F7;border-radius:4px;background:#FFFFFF;color:#14243A;font-size:9px;font-weight:700;white-space:nowrap}.timer-selector input:checked+span{border-color:#14243A;background:#EDF2F7;color:#14243A;box-shadow:inset 0 0 0 1px #14243A}@media(max-width:600px){.timer-selector{grid-template-columns:repeat(5,minmax(0,1fr))}.timer-selector label span{font-size:8px;padding:0 2px}}

.question-rich-content > :first-child,
.review-rich-question > :first-child,
.review-rich-explanation > :first-child {
  margin-top: 0;
}

.question-rich-content > :last-child,
.review-rich-question > :last-child,
.review-rich-explanation > :last-child {
  margin-bottom: 0;
}

.question-rich-content {
  margin: 0 0 20px;
  color: #14243A;
  font-size: 17px;
  line-height: 1.55;
}

.question-rich-content p,
.question-rich-content ul,
.question-rich-content ol {
  margin: 0 0 10px;
}

.review-rich-question {
  margin-bottom: 16px;
  color: #14243A;
  font-size: 15px;
  line-height: 1.55;
}

.review-rich-explanation {
  color: #14243A;
  font-size: 11px;
  line-height: 1.65;
}

/* Staff operations workspace */
.operations-surface {
  min-height: 100vh;
  background: #EDF2F7;
  color: #14243A;
}

.operations-layout {
  display: grid;
  min-height: 100vh;
  grid-template-columns: 232px minmax(0, 1fr);
}

.operations-sidebar {
  position: sticky;
  z-index: 30;
  top: 0;
  display: flex;
  height: 100vh;
  flex-direction: column;
  padding: 20px 14px;
  background: #14243A;
  color: #FFFFFF;
}

.operations-brand {
  display: grid;
  min-height: 58px;
  align-items: center;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 9px;
  padding: 0 8px 16px;
  border-bottom: 1px solid rgba(255,255,255, .12);
  color: #FFFFFF;
  text-decoration: none;
}

.operations-brand > span {
  display: grid;
  width: 34px;
  height: 34px;
  grid-row: 1 / 3;
  place-items: center;
  border-radius: 5px;
  background: #293A50;
  font-family: "Poppins", sans-serif;
  font-size: 18px;
  font-weight: 800;
}

.operations-brand > img {
  width: 108px;
  max-height: 38px;
  grid-row: 1 / 3;
  object-fit: contain;
  object-position: left center;
  filter: brightness(0) invert(1);
}

.operations-brand strong {
  align-self: end;
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  letter-spacing: 0;
}

.operations-brand small {
  align-self: start;
  color: #EDF2F7;
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
}

.operations-sidebar nav {
  display: grid;
  gap: 4px;
  margin-top: 20px;
}

.operations-sidebar nav a,
.operations-sidebar-footer a {
  display: flex;
  min-height: 40px;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 5px;
  color: #EDF2F7;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
}

.operations-sidebar nav a:hover,
.operations-sidebar nav a.active {
  background: rgba(255,255,255, .1);
  color: #FFFFFF;
}

.operations-sidebar nav a.active {
  box-shadow: inset 3px 0 #627083;
}

.operations-sidebar nav img,
.operations-sidebar-footer img {
  width: 17px;
  filter: brightness(0) invert(1);
  opacity: .82;
}

.operations-sidebar-footer {
  display: grid;
  gap: 3px;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255, .12);
}

.operations-main {
  min-width: 0;
}

.operations-topbar {
  display: flex;
  min-height: 62px;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
  padding: 8px 28px;
  border-bottom: 1px solid #EDF2F7;
  background: #FFFFFF;
}

.operations-topbar > div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.operations-topbar > div > span:last-child {
  display: grid;
  gap: 1px;
}

.operations-topbar strong {
  color: #14243A;
  font-size: 10px;
}

.operations-topbar small {
  color: #627083;
  font-size: 8px;
}

.operations-avatar {
  display: grid;
  width: 31px;
  height: 31px;
  place-items: center;
  border-radius: 50%;
  background: #EDF2F7;
  color: #14243A;
  font-size: 11px;
  font-weight: 800;
}

.operations-topbar form button {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border: 0;
  background: transparent;
  color: #293A50;
  font-family: inherit;
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
}

.operations-topbar form img {
  width: 14px;
}

.operations-menu-button {
  display: none;
}

.operations-content {
  width: min(1240px, calc(100% - 48px));
  margin: 0 auto;
  padding: 32px 0 56px;
}

.operations-messages {
  width: min(1240px, calc(100% - 48px));
  margin: 16px auto -12px;
}

.operations-messages > div,
.operations-form-errors {
  padding: 10px 13px;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  background: #EDF2F7;
  color: #14243A;
  font-size: 10px;
}

.operations-form-errors,
.operations-messages .error {
  border-color: #FFE4DF;
  background: #EDF2F7;
  color: #BA3C38;
}

.operations-page-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
}

.operations-page-header > div > span,
.operations-panel > header > div > span {
  color: #293A50;
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.operations-page-header h1 {
  margin: 4px 0;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 27px;
  line-height: 1.2;
  letter-spacing: 0;
}

.operations-page-header p {
  margin: 0;
  color: #627083;
  font-size: 11px;
}

.operations-primary {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  gap: 7px;
  padding: 8px 13px;
  border-radius: 5px;
  background: #293A50;
  color: #FFFFFF;
  font-size: 10px;
  font-weight: 800;
  text-decoration: none;
}

.operations-primary img {
  width: 15px;
  filter: brightness(0) invert(1);
}

.operations-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-bottom: 22px;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
}

.operations-metrics article {
  display: grid;
  min-height: 116px;
  align-content: center;
  padding: 18px 20px;
}

.operations-metrics article + article {
  border-left: 1px solid #EDF2F7;
}

.operations-metrics span {
  color: #293A50;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
}

.operations-metrics strong {
  margin: 4px 0 2px;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 25px;
  letter-spacing: 0;
}

.operations-metrics small {
  color: #627083;
  font-size: 8px;
}

.operations-panel {
  overflow: hidden;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
}

.operations-panel > header {
  display: flex;
  min-height: 64px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 18px;
  border-bottom: 1px solid #EDF2F7;
}

.operations-panel h2 {
  margin: 2px 0 0;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 15px;
  letter-spacing: 0;
}

.operations-panel > header > a {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #14243A;
  font-size: 9px;
  font-weight: 800;
  text-decoration: none;
}

.operations-panel > header > a img {
  width: 13px;
}

.operations-table-wrap {
  overflow-x: auto;
}

.operations-table {
  width: 100%;
  border-collapse: collapse;
  white-space: nowrap;
}

.operations-table th {
  padding: 9px 14px;
  background: #FFFFFF;
  color: #627083;
  font-size: 8px;
  font-weight: 800;
  text-align: left;
  text-transform: uppercase;
}

.operations-table td {
  padding: 12px 14px;
  border-top: 1px solid #EDF2F7;
  color: #14243A;
  font-size: 9px;
  vertical-align: middle;
}

.operations-table td > a:first-child,
.operations-table td > small {
  display: grid;
  gap: 2px;
}

.operations-table td > a:first-child {
  max-width: 470px;
  color: #14243A;
  text-decoration: none;
  white-space: normal;
}

.operations-table td strong {
  color: #14243A;
  font-size: 9px;
}

.operations-table td span,
.operations-table td small {
  color: #627083;
  font-size: 8px;
}

.operations-status,
.operations-difficulty {
  display: inline-flex;
  padding: 4px 7px;
  border-radius: 3px;
  background: #EDF2F7;
  color: #14243A !important;
  font-size: 8px !important;
  font-weight: 800;
  text-transform: uppercase;
}

.operations-status.approved,
.operations-difficulty.easy { background: #EDF2F7; color: #14243A !important; }
.operations-status.review,
.operations-difficulty.moderate { background: var(--na-coral);  ;color:var(--na-white)!important;}
.operations-status.suspended,
.operations-difficulty.very_hard { background: #EDF2F7; color: #BA3C38 !important; }
.operations-difficulty.hard { background: var(--na-coral);  ;color:var(--na-white)!important;}

.operations-icon-link {
  display: grid;
  width: 29px;
  height: 29px;
  place-items: center;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
}

.operations-icon-link img {
  width: 13px;
}

.operations-empty {
  height: 100px;
  color: #627083 !important;
  text-align: center;
}

.operations-filters {
  display: grid;
  align-items: end;
  grid-template-columns: minmax(240px, 1.4fr) repeat(3, minmax(130px, .7fr)) auto;
  gap: 9px;
  margin-bottom: 14px;
  padding: 13px;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
}

.operations-filters label,
.author-fields label,
.author-image-row label,
.author-rich-field > label {
  display: grid;
  gap: 5px;
  color: #14243A;
  font-size: 9px;
  font-weight: 700;
}

.operations-filters label > div {
  position: relative;
}

.operations-filters label > div img {
  position: absolute;
  top: 50%;
  left: 10px;
  width: 14px;
  transform: translateY(-50%);
}

.operations-filters input,
.operations-filters select,
.author-fields input,
.author-fields select,
.author-image-row input[type="text"],
.author-option textarea,
.author-option input[type="text"] {
  width: 100%;
  min-height: 36px;
  padding: 7px 9px;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  background: #FFFFFF;
  color: #14243A;
  font-family: inherit;
  font-size: 10px;
}

.operations-filters label > div input {
  padding-left: 31px;
}

.operations-filters button {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border: 0;
  border-radius: 4px;
  background: #14243A;
  color: #FFFFFF;
  font-family: inherit;
  font-size: 9px;
  font-weight: 800;
}

.operations-filters button img {
  width: 13px;
  filter: brightness(0) invert(1);
}

.operations-pagination {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  padding: 8px 15px;
  border-top: 1px solid #EDF2F7;
  color: #627083;
  font-size: 9px;
}

.operations-pagination div {
  display: flex;
  gap: 6px;
}

.operations-pagination a {
  padding: 5px 8px;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  color: #14243A;
  text-decoration: none;
}

.question-author-header > div > a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #14243A;
  font-size: 9px;
  font-weight: 700;
  text-decoration: none;
}

.question-author-header > div > a img {
  width: 12px;
  transform: rotate(180deg);
}

.question-author-form {
  display: grid;
  gap: 14px;
}

.author-section {
  overflow: hidden;
  border: 1px solid #EDF2F7;
  border-radius: 7px;
  background: #FFFFFF;
}

.author-section > header {
  display: grid;
  align-items: center;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 10px;
  min-height: 63px;
  padding: 10px 18px;
  border-bottom: 1px solid #EDF2F7;
  background: #FFFFFF;
}

.author-section > header > span {
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border-radius: 50%;
  background: #EDF2F7;
  color: #14243A;
  font-size: 9px;
  font-weight: 900;
}

.author-section h2 {
  margin: 0;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 13px;
  letter-spacing: 0;
}

.author-section header p {
  margin: 1px 0 0;
  color: #627083;
  font-size: 8px;
}

.author-fields,
.author-image-row,
.author-rich-field,
.author-options {
  padding: 17px 18px;
}

.author-fields.three-columns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.author-fields.two-columns,
.author-image-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding-top: 0;
}

.author-image-row label > span,
.author-fields label > span {
  display: flex;
  justify-content: space-between;
}

.author-image-row label small {
  color: #627083;
  font-size: 7px;
  font-weight: 600;
}

.author-image-row input[type="file"],
.option-image input[type="file"] {
  width: 100%;
  padding: 8px;
  border: 1px dashed #EDF2F7;
  border-radius: 4px;
  background: #FFFFFF;
  color: #293A50;
  font-size: 8px;
}

.author-image-row img,
.option-image img,
.local-image-preview {
  display: block;
  max-width: 220px;
  max-height: 130px;
  padding: 4px;
  border: 1px solid #EDF2F7;
  background: #FFFFFF;
  object-fit: contain;
}

.question-editor {
  overflow: hidden;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  background: #FFFFFF;
}

.question-editor:focus-within {
  border-color: #293A50;
  box-shadow: 0 0 0 2px rgba(20,36,58, .1);
}

.question-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 6px;
  border-bottom: 1px solid #EDF2F7;
  background: #FFFFFF;
}

.question-editor-toolbar button {
  min-width: 29px;
  min-height: 28px;
  padding: 4px 7px;
  border: 1px solid #EDF2F7;
  border-radius: 3px;
  background: #FFFFFF;
  color: #14243A;
  font-family: inherit;
  font-size: 9px;
  cursor: pointer;
}

.question-editor-content {
  min-height: 130px;
  padding: 14px;
  color: #14243A;
  font-size: 12px;
  line-height: 1.6;
  outline: none;
}

.question-editor-content p {
  margin: 0 0 8px;
}

.author-options {
  display: grid;
  gap: 9px;
}

.author-option {
  display: grid;
  align-items: start;
  grid-template-columns: 29px minmax(220px, 1.5fr) minmax(150px, .75fr) minmax(150px, .75fr) 110px 82px;
  gap: 9px;
  padding: 11px;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  background: #FFFFFF;
}

.author-option-letter {
  display: grid;
  width: 27px;
  height: 27px;
  margin-top: 17px;
  place-items: center;
  border-radius: 50%;
  background: #EDF2F7;
  color: #14243A;
  font-size: 9px;
  font-weight: 800;
}

.author-option label {
  display: grid;
  gap: 4px;
  color: #293A50;
  font-size: 8px;
  font-weight: 700;
}

.author-option textarea {
  min-height: 58px;
  resize: vertical;
}

.option-correct,
.option-delete {
  margin-top: 17px;
  cursor: pointer;
}

.option-correct input,
.option-delete input {
  position: absolute;
  opacity: 0;
}

.option-correct > span,
.option-delete > span {
  display: flex;
  min-height: 29px;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 5px;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  background: #FFFFFF;
  color: #14243A;
  text-align: center;
}

.option-correct img,
.option-delete img {
  width: 13px;
}

.option-correct input:checked + span {
  border-color: #293A50;
  background: #EDF2F7;
  color: #14243A;
}

.option-delete input:checked + span {
  border-color: #FF6B61;
  background: #EDF2F7;
  color: #BA3C38;
}

.field-error,
.option-wide {
  display: block;
  color: #BA3C38 !important;
  font-size: 8px !important;
}

.option-wide {
  grid-column: 2 / -1;
}

.duplicate-check {
  display: flex !important;
  align-items: flex-start;
  gap: 8px !important;
  padding: 10px;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  background: #FFFFFF;
}

.duplicate-check input {
  width: 15px !important;
  min-height: 15px !important;
  margin-top: 2px;
}

.duplicate-check > span {
  display: grid !important;
  justify-content: start !important;
  color: #627083;
  font-size: 8px;
  font-weight: 500;
}

.duplicate-check strong {
  color: #14243A;
  font-size: 9px;
}

.author-actions {
  position: sticky;
  z-index: 12;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 14px;
  border: 1px solid #EDF2F7;
  border-radius: 6px;
  background: rgba(255,255,255, .97);
  box-shadow: 0 -8px 25px rgba(20,36,58, .08);
}

.author-actions > a {
  color: #14243A;
  font-size: 9px;
  font-weight: 700;
  text-decoration: none;
}

.author-actions > div {
  display: flex;
  gap: 7px;
}

.author-actions button {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 6px;
  padding: 7px 11px;
  border: 1px solid #EDF2F7;
  border-radius: 4px;
  background: #FFFFFF;
  color: #14243A;
  font-family: inherit;
  font-size: 9px;
  font-weight: 800;
  cursor: pointer;
}

.author-actions button.review {
  border-color: #14243A;
  background: #14243A;
  color: #FFFFFF;
}

.author-actions button.approve {
  border-color: #293A50;
  background: #293A50;
  color: #FFFFFF;
}

.author-actions button img {
  width: 13px;
  filter: brightness(0) invert(1);
}

@media (max-width: 1100px) {
  .operations-metrics {
    grid-template-columns: 1fr 1fr;
  }

  .operations-metrics article:nth-child(3) {
    border-top: 1px solid #EDF2F7;
    border-left: 0;
  }

  .operations-metrics article:nth-child(4) {
    border-top: 1px solid #EDF2F7;
  }

  .operations-filters {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .operations-filters label:first-child {
    grid-column: 1 / -1;
  }

  .author-option {
    grid-template-columns: 29px minmax(240px, 1fr) 120px 90px;
  }

  .option-image,
  .option-alt {
    grid-column: 2 / 3;
  }

  .option-correct {
    grid-column: 3;
    grid-row: 1;
  }

  .option-delete {
    grid-column: 4;
    grid-row: 1;
  }
}

@media (max-width: 820px) {
  .operations-layout {
    grid-template-columns: 1fr;
  }

  .operations-sidebar {
    position: fixed;
    left: 0;
    width: 232px;
    transform: translateX(-100%);
    transition: transform .2s ease;
  }

  .operations-menu-open .operations-sidebar {
    transform: translateX(0);
    box-shadow: 18px 0 40px rgba(20,36,58, .25);
  }

  .operations-topbar {
    justify-content: flex-end;
    padding: 8px 14px;
  }

  .operations-menu-button {
    display: block;
    width: 34px;
    height: 34px;
    margin-right: auto;
    border: 1px solid #EDF2F7;
    border-radius: 4px;
    background: #FFFFFF;
  }

  .operations-menu-button span,
  .operations-menu-button span::before,
  .operations-menu-button span::after {
    display: block;
    width: 16px;
    height: 2px;
    margin: auto;
    background: #14243A;
    content: "";
  }

  .operations-menu-button span::before { transform: translateY(-5px); }
  .operations-menu-button span::after { transform: translateY(3px); }

  .operations-content,
  .operations-messages {
    width: min(100% - 24px, 1240px);
  }

  .operations-content {
    padding-top: 22px;
  }

  .author-fields.three-columns,
  .author-fields.two-columns,
  .author-image-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .operations-topbar > div > span:last-child,
  .operations-topbar form button {
    font-size: 0;
  }

  .operations-page-header {
    align-items: stretch;
    flex-direction: column;
  }

  .operations-page-header h1 {
    font-size: 22px;
  }

  .operations-primary {
    width: 100%;
    justify-content: center;
  }

  .operations-metrics {
    grid-template-columns: 1fr 1fr;
  }

  .operations-metrics article {
    min-height: 94px;
    padding: 13px;
  }

  .operations-metrics strong {
    font-size: 20px;
  }

  .operations-filters {
    grid-template-columns: 1fr 1fr;
  }

  .operations-filters label:first-child,
  .operations-filters button {
    grid-column: 1 / -1;
  }

  .author-section > header {
    padding: 9px 12px;
  }

  .author-fields,
  .author-image-row,
  .author-rich-field,
  .author-options {
    padding: 13px 11px;
  }

  .author-option {
    grid-template-columns: 27px minmax(0, 1fr);
  }

  .option-text,
  .option-image,
  .option-alt {
    grid-column: 2;
  }

  .option-correct,
  .option-delete {
    grid-row: auto;
    margin-top: 0;
  }

  .option-correct { grid-column: 2; }
  .option-delete { grid-column: 2; }

  .author-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .author-actions > div {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .author-actions button.approve {
    grid-column: 1 / -1;
  }
}

.public-mock-result {
  display: grid;
  min-height: calc(100vh - 150px);
  place-items: center;
  padding-top: 34px;
  padding-bottom: 50px;
}

.public-mock-result > section {
  display: grid;
  width: min(560px, 100%);
  justify-items: center;
  padding: 34px;
  border: 1px solid #FF6B61;
  border-top: 5px solid #BA3C38;
  border-radius: 8px;
  background: #FFFFFF;
  box-shadow: 0 15px 42px rgba(20,36,58, .1);
  text-align: center;
}

.public-mock-result > section > img {
  width: 48px;
  margin: 18px 0 10px;
}

.public-result-brand {
  color: #BA3C38;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.public-mock-result p,
.public-mock-result small,
.public-mock-result em {
  color: #293A50;
  font-size: 10px;
}

.public-mock-result h1 {
  margin: 3px 0;
  color: #14243A;
  font-size: 18px;
}

.public-mock-result h2 {
  margin: 0 0 18px;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 15px;
  letter-spacing: 0;
}

.public-mock-result section > div.public-score-ring {
  position: relative;
  display: grid;
  width: 130px;
  height: 130px;
  margin-bottom: 12px;
  place-content: center;
  background: conic-gradient(from -90deg, #293A50 var(--score, 0%), #EDF2F7 0);
  border-radius: 50%;
}

.public-mock-result .public-score-ring::before {
  position: absolute;
  inset: 9px;
  content: "";
  background: #FFFFFF;
  border-radius: 50%;
}

.public-mock-result .public-score-ring > span {
  position: relative;
  z-index: 1;
  display: grid;
  place-content: center;
}

.public-mock-result .public-score-ring strong,
.public-mock-result .public-score-ring small {
  display: block;
}

.public-mock-result .public-score-ring strong {
  color: #14243A;
  font-size: 28px;
}

.public-mock-result .public-score-ring small {
  color: #293A50;
  font-size: 9px;
}

.public-mock-result .mock-primary-action {
  margin: 20px 0 10px;
}

.public-mock-result em {
  font-style: normal;
}

/* Public mock test experience */
.mock-public-page main {
  overflow: hidden;
  background: #FFFFFF;
}

.mock-public-shell {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
}

.mock-public-hero {
  min-height: 560px;
  padding: 62px 0 66px;
  background: #EDF2F7;
  color: #14243A;
}

.mock-public-hero-grid,
.mock-public-split,
.mock-premium-grid {
  display: grid;
  align-items: center;
  grid-template-columns: minmax(0, .88fr) minmax(520px, 1.12fr);
  gap: clamp(42px, 6vw, 84px);
}

.mock-public-kicker,
.mock-section-label,
.mock-premium-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #14243A;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.mock-public-kicker img,
.mock-premium-label img {
  width: 17px;
  height: 17px;
}

.mock-public-intro h1 {
  max-width: 560px;
  margin: 13px 0 14px;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: clamp(36px, 4.25vw, 56px);
  line-height: 1.08;
  letter-spacing: 0;
}

.mock-public-intro > p {
  max-width: 535px;
  margin: 0;
  color: #14243A;
  font-size: 15px;
  line-height: 1.65;
}

.mock-public-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 25px;
}

.mock-public-primary,
.mock-public-secondary,
.mock-public-cta a,
.mock-premium-section > div > div > a {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 15px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.mock-public-primary {
  background: #293A50;
  color: #FFFFFF;
  box-shadow: 0 8px 22px rgba(20,36,58, .18);
}

.mock-public-primary img,
.mock-public-cta a img,
.mock-premium-section > div > div > a img {
  width: 15px;
  filter: brightness(0) invert(1);
}

.mock-public-secondary {
  border: 1px solid #EDF2F7;
  background: rgba(255,255,255, .65);
  color: #14243A;
}

.mock-public-secondary img {
  width: 16px;
}

.mock-public-nurse-link {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-top: 13px;
  color: #14243A;
  font-size: 10px;
  font-weight: 700;
  text-decoration: none;
}

.mock-public-nurse-link img {
  width: 13px;
}

.mock-demo {
  overflow: hidden;
  border: 1px solid #EDF2F7;
  border-radius: 8px;
  background: #FFFFFF;
  box-shadow: 0 26px 55px rgba(20,36,58, .14);
}

.mock-demo-bar,
.mock-demo-meta,
.mock-demo-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.mock-demo-bar {
  min-height: 48px;
  padding: 0 20px;
  border-bottom: 1px solid #EDF2F7;
  background: #FFFFFF;
  color: #14243A;
  font-size: 11px;
  font-weight: 800;
}

.mock-demo-bar span,
.mock-demo-bar strong {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.mock-demo-bar span i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #293A50;
  box-shadow: 0 0 0 4px #EDF2F7;
}

.mock-demo-bar strong {
  color: #BA3C38;
  font-size: 12px;
}

.mock-demo-bar img {
  width: 15px;
}

.mock-demo-progress {
  height: 4px;
  background: #EDF2F7;
}

.mock-demo-progress span {
  display: block;
  height: 100%;
  background: #293A50;
}

.mock-demo-meta {
  padding: 22px 24px 0;
  color: #627083;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
}

.mock-demo-meta span:last-child {
  color: #14243A;
}

.mock-demo h2 {
  max-width: 500px;
  margin: 12px 24px 17px;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 17px;
  line-height: 1.45;
  letter-spacing: 0;
}

.mock-demo-options {
  display: grid;
  gap: 8px;
  padding: 0 24px;
}

.mock-demo-options span {
  display: grid;
  min-height: 39px;
  align-items: center;
  grid-template-columns: 27px 1fr;
  gap: 9px;
  padding: 6px 10px;
  border: 1px solid #EDF2F7;
  border-radius: 5px;
  color: #14243A;
  font-size: 11px;
}

.mock-demo-options b {
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  border: 1px solid #EDF2F7;
  border-radius: 50%;
  color: #14243A;
  font-size: 10px;
}

.mock-demo-options .is-selected {
  border-color: #293A50;
  background: #EDF2F7;
  color: #14243A;
}

.mock-demo-options .is-selected b {
  border-color: #293A50;
  background: #293A50;
  color: #FFFFFF;
}

.mock-demo-footer {
  min-height: 61px;
  margin-top: 18px;
  padding: 0 24px;
  border-top: 1px solid #EDF2F7;
}

.mock-demo-footer > span {
  display: flex;
  gap: 4px;
}

.mock-demo-footer > span i {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: #EDF2F7;
}

.mock-demo-footer > span i:nth-child(-n+4) {
  background: #293A50;
}

.mock-demo-footer button {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 7px;
  padding: 7px 12px;
  border: 0;
  border-radius: 5px;
  background: #14243A;
  color: #FFFFFF;
  font-family: inherit;
  font-size: 10px;
  font-weight: 800;
  pointer-events: none;
}

.mock-demo-footer button img {
  width: 13px;
  filter: brightness(0) invert(1);
}

.mock-public-facts {
  border-bottom: 1px solid #EDF2F7;
  background: #FFFFFF;
}

.mock-public-facts > div {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.mock-public-facts > div > div {
  display: flex;
  min-height: 78px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-right: 1px solid #EDF2F7;
}

.mock-public-facts > div > div:first-child {
  border-left: 1px solid #EDF2F7;
}

.mock-public-facts strong {
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 17px;
  letter-spacing: 0;
}

.mock-public-facts span {
  color: #627083;
  font-size: 10px;
  font-weight: 700;
}

.mock-public-section {
  padding: 86px 0;
}

.mock-public-section h2,
.mock-premium-section h2,
.mock-public-cta h2 {
  margin: 9px 0 12px;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: clamp(26px, 3vw, 37px);
  line-height: 1.2;
  letter-spacing: 0;
}

.mock-public-section-copy > p,
.mock-public-heading p {
  max-width: 610px;
  margin: 0;
  color: #14243A;
  font-size: 13px;
  line-height: 1.7;
}

.mock-feature-list {
  display: grid;
  gap: 15px;
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
}

.mock-feature-list li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 10px;
  color: #293A50;
  font-size: 11px;
  line-height: 1.5;
}

.mock-feature-list img {
  width: 19px;
  margin-top: 2px;
}

.mock-feature-list strong {
  display: block;
  color: #14243A;
  font-size: 12px;
}

.mock-subject-visual,
.mock-results-visual {
  overflow: hidden;
  border: 1px solid #EDF2F7;
  border-radius: 8px;
  background: #FFFFFF;
  box-shadow: 0 15px 40px rgba(20,36,58, .08);
}

.mock-subject-visual header,
.mock-results-visual header {
  display: flex;
  min-height: 54px;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  border-bottom: 1px solid #EDF2F7;
  color: #14243A;
  font-size: 11px;
  font-weight: 800;
}

.mock-subject-visual header strong {
  color: #293A50;
  font-size: 10px;
}

.mock-subject-row {
  display: grid;
  min-height: 52px;
  align-items: center;
  grid-template-columns: minmax(140px, 1fr) 24px 42%;
  gap: 10px;
  padding: 0 20px;
  border-bottom: 1px solid #EDF2F7;
  color: #14243A;
  font-size: 10px;
}

.mock-subject-row > span {
  display: flex;
  align-items: center;
  gap: 9px;
}

.mock-subject-row span > i {
  width: 9px;
  height: 9px;
  border-radius: 2px;
  background: #293A50;
}

.mock-subject-row span > i.foundations { background: #293A50; }
.mock-subject-row span > i.pharma { background: #293A50; }
.mock-subject-row span > i.community { background: #FF6B61; ;color:var(--na-white)!important;}
.mock-subject-row span > i.aptitude { background: #FF6B61; ;color:var(--na-white)!important;}

.mock-subject-row b {
  color: #14243A;
  font-size: 10px;
}

.mock-subject-row em {
  height: 5px;
  overflow: hidden;
  border-radius: 4px;
  background: #EDF2F7;
}

.mock-subject-row em i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #293A50;
}

.mock-subject-visual footer {
  display: flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: #FFFFFF;
  color: #14243A;
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.mock-subject-visual footer img {
  width: 15px;
}

.mock-exam-section {
  background: #FFFFFF;
}

.mock-public-heading {
  max-width: 650px;
  margin: 0 auto 34px;
  text-align: center;
}

.mock-public-heading p {
  margin: 0 auto;
}

.mock-feature-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid #EDF2F7;
  border-radius: 8px;
  background: #FFFFFF;
}

.mock-feature-grid article {
  min-height: 190px;
  padding: 28px 24px;
}

.mock-feature-grid article + article {
  border-left: 1px solid #EDF2F7;
}

.mock-feature-grid article > img {
  width: 25px;
  height: 25px;
  padding: 5px;
  box-sizing: content-box;
  border-radius: 6px;
  background: #EDF2F7;
}

.mock-feature-grid h3 {
  margin: 17px 0 7px;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  letter-spacing: 0;
}

.mock-feature-grid p {
  margin: 0;
  color: #627083;
  font-size: 10px;
  line-height: 1.65;
}

.mock-premium-section {
  padding: 88px 0;
  background: #14243A;
  color: #FFFFFF;
}

.mock-premium-grid {
  grid-template-columns: minmax(0, 1fr) minmax(430px, .8fr);
}

.mock-premium-section h2 {
  max-width: 590px;
  color: #FFFFFF;
}

.mock-premium-section > div > div > p {
  max-width: 570px;
  color: #EDF2F7;
  font-size: 13px;
  line-height: 1.7;
}

.mock-premium-label {
  color: #FFE4DF;
}

.mock-premium-label img {
  filter: none;
}

.mock-premium-section ul {
  display: grid;
  gap: 10px;
  margin: 22px 0;
  padding: 0;
  list-style: none;
}

.mock-premium-section li {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #EDF2F7;
  font-size: 11px;
}

.mock-premium-section li img {
  width: 16px;
  filter: none;
}

.mock-premium-section > div > div > a {
  margin-top: 7px;
  background: #BA3C38;
  color: #FFFFFF;
}

.mock-pack-preview {
  position: relative;
  overflow: hidden;
  padding: 31px;
  border: 1px solid #BA3C38;
  border-radius: 8px;
  background: #FFFFFF;
  color: #14243A;
  box-shadow: 0 22px 50px rgba(20,36,58, .28);
}

.mock-pack-ribbon {
  position: absolute;
  top: 17px;
  right: -32px;
  width: 125px;
  padding: 5px 0;
  transform: rotate(36deg);
  background: #BA3C38;
  color: #FFFFFF;
  font-size: 8px;
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
}

.mock-pack-preview > small {
  color: #BA3C38;
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.mock-pack-preview h3 {
  max-width: 320px;
  margin: 8px 0;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 21px;
  letter-spacing: 0;
}

.mock-pack-preview > p {
  min-height: 47px;
  margin: 0;
  color: #293A50;
  font-size: 10px;
  line-height: 1.6;
}

.mock-pack-preview > div {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 25px;
  border: 1px solid #EDF2F7;
  border-radius: 6px;
}

.mock-pack-preview > div span {
  padding: 14px 10px;
  color: #627083;
  font-size: 9px;
  text-align: center;
}

.mock-pack-preview > div span + span {
  border-left: 1px solid #EDF2F7;
}

.mock-pack-preview > div strong {
  display: block;
  margin-bottom: 2px;
  color: #14243A;
  font-family: "Poppins", sans-serif;
  font-size: 17px;
  letter-spacing: 0;
}

.mock-pack-preview footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 22px;
  padding-top: 17px;
  border-top: 1px solid #EDF2F7;
  color: #627083;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
}

.mock-pack-preview footer strong {
  color: #BA3C38;
  font-family: "Poppins", sans-serif;
  font-size: 17px;
  letter-spacing: 0;
}

.mock-results-section {
  background: #FFFFFF;
}

.mock-results-visual header strong {
  color: #293A50;
  font-family: "Poppins", sans-serif;
  font-size: 18px;
  letter-spacing: 0;
}

.mock-results-visual svg {
  display: block;
  width: calc(100% - 38px);
  height: auto;
  margin: 22px 19px 12px;
}

.mock-results-visual .chart-grid {
  fill: none;
  stroke: #EDF2F7;
  stroke-width: 1;
}

.mock-results-visual .chart-area {
  fill: url(#mockChartFill);
}

.mock-results-visual .chart-line {
  fill: none;
  stroke: #293A50;
  stroke-linecap: round;
  stroke-width: 4;
}

.mock-results-visual circle {
  fill: #FFFFFF;
  stroke: #293A50;
  stroke-width: 3;
}

.mock-results-visual > div {
  display: flex;
  justify-content: center;
  gap: 24px;
  padding: 0 15px 20px;
  color: #14243A;
  font-size: 9px;
  font-weight: 700;
}

.mock-results-visual > div span {
  display: flex;
  align-items: center;
  gap: 5px;
}

.mock-results-visual > div i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #293A50;
}

.mock-results-visual > div i.wrong { background: #BA3C38; }
.mock-results-visual > div i.skipped { background: #627083; }

.mock-public-cta {
  padding: 29px 0;
  background: #EDF2F7;
}

.mock-public-cta > div {
  display: grid;
  align-items: center;
  grid-template-columns: 45px minmax(0, 1fr) auto;
  gap: 16px;
}

.mock-public-cta > div > img {
  width: 43px;
  height: 43px;
  padding: 9px;
  box-sizing: border-box;
  border-radius: 6px;
  background: #FFFFFF;
}

.mock-public-cta span {
  color: #14243A;
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.mock-public-cta h2 {
  margin: 2px 0 0;
  font-size: 20px;
}

.mock-public-cta a {
  background: #293A50;
  color: #FFFFFF;
}

@media (max-width: 960px) {
  .mock-public-hero-grid,
  .mock-public-split,
  .mock-premium-grid {
    grid-template-columns: 1fr;
  }

  .mock-public-hero {
    padding-top: 48px;
  }

  .mock-demo {
    width: min(640px, 100%);
  }

  .mock-feature-grid {
    grid-template-columns: 1fr 1fr;
  }

  .mock-feature-grid article:nth-child(3) {
    border-left: 0;
  }

  .mock-feature-grid article:nth-child(n+3) {
    border-top: 1px solid #EDF2F7;
  }

  .mock-premium-grid {
    gap: 38px;
  }
}

@media (max-width: 640px) {
  .mock-public-shell {
    width: min(100% - 24px, 1180px);
  }

  .mock-public-hero {
    min-height: auto;
    padding: 34px 0 36px;
  }

  .mock-public-hero-grid {
    gap: 29px;
  }

  .mock-public-intro h1 {
    margin-top: 9px;
    font-size: 31px;
  }

  .mock-public-intro > p {
    font-size: 12px;
    line-height: 1.6;
  }

  .mock-public-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-top: 19px;
  }

  .mock-public-primary,
  .mock-public-secondary {
    min-width: 0;
    padding: 8px;
    font-size: 10px;
  }

  .mock-demo-bar {
    min-height: 42px;
    padding: 0 12px;
  }

  .mock-demo-meta {
    display: grid;
    gap: 5px;
    padding: 15px 13px 0;
  }

  .mock-demo h2 {
    margin: 9px 13px 13px;
    font-size: 13px;
  }

  .mock-demo-options {
    gap: 6px;
    padding: 0 13px;
  }

  .mock-demo-options span {
    min-height: 35px;
    grid-template-columns: 23px minmax(0, 1fr);
    padding: 5px 8px;
    font-size: 9px;
  }

  .mock-demo-options b {
    width: 21px;
    height: 21px;
    font-size: 8px;
  }

  .mock-demo-footer {
    min-height: 52px;
    margin-top: 13px;
    padding: 0 13px;
  }

  .mock-demo-footer > span i:nth-child(n+8) {
    display: none;
  }

  .mock-public-facts > div {
    width: 100%;
    grid-template-columns: 1fr 1fr;
  }

  .mock-public-facts > div > div {
    min-height: 61px;
    border-bottom: 1px solid #EDF2F7;
  }

  .mock-public-facts > div > div:nth-child(odd) {
    border-left: 1px solid #EDF2F7;
  }

  .mock-public-facts strong {
    font-size: 14px;
  }

  .mock-public-facts span {
    font-size: 8px;
  }

  .mock-public-section,
  .mock-premium-section {
    padding: 55px 0;
  }

  .mock-public-split {
    gap: 32px;
  }

  .mock-public-section h2,
  .mock-premium-section h2 {
    font-size: 26px;
  }

  .mock-public-section-copy > p,
  .mock-public-heading p,
  .mock-premium-section > div > div > p {
    font-size: 11px;
  }

  .mock-subject-row {
    grid-template-columns: minmax(130px, 1fr) 19px 31%;
    padding: 0 13px;
  }

  .mock-feature-grid {
    grid-template-columns: 1fr;
  }

  .mock-feature-grid article {
    min-height: auto;
    padding: 21px 19px;
  }

  .mock-feature-grid article + article,
  .mock-feature-grid article:nth-child(3) {
    border-top: 1px solid #EDF2F7;
    border-left: 0;
  }

  .mock-feature-grid h3 {
    margin-top: 11px;
  }

  .mock-pack-preview {
    padding: 25px 18px 21px;
  }

  .mock-pack-preview > div span {
    padding: 11px 5px;
  }

  .mock-results-visual > div {
    gap: 11px;
    font-size: 8px;
  }

  .mock-public-cta > div {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .mock-public-cta > div > img {
    width: 38px;
    height: 38px;
  }

  .mock-public-cta h2 {
    font-size: 15px;
  }

  .mock-public-cta a {
    grid-column: 1 / -1;
    width: 100%;
  }
}
.pack-settings-dialog{width:min(420px,calc(100% - 32px));padding:22px;border:1px solid #EDF2F7;border-radius:16px;box-shadow:0 20px 60px rgba(20,36,58,.22)}.pack-settings-dialog::backdrop{background:rgba(20,36,58,.45)}.pack-settings-dialog h2{margin:0 0 5px;font-size:20px}.pack-settings-dialog p{margin:0 0 16px;color:#627083;font-size:12px}.pack-settings-dialog fieldset{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px;padding:0;border:0}.pack-settings-dialog legend{width:100%;margin-bottom:5px;color:#14243A;font-size:11px;font-weight:700}.pack-settings-dialog label{padding:7px 9px;border:1px solid #EDF2F7;border-radius:6px;color:#14243A;font-size:11px;cursor:pointer}.pack-settings-dialog label:has(input:checked){border-color:#14243A;background:#EDF2F7;color:#14243A}.pack-settings-dialog input{margin-right:4px}.pack-settings-dialog>form>div{display:flex;justify-content:flex-end;gap:8px}.pack-settings-dialog button{padding:9px 13px;border:1px solid #EDF2F7;border-radius:7px;background:#FFFFFF;cursor:pointer}
/* Purchase-history attempt setup */
.pack-settings-dialog{width:min(640px,calc(100vw - 32px));max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);padding:0;overflow-x:hidden;overflow-y:auto;border:0;border-radius:20px;background:#FFFFFF;box-shadow:0 30px 90px rgba(20,36,58,.32)}
.pack-settings-dialog::backdrop{background:rgba(20,36,58,.66);backdrop-filter:blur(3px)}
.pack-settings-dialog>form{display:grid;min-width:0;gap:20px;padding:0 26px 24px}
.pack-settings-dialog>form>*{min-width:0}
.pack-settings-dialog>form>header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin:0 -26px;padding:24px 26px 21px;border-bottom:1px solid #EDF2F7;background:linear-gradient(125deg,#EDF2F7 0%,#EDF2F7 100%)}
.pack-settings-dialog>form>header span{color:#14243A;font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.pack-settings-dialog>form>header h2{margin:5px 0 4px;color:#14243A;font-size:25px;letter-spacing:-.025em}
.pack-settings-dialog>form>header p{margin:0;color:#14243A;font-size:11px}
.pack-settings-dialog>form>header button{display:flex;flex:none;width:auto;height:36px;align-items:center;gap:7px;padding:0 11px;border:1px solid #EDF2F7;border-radius:999px;color:#14243A;background:rgba(255,255,255,.85);font-size:10px;font-weight:800;cursor:pointer;box-shadow:0 3px 10px rgba(20,36,58,.07)}
.pack-settings-dialog>form>header button b{font-size:18px;font-weight:400;line-height:1}
.pack-settings-dialog>form>header button:hover,.pack-settings-dialog>form>header button:focus-visible{color:#FFFFFF;border-color:#14243A;background:#14243A;outline:none}
.pack-attempt-warning{display:grid;gap:4px;padding:14px 16px;border:1px solid #FFE4DF;border-left:4px solid #FF6B61;border-radius:10px;background:var(--na-coral);color:var(--na-white)!important;}
.pack-attempt-warning strong{color:#BA3C38;font-size:12px}
.pack-attempt-warning span{color:#BA3C38;font-size:10px}
.pack-settings-dialog fieldset{min-inline-size:0;margin:0;padding:0;border:0}
.pack-settings-dialog legend{width:100%;margin-bottom:9px;color:#14243A;font-size:11px;font-weight:800}
.pack-settings-dialog .timer-selector,.pack-settings-dialog .negative-marking-selector{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.pack-settings-dialog .timer-selector legend,.pack-settings-dialog .negative-marking-selector legend{grid-column:1/-1}
.pack-settings-dialog .timer-selector label,.pack-settings-dialog .negative-marking-selector label{cursor:pointer}
.pack-settings-dialog .timer-selector input,.pack-settings-dialog .negative-marking-selector input{position:absolute;opacity:0;pointer-events:none}
.pack-settings-dialog .timer-selector label span,.pack-settings-dialog .negative-marking-selector label span{display:flex;min-width:0;min-height:38px;align-items:center;justify-content:center;padding:0 7px;border:1px solid #EDF2F7;border-radius:999px;color:#14243A;background:#FFFFFF;font-size:10px;font-weight:750;white-space:nowrap;box-shadow:0 2px 7px rgba(20,36,58,.04);transition:border-color .15s,background .15s,color .15s,transform .15s}
.pack-settings-dialog .timer-selector label:hover span,.pack-settings-dialog .negative-marking-selector label:hover span{border-color:#627083;transform:translateY(-1px)}
.pack-settings-dialog .timer-selector input:checked+span,.pack-settings-dialog .negative-marking-selector input:checked+span{color:#FFFFFF;border-color:#14243A;background:linear-gradient(135deg,#14243A,#293A50);box-shadow:0 5px 14px rgba(20,36,58,.18)}
.pack-subject-settings{display:block!important;overflow:hidden;border:1px solid #EDF2F7;border-radius:12px;background:#FFFFFF;box-shadow:0 5px 18px rgba(20,36,58,.04)}
.pack-subject-settings>legend{padding:0 10px}
.pack-subject-settings>p{margin:0;padding:0 12px 9px;color:#627083;font-size:10px}
.pack-subject-settings>label{display:grid;grid-template-columns:minmax(0,1fr) 82px;align-items:center;gap:12px;padding:9px 12px;border:0;border-top:1px solid #EDF2F7;border-radius:0}
.pack-subject-settings>label>span{display:grid;gap:2px}
.pack-subject-settings>label strong{font-size:11px}
.pack-subject-settings>label small{color:#627083;font-size:9px}
.pack-subject-settings input{box-sizing:border-box;width:82px;max-width:100%;padding:8px;border:1px solid #EDF2F7;border-radius:7px;text-align:center}
.pack-subject-total{display:flex;align-items:center;justify-content:space-between;padding:11px 12px;border-top:1px solid #EDF2F7;background:#EDF2F7;color:#14243A;font-size:10px}
.pack-subject-settings.complete .pack-subject-total{color:#14243A;background:#EDF2F7}
.pack-subject-settings.over .pack-subject-total{color:#BA3C38;background:#EDF2F7}
.pack-settings-dialog>form>footer{position:sticky;bottom:-24px;display:flex;justify-content:flex-end;gap:10px;margin:0 -26px -24px;padding:16px 26px 20px;border-top:1px solid #EDF2F7;background:rgba(255,255,255,.94);backdrop-filter:blur(10px)}
.pack-settings-dialog>form>footer button{min-height:42px;padding:10px 16px;border:1px solid #EDF2F7;border-radius:9px;cursor:pointer;font-weight:750}
.pack-settings-dialog>form>footer .pack-settings-cancel{color:#14243A;background:#EDF2F7}
.pack-settings-dialog>form>footer .pack-settings-cancel:hover,.pack-settings-dialog>form>footer .pack-settings-cancel:focus-visible{border-color:#293A50;background:#EDF2F7;outline:none}
.pack-settings-dialog>form>footer .premium-pack-action{border-color:#14243A;background:linear-gradient(135deg,#14243A,#293A50);color:#FFFFFF;box-shadow:0 8px 18px rgba(20,36,58,.2)}
.pack-settings-dialog>form>footer .premium-pack-action:disabled{cursor:not-allowed;opacity:.45}
@media(max-width:560px){.pack-settings-dialog{width:calc(100vw - 20px);max-width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:15px}.pack-settings-dialog>form{padding:0 16px 18px}.pack-settings-dialog>form>header{margin:0 -16px;padding:19px 16px 17px}.pack-settings-dialog>form>header button{padding:0 9px}.pack-settings-dialog .timer-selector,.pack-settings-dialog .negative-marking-selector{grid-template-columns:repeat(3,minmax(0,1fr))}.pack-settings-dialog .timer-selector label:nth-of-type(4),.pack-settings-dialog .negative-marking-selector label:nth-of-type(4){grid-column:1}.pack-subject-settings>label{grid-template-columns:minmax(0,1fr) 72px;padding:9px}.pack-subject-settings input{width:72px}.pack-settings-dialog>form>footer{bottom:-18px;display:grid;grid-template-columns:1fr;margin:0 -16px -18px;padding:13px 16px 16px}.pack-settings-dialog>form>footer button{width:100%}}
.latest-national-exams{margin-top:18px;padding:18px 20px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:14px}.latest-national-exams .mock-section-heading{margin-bottom:10px}.latest-national-list{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.latest-national-list a{display:grid;gap:4px;padding:11px 12px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:9px;color:#14243A;text-decoration:none}.latest-national-list strong{font-size:12px}.latest-national-list span,.latest-national-list small{color:#627083;font-size:10px}.latest-national-list small{color:#14243A;font-weight:700}@media(max-width:700px){.latest-national-list{grid-template-columns:1fr}}
.mock-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.mock-choice-card{padding:14px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:14px;box-shadow:0 10px 26px rgba(20,36,58,.06)}.choice-card-preview{position:relative;display:grid;gap:9px;padding:16px 13px 13px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:10px;color:#14243A;font-size:10px;overflow:hidden}.choice-card-preview:before{content:"NursesAce  /  Mock Tests";display:block;margin:-16px -13px 2px;padding:6px 10px;color:#627083;background:#EDF2F7;border-bottom:1px solid #EDF2F7;font-size:8px;font-weight:700;letter-spacing:.04em}.choice-card-preview header,.choice-card-preview footer{display:flex;justify-content:space-between;gap:8px;align-items:center}.choice-card-preview header strong{padding:4px 6px;background:#EDF2F7;color:#14243A;border-radius:5px;font-size:9px}.choice-card-preview header span,.choice-card-preview footer{color:#293A50}.choice-card-preview>div{display:grid;gap:6px}.choice-card-preview>div span{display:flex;justify-content:space-between;padding:6px 7px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:5px}.choice-card-preview b{color:#14243A}.marking-preview b{color:#BA3C38}.competition-preview header strong{background:var(--na-coral);color:var(--na-white)!important;}.competition-preview>div{gap:5px}.competition-preview>div b{font-size:18px;color:#14243A}.competition-preview>div span{border:0;padding:0;background:transparent}.mock-choice-card h3{margin:14px 0 5px;font-size:15px}.mock-choice-card p{margin:0 0 10px;color:#293A50;font-size:11px;line-height:1.5}.mock-choice-card>a{color:#14243A;font-size:11px;font-weight:750;text-decoration:none}@media(max-width:700px){.mock-choice-grid{grid-template-columns:1fr}.mock-choice-card{display:grid;grid-template-columns:minmax(0,150px) 1fr;gap:0 12px}.mock-choice-card h3,.mock-choice-card p,.mock-choice-card>a{grid-column:2}.mock-choice-card h3{margin:0 0 4px}.mock-choice-card p{margin-bottom:7px}.choice-card-preview{grid-row:1/5}}
.real-screen-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.real-screen-card{padding:12px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:14px;box-shadow:0 12px 32px rgba(20,36,58,.08)}.screen-window{height:285px;overflow:hidden;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:10px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}.screen-toolbar{display:flex;align-items:center;gap:7px;height:30px;padding:0 9px;background:#FFFFFF;border-bottom:1px solid #EDF2F7;color:#14243A;font-size:8px}.screen-toolbar b{display:grid;width:18px;height:18px;place-items:center;background:#14243A;color:#FFFFFF;border-radius:5px;font-size:7px}.screen-toolbar span{margin-right:auto;font-weight:700}.screen-toolbar i{width:5px;height:5px;background:#EDF2F7;border-radius:50%}.screen-pack{margin:10px;padding:12px!important;border-radius:8px!important}.screen-pack h3{font-size:14px!important}.screen-pack p{font-size:9px!important}.screen-pack .premium-subject-mix,.screen-pack .premium-pack-facts{font-size:8px}.screen-pack .button{min-height:30px;font-size:9px}.screen-settings{display:grid;gap:10px;margin:10px;padding:13px;background:#FFFFFF;border:1px solid #EDF2F7;border-radius:8px}.screen-settings h3{margin:0;font-size:13px}.screen-settings .button{min-height:30px;font-size:9px}.screen-competition{margin:10px;padding:13px!important;border-radius:8px!important}.screen-competition h3{margin:10px 0 7px!important;font-size:14px!important}.screen-competition .competition-card-facts{gap:6px!important;margin:8px 0!important}.screen-competition .competition-card-facts dt{font-size:8px!important}.screen-competition .competition-card-facts dd{font-size:9px!important}.screen-competition footer{padding-top:8px!important}.screen-competition .competition-button{padding:7px 9px!important;font-size:8px!important}.real-screen-card>h3{margin:13px 2px 5px;font-size:15px}.real-screen-card>p{min-height:34px;margin:0 2px 8px;color:#293A50;font-size:11px;line-height:1.5}.real-screen-card>a{margin:0 2px;color:#14243A;font-size:11px;font-weight:750;text-decoration:none}@media(max-width:850px){.real-screen-grid{grid-template-columns:1fr}.real-screen-card{display:grid;grid-template-columns:minmax(240px,.9fr) 1fr;gap:0 15px}.screen-window{grid-row:1/5;height:235px}.real-screen-card>h3{margin-top:4px}.real-screen-card>p{min-height:0}}@media(max-width:560px){.real-screen-card{display:block}.screen-window{height:255px}.real-screen-card>h3{margin-top:12px}}
.mock-choice-section .mock-public-heading>p{display:none}