:root{
  /* Theme: Dark Red + Black (official-style) */
  --ejust-primary:#7a0000;       /* dark red */
  --ejust-primary-2:#8b0000;     /* dark red alt */
  --ejust-secondary:#111111;     /* black */
  --ejust-text:#1f1f1f;          /* charcoal */
  --ejust-muted:#6b7280;
  --ejust-bg:#f5f5f5;
  --ejust-card:#ffffff;
  --ejust-border:#e5e5e5;
  --ejust-danger:#b00020;        /* required/danger */
}

*{ box-sizing: border-box; }
html, body{ overflow-x: hidden; }
img, svg, video, canvas{ max-width:100%; height:auto; }

.portal-body{
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: var(--ejust-bg);
  color: var(--ejust-text);
}

.portal-container{
  width: 100%;
  padding-left: 1rem;
  padding-right: 1rem;
}
@media (min-width: 1200px){
  .portal-container{ padding-left: 1.5rem; padding-right: 1.5rem; }
}

.skip-link{
  position:absolute;
  left:-999px;
  top:8px;
  background:#111827;
  color:#fff;
  padding:.5rem .75rem;
  border-radius:.5rem;
  z-index:9999;
}
.skip-link:focus{ left:12px; }

.portal-header{
  background: var(--ejust-secondary);
  border-bottom: 3px solid var(--ejust-primary);
}

.admission-top-header{
  box-shadow: 0 14px 34px rgba(0,0,0,.18);
}
.admission-header-bar{
  display:grid;
  grid-template-columns: minmax(260px, auto) 1fr auto;
  align-items:center;
  gap: 1rem;
  padding: .9rem 0;
}
.admission-header-brand{
  display:flex;
  align-items:center;
  gap:.75rem;
  min-width:0;
  color:#fff;
  text-decoration:none;
}
.admission-header-brand:hover,
.admission-header-brand:focus{
  color:#fff;
}
.admission-header-brand:focus-visible,
.admission-header-step:focus-visible,
.btn-ghost:focus-visible{
  outline: 3px solid rgba(255,255,255,.28);
  outline-offset: 3px;
}
.admission-header-brand__text{
  display:grid;
  min-width:0;
  line-height:1.15;
}
.admission-header-meta{
  align-items:center;
  justify-content:center;
  gap:.45rem;
  flex-wrap:wrap;
  min-width:0;
}
.admission-header-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.5rem;
  min-width:0;
}
.admission-step-strip{
  border-top:1px solid rgba(255,255,255,.12);
  padding:.85rem 0 1rem;
}
.admission-step-strip__summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:.65rem;
}
.admission-step-strip__label{
  display:inline-flex;
  align-items:center;
  padding:.35rem .6rem;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
  color:rgba(255,255,255,.84);
  font-weight:900;
  font-size:.82rem;
}
.admission-step-strip__title{
  color:#fff;
  font-weight:900;
}
.admission-step-strip__nav{
  display:grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap:.45rem;
}
.admission-header-step{
  display:flex;
  align-items:center;
  gap:.45rem;
  min-width:0;
  padding:.5rem .55rem;
  border-radius:.85rem;
  color:rgba(255,255,255,.76);
  text-decoration:none;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  transition:transform .14s ease, background-color .14s ease, border-color .14s ease, color .14s ease;
}
.admission-header-step:hover{
  color:#fff;
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.20);
  transform:translateY(-1px);
}
.admission-header-step__dot{
  width:28px;
  height:28px;
  border-radius:999px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  font-size:.85rem;
}
.admission-header-step__text{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:850;
  font-size:.78rem;
}
.admission-header-step.is-active{
  color:#fff;
  background:var(--ejust-primary);
  border-color:rgba(255,255,255,.18);
  box-shadow:0 10px 24px rgba(122,0,0,.28);
}
.admission-header-step.is-active .admission-header-step__dot{
  color:var(--ejust-primary);
  background:#fff;
}
.admission-header-step.is-done{
  color:#fff;
  background:rgba(255,255,255,.11);
  border-color:rgba(255,255,255,.18);
}
.admission-header-step.is-done .admission-header-step__dot{
  background:rgba(25,135,84,.22);
  border-color:rgba(255,255,255,.20);
}

.brand-mark{
  width:44px; height:44px;
  border-radius:12px;
  background: rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  display:grid;
  place-items:center;
}
.brand-mark__inner{
  font-size:.75rem;
  font-weight:800;
  color: rgba(255,255,255,.92);
  letter-spacing:.06em;
}

.portal-title{
  font-weight: 800;
  color:#fff;
}
.portal-subtitle{
  color: rgba(255,255,255,.75);
  font-size:.9rem;
}

.pill{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.35rem .6rem;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.92);
  font-size: .82rem;
  font-weight: 700;
}
.pill--light{
  border-color: rgba(255,255,255,.20);
  background: rgba(255,255,255,.08);
}
.pill--success{
  border-color: rgba(255,255,255,.22);
  background: rgba(122,0,0,.35);
}

.btn-ghost{
  border:1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.10);
  color:#fff;
}
.btn-ghost:hover{
  background: rgba(255,255,255,.16);
  color:#fff;
}

.user-pill{
  border-radius: 999px;
  padding: .35rem .55rem;
  border:1px solid rgba(255,255,255,.20);
  background: rgba(255,255,255,.10);
  color:#fff;
}
.user-pill__avatar{
  width:34px; height:34px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);
  display:grid;
  place-items:center;
}
.user-pill__meta{ font-weight:800; font-size:.85rem; line-height:1.1; }
.user-pill__sub{ font-size:.78rem; color: rgba(255,255,255,.72); line-height:1.1; }

.portal-card{
  border:1px solid var(--ejust-border);
  border-radius: 1rem;
  background: var(--ejust-card);
}
.portal-card .card-header{
  background:#fff;
  border-bottom: 1px solid var(--ejust-border);
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}

.admission-card{ /* compatibility with existing views */
  border:1px solid var(--ejust-border);
  border-radius: 1rem;
  background: var(--ejust-card);
}
.admission-card .card-header{
  background:#fff;
  border-bottom: 1px solid var(--ejust-border);
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}

.portal-sticky{ top: 1.1rem; }

.req{ color: var(--ejust-danger); font-weight:800; }

.avatar-circle{
  width:44px; height:44px;
  border-radius:999px;
  background: rgba(122,0,0,.08);
  border:1px solid rgba(122,0,0,.18);
  display:grid;
  place-items:center;
  color: var(--ejust-primary);
}

.summary-dl dt{
  font-size:.75rem;
  color: var(--ejust-muted);
  font-weight:700;
}
.summary-dl dd{
  margin-bottom:0;
  font-weight:700;
}

/* Progress */
.portal-progress .progress{
  height: .6rem;
  border-radius: 999px;
  background: rgba(17,17,17,.10);
}
.portal-progress .progress-bar{
  background: linear-gradient(90deg, var(--ejust-primary), var(--ejust-primary-2));
}

/* Sidebar (new pill style) */
.portal-sidebar{
  background: var(--ejust-secondary);
  border-color: rgba(255,255,255,.10);
}
.portal-sidebar .card-body{ color: rgba(255,255,255,.92); }

.portal-nav .nav-link{
  display:flex;
  gap:.7rem;
  align-items:flex-start;
  border-radius: 1rem;
  padding: .65rem .75rem;
  color: rgba(255,255,255,.86);
}
.portal-nav__num{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display:grid;
  place-items:center;
  font-weight: 900;
  letter-spacing: .02em;
  color: rgba(255,255,255,.92);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  flex: 0 0 auto;
}
.portal-nav .nav-link:hover{
  background: rgba(255,255,255,.06);
}
.portal-nav .nav-link.active{
  background: rgba(122,0,0,.35);
  border: 1px solid rgba(255,255,255,.10);
  color: #fff;
}
.portal-nav__icon{
  width:34px; height:34px;
  border-radius: 14px;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  display:grid;
  place-items:center;
  color: rgba(255,255,255,.92);
  flex: 0 0 auto;
}
.portal-nav__title{ display:block; font-weight:800; font-size:.92rem; }
.portal-nav__status{ display:block; font-size:.75rem; color: var(--ejust-muted); font-weight:650; margin-top:.1rem; }
.portal-nav__link.is-done .portal-nav__icon{
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.18);
  color: #fff;
}
.portal-nav__link.is-active .portal-nav__icon{
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.18);
  color:#fff;
}

