/* Hind Siliguri (OFL) - Bengali + Latin, self-hosted */
@font-face{font-family:'Hind Siliguri';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/hind-siliguri-400-bengali.woff2') format('woff2');unicode-range:U+0951-0952, U+0964-0965, U+0980-09FE, U+1CD0, U+1CD2, U+1CD5-1CD6, U+1CD8, U+1CE1, U+1CEA, U+1CED, U+1CF2, U+1CF5-1CF7, U+200C-200D, U+20B9, U+25CC, U+A8F1;}
@font-face{font-family:'Hind Siliguri';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/hind-siliguri-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Hind Siliguri';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/hind-siliguri-500-bengali.woff2') format('woff2');unicode-range:U+0951-0952, U+0964-0965, U+0980-09FE, U+1CD0, U+1CD2, U+1CD5-1CD6, U+1CD8, U+1CE1, U+1CEA, U+1CED, U+1CF2, U+1CF5-1CF7, U+200C-200D, U+20B9, U+25CC, U+A8F1;}
@font-face{font-family:'Hind Siliguri';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/hind-siliguri-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Hind Siliguri';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/hind-siliguri-600-bengali.woff2') format('woff2');unicode-range:U+0951-0952, U+0964-0965, U+0980-09FE, U+1CD0, U+1CD2, U+1CD5-1CD6, U+1CD8, U+1CE1, U+1CEA, U+1CED, U+1CF2, U+1CF5-1CF7, U+200C-200D, U+20B9, U+25CC, U+A8F1;}
@font-face{font-family:'Hind Siliguri';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/hind-siliguri-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Hind Siliguri';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/hind-siliguri-700-bengali.woff2') format('woff2');unicode-range:U+0951-0952, U+0964-0965, U+0980-09FE, U+1CD0, U+1CD2, U+1CD5-1CD6, U+1CD8, U+1CE1, U+1CEA, U+1CED, U+1CF2, U+1CF5-1CF7, U+200C-200D, U+20B9, U+25CC, U+A8F1;}
@font-face{font-family:'Hind Siliguri';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/hind-siliguri-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
/* ==========================================================================
   ZP — modern login   (screen only; print untouched)
   Palette is UNCHANGED from the original app:
   #013243 deep · #0F617E teal · #2C3E50 navy · #549AB2 blue · #26A69A accent
   Content, form field names/ids and behaviour are untouched — style only.
   ========================================================================== */
@media screen {

:root {
  --zp-deep:  #013243;
  --zp-teal:  #0F617E;
  --zp-navy:  #2C3E50;
  --zp-blue:  #549AB2;
  --zp-accent:#26A69A;
  --zp-ink:   #0b2f3d;
  --zp-muted: #5f7885;
  --zp-line:  #cddbe2;
  --zp-field: #f3f7f9;
  --zp-font:  'Hind Siliguri','Segoe UI','Nirmala UI',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
}

html { background: var(--zp-deep); }

body.sign-section {
  margin: 0;
  min-height: 100vh;
  position: relative;
  isolation: isolate;
  font-family: var(--zp-font);
  color: var(--zp-ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  background: var(--zp-deep) !important;
}

/* photo + brand gradient backdrop (same photo, much lighter file) */
body.sign-section::before {
  content: "";
  position: fixed; inset: 0; z-index: -2;
  background: url(../img/zp-login-bg2.jpg) center / cover no-repeat;
  filter: saturate(1.12) contrast(1.03);      /* no blur: the building stays crisp */
}
body.sign-section::after {
  content: "";
  position: fixed; inset: 0; z-index: -1;
  background:
    radial-gradient(ellipse 40% 58% at 50% 54%, rgba(1,50,67,.50), transparent 100%),      /* calm centre behind title + card */
    radial-gradient(1100px 560px at 90% -10%, rgba(84,154,178,.22), transparent 62%),
    linear-gradient(180deg, rgba(1,50,67,.58) 0%, rgba(15,97,126,.34) 46%, rgba(1,50,67,.62) 100%);   /* light brand tint — photo clearly visible */
}

/* ---------- top bar ---------- */
body.sign-section .login_top {
  min-height: 0;
  background: rgba(44,62,80,.50) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
          backdrop-filter: blur(14px) saturate(1.2);
  border-bottom: 1px solid rgba(255,255,255,.12);
}
body.sign-section .login_top_container {
  width: min(1840px, calc(100% - 64px));      /* wider header: logos sit near the page edges */
  margin: 0 auto;
  padding: 12px 0;
  overflow: visible;
  display: flex;
  align-items: center;
  gap: 16px;
}
body.sign-section .left-logo,
body.sign-section .right-logo,
body.sign-section .header-text { float: none; }
body.sign-section .left-logo img  { width: 56px; height: auto; top: 0; display: block; filter: drop-shadow(0 4px 10px rgba(0,0,0,.35)); }
body.sign-section .right-logo     { margin-left: auto; }
body.sign-section .right-logo img { width: 52px; height: auto; display: block; filter: drop-shadow(0 4px 10px rgba(0,0,0,.35)); }
body.sign-section .header-text {
  margin: 0;
  color: #fff;
  font-family: var(--zp-font);
  line-height: 1.15;
}
body.sign-section .header-text .name {
  font-size: 26px; font-weight: 700; letter-spacing: .2px;
}
body.sign-section .header-text .name-soft {
  font-size: 12.5px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase;
  color: rgba(255,255,255,.74);
}

/* ---------- stage ---------- */
body.sign-section .login_page { display: flex; min-height: calc(100vh - 82px); }
body.sign-section .login_area {
  width: 100% !important;
  margin: 0 !important;
  background: none !important;
  box-shadow: none !important;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 44px 16px 26px;
}
body.sign-section .login_head_area {
  width: auto; min-height: 0; padding: 0 0 34px;
  background: none !important; text-align: center;
}
body.sign-section .login_head_area h1 {
  position: relative;
  margin: 0; padding-bottom: 18px;
  font-family: var(--zp-font);
  font-size: clamp(27px, 4.4vw, 42px); font-weight: 700; letter-spacing: .2px; line-height: 1.25;
  color: #fff; text-shadow: 0 2px 22px rgba(0,0,0,.50), 0 1px 3px rgba(0,0,0,.40);   /* keeps the title readable over the clearer photo */
}
body.sign-section .login_head_area h1::after {
  content: ""; position: absolute; left: 50%; bottom: 0;
  width: 68px; height: 4px; border-radius: 4px; transform: translateX(-50%);
  background: linear-gradient(90deg, var(--zp-blue), var(--zp-accent));
}
body.sign-section .login_content {
  width: 100%; padding: 0 !important; border: 0 !important;
  display: flex; justify-content: center;
}

/* ---------- card ---------- */
body.sign-section .container.sign-cont {
  position: relative;
  width: min(440px, 100%) !important; max-width: none;
  margin: 34px auto 0;
  padding: 0 34px 18px;
  background: rgba(255,255,255,.975);
  border: 0 !important;
  border-radius: 26px;
  opacity: 1 !important;
  box-shadow: 0 46px 90px -34px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.45);
}
/* lock badge (inline SVG – no icon-font dependency) */
body.sign-section .container.sign-cont::before {
  content: "";
  display: block;
  width: 68px; height: 68px;
  margin: -34px auto 6px;
  border-radius: 22px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.5' y='10.5' width='15' height='10' rx='2.6'/%3E%3Cpath d='M8 10.5V8a4 4 0 0 1 8 0v2.5'/%3E%3Ccircle cx='12' cy='15.5' r='1.15' fill='%23fff' stroke='none'/%3E%3C/svg%3E") center / 32px no-repeat,
    linear-gradient(140deg, var(--zp-teal) 0%, var(--zp-blue) 100%);
  box-shadow: 0 16px 32px -12px rgba(15,97,126,.85), 0 0 0 6px rgba(255,255,255,.9);
}
body.sign-section .sign-cont.animated.zoomIn {
  animation-name: zpRise; animation-duration: .6s;
  animation-timing-function: cubic-bezier(.2,.8,.2,1);
}
@keyframes zpRise {
  from { opacity: 0; transform: translateY(16px) scale(.985); }
  to   { opacity: 1; transform: none; }
}

/* ---------- form ---------- */
body.sign-section .sign-cont .row,
body.sign-section .sign-cont .sign-row { margin-bottom: 0; }
body.sign-section .sign-cont .input-field { margin-top: 36px; }
body.sign-section .sign-cont form#reg-form > .row:first-child .input-field { margin-top: 24px; }
body.sign-section .sign-cont .input-field.col { padding: 0; }

body.sign-section .sign-cont .input-field input:not([type]),
body.sign-section .sign-cont .input-field input[type=text],
body.sign-section .sign-cont .input-field input[type=password],
body.sign-section .sign-cont .select-wrapper input.select-dropdown {
  box-sizing: border-box;
  display: block; width: 100%;
  height: 54px; line-height: 54px; margin: 0; padding: 0 16px;
  font-family: var(--zp-font); font-size: 16px; color: var(--zp-ink);
  background: var(--zp-field);
  border: 1.5px solid var(--zp-line);
  border-radius: 14px;
  box-shadow: none;
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
body.sign-section .sign-cont .input-field input:focus:not([readonly]),
body.sign-section .sign-cont .select-wrapper input.select-dropdown:focus,
body.sign-section .sign-cont .select-wrapper input.select-dropdown.active {
  background: #fff;
  border-color: var(--zp-blue) !important;
  box-shadow: 0 0 0 4px rgba(84,154,178,.22) !important;
}
body.sign-section .sign-cont .input-field input:hover:not(:focus):not([readonly]) { border-color: #b3c8d2; }

/* label: sits inside the field, floats above it when active */
body.sign-section .sign-cont .input-field label {
  left: 16px !important; top: 16px;
  font-family: var(--zp-font); font-size: 16px; font-weight: 400;
  color: var(--zp-muted);
  pointer-events: none;
  transition: top .18s ease, left .18s ease, font-size .18s ease, color .18s ease;
}
body.sign-section .sign-cont .input-field label.active {
  transform: none;
  top: -24px; left: 3px !important;
  font-size: 13.5px; font-weight: 600;
  color: var(--zp-teal);
}
body.sign-section .sign-cont .input-field input:focus:not([readonly]) + label { color: var(--zp-teal) !important; }

/* select (Materialize material_select) */
body.sign-section .sign-cont .select-wrapper { position: relative; }
body.sign-section .sign-cont .select-wrapper input.select-dropdown { cursor: pointer; padding-right: 44px; }
body.sign-section .sign-cont .select-wrapper span.caret {
  position: absolute; right: 18px; top: 50%;
  width: 9px; height: 9px; margin-top: -7px;
  font-size: 0; color: transparent;
  border-right: 2px solid var(--zp-blue); border-bottom: 2px solid var(--zp-blue);
  transform: rotate(45deg);
  transition: transform .2s ease;
  pointer-events: none;
  z-index: 2;   /* the caret precedes the input in the DOM; keep it above the input's solid fill */
}
body.sign-section .sign-cont .select-wrapper input.select-dropdown.active ~ span.caret { transform: rotate(225deg); margin-top: -2px; }

/* dropdown list (rendered inside the form) */
body.sign-section .sign-cont ul.dropdown-content.select-dropdown {
  margin-top: 60px;           /* open BELOW the field (54px) instead of covering it */
  max-height: 268px;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 24px 50px -16px rgba(1,50,67,.5), 0 0 0 1px rgba(15,97,126,.10);
  padding: 6px;
}
body.sign-section .sign-cont ul.dropdown-content.select-dropdown li {
  min-height: 0; border-radius: 10px;
}
body.sign-section .sign-cont ul.dropdown-content.select-dropdown li > span {
  padding: 11px 14px; line-height: 1.35; font-size: 15.5px;
  font-family: var(--zp-font); color: var(--zp-ink);
}
body.sign-section .sign-cont ul.dropdown-content.select-dropdown li:hover:not(.disabled) { background: #e8f2f6; }
body.sign-section .sign-cont ul.dropdown-content.select-dropdown li.active { background: #d8eaf1; }
body.sign-section .sign-cont ul.dropdown-content.select-dropdown li.active > span { font-weight: 600; color: var(--zp-teal); }
body.sign-section .sign-cont ul.dropdown-content.select-dropdown li.disabled > span { color: #8aa0ab; }

/* buttons */
body.sign-section .sign-cont .input-field.col.s6 { padding: 0 6px; margin-top: 30px; }
body.sign-section .sign-cont .row > .input-field.col.s6:first-child { padding-left: 0; }
body.sign-section .sign-cont .row > .input-field.col.s6:last-child  { padding-right: 0; }
body.sign-section .sign-cont .btn.btn-large.btn-register {
  display: block; width: 100%;
  height: 52px; line-height: 52px; padding: 0 8px;
  font-family: var(--zp-font); font-size: 16.5px; font-weight: 600; letter-spacing: .2px;
  text-transform: none;
  color: #fff !important;
  background: var(--zp-blue) !important;
  border: 0; border-radius: 14px;
  box-shadow: 0 14px 26px -14px rgba(84,154,178,.95);
  transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease;
}
body.sign-section .sign-cont .btn.btn-large.btn-register:hover {
  background: var(--zp-teal) !important;
  transform: translateY(-1px);
  box-shadow: 0 18px 30px -14px rgba(15,97,126,.95);
}
body.sign-section .sign-cont .btn.btn-large.btn-register:active { transform: none; }
body.sign-section .sign-cont .btn.btn-large.btn-register:focus-visible {
  outline: 3px solid rgba(84,154,178,.45); outline-offset: 2px;
}
body.sign-section .sign-cont .btn.btn-large.btn-register[type=reset] {
  color: var(--zp-teal) !important;
  background: transparent !important;
  border: 1.5px solid #bcd3dd;
  line-height: 49px;
  box-shadow: none;
}
body.sign-section .sign-cont .btn.btn-large.btn-register[type=reset]:hover {
  background: #eef5f8 !important; border-color: var(--zp-blue); transform: none; box-shadow: none;
}
/* ripple colour from waves-effect stays readable */
body.sign-section .sign-cont .waves-ripple { opacity: .35; }

/* ---------- footer ---------- */
body.sign-section .login_footer {
  background: none !important;
  margin-top: 28px; padding: 0;
  font-size: 13.5px; letter-spacing: .2px;
  color: rgba(255,255,255,.88);
  text-shadow: 0 1px 6px rgba(0,0,0,.55);
  text-align: center;
}
body.sign-section .login_footer a {
  color: #fff !important; font-weight: 600;
  border-bottom: 1px solid rgba(255,255,255,.35);
  transition: border-color .2s ease;
}
body.sign-section .login_footer a:hover { border-bottom-color: #fff; }

/* ---------- small screens ---------- */
@media (max-width: 600px) {
  body.sign-section .login_top_container { padding: 10px 0; gap: 12px; }
  body.sign-section .left-logo img  { width: 44px; }
  body.sign-section .right-logo img { width: 42px; }
  body.sign-section .header-text .name { font-size: 20px; }
  body.sign-section .header-text .name-soft { font-size: 10.5px; letter-spacing: .2em; }
  body.sign-section .login_area { padding: 30px 14px 20px; }
  body.sign-section .login_head_area { padding-bottom: 26px; }
  body.sign-section .container.sign-cont { padding: 0 22px 12px; border-radius: 22px; }
}
@media (max-height: 640px) and (min-width: 601px) {
  body.sign-section .login_area { padding-top: 26px; }
  body.sign-section .login_head_area { padding-bottom: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  body.sign-section .sign-cont.animated.zoomIn { animation: none; }
  body.sign-section * { transition: none !important; }
}

} /* /@media screen */
