/* Background Image Media Queries */
/* css.css MUST BE marked from login.html */
@font-face {
	font-family: 'IRANSansWeb(FaNum)';
	src: local('IRANSansWeb(FaNum)'), url('../fonts/IRANSansWeb(FaNum).ttf');
}
body.login {
    font-family: "IRANSansWeb(FaNum)", Arial, sans-serif, -apple-system;
	background-image: url('../img/zlg_640x700.jpg');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}
@media screen and (min-width: 640px){
	body.login {
		background-image: url('../img/zlg_960x700.jpg');
	}
}
@media screen and (min-width: 960px){
	body.login {
		background-image: url('../img/zlg_1200x900.jpg');
	}
}
@media screen and (min-width: 1200px){
	body.login {
		background-image: url('../img/zlg_1600x950.jpg');
	}
}
@media screen and (min-width: 1600px){
	body.login {
		background-image: url('../img/zlg_2000x1050.jpg');
	}
}

/* MUST BE un-marked for NO IMAGE */
/*
body.login{
    background-image: none !important;
    background-color: #323440 !important
}
*/

/*
.uk-overlay-primary {
    background: #0D2B3E;
}
 */

.login .uk-width-medium.uk-padding-small.uk-position-z-index.uk-scrollspy-inview.uk-animation-fade {
    width: 456px;
    height: 573px;
}
.login form.toggle-class {
    background-color: #D9E4EC;
    padding: 30px;
    border-radius: 5px
}
.login .toggle-class .uk-margin-bottom {
    border-radius: 10px;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
    background-image: linear-gradient(to right, #043138 1%, #043138 100%);
}
.login .toggle-class button.uk-button.uk-button-primary.uk-border-pill.uk-width-1-1 {
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.5;
    letter-spacing: normal;
    text-align: center;
    color: #CFD8DC;
}
.login input.uk-input.uk-border-pill {
    border-radius: 10px;
    border: solid 1px rgb(112, 112, 112);
    background-color: transparent !important;
    padding: 0 50px !important;
}
.login input.uk-input.uk-border-pill::placeholder{
    color: #999 !important;
}
.login .uk-form-icon-flip{
    color: #043138 !important;
    right: 0!important;
    left: auto !important;
    margin: 0 15px !important
}
.login .uk-text-center img {
    width: 125px;
    margin: 10px 0;
}
.login button.uk-button.uk-button-primary.uk-border-pill.uk-width-1-1 {
    background-color: transparent !important; 
}
.uk-input, .uk-light {
    color: #055160 !important;
}
.uk-light a {
    color: #043138 !important;
}
.uk-input::placeholder{
    color: #999 !important;
}
.uk-light, .uk-text-muted {
    color: #055160 !important;
}
.uk-light, .uk-checkbox {
    border-color: #055160 !important;
}

/** ADED FOR BOLD BTNS **/
  /* رنگ‌ها (بر اساس پالت شما) */
  :root{
    --primary:#055160;     /* آبی کلاسیک */
    --accent:#B9F8B1;      /* هایلایت/لینک */
    --dark:#043138;        /* خاکستری تیره */
    --light:#ECEFF1;       /* خاکستری روشن */
  }

  .hero{
    position: relative;
    min-height: 60vh;             /* ارتفاع منطقی برای دسکتاپ */
    display: grid;
    place-items: center;
    text-align: right;
    color: #fff;
    /* تصویر پس‌زمینه: این URL را با تصویر خودتان عوض کنید */
    background:
      linear-gradient( to bottom right, rgba(13,43,62,.65), rgba(30,136,229,.55) ),
      url('../static/img/slider.jpg') center/cover no-repeat;
  }

  /* لایه تیره اضافی برای خوانایی متن (در صورت نیاز) */
  .hero__overlay{
    position:absolute; inset:0;
    background: radial-gradient(ellipse at 70% 30%, rgba(0,0,0,.15), rgba(0,0,0,.35));
    pointer-events:none;
  }

  .hero__content{
    position: relative;
    width: min(92vw, 980px);
    padding: clamp(16px, 3vw, 32px);
  }

  .hero h1{
    margin: 0 0 .5rem;
    font-size: clamp(1.6rem, 3.5vw, 2.4rem);
    line-height: 1.35;
    color: #ECEFF1 !important;
  }
  .hero__subtitle{
    margin: 0 0 1.25rem;
    font-size: clamp(1rem, 2.2vw, 1.1rem);
    color: #CFD8DC;
  }

  .btn{
    display: inline-block;
    padding: .85rem 1.25rem;
    border-radius: .75rem;        /* گوشه‌های کمی گرد */
    font-weight: 600;
    text-decoration: none;
    color: #0F2A44 !important;
    transition: transform .12s ease, box-shadow .12s ease, background-color .15s ease;
    will-change: transform;
  }
  .btn--contact{
    font-family: 'IRANSansWeb(FaNum)';
    background: #B9F8B1;
    color: #00313A;               /* کنتراست خوب روی فیروزه‌ای */
    box-shadow: 0 8px 24px rgba(0, 184, 217, .25);
  }
  .btn--contact:hover{
    transform: translateY(-1px);
    box-shadow: 0 10px 28px rgba(0, 184, 217, .35);
    background: #B9F8B1;          /* کمی روشن‌تر در هاور */
    color: #ECEFF1 !important;
  }

  /* دکمه اختیاری ثانویه */
  .btn--secondary{
    font-family: 'IRANSansWeb(FaNum)';
    background: #B9F8B1;
    box-shadow: 0 10px 28px rgba(0, 184, 217, .35);
    color: #FFFFFF;
    margin-inline-start: .6rem;
    backdrop-filter: saturate(120%) blur(2px);
    border: 2px solid rgba(255,255,255,.25);
  }
  .btn--secondaryg{
    font-family: 'IRANSansWeb(FaNum)';
    background: #008000;
    box-shadow: 0 10px 28px rgba(0, 255, 0, .35);
    color: #FFFFFF;
    margin-inline-start: .6rem;
    backdrop-filter: saturate(120%) blur(2px);
    border: 2px solid rgba(255,255,255,.25);
  }
  .btn--secondaryr{
    font-family: 'IRANSansWeb(FaNum)';
    background: #FA8072;
    box-shadow: 0 10px 28px rgba(255, 0, 0, .35);
    color: #FFFFFF;
    margin-inline-start: .6rem;
    backdrop-filter: saturate(120%) blur(2px);
    border: 2px solid rgba(255,255,255,.25);
  }
 .btn--secondaryo{
    font-family: 'IRANSansWeb(FaNum)';
    background: #FA8072;
    box-shadow: 0 10px 28px rgba(255, 0, 0, .35);
    color: #FFFFFF;
    margin-inline-start: .6rem;
    backdrop-filter: saturate(120%) blur(2px);
    border: 2px solid rgba(255,255,255,.25);
  }
.btn--secondaryb{
    font-family: 'IRANSansWeb(FaNum)';
    background: #dcdcdc;
    box-shadow: 0 10px 28px rgba(140, 140, 134, .35);
    color: #FFFFFF;
    margin-inline-start: .6rem;
    backdrop-filter: saturate(120%) blur(2px);
    border: 2px solid rgba(255,255,255,.25);
  }
.btn--secondaryt{
    font-family: 'IRANSansWeb(FaNum)';
    background: #808080;
    box-shadow: 0 10px 28px rgba(100, 100, 100, .35);
    color: #FFFFFF;
    margin-inline-start: .6rem;
    backdrop-filter: saturate(120%) blur(2px);
    border: 2px solid rgba(255,255,255,.25);
  }

  .btn--secondary:hover{
    background: rgba(255,255,255,.18);
  }
  .btn--secondaryg:hover{
    background: rgba(255,255,255,.18);
  }
 .btn--secondaryr:hover{
    background: rgba(255,255,255,.18);
  }
 .btn--secondaryo:hover{
    background: rgba(255,255,255,.18);
  }

 .btn--secondaryb:hover{
    background: rgba(255,255,255,.18);
  }
 .btn--secondaryt:hover{
    background: rgba(255,255,255,.18);
  }

  /* واکنش‌گرایی بهتر برای موبایل */
  @media (max-width: 640px){
    .hero{
      min-height: 60vh;
      background-position: 60% center;
    }
    .btn{ width: 100%; text-align: center; }
    .btn--secondary{ margin-inline-start: 0; margin-top: .6rem; }
  }