/* Buttons */
.btn-primary{
  --bs-btn-bg: var(--ejust-primary);
  --bs-btn-border-color: var(--ejust-primary);
  --bs-btn-hover-bg: #650000;
  --bs-btn-hover-border-color:#650000;
  --bs-btn-active-bg:#5a0000;
  --bs-btn-active-border-color:#5a0000;
  --bs-btn-border-radius: 999px;
}
.btn-success{
  --bs-btn-bg: var(--ejust-primary);
  --bs-btn-border-color: var(--ejust-primary);
  --bs-btn-hover-bg: #650000;
  --bs-btn-hover-border-color:#650000;
  --bs-btn-border-radius: 999px;
}
.btn-danger{
  --bs-btn-bg: var(--ejust-danger);
  --bs-btn-border-color: var(--ejust-danger);
  --bs-btn-hover-bg: #8f001a;
  --bs-btn-hover-border-color: #8f001a;
  --bs-btn-border-radius: 999px;
}
.btn-secondary{
  --bs-btn-bg: var(--ejust-secondary);
  --bs-btn-border-color: var(--ejust-secondary);
  --bs-btn-hover-bg: #000000;
  --bs-btn-hover-border-color: #000000;
  --bs-btn-border-radius: 999px;
}
.btn-outline-secondary,
.btn-outline-danger,
.btn-outline-primary{
  border-radius: 999px;
}

/* Guideline card */
.guideline-card{
  border:1px solid var(--ejust-border);
  border-radius: 1rem;
  background: linear-gradient(180deg, rgba(122,0,0,.05), rgba(255,255,255,.92));
}
.guideline-icon{
  width:44px; height:44px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(122,0,0,.10);
  border:1px solid rgba(122,0,0,.18);
  color: var(--ejust-primary);
  flex: 0 0 auto;
}
.checklist{ list-style:none; padding-left:0; margin:0; }
.checklist li{
  display:flex;
  align-items:flex-start;
  gap:.5rem;
  margin-top:.35rem;
}
.checklist i{ color: var(--ejust-primary); margin-top:.15rem; }

/* Help panel */
.help-badge{
  width:28px; height:28px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background: rgba(122,0,0,.10);
  border:1px solid rgba(122,0,0,.18);
  color: var(--ejust-primary);
}
.help-tip{
  display:flex;
  gap:.65rem;
  align-items:flex-start;
  padding:.65rem .75rem;
  border:1px solid var(--ejust-border);
  border-radius: .9rem;
  background: rgba(255,255,255,.9);
}
.help-tip i{
  width:26px;
  color: var(--ejust-primary);
  margin-top:.15rem;
}

/* Forms */
.portal-form .form-label{ font-weight:700; }
.portal-form .form-control,
.portal-form .form-select,
.portal-form .input-group-text{
  border-radius: .85rem;
}
.portal-form .input-group-text{
  background: rgba(17,17,17,.03);
  border-color: var(--ejust-border);
}

