/* ================================
   LOGIN MODAL — MEDİTRACK PREMIUM
   Version: 20260520-login-premium-soft1
   Soft playful design + clean AppDialog-like form
================================ */

#loginModal,
#loginModal *,
#loginModal *::before,
#loginModal *::after{
  box-sizing:border-box;
}

/* ================================
   OVERLAY
================================ */

#loginModal.modal{
  position:fixed;
  inset:0;
  z-index:100000;
  display:none;
  align-items:center;
  justify-content:center;
  width:100%;
  max-width:100vw;
  min-height:100vh;
  min-height:100dvh;
  padding:18px;
  overflow:hidden;
  background:
    radial-gradient(circle at 16% 18%, rgba(34,197,94,.24), transparent 28%),
    radial-gradient(circle at 84% 28%, rgba(59,130,246,.24), transparent 30%),
    radial-gradient(circle at 48% 86%, rgba(20,184,166,.18), transparent 34%),
    linear-gradient(135deg, rgba(15,23,42,.74), rgba(71,85,105,.64));
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

#loginModal.show{
  display:flex !important;
  animation:loginOverlayIn .22s ease both;
}

/* yumşaq fon işıqları */
#loginModal::before,
#loginModal::after{
  content:"";
  position:absolute;
  border-radius:999px;
  pointer-events:none;
  opacity:.58;
  filter:blur(8px);
  z-index:0;
}

#loginModal::before{
  width:300px;
  height:300px;
  left:-110px;
  top:12%;
  background:radial-gradient(circle, rgba(20,184,166,.38), transparent 68%);
  animation:loginBlobMove 8s ease-in-out infinite;
}

#loginModal::after{
  width:290px;
  height:290px;
  right:-120px;
  bottom:8%;
  background:radial-gradient(circle, rgba(59,130,246,.36), transparent 68%);
  animation:loginBlobMove 9s ease-in-out infinite reverse;
}

/* ================================
   CARD
================================ */

#loginModal .modal-box,
#loginModal .login-card{
  position:relative;
  z-index:1;
  width:min(410px, calc(100vw - 32px));
  max-width:100%;
  max-height:calc(100dvh - 36px);
  overflow:auto;
  padding:0;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.78);
  background:
    radial-gradient(circle at 18% 0%, rgba(20,184,166,.10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,252,255,.96));
  box-shadow:
    0 34px 90px rgba(15,23,42,.34),
    0 16px 34px rgba(15,23,42,.16),
    inset 0 1px 0 rgba(255,255,255,.92);
  animation:loginCardIn .30s cubic-bezier(.2,.9,.25,1.08) both;
}

/* kart içində dekorativ yumşaq işıqlar */
#loginModal .login-glow{
  position:absolute;
  border-radius:999px;
  pointer-events:none;
  z-index:0;
  filter:blur(4px);
}

#loginModal .login-glow-one{
  width:190px;
  height:190px;
  left:-96px;
  bottom:-100px;
  background:radial-gradient(circle, rgba(16,185,129,.22), transparent 68%);
}

#loginModal .login-glow-two{
  width:160px;
  height:160px;
  right:-86px;
  top:-88px;
  background:radial-gradient(circle, rgba(37,99,235,.16), transparent 68%);
}

/* yüngül shine */
#loginModal .login-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(
    120deg,
    transparent 0%,
    rgba(255,255,255,.78) 18%,
    transparent 36%
  );
  transform:translateX(-135%);
  animation:loginShine 5.4s ease-in-out infinite;
}

/* bütün real kontent dekorun üstündə */
#loginModal .login-brand,
#loginModal .login-form{
  position:relative;
  z-index:1;
}

/* ================================
   BRAND / HEADER
================================ */

#loginModal .login-brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:0;
  padding:30px 26px 18px;
  text-align:center;
  border-bottom:1px solid rgba(226,232,240,.78);
}

