/* ============================================================
   #8380 nagradna igra — login/registracija popup stili.
   Izvlecek iz style-2014.css (samo popup pravila), da NE nalagamo
   celega site CSS-a na standalone stran /igra/velika-poletna-2026.
   Genericna element/helper pravila so SCOPANA pod .ui-dialog -> NE puscajo
   v demo dizajn kolesa. .login-box/.register-box so popup-specificni razredi
   (demo jih ne uporablja).
   ============================================================ */

/* KLJUCNO: demo stran ima globalni *{box-sizing:border-box}, ki pljuska v popup.
   style-2014 popup sirine (92%, 81%, auto ...) predpostavljajo content-box -> z border-box
   se vse skrci (beli trakovi, neporavnani FB/Google gumbi). Reset na content-box znotraj popupa. */
.ui-dialog, .ui-dialog * { box-sizing: content-box; }

/* ---- helpers (scoped na popup) ---- */
.ui-dialog .clear { clear: both; }
.ui-dialog .hide { display: none; }
.ui-dialog input:focus, .ui-dialog select:focus, .ui-dialog textarea:focus, .ui-dialog button:focus { outline: none; }

.ui-dialog .field-text { float: left; width: 30%; padding: 10px 0 0 0; }
.ui-dialog .field-input { float: left; width: 70%; margin: 10px 0 0 0; min-height: 25px; }
.ui-dialog .text_right_to_input { float: left; margin: 6px 0 0 5px; }
.ui-dialog .text_left_to_input { float: left; margin: 6px 5px 0 0; }
.ui-dialog .field-text_right { float: left; width: 70%; margin: 10px 0 0 0; }