/* Personal information */
.personal-info-page{
  --field-radius: 1rem;
}
.admission-page-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}
.admission-eyebrow{
  display:inline-flex;
  align-items:center;
  padding:.35rem .7rem;
  border-radius:999px;
  border:1px solid rgba(122,0,0,.16);
  background:rgba(122,0,0,.07);
  color:var(--ejust-primary);
  font-weight:900;
  font-size:.8rem;
  margin-bottom:.65rem;
}
.step-status-card{
  min-width:220px;
  display:flex;
  align-items:center;
  gap:.7rem;
  padding:.85rem 1rem;
  border-radius:1rem;
  border:1px solid var(--ejust-border);
  background:#fff;
  box-shadow:0 14px 30px rgba(17,17,17,.07);
}
.step-status-card__icon{
  width:42px;
  height:42px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:rgba(122,0,0,.09);
  color:var(--ejust-primary);
}
.step-status-card__label,
.step-status-card__value{
  display:block;
  line-height:1.1;
}
.step-status-card__label{
  color:var(--ejust-muted);
  font-weight:800;
  font-size:.76rem;
}
.step-status-card__value{
  color:var(--ejust-secondary);
  font-weight:900;
}
.personal-section{
  border:1px solid var(--ejust-border);
  border-radius:1.15rem;
  background:#fff;
  padding:1rem;
  box-shadow:0 18px 45px rgba(17,17,17,.07);
}
.personal-section__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  padding-bottom:1rem;
  margin-bottom:1rem;
  border-bottom:1px solid rgba(17,17,17,.08);
}
.personal-section__header h2{
  margin:0 0 .25rem;
  color:var(--ejust-secondary);
  font-size:1rem;
  font-weight:900;
}
.personal-section__header p{
  margin:0;
  color:var(--ejust-muted);
  font-size:.9rem;
}
.section-chip{
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
  padding:.35rem .65rem;
  border-radius:999px;
  background:rgba(122,0,0,.07);
  color:var(--ejust-primary);
  border:1px solid rgba(122,0,0,.14);
  font-weight:900;
  font-size:.76rem;
}
.mini-section-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  padding:.7rem .85rem;
  border-radius:1rem;
  background:rgba(17,17,17,.035);
  border:1px solid rgba(17,17,17,.06);
}
.mini-section-title span{
  font-weight:900;
  color:var(--ejust-secondary);
}
.mini-section-title small{
  color:var(--ejust-muted);
  font-weight:700;
}
.personal-info-form .form-label{
  color:#202020;
  font-size:.88rem;
  margin-bottom:.45rem;
}
.personal-info-form .form-control,
.personal-info-form .form-select{
  min-height:48px;
  border-radius:var(--field-radius);
  border-color:#d9dde3;
  background-color:#fff;
  transition:border-color .16s ease, box-shadow .16s ease, transform .16s ease, background-color .16s ease;
}
.personal-info-form .form-control:hover,
.personal-info-form .form-select:hover{
  border-color:rgba(122,0,0,.28);
  background-color:#fffdfd;
}
.personal-info-form .form-control:focus,
.personal-info-form .form-select:focus{
  border-color:var(--ejust-primary);
  box-shadow:0 0 0 .22rem rgba(122,0,0,.12);
}
.input-shell{
  position:relative;
}
.input-shell .form-control{
  padding-left:2.75rem;
}
.input-shell__icon{
  position:absolute;
  left:1rem;
  top:50%;
  transform:translateY(-50%);
  color:var(--ejust-primary);
  z-index:2;
  pointer-events:none;
}
.input-shell--readonly .form-control{
  background:rgba(17,17,17,.035);
  font-weight:800;
}
.rtl-input{
  direction:rtl;
  text-align:right;
}
.rtl-input::placeholder{
  text-align:right;
}
.searchable-select{
  display:grid;
  gap:.45rem;
}
.searchable-select__search{
  min-height:42px !important;
  border-style:dashed;
  background:rgba(17,17,17,.025) !important;
}
.segmented-field{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
}
.segmented-field__option{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  min-height:46px;
  padding:.65rem 1rem;
  border-radius:999px;
  border:1px solid #d9dde3;
  background:#fff;
  color:#1f2937;
  font-weight:850;
  cursor:pointer;
  transition:transform .16s ease, border-color .16s ease, background-color .16s ease, color .16s ease, box-shadow .16s ease;
}
.segmented-field__option:hover{
  transform:translateY(-1px);
  border-color:rgba(122,0,0,.25);
  box-shadow:0 10px 20px rgba(17,17,17,.06);
}
.btn-check:checked + .segmented-field__option{
  color:#fff;
  background:var(--ejust-primary);
  border-color:var(--ejust-primary);
  box-shadow:0 10px 22px rgba(122,0,0,.18);
}
.modern-validation{
  display:block;
  min-height:1.15rem;
  margin-top:.35rem;
  font-size:.8rem;
  font-weight:750;
}
.portal-alert{
  border-radius:1rem;
  border:1px solid rgba(122,0,0,.12);
}
.upload-box--modern{
  border-radius:1rem;
  transition:border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.upload-box--modern:hover,
.upload-box--modern.is-dragover{
  border-color:rgba(122,0,0,.35);
  box-shadow:0 14px 32px rgba(17,17,17,.08);
  transform:translateY(-1px);
}
.photo-preview--modern{
  min-height:220px;
  border-radius:1rem;
}
.form-action-bar{
  position:sticky;
  bottom:0;
  z-index:4;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem;
  margin:0 -1rem -1rem;
  border-top:1px solid rgba(17,17,17,.08);
  background:rgba(245,245,245,.88);
  backdrop-filter:blur(10px);
}

@media (max-width: 767.98px){
  .step-status-card{
    width:100%;
    min-width:0;
  }
  .personal-section{
    padding:.85rem;
    border-radius:1rem;
  }
  .personal-section__header,
  .mini-section-title,
  .form-action-bar{
    align-items:stretch;
    flex-direction:column;
  }
  .segmented-field__option{
    flex:1 1 130px;
  }
  .form-action-bar .btn{
    width:100%;
  }
}

/* Hide validation messages in UI (keep backend validation intact) */
.invalid-feedback,
.field-validation-error,
.validation-summary-errors{
  display: none !important;
}

.personal-info-form .invalid-feedback.field-validation-error,
.personal-info-form .invalid-feedback[data-valmsg-for],
.personal-info-form .modern-validation.field-validation-error,
.personal-info-form .modern-validation:not(:empty),
.portal-form .invalid-feedback.field-validation-error,
.portal-form .invalid-feedback[data-valmsg-for]:not(:empty),
.portal-form .modern-validation.field-validation-error,
.portal-form .modern-validation:not(:empty){
  display:block !important;
}
.personal-info-form .form-control.is-invalid,
.personal-info-form .form-select.is-invalid,
.personal-info-form .searchable-select.is-invalid .searchable-select__search,
.portal-form .form-control.is-invalid,
.portal-form .form-select.is-invalid,
.portal-form .searchable-select.is-invalid .searchable-select__search{
  border-color:var(--ejust-danger);
  box-shadow:0 0 0 .22rem rgba(176,0,32,.12);
}
.personal-info-form .segmented-field.is-invalid,
.portal-form .segmented-field.is-invalid{
  padding:.35rem;
  border:1px solid rgba(176,0,32,.45);
  border-radius:1rem;
  background:rgba(176,0,32,.035);
}
.personal-info-form .invalid-feedback,
.portal-form .invalid-feedback{
  margin-top:.4rem;
  color:var(--ejust-danger);
  font-weight:800;
  font-size:.82rem;
}

/* Prevent long text overflow */
.portal-body *{
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Header tabs (steps as tabs in header) */
.header-tabs{
  border-top: 1px solid rgba(255,255,255,.12);
}
.header-tabs__inner{
  padding-top: .75rem;
}
.header-tabs__nav{ margin-bottom: 0; }
.header-tabs__link{
  border-radius: 999px !important;
  padding: .45rem .7rem;
  font-weight: 800;
  font-size: .86rem;
  color: rgba(255,255,255,.86);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  white-space: nowrap;
}
.header-tabs__link:hover{
  background: rgba(255,255,255,.14);
  color:#fff;
}
.header-tabs__link.active{
  background: var(--ejust-primary);
  color: #fff;
  border-color: rgba(255,255,255,.10);
}

/* Header step cards (desktop stepper) */
.step-grid{
  width: 100%;
}
.admission-step-card,
.admission-step-card *,
.admission-step-tab,
.admission-step-tab *{
  opacity: 1 !important;
  visibility: visible !important;
}
.admission-step-card{
  width: 100%;
  min-width: 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 1rem;
  padding: .9rem 1rem;
  border-radius: 1rem;
  text-decoration:none;
  border:1px solid var(--ejust-border);
  background: #fff;
  color: var(--ejust-secondary);
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
  position: relative;
  z-index: 1;
  overflow: hidden;
  transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease, border-color .12s ease;
}
.admission-step-card:hover{
  background: #fff5f5;
  color: var(--ejust-secondary);
  border-color: #8b0000;
  box-shadow: 0 10px 24px rgba(139, 0, 0, 0.16);
  transform: translateY(-2px);
}
.admission-step-card__number{
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 900;
  font-size: 1.02rem;
  letter-spacing: .04em;
  background: #f5f5f5;
  color: #8b0000 !important;
  border: 1px solid var(--ejust-border);
  flex: 0 0 auto;
}
.admission-step-card__content{ min-width:0; }
.admission-step-card__label{
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .02em;
  opacity: 1;
  text-transform: uppercase;
}
.admission-step-card__title{
  font-weight: 900;
  font-size: .95rem;
  line-height: 1.15;
  color: inherit !important;
  white-space: normal;
  word-break: break-word;
}
.admission-step-card__status{
  width: 38px;
  height: 38px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  border:1px solid var(--ejust-border);
  background: #fff;
  flex: 0 0 auto;
}
.admission-step-card.active,
.admission-step-card.is-active{
  background: #8b0000;
  color: #fff !important;
  border-color: #8b0000;
  box-shadow: 0 10px 25px rgba(139,0,0,.30);
}
.admission-step-card.active:hover,
.admission-step-card.is-active:hover{
  background: #7a0000;
  color:#fff !important;
  transform: translateY(-2px);
}
.admission-step-card.completed,
.admission-step-card.is-done{
  background: #111111;
  color:#fff !important;
  border-color: #111111;
}
.admission-step-card.completed:hover,
.admission-step-card.is-done:hover{
  background: #1f1f1f;
  color:#fff !important;
  transform: translateY(-2px);
}
.admission-step-card.pending,
.admission-step-card.is-pending{
  background: #ffffff;
  color: #111111 !important;
  border: 1px solid var(--ejust-border);
}
.admission-step-card.pending:hover,
.admission-step-card.is-pending:hover{
  background: #fff5f5;
  color: #111111 !important;
  border-color: #8b0000;
}
.admission-step-card.active .admission-step-card__number,
.admission-step-card.is-active .admission-step-card__number{
  background: #ffffff;
  color: #8b0000 !important;
  border-color: rgba(255,255,255,.35);
}
.admission-step-card.completed .admission-step-card__number,
.admission-step-card.is-done .admission-step-card__number{
  background: #8b0000;
  color:#ffffff !important;
  border-color: rgba(255,255,255,.12);
}
.admission-step-card.active .admission-step-card__status,
.admission-step-card.is-active .admission-step-card__status,
.admission-step-card.completed .admission-step-card__status,
.admission-step-card.is-done .admission-step-card__status{
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color:#fff;
}

/* Upload */
.file-pill{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.25rem .55rem;
  border-radius:999px;
  border:1px solid var(--ejust-border);
  background:#fff;
  font-size:.85rem;
  color:#111827;
}
.upload-box{
  border: 1.5px dashed rgba(17,24,39,.22);
  border-radius: 1rem;
  padding: 1rem;
  display:flex;
  align-items:center;
  gap: .9rem;
  background: linear-gradient(180deg, rgba(11,61,46,.03), rgba(255,255,255,.70));
}
.upload-box__icon{
  width:42px; height:42px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  color: var(--ejust-primary);
  background: rgba(11,61,46,.08);
  border:1px solid rgba(11,61,46,.15);
}
.upload-drop{
  position:relative;
  border-radius: 1rem;
  border: 1.5px dashed rgba(17,24,39,.22);
  background: linear-gradient(180deg, rgba(11,61,46,.03), rgba(255,255,255,.85));
  padding: 1rem;
}
.upload-drop__input{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
}
.upload-drop__content{
  display:flex;
  align-items:center;
  gap:.85rem;
}
.upload-drop__icon{
  font-size: 1.4rem;
  color: var(--ejust-primary);
}
.upload-drop__meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: .75rem;
  margin-top: .75rem;
  flex-wrap:wrap;
}
.upload-drop.is-dragover{
  border-color: rgba(200,160,74,.7);
  box-shadow: 0 0 0 4px rgba(200,160,74,.15);
}

/* Photo preview */
.photo-preview{
  position:relative;
  border-radius: 1rem;
  border:1px solid var(--ejust-border);
  background: #fff;
  min-height: 220px;
  overflow:hidden;
}
.photo-preview img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:none;
}
.photo-preview.has-image img{ display:block; }
.photo-preview__placeholder{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  text-align:center;
  gap:.35rem;
  color: var(--ejust-muted);
  padding:1rem;
}
.photo-preview.has-image .photo-preview__placeholder{ display:none; }
.photo-preview__placeholder i{ font-size:2.25rem; }

/* Section title blocks (names in EN/AR, etc.) */
.section-title{
  padding:.85rem 1rem;
  background: rgba(17,24,39,.03);
  border:1px solid var(--ejust-border);
  border-radius: .9rem;
}
.section-title__label{ font-weight:800; }
.section-title__hint{ font-size:.875rem; color: var(--ejust-muted); margin-top:.25rem; }

/* Score cards (School Information) */
.score-card{
  padding: .9rem;
  border-radius: 1rem;
  border:1px solid var(--ejust-border);
  background: rgba(255,255,255,.95);
}
.score-card__label{
  font-size:.8rem;
  color: var(--ejust-muted);
  font-weight:800;
  margin-bottom:.35rem;
}