#loginModal .login-logo{
  width:56px;
  height:56px;
  margin:0 auto 14px;
  border-radius:20px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#047857;
  font-size:24px;
  font-weight:950;
  line-height:1;
  background:
    radial-gradient(circle at 35% 24%, rgba(255,255,255,.92), transparent 30%),
    linear-gradient(135deg, #ccfbf1, #dbeafe);
  border:1px solid rgba(45,212,191,.46);
  box-shadow:
    0 14px 30px rgba(20,184,166,.20),
    inset 0 1px 0 rgba(255,255,255,.95);
  animation:loginLogoFloat 3s ease-in-out infinite;
}

#loginModal h3{
  margin:0;
  padding:0 !important;
  border:0 !important;
  color:#0f172a;
  font-size:24px;
  line-height:1.14;
  font-weight:950;
  letter-spacing:-.035em;
  text-align:center;
}

#loginModal .login-brand p{
  display:block !important;
  width:100%;
  max-width:260px;
  margin:8px auto 0;
  color:#64748b;
  font-size:13.5px;
  line-height:1.42;
  font-weight:700;
  text-align:center;
}

/* ================================
   FORM
================================ */

#loginModal #loginForm,
#loginModal .login-form{
  width:100%;
  max-width:318px;
  margin:0 auto;
  padding:22px 0 28px !important;
}

#loginModal #loginForm::before,
#loginModal .login-form::before{
  content:"Təhlükəsiz giriş";
  display:block;
  width:100%;
  margin:0 0 14px;
  color:#0f766e;
  font-size:13px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.01em;
  text-align:center;
}

#loginModal .login-field{
  display:block;
  width:100%;
  margin:0 0 12px;
}

#loginModal .login-field span{
  display:block !important;
  margin:0 0 6px;
  color:#475569;
  font-size:12px;
  line-height:1.2;
  font-weight:850;
  letter-spacing:.01em;
}

#loginModal #loginUser,
#loginModal #loginPass{
  display:block;
  width:100% !important;
  max-width:100%;
  height:48px;
  margin:0;
  padding:0 15px;
  border:1px solid #dbe3ef;
  border-radius:15px;
  outline:none;
  background:
    linear-gradient(180deg, rgba(248,250,252,.98), rgba(241,245,249,.96));
  color:#0f172a;
  font-size:15px;
  font-weight:700;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.86),
    0 7px 18px rgba(15,23,42,.045);
  transition:
    border-color .16s ease,
    box-shadow .16s ease,
    background .16s ease,
    transform .16s ease;
}

#loginModal #loginUser::placeholder,
#loginModal #loginPass::placeholder{
  color:#94a3b8;
  font-weight:550;
}

#loginModal #loginUser:focus,
#loginModal #loginPass:focus{
  border-color:#93c5fd;
  background:#fff;
  box-shadow:
    0 0 0 4px rgba(37,99,235,.13),
    0 12px 26px rgba(15,23,42,.08);
  transform:translateY(-1px);
}

/* ================================
   BUTTONS
================================ */

#loginModal .modal-actions,
#loginModal .login-actions{
  display:flex !important;
  align-items:center;
  justify-content:flex-end !important;
  flex-direction:row !important;
  gap:10px;
  width:100%;
  margin:18px 0 0;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}

#loginModal .modal-actions button,
#loginModal .login-btn{
  min-width:94px;
  height:42px;
  padding:0 17px;
  border:0;
  border-radius:12px;
  font-size:14px;
  line-height:42px;
  font-weight:900;
  cursor:pointer;
  transition:
    transform .14s ease,
    box-shadow .14s ease,
    background .14s ease,
    color .14s ease;
}

#loginModal .modal-actions button:active,
#loginModal .login-btn:active{
  transform:scale(.98);
}

/* Ləğv et */
#loginModal .modal-actions button:first-child,
#loginModal .login-btn-ghost{
  background:#f1f5f9;
  color:#334155;
  box-shadow:none;
}

#loginModal .modal-actions button:first-child:hover,
#loginModal .login-btn-ghost:hover{
  background:#e2e8f0;
  color:#0f172a;
  transform:translateY(-1px);
}

