@font-face {
  font-family: "Sahla Partners";
  src: url("/assets/partners-download/tajawal-arabic-400-normal.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
.partner-auth-scene .partner-recruitment-ad{position:relative;display:block;width:100%;height:112px;min-height:112px;aspect-ratio:auto;margin:6px 0 2px;padding:0;border:0;border-radius:13px;background:#075f42;color:#fff;text-decoration:none;box-shadow:0 8px 22px #063f2c20;overflow:hidden}.partner-auth-scene .partner-recruitment-ad :is(img,video){position:absolute;inset:0;width:100%;height:100%;border-radius:0;object-fit:cover;object-position:center 24%}.partner-auth-scene .partner-recruitment-ad span{position:absolute;inset:auto 0 0;display:flex;width:100%;height:47%;padding:20px 28px 5px 9px;flex-direction:column;justify-content:flex-end;gap:1px;background:linear-gradient(0deg,rgba(2,52,36,.96) 0,rgba(3,72,49,.7) 54%,transparent 100%);color:#fff;text-align:right;text-shadow:0 2px 6px #002c1e}.partner-auth-scene .partner-recruitment-ad b{font-size:.66rem;font-weight:900;line-height:1.25}.partner-auth-scene .partner-recruitment-ad small{color:#effff7;font-size:.5rem;line-height:1.3}.partner-auth-scene .partner-recruitment-ad i{position:absolute;z-index:2;right:9px;bottom:7px;color:#ffd026;font-size:1rem;font-style:normal;filter:drop-shadow(0 2px 3px #002c1e)}

@font-face {
  font-family: "Sahla Partners";
  src: url("/assets/partners-download/tajawal-arabic-700-normal.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}

/* The approved Algiers scene stays behind the partner access flow. */
.partner-auth-scene {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  width: min(100%, 520px);
  min-height: 100svh;
  margin: 0 auto;
  padding: 0 0 max(12px, env(safe-area-inset-bottom));
  border-radius: 0;
  background: #084b38;
  font-family: "Sahla Partners", Tahoma, Arial, sans-serif;
}

.partner-auth-scene::before {
  content: "";
  position: fixed;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 50%;
  width: min(100vw, 520px);
  transform: translateX(-50%);
  pointer-events: none;
  background-color: #063d2c;
  background:
    linear-gradient(180deg, #ffffff12 0%, transparent 43%, #063d2c99 75%, #063d2cf0 100%),
    url("/assets/partners-download/partners-full-background.png") center top / 100% auto no-repeat;
}

.partner-auth-scene > header {
  position: relative;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
  min-height: 64px;
  flex-shrink: 0;
  padding: max(8px, env(safe-area-inset-top)) 14px 8px;
  background: transparent;
}

.partner-auth-scene > .partner-auth-brand {
  justify-content: center;
}

.partner-auth-scene > header .brand,
.partner-auth-scene > header .logo {
  display: block;
  width: 104px;
  max-height: 48px;
  height: auto;
  object-fit: contain;
}

.partner-auth-scene.partner-choice > .access-card,
.partner-auth-scene > .signin.panel {
  position: relative;
  width: calc(100% - 24px);
  flex-shrink: 0;
  margin: 6px 12px 12px;
  padding: 12px 14px;
  border: 1px solid #ffffffc9;
  border-radius: 20px;
  background: #ffffffee;
  box-shadow: 0 16px 48px #02332438;
  color: #163f30;
}

/* Keep the people unobstructed: the role chooser sits on the lower part of the photo. */
.partner-auth-scene.partner-choice > .access-card {
  margin-top: auto;
  margin-bottom: max(8px, env(safe-area-inset-bottom));
}

@media (max-height: 690px) {
  .partner-auth-scene.partner-choice > .access-card {
    max-height: 46svh;
    overflow-y: auto;
    scrollbar-width: thin;
  }
}

.partner-auth-scene .portal-role-mark {
  height: 48px;
  margin: 0;
}

.partner-auth-scene .portal-role-mark > .service-badge-art {
  width: 38px;
  height: 48px;
  margin: 0;
}

.partner-auth-scene .signin h1 {
  margin: 2px 0 6px;
  font-size: 1.25rem;
  line-height: 1.4;
}

.partner-auth-scene .signin .eyebrow {
  margin: 0;
}

.partner-auth-scene .signin > .muted,
.partner-auth-scene .portal-hint {
  margin: 8px 0 10px;
  line-height: 1.45;
}

.partner-auth-scene .stack {
  gap: 8px;
}

.partner-auth-scene .stack input,
.partner-auth-scene .stack select {
  background: #fff;
  min-height: 44px;
  padding: 9px 11px;
  font-size: 1rem;
}

.partner-auth-scene .error:empty {
  display: none;
}

.partner-auth-scene .signin .primary {
  width: 100%;
  min-height: 44px;
}

.partner-auth-scene .partner-options .entry-card {
  background: #fffffff5;
  min-height: 72px;
  grid-template-columns: 42px minmax(0, 1fr) 20px !important;
  gap: 8px;
  padding: 7px 8px;
  border-radius: 14px;
}

.partner-auth-scene .partner-options {
  gap: 7px;
}

.partner-auth-scene .partner-options .entry-card > .service-badge-art {
  width: 42px !important;
  height: 54px !important;
}

.partner-auth-scene .partner-options .entry-card > .entry-copy {
  gap: 1px;
}

.partner-auth-scene .partner-options .entry-card .entry-copy b {
  font-size: 1.08rem;
  font-weight: 700;
  line-height: 1.3;
}

.partner-auth-scene .partner-options .entry-card .entry-copy small {
  color: #315d4e;
  font-size: .98rem;
  font-weight: 500;
  line-height: 1.4;
}

.partner-auth-scene .partner-options .entry-card > i {
  width: 20px;
  height: 20px;
}

.partner-auth-scene.partner-choice .access-card > h1,
.partner-auth-scene .partner-options > h2 {
  margin: 0 0 8px;
  font-size: 1.25rem;
  line-height: 1.4;
}

.partner-signin-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.partner-auth-scene .partner-signin-title + .muted{margin-top:2px}.partner-auth-scene .secondary.wide{min-height:42px;margin-top:7px}.partner-auth-scene #staff-login + .secondary.wide{margin-top:8px}.partner-auth-scene .signin.panel{overflow-y:auto;scrollbar-width:thin}

.partner-auth-scene .stack label {
  gap: 4px;
  font-size: .875rem;
  line-height: 1.4;
}

.partner-auth-scene .signin-language {
  margin-top: 0;
}

.partner-auth-scene .reset-link {
  display: flex;
  margin: 0 auto;
  min-height: 44px;
  padding: 6px 10px;
}

/* Match a portrait 9:16 phone frame on larger screens. Content can still grow. */
@media (min-width: 600px) {
  .partner-auth-scene,
  .partner-auth-scene::before {
    width: min(430px, 56.25svh);
  }
  .partner-auth-scene{min-height:min(844px,calc(100svh - 32px));height:min(844px,calc(100svh - 32px));margin:16px auto;border-radius:24px;overflow:hidden}.partner-auth-scene::before{top:16px;bottom:auto;height:min(844px,calc(100svh - 32px));border-radius:24px}
}