.ui-dialog input[type="text"], .ui-dialog input[type="password"], .ui-dialog textarea, .ui-dialog select {
  width: 298px; height: 30px; border: 1px solid #CCCCCC; padding-left: 5px; font-size: 14px; line-height: 30px; float: left;
}
.ui-dialog select { height: 32px; width: 310px; }
.ui-dialog input[type="text"]:focus, .ui-dialog input[type="password"]:focus, .ui-dialog textarea:focus, .ui-dialog select:focus { border: 1px solid #222222; }
.ui-dialog input[type="checkbox"] { margin-right: 10px; }
.ui-dialog .field-input .small_explain { clear: both; display: block; color: #888888 !important; font-size: 12px; padding: 4px 0 0 0; }
.ui-dialog .field-input input.error { border: 1px solid #E50000 !important; }
.ui-dialog .field-input .error { clear: both; color: #E50000 !important; font-size: 12px; }
.ui-dialog .required:after { content: "*"; font-weight: bold; color: red; }

/* ---- gumbi (scoped na popup) ---- */
.ui-dialog .button, .ui-dialog .button_green, .ui-dialog .button_green_petrol, .ui-dialog .button_red {
  display: block; border: none; border-radius: 3px; background-color: #1D1D1D; padding: 7px 10px 5px 10px;
  line-height: 18px; cursor: pointer; color: #FFFFFF !important; font-family: 'Roboto Condensed', sans-serif !important;
  font-size: 14px; text-decoration: none;
}
.ui-dialog .button:hover { text-decoration: underline; }
.ui-dialog .button_red { background-color: #E50000; }
.ui-dialog .button_green {
  background-color: #E50000; border-bottom: 2px solid #710004; margin: 0; font-weight: 300;
  background: #EC1A23; background: linear-gradient(to bottom, #EC1A23 0%, #AB090F 100%);
}
.ui-dialog .button_green span { margin-right: 8px; }
.ui-dialog .button_green:hover { margin: 2px 0 0 0; border-bottom: none; text-decoration: none !important; }

/* ---- popup layout (login/register block, popup-specificni razredi) ---- */
.popup_padding { padding: 20px; }
.ui-dialog.login .register-box, .ui-dialog.register .login-box .not_yet_member { display: none; }
.ui-dialog .mobile_close {
  position: fixed; right: 0; top: 0; width: 50px; height: 50px; display: block;
  background: url(/Content/cacheable/css/images/style-2014/button-close-mobile.png) top no-repeat;
}

/* LOGIN BOX */
.login-box { background: #FFF3CC; float: right; width: 250px; padding: 20px 20px; }
.login-box a { color: #222222; }
.login-box .title { font-size: 24px; line-height: 30px; margin-bottom: 10px; font-weight: 300; color: #E50000; }
.login-box .title strong { font-size: 36px; font-weight: 500; }
.login-box .field-text { width: 70px; color: #222222; padding: 17px 0 0 0; }
.login-box .field-input { width: 180px; }
.login-box .field-text_right { width: 180px; padding: 0 0 10px 0; font-size: 13px; }
.login-box .field-input input[type="text"], .login-box .field-input input[type="password"] { width: 168px; border: 1px solid #DBCEA5; }
.login-box .field-input input[type="text"]:focus, .login-box .field-input input[type="password"]:focus { border: 1px solid #928867; }
.login-box hr { margin-bottom: 20px; }
.login-box .facebook { margin: 15px 0 0 0; border-top: 1px solid #DBCEA5; padding: 15px 0 0 0; }
.login-box a.facebook_login {
  width: 190px; height: 46px;
  background: #3B5998 url(/Content/cacheable/css/images/style-2014/button-login_with_facebook.png) no-repeat 11px 11px;
  border-bottom: 2px solid #233251; border-radius: 3px; color: #FFFFFF; display: block; margin: 0;
  padding: 6px 10px 0 50px; font-weight: 300; font-size: 14px; text-decoration: none; cursor: pointer;
}
.login-box a.facebook_login strong { font-weight: 700; font-size: 18px; }
.login-box a.facebook_login:hover { height: 46px; margin: 2px 0 0 0; border-bottom: none; }
.login-box .google_plus { padding: 15px 0 0 0; }
.login-box a.google_plus_login {
  width: 190px; height: 46px;
  background: #D34836 url(/Content/images/2017/google_plus_login.svg) no-repeat 11px 11px; background-size: 30px;
  border-bottom: 2px solid #A62A1A; border-radius: 3px; color: #FFFFFF; display: block; margin: 0;
  padding: 6px 10px 0 50px; font-weight: 300; font-size: 14px; text-decoration: none; cursor: pointer;
}
.login-box a.google_plus_login strong { font-weight: 700; font-size: 18px; display: block; }
.login-box a.google_plus_login:hover { height: 46px; margin: 2px 0 0 0; border-bottom: none; }
.login-box .not_yet_member { margin-top: 15px; border-top: 1px solid #DBCEA5; padding-top: 15px; }
.ui-dialog.login .login-box { width: 92%; padding: 4%; }
.ui-dialog.login .login-box .field-text { width: 30%; }
.ui-dialog.login .login-box .field-input { width: 70%; }
.ui-dialog.login .login-box .field-text_right { width: 70%; }
.ui-dialog.login .login-box a.facebook_login { width: 81%; padding: 6px 4% 6px 15%; }
.ui-dialog.login .login-box a.google_plus_login { width: auto; }

/* REGISTER BOX */
.register-box { width: 370px; float: left; padding: 20px 0 20px 20px; }
.register-box .title { font-size: 24px; color: #E50000; line-height: 30px; margin-bottom: 10px; font-weight: 300; }
.register-box .title strong { font-size: 36px; font-weight: 500; }
.register-box .field-text { width: 130px; padding: 17px 0 0 0; }
.register-box .field-input { width: 180px; }
.register-box .field-input input[type="text"], .register-box .field-input input[type="password"] { width: 200px; }
.register-box .field-input input[type="tel"] { width: 210px; }
.register-box .field-input select { width: 212px; height: 32px; background: #FFFFFF; border: 1px solid #BBBBBB; padding: 5px 5px; }
/* intl-tel-input na MOBILNIH napravah vstavi skriti <select> za izbiro drzave
   (position:absolute; left:0; z-index:1; opacity:0). Genericno pravilo zgoraj
   (za #RegisterCityName) ga razsiri na 212px -> nevidni select prekrije cel
   telefonski input in na mobilu ni mogoce vpisati stevilke. Vrnemo intl-tel-input
   privzeto sirino (samo zastavica), da ostane vnosno polje klikabilno. */
.register-box .field-input .intl-tel-input select {
  width: 42px; height: 100%; padding: 0; border: 0; background: none;
}
.register-box .field-text_right { width: 210px; padding: 0 0 10px 0; font-size: 13px; }
.register-box .field-text_right .error { clear: both; color: #E50000 !important; font-size: 12px; }
.register-box .g-recaptcha { margin-left: 130px; width: 212px; display: block !important; }
.register-box .g-recaptcha div, .register-box .g-recaptcha iframe { width: 212px !important; }
.ui-dialog.login .register-box { width: 92%; padding: 4%; }

/* register-box polja v login nacinu (kompaktni register) — style-2014:966-985 (prej spregledano) */
.ui-dialog.login .register-box .field-text { width: 40%; }
.ui-dialog.login .register-box .field-input { width: 60%; }
.ui-dialog.login .register-box .field-text_right { width: 60%; }
.ui-dialog.login .field-input input[type="text"], .ui-dialog.login .field-input input[type="password"] { width: 96% !important; padding: 0 2% !important; }
.ui-dialog.login .field-input select { width: 100%; }

/* login nacin: login-box je base float:right (732) + width 92% -> 8% beli trak na levi.
   V login nacinu naj NE floata -> 100% zapolni dialog. */
.ui-dialog.login .login-box { float: none; }

/* register two-column (option B): desni login-box je ozek (250px) — FB/Google gumbi naj se prilegajo
   v 2 vrstici (manjsa pisava, fiksna 46px visina), da tekst ne gre cez gumb in dialog ne zraste prevec. */
.ui-dialog.register .login-box a.facebook_login,
.ui-dialog.register .login-box a.google_plus_login {
  width: auto; height: 46px; box-sizing: border-box;
  padding: 5px 8px 0 44px; background-position: 10px center; background-size: 24px;
  font-size: 11px; line-height: 13px; overflow: hidden;
}
.ui-dialog.register .login-box a.facebook_login strong,
.ui-dialog.register .login-box a.google_plus_login strong { font-size: 13px; line-height: 15px; }

/* ============================================================
   #8396 MOBILNA POSTAVITEV POPUPA.
   Extract #8380 ni vseboval mobilnih @media pravil (style-2014 jih ima), zato se
   je registracijska forma na ozkih zaslonih razvlekla desno (desktop fiksne sirine
   polj v ~350px dialogu -> horizontalni preliv). Zlozimo login-box/register-box in
   njuna polja v en stolpec (100% sirina), kot dela glavni site. Drzavni <select>
   ostane 42px (pravilo zgoraj), da telefon ostane vnosljiv.
   ============================================================ */
@media (max-width: 740px) {
  .ui-dialog.register .login-box, .ui-dialog.register .register-box,
  .ui-dialog.login .login-box, .ui-dialog.login .register-box { float: none; width: 92%; padding: 4%; }

  .ui-dialog.register .login-box .field-text, .ui-dialog.register .login-box .field-input,
  .ui-dialog.register .register-box .field-text, .ui-dialog.register .register-box .field-input,
  .ui-dialog.register .register-box .field-text_right,
  .ui-dialog.login .login-box .field-text, .ui-dialog.login .login-box .field-input,
  .ui-dialog.login .register-box .field-text, .ui-dialog.login .register-box .field-input,
  .ui-dialog.login .register-box .field-text_right { width: 100%; }

  .ui-dialog.register .field-input input[type="text"], .ui-dialog.register .field-input input[type="password"],
  .ui-dialog.login .field-input input[type="text"], .ui-dialog.login .field-input input[type="password"] { width: 96%; padding: 0 2%; }

  .ui-dialog.register .field-input select, .ui-dialog.login .field-input select { width: 100%; }
}