/* Auto-extracted from Views/Account/Login.cshtml */

/* ── Login Reset & Base ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:'DM Sans',sans-serif;min-height:100vh;display:flex;background:#0a1628;overflow:hidden;color:#fff}
input,button{font-family:inherit}
/* ── Left Panel ── */
.lp-left{
  flex:1;position:relative;overflow:hidden;
  display:flex;flex-direction:column;justify-content:space-between;
  padding:40px;
  color:#ffffff;
  background:linear-gradient(160deg,#0f1a2e 0%,#162340 60%,#1a2d52 100%);
}
.lp-left::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 30% 20%,rgba(201,148,58,.12),transparent 60%),
             radial-gradient(ellipse at 80% 80%,rgba(44,91,160,.18),transparent 55%);
  pointer-events:none;
}
/* Geometric decoration */
.lp-geo{position:absolute;right:-60px;top:-60px;width:320px;height:320px;opacity:.07;}
.lp-geo circle{fill:none;stroke:#c9943a;stroke-width:1;}
.lp-geo2{position:absolute;left:40px;bottom:100px;width:160px;height:160px;opacity:.05;}
.lp-geo2 polygon{fill:none;stroke:#6cb4e4;stroke-width:1;}

.lp-brand{position:relative;display:flex;align-items:center;gap:14px;}
.lp-brand__icon{
  width:72px;height:72px;border-radius:16px;
  background:transparent;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 20px rgba(0,0,0,.4);
}
.lp-brand__name{font-size:18px;font-weight:600;color:#ffffff !important;letter-spacing:-.01em;}
.lp-brand__sub-accent{color:#c9943a;}
.lp-brand__sub{font-size:12px;color:rgba(255,255,255,.6) !important;margin-top:1px;}

/* Clock / time area */
.lp-clock-area{position:relative;text-align:center;padding:20px 0;}
.lp-time-icon{font-size:64px;margin-bottom:8px;line-height:1;}
.lp-time{font-size:56px;font-weight:300;color:#fff;font-family:'DM Mono',monospace;letter-spacing:-.02em;line-height:1;}
.lp-date{font-size:15px;color:rgba(255,255,255,.5);margin-top:6px;}
.lp-greeting{
  margin-top:16px;font-size:22px;font-weight:600;
  color:#ffffff !important;font-family:'DM Sans',sans-serif;
}
.lp-greeting__sub{font-size:13px;color:rgba(255,255,255,.45);margin-top:6px;line-height:1.6;}

/* Hours indicator */
.lp-hours{position:relative;margin-top:24px;}
.lp-hours__bar{height:6px;background:rgba(255,255,255,.1);border-radius:99px;overflow:hidden;}
.lp-hours__fill{height:100%;border-radius:99px;transition:width 1s ease;background:linear-gradient(90deg,#c9943a,#e8b95a);}
.lp-hours__label{font-size:11px;color:rgba(255,255,255,.35);margin-top:6px;display:flex;justify-content:space-between;}

.lp-status{
  position:relative;display:flex;align-items:center;gap:8px;
  padding:12px 16px;border-radius:10px;
  border:1px solid;margin-top:8px;
}
.lp-status--open{background:rgba(22,163,74,.08);border-color:rgba(22,163,74,.25);color:#4ade80;}
.lp-status--closed{background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.25);color:#f87171;}
.lp-status i{font-size:8px;animation:lpPulse 1.5s ease-in-out infinite;}
@keyframes lpPulse{0%,100%{opacity:1}50%{opacity:.3}}
.lp-status__text{font-size:12px;}

.lp-footer{position:relative;font-size:11px;color:rgba(255,255,255,.6) !important;}

/* ── Right Panel ── */
.lp-right{
  width:440px;flex-shrink:0;
  background:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:48px 48px;position:relative;overflow:hidden;
}
.lp-right::before{
  content:'';position:absolute;top:-80px;right:-80px;
  width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,148,58,.06),transparent 70%);
}

.lp-form-wrap{width:100%;max-width:360px;position:relative;}
.lp-form-title{font-size:24px;font-weight:700;color:#0f1a2e;margin-bottom:4px;letter-spacing:-.4px;}
.lp-form-sub{font-size:13px;color:#8898aa;margin-bottom:32px;}

.lp-field{margin-bottom:16px;}
.lp-field label{display:block;font-size:12px;font-weight:500;color:#4a5568;margin-bottom:6px;}
.lp-input-wrap{position:relative;}
.lp-input-wrap i.pfx{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:#8898aa;font-size:13px;pointer-events:none;}
.lp-input-wrap input{
  width:100%;padding:11px 14px 11px 36px;
  border:1.5px solid #e2e6ed;border-radius:10px;
  font-size:14px;color:#0f1a2e;outline:none;
  background:#f8f9fb;transition:all .2s;
}
.lp-input-wrap input:focus{border-color:#c9943a;background:#fff;box-shadow:0 0 0 3px rgba(201,148,58,.12);}
.lp-input-wrap .eye{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:#8898aa;cursor:pointer;font-size:13px;}
.lp-input-wrap .eye:hover{color:#0f1a2e;}

.lp-options{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;}
.lp-remember{display:flex;align-items:center;gap:7px;font-size:12px;color:#4a5568;cursor:pointer;}
.lp-remember input{accent-color:#c9943a;}
.lp-forgot{font-size:12px;color:#c9943a;font-weight:500;}
.lp-forgot:hover{text-decoration:underline;}

.lp-submit{
  width:100%;padding:13px;
  background:linear-gradient(135deg,#0f1a2e,#162340);
  color:#fff;border:none;border-radius:10px;
  font-size:15px;font-weight:600;cursor:pointer;
  transition:all .2s;position:relative;overflow:hidden;
}
.lp-submit:hover{background:linear-gradient(135deg,#162340,#1e3258);transform:translateY(-1px);box-shadow:0 6px 20px rgba(15,26,46,.3);}
.lp-submit:active{transform:translateY(0);}
.lp-submit:disabled{opacity:.6;cursor:not-allowed;transform:none;}
.lp-submit__spinner{display:none;position:absolute;inset:0;background:inherit;align-items:center;justify-content:center;}
.lp-submit.loading .lp-submit__spinner{display:flex;}

.lp-divider{position:relative;text-align:center;margin:20px 0;color:#8898aa;font-size:11px;}
.lp-divider::before,.lp-divider::after{content:'';position:absolute;top:50%;width:42%;height:1px;background:#e2e6ed;}
.lp-divider::before{left:0}.lp-divider::after{right:0}

.lp-error{
  background:#fee2e2;border:1px solid #fca5a5;border-radius:8px;
  padding:10px 13px;font-size:12px;color:#dc2626;
  display:none;align-items:center;gap:8px;margin-bottom:14px;
}
.lp-error.show{display:flex;}

/* ── OTP Modal ── */
.lp-otp-overlay{
  display:none;position:fixed;inset:0;z-index:100;
  background:rgba(10,22,40,.65);backdrop-filter:blur(6px);
  align-items:center;justify-content:center;
}
.lp-otp-overlay.open{display:flex;}
.lp-otp-box{
  background:#fff;border-radius:20px;padding:36px 40px;
  max-width:400px;width:100%;text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,.25);
  animation:otpIn .25s ease;
}
@keyframes otpIn{from{opacity:0;transform:scale(.94)translateY(-10px)}to{opacity:1;transform:scale(1)translateY(0)}}
.lp-otp-icon{
  width:64px;height:64px;border-radius:50%;margin:0 auto 16px;
  background:linear-gradient(135deg,#c9943a,#e8b95a);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:26px;
}
.lp-otp-title{font-size:20px;font-weight:700;color:#0f1a2e;margin-bottom:4px;}
.lp-otp-desc{font-size:13px;color:#8898aa;margin-bottom:24px;line-height:1.5;}
.lp-otp-digits{display:flex;gap:10px;justify-content:center;margin-bottom:20px;}
.lp-otp-digit{
  width:52px;height:60px;text-align:center;
  font-size:24px;font-weight:700;font-family:'DM Mono',monospace;
  border:2px solid #e2e6ed;border-radius:12px;
  background:#f8f9fb;color:#0f1a2e;outline:none;
  transition:all .15s;
}
.lp-otp-digit:focus{border-color:#c9943a;background:#fff;box-shadow:0 0 0 3px rgba(201,148,58,.12);}
.lp-otp-digit.filled{border-color:#c9943a;background:#fdf3e3;}
.lp-otp-resend{font-size:12px;color:#8898aa;margin-bottom:20px;}
.lp-otp-resend a{color:#c9943a;font-weight:500;cursor:pointer;}
.lp-otp-verify{
  width:100%;padding:12px;background:linear-gradient(135deg,#c9943a,#e8b95a);
  color:#fff;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;
}
.lp-otp-verify:hover{opacity:.92;}
.lp-otp-back{margin-top:12px;font-size:12px;color:#8898aa;cursor:pointer;}
.lp-otp-back:hover{color:#0f1a2e;}

/* Hours closed modal */
.lp-closed-box{
  background:#fff;border-radius:20px;padding:36px 40px;
  max-width:380px;width:100%;text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,.25);
  animation:otpIn .25s ease;
}
.lp-closed-icon{font-size:48px;margin-bottom:12px;color:#dc2626;}
.lp-closed-title{font-size:18px;font-weight:700;color:#0f1a2e;margin-bottom:8px;}
.lp-closed-desc{font-size:13px;color:#8898aa;line-height:1.6;}
.lp-closed-hours{
  margin:16px 0;background:#f8f9fb;border-radius:10px;padding:14px;
  font-size:13px;color:#4a5568;border:1px solid #e2e6ed;
}

/* Version */
.lp-version{position:absolute;bottom:12px;right:16px;font-size:11px;color:#c8cdd8;font-family:'DM Mono',monospace;}

@media(max-width:900px){
  .lp-left{display:none;}
  .lp-right{width:100%;padding:32px 24px;}
}
@media(max-width:480px){
  .lp-right{padding:24px 20px;}
  .lp-otp-box{padding:28px 20px;}
  .lp-otp-digit{width:44px;height:52px;font-size:20px;}
}
    

@keyframes shake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}

/* ── Company name marquee ── */
.lp-marquee-wrap{
  position:absolute;bottom:70px;left:0;right:0;
  overflow:hidden;white-space:nowrap;
  padding:8px 0;
  background:rgba(201,148,58,.08);
  border-top:1px solid rgba(201,148,58,.15);
  border-bottom:1px solid rgba(201,148,58,.15);
}
.lp-marquee{
  display:inline-block;
  animation:marqueeScroll 22s linear infinite;
  font-size:11px;font-weight:500;
  color:rgba(255,255,255,.55);
  letter-spacing:.08em;text-transform:uppercase;
}
.lp-marquee span{color:#c9943a;margin:0 24px;}
@keyframes marqueeScroll{
  0%  {transform:translateX(100vw);}
  100%{transform:translateX(-100%);}
}

/* ── Logo on login ── */
.lp-brand__logo{
  width:72px;height:72px;border-radius:16px;
  object-fit:cover;
  display:block;
}
.lp-brand__icon img{
  width:72px;height:72px;border-radius:16px;
  display:block;
}




/* ── Greeting sub (branch + sign in message) ── */
.lp-greeting__sub {
  display: block !important;
  font-size: 13px;
  color: rgba(255,255,255,.65) !important;
  margin-top: 6px;
  line-height: 1.6;
}

.lp-marquee-wrap { display: none !important; }

.lp-company-name{font-size:16px;font-weight:700;color:#ffffff !important;margin-top:10px;text-align:center;padding:0 16px;}

/* ── Software slogan ── */
.lp-brand__slogan {
  font-size: 11px;
  font-style: italic;
  color: #c9943a !important;
  margin-top: 3px;
  letter-spacing: 0.02em;
  opacity: 0.9;
}

/* ===== Theme switcher skin (mirrors the app theme on the login) ===== */
:root, html[data-theme]    { --lp-a:#0f1a2e; --lp-b:#c9943a; }  /* login panel + button stay classic navy */
html[data-theme="navy"]    { --lp-b:#c9943a; }
html[data-theme="teal"]    { --lp-b:#0d9488; }
html[data-theme="emerald"] { --lp-b:#059669; }
html[data-theme="indigo"]  { --lp-b:#4f46e5; }
html[data-theme="maroon"]  { --lp-b:#be123c; }
html[data-theme="slate"]   { --lp-b:#0ea5e9; }
.lp-left{ background:linear-gradient(160deg, var(--lp-a) 0%, color-mix(in srgb, var(--lp-a) 78%, #000) 62%, color-mix(in srgb, var(--lp-a) 60%, #1a2d52) 100%) !important; }
.lp-submit{ background:linear-gradient(135deg, var(--lp-a), color-mix(in srgb, var(--lp-a) 75%, #000)) !important; }
.lp-submit:hover{ background:linear-gradient(135deg, color-mix(in srgb, var(--lp-a) 85%, #000), color-mix(in srgb, var(--lp-a) 65%, #000)) !important; }
.lp-input-wrap input:focus{ border-color:var(--lp-b) !important; box-shadow:0 0 0 3px color-mix(in srgb, var(--lp-b) 20%, transparent) !important; }
.lp-hours__fill{ background:linear-gradient(90deg, var(--lp-b), color-mix(in srgb, var(--lp-b) 60%, #fff)) !important; }
.lp-brand__sub-accent{ color:var(--lp-b) !important; }
/* theme switcher control */
.lp-theme{ margin-top:18px; }
.lp-theme__label{ font-size:12px;color:#8898aa;display:block;margin-bottom:7px;font-weight:500; }
.lp-theme__swatches{ display:flex;gap:9px;flex-wrap:wrap; }
.lp-theme__sw{ width:30px;height:30px;border-radius:50%;cursor:pointer;border:2px solid #e2e6ed;display:flex;align-items:center;justify-content:center;transition:transform .12s,border-color .12s;position:relative; }
.lp-theme__sw:hover{ transform:scale(1.1); }
.lp-theme__sw.active{ border-color:#1f2d3d; }
.lp-theme__sw.active::after{ content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;color:#fff;font-size:11px;text-shadow:0 1px 2px rgba(0,0,0,.4); }