/* Daxil ol */
#loginModal .modal-actions button:last-child,
#loginModal .login-btn-primary{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg, #2563eb, #1d4ed8);
  color:#ffffff;
  box-shadow:0 14px 28px rgba(37,99,235,.24);
}

#loginModal .modal-actions button:last-child::before,
#loginModal .login-btn-primary::before{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-120%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.26), transparent);
  transition:transform .45s ease;
}

#loginModal .modal-actions button:last-child:hover::before,
#loginModal .login-btn-primary:hover::before{
  transform:translateX(120%);
}

#loginModal .modal-actions button:last-child:hover,
#loginModal .login-btn-primary:hover{
  background:linear-gradient(135deg, #1d4ed8, #1e40af);
  box-shadow:0 18px 34px rgba(37,99,235,.30);
  transform:translateY(-1px);
}

/* keyboard focus */
#loginModal .login-btn:focus-visible,
#loginModal #loginUser:focus-visible,
#loginModal #loginPass:focus-visible{
  outline:4px solid rgba(37,99,235,.18);
  outline-offset:2px;
}

/* ================================
   OPTIONAL MESSAGES
================================ */

#loginModal .login-error,
#loginModal .login-success{
  margin:12px 0 0;
  padding:10px 12px;
  border-radius:14px;
  font-size:12px;
  line-height:1.4;
  font-weight:800;
  text-align:center;
}

#loginModal .login-error{
  background:#fee2e2;
  color:#991b1b;
  border:1px solid #fecaca;
}

#loginModal .login-success{
  background:#dcfce7;
  color:#166534;
  border:1px solid #bbf7d0;
}

/* ================================
   ANIMATIONS
================================ */

@keyframes loginOverlayIn{
  from{
    opacity:0;
  }
  to{
    opacity:1;
  }
}

@keyframes loginCardIn{
  from{
    opacity:0;
    transform:translateY(16px) scale(.96);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes loginLogoFloat{
  0%,
  100%{
    transform:translateY(0) rotate(0deg);
  }
  50%{
    transform:translateY(-4px) rotate(4deg);
  }
}

@keyframes loginBlobMove{
  0%,
  100%{
    transform:translate3d(0,0,0) scale(1);
  }
  50%{
    transform:translate3d(18px,-14px,0) scale(1.08);
  }
}

@keyframes loginShine{
  0%,
  60%{
    transform:translateX(-135%);
  }
  82%,
  100%{
    transform:translateX(135%);
  }
}

/* ================================
   MOBILE
================================ */

@media (max-width:640px){
  #loginModal.modal{
    align-items:center;
    justify-content:center;
    padding:14px;
    min-height:100dvh;
  }

  #loginModal .modal-box,
  #loginModal .login-card{
    width:min(100%, 370px);
    max-width:100%;
    max-height:calc(100dvh - 28px);
    border-radius:28px;
  }

  #loginModal .login-brand{
    padding:26px 20px 17px;
  }

  #loginModal .login-logo{
    width:52px;
    height:52px;
    border-radius:18px;
    margin-bottom:13px;
  }

  #loginModal h3{
    font-size:22px;
  }

  #loginModal .login-brand p{
    max-width:245px;
    font-size:13px;
  }

  #loginModal #loginForm,
  #loginModal .login-form{
    max-width:100%;
    padding:20px 22px 24px !important;
  }

  #loginModal #loginUser,
  #loginModal #loginPass{
    height:48px;
    font-size:16px;
  }

  #loginModal .modal-actions,
  #loginModal .login-actions{
    gap:9px;
  }

  #loginModal .modal-actions button,
  #loginModal .login-btn{
    flex:1 1 0;
    min-width:0;
    height:44px;
    line-height:44px;
    padding:0 12px;
  }
}

@media (max-width:380px){
  #loginModal.modal{
    padding:10px;
  }

  #loginModal .modal-box,
  #loginModal .login-card{
    width:100%;
    max-height:calc(100dvh - 20px);
    border-radius:24px;
  }

  #loginModal .login-brand{
    padding:23px 16px 15px;
  }

  #loginModal .login-logo{
    width:48px;
    height:48px;
    border-radius:16px;
  }

  #loginModal h3{
    font-size:20px;
  }

  #loginModal .login-brand p{
    max-width:220px;
    font-size:12.5px;
  }

  #loginModal #loginForm,
  #loginModal .login-form{
    padding-left:16px !important;
    padding-right:16px !important;
  }
}