/* Fees row */
.fee-row{
  display:grid;
  grid-template-columns: 1.5fr .7fr .5fr .6fr;
  gap: 1rem;
  align-items:center;
  padding: 1rem;
  border:1px solid var(--ejust-border);
  border-radius: 1rem;
  background: #fff;
}
.fee-row__left{ min-width: 0; }
.fee-row__right{ min-width: 0; }
@media (max-width: 768px){
  .fee-row{ grid-template-columns: 1fr 1fr; }
}

/* Small icons */
.map-icon{
  width:44px; height:44px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(200,160,74,.12);
  border:1px solid rgba(200,160,74,.35);
  color: #8a6a20;
}
.info-badge{
  width:44px; height:44px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(13,110,253,.08);
  border:1px solid rgba(13,110,253,.18);
  color: #0b5ed7;
  flex: 0 0 auto;
}

/* Terms */
.terms-scroll{
  max-height: 340px;
  overflow:auto;
  padding: 1rem;
  border-radius: 1rem;
  background: rgba(17,24,39,.03);
  border:1px solid var(--ejust-border);
}
.terms-scroll:focus{
  outline: 3px solid rgba(200,160,74,.35);
  outline-offset: 2px;
}

/* Intro */
.intro-hero{
  border-radius: 1.25rem;
  overflow:hidden;
  background: linear-gradient(135deg, #111111 0%, #111111 55%, rgba(122,0,0,.35) 100%);
  box-shadow: 0 18px 45px rgba(2, 6, 23, .15);
}
.intro-hero__inner{
  padding: 1.75rem;
}
@media (min-width: 768px){
  .intro-hero__inner{ padding: 2.25rem; }
}
.intro-hero__lead{
  color: rgba(255,255,255,.78);
  font-size: 1.05rem;
}
.intro-hero__footer{
  border-top: 1px solid rgba(255,255,255,.14);
  padding-top: 1rem;
}
.intro-card{
  border-radius: 1.25rem;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.12);
  color:#fff;
  padding: 1rem;
  backdrop-filter: blur(8px);
}
.intro-card .checklist i{ color: rgba(255,255,255,.92); }
.intro-card__icon{
  width:44px; height:44px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);
}
.timeline{
  display:grid;
  grid-template-columns: 1fr;
  gap: .75rem;
}
.timeline__item{
  display:flex;
  gap: .9rem;
  align-items:flex-start;
  padding: .9rem 1rem;
  border-radius: 1rem;
  border:1px solid var(--ejust-border);
  background:#fff;
}
.timeline__dot{
  width:34px; height:34px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  background: rgba(122,0,0,.08);
  border:1px solid rgba(122,0,0,.20);
  color: var(--ejust-primary);
  font-weight: 800;
  flex:0 0 auto;
}
.timeline__content{ min-width: 0; }
.step-card{
  border:1px solid var(--ejust-border);
  border-radius: 1rem;
  padding: 1rem;
  background:#fff;
  height:100%;
}
.step-card__icon{
  width:38px; height:38px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(17,24,39,.04);
  border:1px solid rgba(17,24,39,.10);
  color: var(--ejust-primary);
  margin-bottom:.6rem;
}
.mini-icon{
  width:40px; height:40px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(200,160,74,.12);
  border:1px solid rgba(200,160,74,.35);
  color:#8a6a20;
  flex:0 0 auto;
}

/* Review */
.review-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: .75rem;
  padding: .9rem 1rem;
  border:1px solid var(--ejust-border);
  border-radius: 1rem;
  background:#fff;
}
.review-item__left{
  display:flex;
  align-items:flex-start;
  gap:.75rem;
}
.review-item__left i{
  color: var(--ejust-primary);
  font-size:1.15rem;
  margin-top:.15rem;
}

