/* Feeder POS login refinement — isolated from the main app UI. */
.feeder-login-page {
  --login-red:#970711;
  --login-red-deep:#650108;
  --login-gold:#f4c452;
  --login-ink:#241817;
  --login-muted:#7f706c;
  --login-line:#eadfdb;
  --login-surface:#fff;
  min-height:100vh;
  min-height:100dvh;
}

.feeder-login-page .login-card {
  border:1px solid rgba(110,63,53,.09)!important;
  border-radius:20px!important;
  box-shadow:0 24px 70px rgba(79,31,24,.12)!important;
  overflow:hidden;
}
.feeder-login-page .login-heading { margin-bottom:24px; }
.feeder-login-page .login-eyebrow {
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:10px;
}
.feeder-login-page .login-eyebrow i { font-size:12px; }
.feeder-login-page .login-card h2 { color:var(--login-ink); font-weight:800; }
.feeder-login-page .login-copy { margin-bottom:0; font-size:12px; line-height:1.55; }
.feeder-login-page .login-form { display:grid; gap:18px; }
.feeder-login-page .login-field { min-width:0; }
.feeder-login-page .login-field .form-label {
  margin:0 0 8px;
  color:#463634;
  font-size:12px;
  font-weight:750;
}
.feeder-login-page .input-icon-wrap > i {
  left:15px;
  color:#9d0710;
  font-size:16px;
  pointer-events:none;
}
.feeder-login-page .input-icon-wrap .form-control {
  height:52px;
  min-height:52px;
  padding:0 44px 0 44px;
  border:1px solid var(--login-line)!important;
  border-radius:13px!important;
  background:#fff!important;
  color:var(--login-ink)!important;
  font-size:16px!important; /* prevents iOS focus zoom */
  font-weight:650;
  box-shadow:none!important;
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.feeder-login-page .input-icon-wrap .form-control::placeholder { color:#b4a7a3; font-weight:500; }
.feeder-login-page .input-icon-wrap .form-control:focus {
  border-color:rgba(157,7,16,.55)!important;
  box-shadow:0 0 0 4px rgba(157,7,16,.08)!important;
  background:#fffdfc!important;
}
.feeder-login-page .password-toggle {
  position:absolute;
  z-index:3;
  top:50%;
  right:5px;
  width:42px;
  height:42px;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  border:0;
  border-radius:11px;
  color:#7e6863;
  background:transparent;
  font-size:18px;
  -webkit-tap-highlight-color:transparent;
}
.feeder-login-page .password-toggle:active { background:#f8efec; color:#9d0710; }
.feeder-login-page .login-submit {
  min-height:54px;
  margin-top:4px!important;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:0!important;
  border-radius:13px!important;
  font-size:14px;
  font-weight:800;
  letter-spacing:.01em;
  box-shadow:0 12px 24px rgba(151,7,17,.22)!important;
  -webkit-tap-highlight-color:transparent;
}
.feeder-login-page .login-submit:active { transform:translateY(1px); }
.feeder-login-page .login-error {
  min-height:46px;
  margin:0 0 18px!important;
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 13px!important;
  font-size:12px!important;
  line-height:1.4;
}
.feeder-login-page .login-error i { flex:0 0 auto; font-size:16px; }
.feeder-login-page .login-footnote {
  margin-top:20px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  color:#9a8a85;
  font-size:10px;
  text-align:center;
}
.feeder-login-page .login-footnote i { color:#b69039; }
.feeder-login-page .login-mobile-brand-copy small { display:none; }

/* Phones — iPhone/Android first */
@media (max-width:768px) {
  html:has(.feeder-login-page),
  body.feeder-login-page { overscroll-behavior-y:none; }
  body.feeder-login-page {
    overflow-x:hidden;
    overflow-y:auto;
    background:
      radial-gradient(circle at 80% 2%,rgba(255,221,125,.22),transparent 25%),
      radial-gradient(circle at 5% 18%,rgba(255,189,58,.14),transparent 27%),
      linear-gradient(180deg,#9f0912 0,#79040b 31%,#f7f2ef 31%,#f7f2ef 100%)!important;
  }
  .feeder-login-page .login-panel {
    width:100%;
    min-height:100vh;
    min-height:100dvh;
    display:flex!important;
    align-items:flex-start!important;
    justify-content:center;
    padding:
      max(18px,env(safe-area-inset-top))
      max(14px,env(safe-area-inset-right))
      max(20px,env(safe-area-inset-bottom))
      max(14px,env(safe-area-inset-left))!important;
  }
  .feeder-login-page .login-card {
    width:min(100%,460px)!important;
    margin-top:clamp(48px,10vh,92px);
    border-radius:22px!important;
    background:rgba(255,255,255,.985)!important;
    box-shadow:0 24px 58px rgba(75,8,12,.2)!important;
  }
  .feeder-login-page .login-card .card-body { padding:24px 20px 20px!important; }
  .feeder-login-page .login-mobile-brand {
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:12px!important;
    margin:0 0 22px!important;
    padding-bottom:18px;
    border-bottom:1px solid #f0e7e3;
    color:#8e0610!important;
    font-family:inherit!important;
  }
  .feeder-login-page .login-mobile-logo-wrap {
    width:58px;
    height:58px;
    flex:0 0 58px;
    display:grid;
    place-items:center;
    border-radius:17px;
    background:linear-gradient(145deg,#fff7df,#fff);
    box-shadow:inset 0 0 0 1px rgba(180,125,17,.13),0 8px 20px rgba(109,61,19,.08);
  }
  .feeder-login-page .login-mobile-brand img {
    width:51px!important;
    height:51px!important;
    object-fit:contain;
  }
  .feeder-login-page .login-mobile-brand-copy {
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:4px;
  }
  .feeder-login-page .login-mobile-brand-copy strong {
    color:#8c0610;
    font-size:20px;
    line-height:1;
    font-weight:850;
    letter-spacing:-.02em;
  }
  .feeder-login-page .login-mobile-brand-copy small {
    display:block;
    color:#9a827b;
    font-size:10px;
    font-weight:650;
  }
  .feeder-login-page .login-heading { margin-bottom:20px; }
  .feeder-login-page .login-card h2 { margin:7px 0 5px!important; font-size:24px!important; line-height:1.15; }
  .feeder-login-page .login-copy { font-size:12px!important; }
  .feeder-login-page .login-form { gap:16px; }
  .feeder-login-page .login-field .form-label { font-size:12px; }
  .feeder-login-page .input-icon-wrap .form-control { height:54px; min-height:54px; border-radius:14px!important; }
  .feeder-login-page .login-submit { min-height:56px; border-radius:14px!important; font-size:14px; }
  .feeder-login-page .login-footnote { margin-top:18px; }
}

/* Small phones */
@media (max-width:390px) {
  .feeder-login-page .login-panel { padding-left:11px!important; padding-right:11px!important; }
  .feeder-login-page .login-card { margin-top:38px; border-radius:19px!important; }
  .feeder-login-page .login-card .card-body { padding:20px 16px 17px!important; }
  .feeder-login-page .login-mobile-brand { margin-bottom:18px!important; padding-bottom:15px; }
  .feeder-login-page .login-mobile-logo-wrap { width:52px; height:52px; flex-basis:52px; border-radius:15px; }
  .feeder-login-page .login-mobile-brand img { width:46px!important; height:46px!important; }
  .feeder-login-page .login-mobile-brand-copy strong { font-size:19px; }
  .feeder-login-page .login-card h2 { font-size:22px!important; }
}

/* Short phone / keyboard / landscape friendly */
@media (max-width:768px) and (max-height:700px) {
  .feeder-login-page .login-card { margin-top:12px; }
  .feeder-login-page .login-card .card-body { padding-top:17px!important; padding-bottom:16px!important; }
  .feeder-login-page .login-mobile-brand { margin-bottom:14px!important; padding-bottom:12px; }
  .feeder-login-page .login-mobile-logo-wrap { width:48px; height:48px; flex-basis:48px; }
  .feeder-login-page .login-mobile-brand img { width:43px!important; height:43px!important; }
  .feeder-login-page .login-heading { margin-bottom:14px; }
  .feeder-login-page .login-copy { display:none; }
  .feeder-login-page .login-form { gap:12px; }
  .feeder-login-page .login-footnote { margin-top:12px; }
}

/* Tablet keeps the app's premium two-column language, but with larger touch fields. */
@media (min-width:769px) and (max-width:1100px) {
  .feeder-login-page.login-page { grid-template-columns:minmax(320px,40%) 1fr!important; }
  .feeder-login-page .login-panel { padding:24px!important; }
  .feeder-login-page .login-card { width:min(440px,100%)!important; }
  .feeder-login-page .login-card .card-body { padding:30px!important; }
  .feeder-login-page .input-icon-wrap .form-control { height:54px; min-height:54px; }
  .feeder-login-page .login-submit { min-height:54px; }
}