/* ================================
   REDUCED MOTION
================================ */

@media (prefers-reduced-motion:reduce){
  #loginModal.show,
  #loginModal::before,
  #loginModal::after,
  #loginModal .modal-box,
  #loginModal .login-card,
  #loginModal .login-card::before,
  #loginModal .login-logo,
  #loginModal .modal-actions button:last-child::before,
  #loginModal .login-btn-primary::before{
    animation:none !important;
  }

  #loginModal #loginUser:focus,
  #loginModal #loginPass:focus,
  #loginModal .modal-actions button:hover,
  #loginModal .login-btn:hover{
    transform:none !important;
  }
}

/* ======================================================
   LOGIN MODAL — scrollbar fix + compact final override
   Version: 20260520-login-noscroll1
====================================================== */

#loginModal.modal{
  overflow:hidden !important;
  padding:18px !important;
}

#loginModal .modal-box,
#loginModal .login-card{
  width:min(390px, calc(100vw - 32px)) !important;
  max-width:calc(100vw - 32px) !important;
  max-height:none !important;
  overflow:hidden !important;
  border-radius:28px !important;
}

/* Scrollbar tam gizlənsin */
#loginModal .modal-box::-webkit-scrollbar,
#loginModal .login-card::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

#loginModal .modal-box,
#loginModal .login-card{
  scrollbar-width:none !important;
}

/* Header bir az kompakt */
#loginModal .login-brand{
  padding:26px 22px 16px !important;
}

#loginModal .login-logo{
  width:54px !important;
  height:54px !important;
  margin-bottom:13px !important;
  border-radius:19px !important;
}

#loginModal h3{
  font-size:23px !important;
}

#loginModal .login-brand p{
  max-width:250px !important;
  font-size:13px !important;
}

/* Form kartdan daşmasın */
#loginModal #loginForm,
#loginModal .login-form{
  width:100% !important;
  max-width:none !important;
  padding:20px 32px 26px !important;
  margin:0 !important;
}

#loginModal #loginForm::before,
#loginModal .login-form::before{
  margin-bottom:14px !important;
}

#loginModal .login-field{
  width:100% !important;
  margin-bottom:12px !important;
}

#loginModal #loginUser,
#loginModal #loginPass{
  width:100% !important;
  max-width:100% !important;
  height:47px !important;
  border-radius:14px !important;
}

/* Düymələr səliqəli */
#loginModal .modal-actions,
#loginModal .login-actions{
  margin-top:18px !important;
  justify-content:flex-end !important;
  gap:10px !important;
}

#loginModal .modal-actions button,
#loginModal .login-btn{
  height:42px !important;
  min-width:94px !important;
  border-radius:12px !important;
}

/* Kiçik ekran */
@media (max-width:640px){
  #loginModal.modal{
    padding:12px !important;
    align-items:center !important;
  }

  #loginModal .modal-box,
  #loginModal .login-card{
    width:calc(100vw - 24px) !important;
    max-width:calc(100vw - 24px) !important;
    max-height:calc(100dvh - 24px) !important;
    overflow:hidden !important;
    border-radius:26px !important;
  }

  #loginModal .login-brand{
    padding:24px 18px 15px !important;
  }

  #loginModal #loginForm,
  #loginModal .login-form{
    padding:18px 20px 22px !important;
  }

  #loginModal .modal-actions button,
  #loginModal .login-btn{
    flex:1 1 0 !important;
    min-width:0 !important;
    height:44px !important;
  }
}

@media (max-width:380px){
  #loginModal .modal-box,
  #loginModal .login-card{
    width:calc(100vw - 16px) !important;
    max-width:calc(100vw - 16px) !important;
    border-radius:22px !important;
  }

  #loginModal #loginForm,
  #loginModal .login-form{
    padding-left:16px !important;
    padding-right:16px !important;
  }
}