/* Authentication */
.auth-body{
  min-height: 100vh;
}
.auth-shell{
  min-height: 100vh;
  display:grid;
  grid-template-columns: minmax(320px, .9fr) minmax(0, 1.1fr);
}
.auth-brand-panel{
  background: linear-gradient(145deg, #111111 0%, #171717 58%, #7a0000 100%);
  color:#fff;
  display:flex;
  align-items:center;
  padding: clamp(1.5rem, 4vw, 4rem);
}
.auth-brand-panel__content{
  max-width: 620px;
}
.auth-step-note{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.55rem .75rem;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  font-weight:800;
  font-size:.9rem;
}
.auth-brand-panel__title{
  font-size: clamp(2rem, 4vw, 3.65rem);
  line-height: 1;
  font-weight: 900;
  margin-bottom: 1rem;
}
.auth-brand-panel__lead{
  color: rgba(255,255,255,.78);
  font-size: 1.05rem;
  max-width: 48rem;
}
.auth-brand-panel__meta{
  display:flex;
  align-items:center;
  gap:.75rem;
  flex-wrap:wrap;
  margin-top: 2rem;
}
.auth-brand-panel__meta span{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding:.45rem .7rem;
  border-radius:999px;
  background: rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.14);
  font-weight:750;
  color: rgba(255,255,255,.88);
}
.auth-content{
  display:flex;
  align-items:center;
  justify-content:center;
  padding: clamp(1rem, 4vw, 3rem);
}
.auth-card{
  width: min(100%, 560px);
  border:1px solid var(--ejust-border);
  border-radius: 1rem;
  background:#fff;
  box-shadow: 0 18px 50px rgba(17,17,17,.10);
  padding: clamp(1rem, 3vw, 2rem);
}
.auth-card--wide{
  width: min(100%, 900px);
}
.auth-card__header{
  margin-bottom: 1.35rem;
}
.auth-card__eyebrow{
  display:inline-flex;
  align-items:center;
  color: var(--ejust-primary);
  font-weight: 900;
  margin-bottom: .65rem;
}
.auth-choice-grid{
  display:grid;
  gap: 1rem;
}
.auth-choice{
  display:flex;
  align-items:center;
  gap: .9rem;
  padding: 1rem;
  border-radius: 1rem;
  border:1px solid var(--ejust-border);
  color: var(--ejust-secondary);
  text-decoration:none;
  background:#fff;
  transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.auth-choice:hover{
  color: var(--ejust-secondary);
  border-color: var(--ejust-primary);
  box-shadow: 0 12px 28px rgba(122,0,0,.12);
  transform: translateY(-1px);
}
.auth-choice--primary{
  background: #fff7f7;
  border-color: rgba(122,0,0,.20);
}
.auth-choice__icon,
.auth-choice__arrow{
  width:42px;
  height:42px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(122,0,0,.08);
  color: var(--ejust-primary);
  flex: 0 0 auto;
}
.auth-choice__arrow{
  margin-left:auto;
  background: rgba(17,17,17,.04);
  color: var(--ejust-secondary);
}
.auth-choice__body{
  min-width:0;
}
.auth-choice__title{
  display:block;
  font-weight: 900;
}
.auth-choice__text{
  display:block;
  color: var(--ejust-muted);
  font-size:.92rem;
  margin-top:.15rem;
}
.auth-validation-summary:empty{
  display:none !important;
}
.auth-card .field-validation-error,
.auth-card .validation-summary-errors{
  display:block !important;
  color: var(--ejust-danger);
  font-size:.85rem;
  font-weight:700;
  margin-top:.35rem;
}
.auth-card .validation-summary-errors ul{
  margin-bottom:0;
}
.login-form-modern{
  --login-focus: rgba(122,0,0,.18);
}
.login-field{
  position:relative;
}
.login-input-group{
  border-radius:1rem;
  transition: transform .16s ease, box-shadow .16s ease;
}
.login-input-group .form-control,
.login-input-group .input-group-text,
.login-input-group .login-password-toggle{
  min-height:52px;
  border-color:var(--ejust-border);
}
.login-input-group .input-group-text{
  color:var(--ejust-primary);
  background:rgba(122,0,0,.06);
  border-top-left-radius:1rem;
  border-bottom-left-radius:1rem;
}
.login-input-group .form-control{
  font-weight:750;
  letter-spacing:0;
}
.login-input-group .form-control:focus{
  border-color:rgba(122,0,0,.45);
  box-shadow:none;
}
.login-field:focus-within .login-input-group{
  transform:translateY(-1px);
  box-shadow:0 0 0 .22rem var(--login-focus), 0 12px 26px rgba(17,17,17,.08);
}
.login-field:hover .login-input-group{
  box-shadow:0 10px 22px rgba(17,17,17,.06);
}
.login-input-check{
  display:none;
  align-items:center;
  justify-content:center;
  width:42px;
  color:#146c43;
  background:#fff;
  border-top:1px solid var(--ejust-border);
  border-bottom:1px solid var(--ejust-border);
}
.login-field.is-valid .login-input-check{
  display:inline-flex;
}
.login-field.is-valid .login-input-group .form-control,
.login-field.is-valid .login-input-group .input-group-text{
  border-color:rgba(25,135,84,.35);
}
.login-field.is-valid .login-field-hint,
.login-field.is-valid .login-field-counter{
  color:#146c43;
}
.login-field.is-incomplete .login-field-hint,
.login-field.is-incomplete .login-field-counter{
  color:var(--ejust-danger);
}
.login-field-hint,
.login-field-counter{
  margin-top:.35rem;
  font-size:.82rem;
  font-weight:800;
  color:var(--ejust-muted);
}
.login-field-counter{
  font-size:.78rem;
}
.login-password-toggle{
  border-top-right-radius:1rem !important;
  border-bottom-right-radius:1rem !important;
  border:1px solid var(--ejust-border);
  border-left:0;
  color:var(--ejust-primary);
  background:#fff;
  min-width:52px;
}
.login-password-toggle:hover{
  color:#fff;
  background:var(--ejust-primary);
}
@keyframes loginShake{
  0%, 100%{ transform:translateX(0); }
  20%{ transform:translateX(-6px); }
  40%{ transform:translateX(6px); }
  60%{ transform:translateX(-4px); }
  80%{ transform:translateX(4px); }
}
.login-field.is-shaking .login-input-group{
  animation:loginShake .34s ease;
  box-shadow:0 0 0 .22rem rgba(176,0,32,.16);
}
@media (max-width: 992px){
  .auth-shell{
    grid-template-columns: 1fr;
  }
  .auth-brand-panel{
    min-height: auto;
    padding: 1.25rem;
  }
  .auth-brand-panel__title{
    font-size: 2rem;
  }
  .auth-content{
    align-items:flex-start;
  }
}
@media (max-width: 576px){
  .auth-choice{
    align-items:flex-start;
  }
  .auth-choice__arrow{
    display:none;
  }
}

.student-portal-body{
  min-height:100vh;
  background: var(--ejust-bg);
}
.student-portal-header{
  position: sticky;
  top: 0;
  z-index: 1020;
  background: var(--ejust-secondary);
  border-bottom: 3px solid var(--ejust-primary);
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
}
.student-portal-nav{
  padding-top:.85rem;
  padding-bottom:.85rem;
}
.student-portal-brand{
  display:flex;
  align-items:center;
  gap:.75rem;
  min-width:0;
  color:#fff;
  text-decoration:none;
}
.student-portal-brand:hover{
  color:#fff;
}
.student-portal-brand__text{
  display:grid;
  min-width:0;
  line-height:1.15;
}
.student-portal-brand__title{
  color:#fff;
  font-weight:900;
  font-size:1rem;
}
.student-portal-brand__subtitle{
  color:rgba(255,255,255,.72);
  font-size:.78rem;
  max-width: 34ch;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.student-portal-toggler{
  border:1px solid rgba(255,255,255,.25);
  color:#fff;
  box-shadow:none;
}
.student-portal-toggler:focus{
  box-shadow:0 0 0 .2rem rgba(255,255,255,.16);
}
.student-portal-menu{
  gap:.35rem;
}
.student-portal-menu .nav-link{
  display:flex;
  align-items:center;
  gap:.45rem;
  border-radius:999px;
  color:rgba(255,255,255,.82);
  font-weight:800;
  padding:.55rem .75rem;
}
.student-portal-menu .nav-link:hover,
.student-portal-menu .nav-link.active{
  color:#fff;
  background:rgba(255,255,255,.10);
}
.student-portal-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.75rem;
}
.student-portal-user{
  display:flex;
  align-items:center;
  gap:.55rem;
  min-width:0;
  padding:.35rem .55rem;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
}
.student-portal-user__avatar{
  width:34px;
  height:34px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.20);
  flex:0 0 auto;
}
.student-portal-user__text{
  display:grid;
  min-width:0;
  line-height:1.1;
}
.student-portal-user__name{
  font-weight:900;
  font-size:.86rem;
  max-width:16ch;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.student-portal-user__email{
  color:rgba(255,255,255,.68);
  font-size:.76rem;
  max-width:20ch;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.student-portal-main{
  padding: clamp(1rem, 2.5vw, 2rem) 0;
}
.available-shell{
  width:100%;
}
.available-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border:1px solid var(--ejust-border);
  border-radius: 1rem;
  background:#fff;
  box-shadow: 0 16px 40px rgba(17,17,17,.08);
}
.available-breadcrumb{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  color:var(--ejust-primary);
  font-weight:900;
  margin-bottom:.5rem;
}
.available-title{
  margin:0;
  font-weight:900;
  font-size:clamp(1.65rem, 2.8vw, 2.5rem);
}
.available-lead{
  color:var(--ejust-muted);
  margin:.4rem 0 0;
  max-width:68rem;
}
.available-header__badge{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding:.5rem .75rem;
  border-radius:999px;
  border:1px solid rgba(122,0,0,.18);
  background:rgba(122,0,0,.08);
  color:var(--ejust-primary);
  font-weight:900;
  white-space:nowrap;
}
.available-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
  gap:1rem;
  align-items:stretch;
}
.available-card,
.available-empty{
  padding: clamp(1.1rem, 2vw, 1.5rem);
  border:1px solid var(--ejust-border);
  border-radius: 1rem;
  background:#fff;
  box-shadow: 0 14px 34px rgba(17,17,17,.08);
}
.available-card{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.available-card form{
  margin-top:auto !important;
  padding-top:1rem;
}
.admissions-card-grid{
  width:100%;
}
.admission-card-modern{
  overflow:hidden;
  min-width:0;
  transition: transform .14s ease, box-shadow .14s ease;
}
.admission-card-modern:hover{
  transform: translateY(-3px);
  box-shadow: 0 18px 42px rgba(17,17,17,.12) !important;
}
.admission-card-modern__icon{
  width:48px;
  height:48px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:rgba(122,0,0,.08);
  border:1px solid rgba(122,0,0,.18);
  color:var(--ejust-primary);
  font-size:1.25rem;
  flex:0 0 auto;
}
.admission-card-modern__badge{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:.45rem .7rem;
  border-radius:999px;
  background:rgba(25,135,84,.10);
  color:#146c43;
  border:1px solid rgba(25,135,84,.18);
  font-weight:900;
}
.admission-card-modern__title{
  font-weight:900;
  color:var(--ejust-secondary);
  margin-bottom:.5rem;
}
.admission-card-modern__description{
  color:var(--ejust-muted);
  margin-bottom:1rem;
}
.admission-card-modern__meta{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:.75rem;
  margin-top:auto;
}
.admission-card-modern__meta-item{
  min-width:0;
  padding:.75rem;
  border-radius:.9rem;
  background:rgba(17,17,17,.03);
  border:1px solid var(--ejust-border);
}
.admission-card-modern__meta-label{
  display:block;
  color:var(--ejust-muted);
  font-size:.74rem;
  font-weight:900;
  margin-bottom:.2rem;
}
.admission-card-modern__meta-value{
  display:block;
  color:var(--ejust-secondary);
  font-weight:900;
}
.admission-card-modern__action{
  min-height:48px;
  font-weight:900;
}
.profile-shell{
  width:100%;
}
.profile-card{
  padding:clamp(1.1rem, 2vw, 1.5rem);
  border:1px solid var(--ejust-border);
  border-radius:1rem;
  background:#fff;
  box-shadow:0 14px 34px rgba(17,17,17,.08);
  min-width:0;
}
.profile-card__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:1rem;
}
.profile-info-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.85rem;
}
.profile-info-item,
.profile-timeline__item{
  padding:.85rem;
  border:1px solid var(--ejust-border);
  border-radius:.9rem;
  background:rgba(17,17,17,.03);
  min-width:0;
}
.profile-info-item span,
.profile-timeline__item span{
  display:block;
  color:var(--ejust-muted);
  font-size:.76rem;
  font-weight:900;
  margin-bottom:.22rem;
}
.profile-info-item strong,
.profile-timeline__item strong{
  display:block;
  color:var(--ejust-secondary);
  font-weight:900;
}
.profile-timeline{
  display:grid;
  gap:.75rem;
}
.profile-empty{
  display:flex;
  align-items:flex-start;
  gap:.8rem;
  padding:1rem;
  border:1px dashed rgba(17,17,17,.18);
  border-radius:1rem;
  background:rgba(17,17,17,.03);
  color:var(--ejust-muted);
}
.profile-empty i{
  color:var(--ejust-primary);
  font-size:1.4rem;
}
.profile-application-card{
  height:100%;
  padding:1rem;
  border:1px solid var(--ejust-border);
  border-radius:1rem;
  background:#fff;
  box-shadow:0 10px 24px rgba(17,17,17,.06);
}
.profile-progress .progress{
  height:.55rem;
  border-radius:999px;
  background:rgba(17,17,17,.09);
}
.profile-progress .progress-bar{
  background:linear-gradient(90deg, var(--ejust-primary), #b21b1b);
}
.profile-app-meta{
  display:grid;
  gap:.45rem;
  margin-top:1rem;
  color:var(--ejust-muted);
  font-weight:750;
  font-size:.88rem;
}
.profile-app-meta span{
  display:flex;
  gap:.45rem;
  align-items:center;
}
.profile-app-meta i{
  color:var(--ejust-primary);
}
.profile-result--success{
  border-color:rgba(25,135,84,.25);
  background:linear-gradient(180deg, rgba(25,135,84,.08), #fff);
}
.profile-result--danger{
  border-color:rgba(176,0,32,.25);
  background:linear-gradient(180deg, rgba(176,0,32,.08), #fff);
}
.profile-result--warning{
  border-color:rgba(255,193,7,.35);
  background:linear-gradient(180deg, rgba(255,193,7,.12), #fff);
}
.profile-result--info,
.profile-result--muted{
  border-color:rgba(122,0,0,.16);
  background:linear-gradient(180deg, rgba(122,0,0,.06), #fff);
}
.available-card__icon{
  width:46px;
  height:46px;
  border-radius: 16px;
  display:grid;
  place-items:center;
  background: rgba(122,0,0,.08);
  color: var(--ejust-primary);
  border:1px solid rgba(122,0,0,.18);
}
.available-card__status{
  display:inline-flex;
  align-items:center;
  padding:.35rem .6rem;
  border-radius:999px;
  background: rgba(25,135,84,.10);
  color:#146c43;
  border:1px solid rgba(25,135,84,.18);
  font-weight:800;
  font-size:.82rem;
}
.available-meta{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:.75rem;
  margin:1rem 0 0;
}
.available-meta div{
  padding:.75rem;
  border-radius:.85rem;
  background: rgba(17,17,17,.03);
  border:1px solid var(--ejust-border);
}
.available-meta dt{
  color: var(--ejust-muted);
  font-size:.75rem;
  font-weight:800;
}
.available-meta dd{
  margin:0;
  font-weight:800;
}
@media (min-width: 1400px){
  .available-grid{
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 390px), 1fr));
  }
}
@media (max-width: 991.98px){
  .admission-header-bar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.75rem;
    flex-wrap:nowrap;
  }
  .admission-header-brand__text{
    max-width: min(54vw, 360px);
  }
  .admission-header-actions{
    flex:0 0 auto;
  }
  .student-portal-actions{
    align-items:flex-start;
    justify-content:flex-start;
    flex-direction:column;
    padding-top:.5rem;
  }
  .student-portal-menu .nav-link{
    border-radius:.75rem;
  }
}
@media (max-width: 768px){
  .available-header{
    flex-direction:column;
  }
  .available-meta{
    grid-template-columns: 1fr;
  }
  .available-header__badge{
    white-space:normal;
  }
  .admission-card-modern__meta{
    grid-template-columns:1fr;
  }
  .profile-info-grid{
    grid-template-columns:1fr;
  }
  .profile-card__header{
    flex-direction:column;
  }
}
@media (max-width: 576px){
  .admission-header-bar{
    padding:.75rem 0;
  }
  .admission-header-brand{
    gap:.55rem;
  }
  .admission-header-brand .brand-mark{
    width:40px;
    height:40px;
  }
  .admission-header-actions{
    gap:.35rem;
  }
  .admission-header-actions .btn{
    padding:.45rem .55rem;
  }
  .admission-header-actions .btn i{
    margin-right:0 !important;
  }
  .admission-header-actions .btn{
    font-size:0;
  }
  .admission-header-actions .btn i{
    font-size:1rem;
  }
  .student-portal-brand__subtitle,
  .student-portal-user__email{
    display:none;
  }
  .student-portal-main{
    padding-top:1rem;
  }
}

/* Global processing loader */
.portal-loader-active,
.portal-loader-active body{
  overflow:hidden;
}
.portal-loader{
  position:fixed;
  inset:0;
  z-index:2000;
  display:grid;
  place-items:center;
  padding:1rem;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .18s ease, visibility .18s ease;
}
.portal-loader.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.portal-loader__backdrop{
  position:absolute;
  inset:0;
  background:rgba(17,17,17,.48);
  backdrop-filter:blur(7px);
}
.portal-loader__panel{
  position:relative;
  width:min(100%, 360px);
  display:grid;
  justify-items:center;
  gap:.9rem;
  padding:1.35rem;
  border-radius:1.1rem;
  border:1px solid rgba(255,255,255,.24);
  background:rgba(255,255,255,.96);
  box-shadow:0 24px 70px rgba(0,0,0,.28);
  transform:translateY(8px) scale(.98);
  transition:transform .18s ease;
}
.portal-loader.is-visible .portal-loader__panel{
  transform:translateY(0) scale(1);
}
.portal-loader__spinner{
  position:relative;
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
}
.portal-loader__spinner::before{
  content:"";
  width:58px;
  height:58px;
  border-radius:50%;
  border:4px solid rgba(122,0,0,.12);
  border-top-color:var(--ejust-primary);
  animation:portalSpin .82s linear infinite;
}
.portal-loader__spinner span{
  position:absolute;
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--ejust-primary);
  opacity:.14;
  animation:portalPulse 1.05s ease-in-out infinite;
}
.portal-loader__spinner span:last-child{
  animation-delay:.18s;
}
.portal-loader__message{
  color:var(--ejust-secondary);
  font-weight:900;
  text-align:center;
}
.portal-loader__bar{
  width:100%;
  height:7px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(122,0,0,.10);
}
.portal-loader__bar span{
  display:block;
  width:45%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg, var(--ejust-primary), #b21b1b);
  animation:portalBar 1.05s ease-in-out infinite;
}
.btn.is-processing{
  cursor:wait;
  opacity:.86;
}
.portal-form{
  transition:opacity .16s ease;
}
.applicant-code-pill{
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.24);
}
.applicant-avatar{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:999px;
  border:3px solid rgba(255,255,255,.92);
  background:#fff;
  box-shadow:0 10px 24px rgba(17,17,17,.14);
  flex:0 0 auto;
}
.applicant-avatar img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.applicant-avatar--xs{
  width:38px;
  height:38px;
  border-width:2px;
}
.applicant-avatar--sm{
  width:48px;
  height:48px;
}
.applicant-avatar--md{
  width:58px;
  height:58px;
}
.applicant-avatar--lg{
  width:76px;
  height:76px;
}
.applicant-avatar--xl{
  width:104px;
  height:104px;
}
.applicant-code-card{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.85rem 1rem;
  border-radius:1rem;
  border:1px solid rgba(122,0,0,.16);
  background:linear-gradient(180deg, rgba(122,0,0,.06), #fff);
  box-shadow:0 12px 28px rgba(17,17,17,.06);
}
.applicant-code-card__icon{
  width:42px;
  height:42px;
  border-radius:14px;
  display:grid;
  place-items:center;
  color:var(--ejust-primary);
  background:rgba(122,0,0,.09);
  border:1px solid rgba(122,0,0,.14);
  flex:0 0 auto;
}
.applicant-code-card__label,
.applicant-code-card__value{
  display:block;
  line-height:1.1;
}
.applicant-code-card__label{
  color:var(--ejust-muted);
  font-size:.76rem;
  font-weight:900;
}
.applicant-code-card__value{
  color:var(--ejust-secondary);
  font-weight:950;
  font-size:1.05rem;
}
.admission-sidebar-applicant{
  display:flex;
  align-items:center;
  gap:.85rem;
  padding:1rem;
  border-radius:1rem;
  background:#fff;
  border:1px solid var(--ejust-border);
  box-shadow:0 12px 28px rgba(17,17,17,.06);
}
.admission-sidebar-applicant__name{
  color:var(--ejust-secondary);
  font-weight:950;
  line-height:1.15;
}
.admission-sidebar-applicant__code{
  color:var(--ejust-muted);
  font-size:.82rem;
  font-weight:800;
  margin-top:.2rem;
}
.profile-hero-identity{
  display:flex;
  align-items:center;
  gap:1rem;
}
@media (max-width: 575.98px){
  .profile-hero-identity{
    align-items:flex-start;
  }
  .applicant-avatar--xl{
    width:78px;
    height:78px;
  }
}
.address-preview-card{
  display:flex;
  align-items:flex-start;
  gap:.8rem;
  padding:1rem;
  border-radius:1rem;
  border:1px solid var(--ejust-border);
  background:rgba(17,17,17,.03);
  min-height:150px;
}
.address-preview-card--en{
  direction:ltr;
  text-align:left;
}
.address-preview-card--ar{
  direction:rtl;
  text-align:right;
}
.address-preview-card__icon{
  width:44px;
  height:44px;
  border-radius:15px;
  display:grid;
  place-items:center;
  background:rgba(122,0,0,.08);
  color:var(--ejust-primary);
  border:1px solid rgba(122,0,0,.14);
  flex:0 0 auto;
}
.address-preview-card--ar .address-preview-card__icon{
  order:2;
}
.address-preview-card__body{
  min-width:0;
  flex:1 1 auto;
}
.address-preview-card__label{
  color:var(--ejust-muted);
  font-size:.78rem;
  font-weight:900;
  margin-bottom:.45rem;
}
.address-preview-card__line{
  color:var(--ejust-secondary);
  font-weight:900;
  line-height:1.65;
  white-space:pre-wrap;
}
.address-preview-card__meta{
  margin-top:.55rem;
  color:var(--ejust-muted);
  font-size:.9rem;
  font-weight:750;
}
.residence-instructions-modal .modal-content{
  border:0;
  border-radius:1.15rem;
  box-shadow:0 24px 70px rgba(17,17,17,.28);
}
.residence-instructions-modal .modal-header,
.residence-instructions-modal .modal-footer{
  border-color:var(--ejust-border);
}
.school-instructions-modal .modal-content{
  border:0;
  border-radius:1.15rem;
  box-shadow:0 24px 70px rgba(17,17,17,.28);
  overflow:hidden;
}
.school-instructions-modal .modal-header,
.school-instructions-modal .modal-footer{
  border-color:var(--ejust-border);
}
.school-instructions-modal .modal-header{
  background:linear-gradient(180deg, rgba(20,120,82,.08), rgba(255,255,255,0));
}
.school-instructions-modal__title-ar{
  color:var(--ejust-secondary);
  font-size:.95rem;
  font-weight:850;
  margin-top:.35rem;
}
.school-instructions-modal__section{
  background:var(--ejust-surface-soft);
  border:1px solid var(--ejust-border);
  border-radius:1rem;
  padding:1rem;
}
.school-instructions-modal__section + .school-instructions-modal__section{
  margin-top:1rem;
}
.school-instructions-modal__section--ar{
  text-align:right;
}
.school-instructions-modal__list{
  margin-bottom:0;
  padding-inline-start:1.25rem;
  line-height:1.65;
  color:var(--ejust-secondary);
}
.school-instructions-modal__section--ar .school-instructions-modal__list{
  padding-inline-start:0;
  padding-inline-end:1.25rem;
}
.portal-date-picker,
.graduation-date-picker{
  width:100%;
  border-radius:16px;
  box-shadow:0 10px 24px rgba(17,17,17,.05);
  transition:box-shadow .18s ease, transform .18s ease;
}
.portal-date-picker:hover,
.graduation-date-picker:hover{
  box-shadow:0 14px 30px rgba(17,17,17,.08);
}
.portal-date-picker:focus-within,
.graduation-date-picker:focus-within{
  box-shadow:0 0 0 .22rem rgba(122,0,0,.10), 0 14px 30px rgba(17,17,17,.08);
}
.portal-date-picker .form-control,
.graduation-date-picker .form-control{
  border-top-left-radius:16px;
  border-bottom-left-radius:16px;
  min-height:48px;
  cursor:pointer;
  background:#fff;
}
.input-shell .portal-date-picker .form-control{
  padding-left:1rem;
}
.portal-date-picker__button,
.graduation-date-picker__button{
  border-top-right-radius:16px;
  border-bottom-right-radius:16px;
  min-width:52px;
  color:var(--ejust-primary);
  border-color:var(--ejust-border);
  background:#fff;
}
.portal-date-picker__button:hover,
.portal-date-picker__button:focus,
.graduation-date-picker__button:hover,
.graduation-date-picker__button:focus{
  color:#fff;
  border-color:var(--ejust-primary);
  background:var(--ejust-primary);
}
.portal-date-picker.is-invalid .form-control,
.portal-date-picker.is-invalid .portal-date-picker__button,
.graduation-date-picker.is-invalid .form-control,
.graduation-date-picker.is-invalid .graduation-date-picker__button{
  border-color:var(--ejust-danger);
}
.portal-date-picker--readonly .form-control{
  background:var(--ejust-bg);
  color:var(--ejust-muted);
  cursor:not-allowed;
}
.portal-date-picker--readonly .portal-date-picker__button{
  opacity:.68;
  cursor:not-allowed;
}
.flatpickr-calendar{
  border:0;
  border-radius:18px;
  box-shadow:0 22px 60px rgba(17,17,17,.22);
  font-family:"Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected:hover{
  background:var(--ejust-primary);
  border-color:var(--ejust-primary);
}
.flatpickr-day.today{
  border-color:var(--ejust-primary);
}
.english-helper-card{
  display:flex;
  gap:1rem;
  align-items:flex-start;
  padding:1rem;
  border:1px solid var(--ejust-border);
  border-radius:18px;
  background:linear-gradient(180deg,#fff,var(--ejust-surface-soft));
  box-shadow:0 12px 28px rgba(17,17,17,.05);
}
.english-helper-card__icon{
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  flex:0 0 44px;
  color:var(--ejust-primary);
  background:rgba(122,0,0,.08);
  border-radius:14px;
}
.english-not-taken-message{
  border:0;
  border-radius:18px;
  box-shadow:0 12px 30px rgba(13,110,253,.08);
}
.upload-inline{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:.75rem 1rem;
  border:1px dashed var(--ejust-border);
  border-radius:16px;
  color:var(--ejust-primary);
  background:#fff;
  cursor:pointer;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.upload-inline:hover,
.upload-inline:focus-within{
  border-color:var(--ejust-primary);
  box-shadow:0 12px 28px rgba(122,0,0,.08);
  transform:translateY(-1px);
}
.upload-inline input{
  position:absolute;
  inline-size:1px;
  block-size:1px;
  opacity:0;
  pointer-events:none;
}
.admission-instructions-modal .modal-content{
  border-radius:24px;
  overflow:hidden;
}
.admission-instructions-modal .modal-header{
  background:var(--ejust-surface-soft);
  border-bottom:1px solid var(--ejust-border);
}
.instruction-list{
  margin-bottom:0;
  line-height:1.7;
  color:var(--ejust-secondary);
}
.faculty-choice-card{
  position:relative;
  display:flex;
  gap:1rem;
  min-height:132px;
  height:100%;
  padding:1rem 1rem 1rem 3.35rem;
  border:1px solid var(--ejust-border);
  border-radius:18px;
  background:#fff;
  box-shadow:0 12px 30px rgba(17,17,17,.045);
  cursor:pointer;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}
.faculty-choice-card:hover,
.faculty-choice-card:focus-within{
  border-color:rgba(122,0,0,.45);
  box-shadow:0 18px 42px rgba(17,17,17,.08);
  transform:translateY(-1px);
}
.faculty-choice-card.is-selected{
  border-color:var(--ejust-primary);
  background:linear-gradient(180deg,#fff,rgba(122,0,0,.045));
  box-shadow:0 18px 42px rgba(122,0,0,.12);
}
.faculty-choice-card__input{
  position:absolute;
  inline-size:1px;
  block-size:1px;
  opacity:0;
}
.faculty-choice-card__check{
  position:absolute;
  left:1rem;
  top:1rem;
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border:1px solid var(--ejust-border);
  border-radius:999px;
  color:transparent;
  background:#fff;
  transition:all .18s ease;
}
.faculty-choice-card.is-selected .faculty-choice-card__check{
  color:#fff;
  border-color:var(--ejust-primary);
  background:var(--ejust-primary);
}
.faculty-choice-card__content{
  display:flex;
  flex-direction:column;
  gap:.45rem;
  min-width:0;
}
.faculty-choice-card__ar{
  font-weight:800;
  color:var(--ejust-primary);
  font-size:1.02rem;
  text-align:right;
}
.faculty-choice-card__en{
  color:var(--ejust-secondary);
  line-height:1.45;
}
.faculty-list{
  display:flex;
  flex-direction:column;
  gap:.85rem;
}
.faculty-choice-card--row{
  min-height:96px;
  width:100%;
  margin:0;
}
.selected-preference-empty{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.7rem;
  min-height:96px;
  color:var(--ejust-muted);
  border:1px dashed var(--ejust-border);
  border-radius:18px;
  background:var(--ejust-surface-soft);
  font-weight:700;
}
.selected-preference-empty i{
  color:var(--ejust-primary);
  font-size:1.35rem;
}
.selected-preference-card{
  display:flex;
  gap:1rem;
  align-items:flex-start;
  padding:1rem;
  border:1px solid rgba(122,0,0,.22);
  border-radius:18px;
  background:linear-gradient(180deg,#fff,rgba(122,0,0,.05));
  box-shadow:0 18px 42px rgba(122,0,0,.10);
}
.selected-preference-card__badge{
  flex:0 0 auto;
  padding:.45rem .75rem;
  color:#fff;
  background:var(--ejust-primary);
  border-radius:999px;
  font-size:.78rem;
  font-weight:800;
}
.selected-preference-card__body{
  display:flex;
  flex-direction:column;
  gap:.35rem;
  min-width:0;
}
.selected-preference-card__ar{
  color:var(--ejust-primary);
  font-weight:850;
  font-size:1.08rem;
  text-align:right;
}
.selected-preference-card__en{
  color:var(--ejust-secondary);
  line-height:1.45;
  font-weight:650;
}
.guardian-card{
  position:relative;
  padding:1rem;
  border:1px solid var(--ejust-border);
  border-radius:18px;
  background:linear-gradient(180deg,#fff,rgba(17,17,17,.018));
  box-shadow:0 14px 34px rgba(17,17,17,.055);
}
.guardian-card__badge{
  display:inline-flex;
  align-items:center;
  width:max-content;
  padding:.45rem .75rem;
  margin-bottom:1rem;
  color:#fff;
  background:var(--ejust-primary);
  border-radius:999px;
  font-size:.78rem;
  font-weight:900;
}
.guardian-address-textarea{
  min-height:120px;
  resize:vertical;
}
.guardian-second-empty{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.7rem;
  min-height:120px;
  color:var(--ejust-muted);
  border:1px dashed var(--ejust-border);
  border-radius:18px;
  background:var(--ejust-surface-soft);
  font-weight:800;
}
.guardian-second-empty i{
  color:var(--ejust-primary);
  font-size:1.45rem;
}
.guardian-instructions-modal .modal-content{
  border-radius:24px;
  overflow:hidden;
}
.guardian-instructions-modal__title-ar{
  color:var(--ejust-secondary);
  font-size:.95rem;
  font-weight:850;
  margin-top:.35rem;
}
.guardian-bootstrap-card{
  overflow:hidden;
}
.guardian-bootstrap-card .form-control-lg,
.guardian-bootstrap-card .form-select-lg{
  min-height:52px;
  border-radius:1rem;
  font-size:1rem;
}
.guardian-emergency-box{
  display:flex;
  align-items:center;
  min-height:52px;
  padding:.7rem 1rem;
  border:1px solid var(--ejust-border);
  border-radius:1rem;
  background:rgba(122,0,0,.045);
}
.guardian-emergency-box .form-check-input{
  width:3rem;
  height:1.5rem;
  cursor:pointer;
}
.guardian-emergency-box .form-check-input:checked{
  background-color:var(--ejust-primary);
  border-color:var(--ejust-primary);
}
@media (max-width:575.98px){
  .selected-preference-card{
    flex-direction:column;
  }
}
@keyframes portalSpin{
  to{ transform:rotate(360deg); }
}
@keyframes portalPulse{
  0%, 100%{ transform:scale(.65); opacity:.10; }
  50%{ transform:scale(1.08); opacity:.22; }
}
@keyframes portalBar{
  0%{ transform:translateX(-110%); }
  100%{ transform:translateX(235%); }
}
@media (prefers-reduced-motion: reduce){
  .portal-loader,
  .portal-loader__panel,
  .portal-loader__spinner::before,
  .portal-loader__spinner span,
  .portal-loader__bar span{
    animation:none;
    transition:none;
  }
}

.required-document-card{
  transition:transform .18s ease, box-shadow .18s ease;
}
.required-document-card:hover{
  transform:translateY(-2px);
}
.required-document-card.is-invalid{
  box-shadow:0 0 0 .2rem rgba(220,53,69,.12), 0 .5rem 1rem rgba(15,23,42,.08) !important;
}
.required-document-upload{
  min-height:180px;
  cursor:pointer;
}
.required-document-upload.is-invalid{
  border-color:#dc3545;
  background:rgba(220,53,69,.04);
}
.required-document-preview__image{
  display:none;
  width:100%;
  height:96px;
  object-fit:cover;
  border:1px solid rgba(15,23,42,.12);
  border-radius:12px;
  background:#f8fafc;
}
.required-document-preview__image.is-visible{
  display:block;
}
.required-document-preview__pdf{
  align-items:center;
  gap:.5rem;
  color:#b42318;
  font-weight:600;
}
.required-document-preview__pdf:not(.d-none){
  display:flex;
}
.required-document-preview{
  display:none;
}
.required-document-preview.is-visible{
  display:block;
}
.required-document-preview-card{
  display:flex;
  align-items:center;
  gap:1rem;
  padding:1rem;
  border:1px solid var(--ejust-border);
  border-radius:1rem;
  background:#fff;
}
.required-document-preview-card__media{
  width:112px;
  min-width:112px;
  height:96px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:#f8fafc;
  overflow:hidden;
}
.required-document-preview__file-icon{
  font-size:2.75rem;
  color:var(--ejust-primary);
}
.required-document-preview-card__body{
  min-width:0;
  flex:1;
}
.required-document-preview__name{
  overflow-wrap:anywhere;
}
@media (max-width:575.98px){
  .required-document-preview-card{
    align-items:flex-start;
    flex-direction:column;
  }
  .required-document-preview-card__media{
    width:100%;
  }
}

.fawry-logo{
  height:42px;
  max-width:140px;
  object-fit:contain;
}

.fawry-logo--sm{
  height:28px;
  max-width:96px;
}

.fawry-logo--btn{
  height:20px;
  max-width:72px;
  vertical-align:middle;
}

.btn-fawry-payment{
  background:#0d6efd;
  color:#fff;
  border:0;
  padding:.75rem 1.25rem;
  font-weight:600;
  pointer-events:auto;
}

.btn-fawry-payment:hover,
.btn-fawry-payment:focus{
  background:#0b5ed7;
  color:#fff;
}

.payment-card-btn{
  width:100%;
  border:0;
  background:transparent;
  padding:0;
  text-align:inherit;
}

.payment-card{
  cursor:pointer;
  transition:all .25s ease;
}

.payment-card:hover{
  transform:translateY(-6px);
  box-shadow:0 16px 35px rgba(0,0,0,.12);
}

.payment-order-page--compact{
  gap:1rem;
}

.payment-order-heading{
  align-items:center;
}

.payment-order-status-badge{
  align-self:flex-start;
  padding:.45rem .75rem;
  border-radius:999px;
  font-size:.8rem;
}

.payment-order-shell{
  padding:1rem;
  box-shadow:none;
}

.payment-order-column{
  display:grid;
  gap:.75rem;
}

.payment-order-column--summary{
  align-content:start;
}

.payment-order-block__title{
  margin-bottom:.5rem;
  color:var(--ejust-secondary);
  font-size:.95rem;
  font-weight:900;
}

.detail-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  padding:.55rem 0;
  border-bottom:1px solid rgba(17,17,17,.08);
}

.detail-row:last-child{
  border-bottom:0;
}

.detail-label{
  color:var(--ejust-muted);
  font-size:.82rem;
  font-weight:800;
  flex:0 0 42%;
}

.detail-value{
  color:var(--ejust-secondary);
  font-weight:850;
  text-align:end;
  overflow-wrap:anywhere;
  flex:1 1 auto;
}

.payment-order-total{
  display:grid;
  gap:.2rem;
  padding:.85rem 1rem;
  border:1px solid rgba(122,0,0,.16);
  border-radius:1rem;
  background:linear-gradient(180deg, rgba(122,0,0,.05), #fff);
}

.payment-order-total__label{
  color:var(--ejust-muted);
  font-size:.78rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.payment-order-total__value{
  color:var(--ejust-primary);
  font-size:1.25rem;
  font-weight:950;
  line-height:1.2;
  overflow-wrap:anywhere;
}

.payment-order-note{
  font-size:.88rem;
  line-height:1.5;
}

.payment-order-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
}

.payment-order-actions .btn{
  flex:1 1 180px;
}

.payment-order-page[dir="rtl"] .detail-value{
  text-align:start;
}

@media (max-width: 575.98px){
  .payment-order-shell{
    padding:.85rem;
  }

  .detail-row{
    flex-direction:column;
    gap:.25rem;
  }

  .detail-label,
  .detail-value{
    flex:auto;
    text-align:start;
  }

  .payment-order-total__value{
    font-size:1.12rem;
  }
}