/* ======================================================
   LOGIN MODAL — mobile fullscreen panel
   Version: 20260520-login-mobile-full1
====================================================== */

@media (max-width: 640px){
  #loginModal.modal{
    inset:0 !important;
    width:100vw !important;
    height:100vh !important;
    height:100dvh !important;
    min-height:100dvh !important;
    padding:0 !important;
    align-items:stretch !important;
    justify-content:stretch !important;
    overflow:hidden !important;
    background:
      radial-gradient(circle at 18% 12%, rgba(34,197,94,.22), transparent 30%),
      radial-gradient(circle at 88% 28%, rgba(37,99,235,.22), transparent 32%),
      radial-gradient(circle at 45% 92%, rgba(20,184,166,.18), transparent 34%),
      linear-gradient(135deg, rgba(15,23,42,.72), rgba(71,85,105,.66)) !important;
  }

  #loginModal .modal-box,
  #loginModal .login-card{
    width:100vw !important;
    max-width:100vw !important;
    height:100vh !important;
    height:100dvh !important;
    max-height:100dvh !important;
    min-height:100dvh !important;
    margin:0 !important;
    border-radius:0 !important;
    border:0 !important;
    overflow:hidden !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    background:
      radial-gradient(circle at 16% 0%, rgba(20,184,166,.12), transparent 34%),
      linear-gradient(180deg, rgba(255,255,255,.99), rgba(248,252,255,.97)) !important;
    box-shadow:none !important;
  }

  #loginModal .login-brand{
    flex:0 0 auto !important;
    padding:26px 22px 18px !important;
    border-bottom:1px solid rgba(226,232,240,.75) !important;
  }

  #loginModal .login-logo{
    width:56px !important;
    height:56px !important;
    border-radius:20px !important;
    margin-bottom:14px !important;
  }

  #loginModal h3{
    font-size:24px !important;
  }

  #loginModal .login-brand p{
    max-width:260px !important;
    font-size:13.5px !important;
    line-height:1.45 !important;
  }

  #loginModal #loginForm,
  #loginModal .login-form{
    flex:0 0 auto !important;
    width:100% !important;
    max-width:420px !important;
    margin:0 auto !important;
    padding:24px 24px 28px !important;
  }

  #loginModal #loginForm::before,
  #loginModal .login-form::before{
    margin-bottom:16px !important;
    font-size:13px !important;
  }

  #loginModal .login-field{
    margin-bottom:14px !important;
  }

  #loginModal .login-field span{
    display:block !important;
    margin-bottom:7px !important;
    font-size:12px !important;
  }

  #loginModal #loginUser,
  #loginModal #loginPass{
    width:100% !important;
    height:52px !important;
    font-size:16px !important;
    border-radius:16px !important;
  }

  #loginModal .modal-actions,
  #loginModal .login-actions{
    margin-top:20px !important;
    gap:10px !important;
    flex-direction:row !important;
  }

  #loginModal .modal-actions button,
  #loginModal .login-btn{
    flex:1 1 0 !important;
    min-width:0 !important;
    height:48px !important;
    line-height:48px !important;
    border-radius:14px !important;
    font-size:15px !important;
  }
}

/* çox balaca ekranlarda iç boşluqları azalsın */
@media (max-width: 380px){
  #loginModal .login-brand{
    padding:22px 18px 15px !important;
  }

  #loginModal .login-logo{
    width:50px !important;
    height:50px !important;
    border-radius:17px !important;
  }

  #loginModal h3{
    font-size:21px !important;
  }

  #loginModal .login-brand p{
    max-width:230px !important;
    font-size:12.5px !important;
  }

  #loginModal #loginForm,
  #loginModal .login-form{
    padding:20px 18px 24px !important;
  }

  #loginModal #loginUser,
  #loginModal #loginPass{
    height:50px !important;
  }
}

/* ======================================================
   LOGIN MOBILE — keyboard safe fullscreen
   Version: 20260521-login-keyboard-safe1
====================================================== */

@media (max-width: 640px){
  html,
  body{
    overflow-x:hidden !important;
    -webkit-text-size-adjust:100%;
  }

  body.login-open,
  body.locked-app{
    overflow:hidden !important;
  }

  #loginModal.modal{
    position:fixed !important;
    inset:0 !important;
    width:100vw !important;
    max-width:100vw !important;
    height:100svh !important;
    min-height:100svh !important;
    padding:0 !important;
    display:none;
    align-items:stretch !important;
    justify-content:stretch !important;
    overflow:hidden !important;
  }

  #loginModal.show{
    display:flex !important;
  }

  #loginModal .modal-box,
  #loginModal .login-card{
    width:100vw !important;
    max-width:100vw !important;
    height:100svh !important;
    min-height:100svh !important;
    max-height:100svh !important;
    margin:0 !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-start !important;
    padding-bottom:env(safe-area-inset-bottom) !important;
    scrollbar-width:none !important;
  }

  #loginModal .modal-box::-webkit-scrollbar,
  #loginModal .login-card::-webkit-scrollbar{
    width:0 !important;
    height:0 !important;
    display:none !important;
  }

  #loginModal .login-brand{
    flex:0 0 auto !important;
    padding:
      calc(18px + env(safe-area-inset-top))
      20px
      14px !important;
  }

  #loginModal .login-logo{
    width:48px !important;
    height:48px !important;
    border-radius:17px !important;
    margin-bottom:10px !important;
  }

  #loginModal h3{
    font-size:21px !important;
    line-height:1.15 !important;
  }

  #loginModal .login-brand p{
    max-width:270px !important;
    font-size:12.5px !important;
    line-height:1.35 !important;
  }

  #loginModal #loginForm,
  #loginModal .login-form{
    flex:0 0 auto !important;
    width:100% !important;
    max-width:430px !important;
    margin:0 auto !important;
    padding:18px 26px 22px !important;
  }

  #loginModal #loginForm::before,
  #loginModal .login-form::before{
    margin-bottom:14px !important;
    font-size:13px !important;
  }

  #loginModal .login-field{
    margin-bottom:13px !important;
  }

  #loginModal .login-field span{
    display:block !important;
    margin-bottom:7px !important;
  }

  #loginModal #loginUser,
  #loginModal #loginPass{
    width:100% !important;
    max-width:100% !important;
    height:52px !important;
    min-height:52px !important;
    font-size:16px !important;
    line-height:52px !important;
    border-radius:16px !important;
    transform:none !important;
    scroll-margin-top:120px !important;
  }

  #loginModal #loginUser:focus,
  #loginModal #loginPass:focus{
    transform:none !important;
  }

  #loginModal .modal-actions,
  #loginModal .login-actions{
    margin-top:18px !important;
    gap:10px !important;
    flex-direction:row !important;
  }

  #loginModal .modal-actions button,
  #loginModal .login-btn{
    flex:1 1 0 !important;
    min-width:0 !important;
    height:48px !important;
    line-height:48px !important;
    border-radius:14px !important;
    font-size:15px !important;
  }
}

/* Klaviatura açıq olanda hündürlük azaldıqda kompakt rejim */
@media (max-width: 640px) and (max-height: 680px){
  #loginModal .login-brand{
    padding:
      calc(12px + env(safe-area-inset-top))
      18px
      10px !important;
  }

  #loginModal .login-logo{
    width:42px !important;
    height:42px !important;
    border-radius:15px !important;
    margin-bottom:8px !important;
  }

  #loginModal h3{
    font-size:19px !important;
  }

  #loginModal .login-brand p{
    font-size:12px !important;
    line-height:1.3 !important;
  }

  #loginModal #loginForm,
  #loginModal .login-form{
    padding:14px 22px 18px !important;
  }

  #loginModal #loginUser,
  #loginModal #loginPass{
    height:50px !important;
    min-height:50px !important;
    line-height:50px !important;
  }
}

@media (max-width: 380px){
  #loginModal #loginForm,
  #loginModal .login-form{
    padding-left:18px !important;
    padding-right:18px !important;
  }
}