@font-face{font-family:'Farabee';src:url('../fonts/farabee-regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Farabee';src:url('../fonts/farabee-medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Akedoakushon';src:url('../fonts/akedoakushon.woff2') format('woff2');font-display:swap}

:root{
  --bg:#0a0806; --panel:#14100c; --panel-2:#1d1813;
  --border:#3a2e1e; --border-soft:#2a2118;
  --amber:#f0b25c; --amber-dim:#c9832f;
  --text:#d8c4a0; --text-dim:#9a8368; --text-mute:#5a4a34;
}

html,body{height:100%;background:var(--bg)!important}
body{
  color:var(--text)!important;
  font-family:'Farabee',system-ui,sans-serif!important;
  margin:0;display:flex;align-items:center;justify-content:center;
  min-height:100vh;padding:24px;box-sizing:border-box;
  background-image:
    radial-gradient(1px 1px at 12% 22%,rgba(255,255,255,.7) 50%,transparent),
    radial-gradient(1px 1px at 68% 14%,rgba(255,255,255,.5) 50%,transparent),
    radial-gradient(1px 1px at 34% 71%,rgba(255,255,255,.6) 50%,transparent),
    radial-gradient(2px 2px at 82% 58%,rgba(255,255,255,.5) 50%,transparent),
    radial-gradient(1px 1px at 51% 40%,rgba(255,255,255,.4) 50%,transparent),
    radial-gradient(1px 1px at 25% 88%,rgba(255,255,255,.55) 50%,transparent),
    radial-gradient(1px 1px at 91% 32%,rgba(255,255,255,.45) 50%,transparent),
    radial-gradient(1px 1px at 8% 55%,rgba(255,255,255,.4) 50%,transparent),
    radial-gradient(1px 1px at 60% 82%,rgba(255,255,255,.5) 50%,transparent);
  background-repeat:no-repeat;
}

.login-pf-page,#kc-container,#kc-container-wrapper,.login-pf-page-header{
  background:none!important;padding:0!important;margin:0 auto!important;
  max-width:400px;width:100%;
}

/* ЛОГОТИП: название + черта + слоган, как в шапке кабинета */
#kc-header,#kc-header-wrapper{
  background:none!important;border:none!important;
  padding:0 0 26px!important;font-size:0!important;color:transparent!important;
  display:flex!important;align-items:center;justify-content:center;gap:13px;
}
#kc-header-wrapper::before{
  content:'Точка\00000Aсбора';white-space:pre;
  font-family:'Akedoakushon',monospace;
  font-size:17px;line-height:1.14;letter-spacing:.06em;
  color:var(--text);text-align:left;
}
#kc-header-wrapper::after{
  content:'Гарантируем\00000Aпервый\00000Aшаг';white-space:pre;
  font-family:'Farabee',sans-serif;
  font-size:11.5px;line-height:1.2;letter-spacing:.03em;
  color:var(--amber);text-align:left;
  border-left:1px solid var(--border);padding-left:13px;
}

/* карточка */
#kc-content,#kc-content-wrapper,.card-pf,.login-pf-page .card-pf{
  background:var(--panel)!important;
  border:1px solid var(--border)!important;
  border-radius:14px!important;
  box-shadow:0 10px 40px rgba(0,0,0,.5)!important;
  padding:32px 28px!important;margin:0!important;
}
/* убираем вложенную рамку — Keycloak рисует две */
#kc-form,#kc-form-wrapper,.pf-c-card,.pf-c-card__body,.pf-c-form{
  background:none!important;border:none!important;box-shadow:none!important;padding:0!important;
}

#kc-page-title,h1,h2{
  color:var(--text)!important;font-family:'Farabee',sans-serif!important;
  font-size:17px!important;font-weight:500!important;
  text-align:center;margin:0 0 24px!important;letter-spacing:.01em;
}

label,.pf-c-form__label,.pf-c-form__label-text{
  color:var(--text-dim)!important;font-family:'Farabee',sans-serif!important;
  font-size:12.5px!important;font-weight:400!important;margin-bottom:6px!important;
}

.pf-c-form-control,input[type="text"],input[type="password"],input[type="email"]{
  background:var(--panel-2)!important;border:1px solid var(--border)!important;
  border-radius:9px!important;color:var(--text)!important;
  font-family:'Farabee',sans-serif!important;font-size:15px!important;
  padding:12px 14px!important;height:auto!important;box-shadow:none!important;width:100%!important;
  box-sizing:border-box!important;
}
.pf-c-form-control:focus,input:focus{
  border-color:var(--amber-dim)!important;outline:none!important;
  box-shadow:0 0 0 3px rgba(240,178,92,.14)!important;
}
input::placeholder{color:var(--text-mute)!important}
.pf-c-form__group{margin-bottom:18px!important}

/* поле пароля с кнопкой «показать» */
.pf-c-input-group{
  background:var(--panel-2)!important;border:1px solid var(--border)!important;
  border-radius:9px!important;overflow:hidden;display:flex!important;align-items:stretch;
}
.pf-c-input-group input{border:none!important;border-radius:0!important;background:none!important;flex:1}
.pf-c-input-group:focus-within{border-color:var(--amber-dim)!important;box-shadow:0 0 0 3px rgba(240,178,92,.14)!important}
.pf-c-input-group .pf-c-button,#kc-form-login button[type="button"]{
  background:none!important;border:none!important;color:var(--text-mute)!important;
  padding:0 14px!important;cursor:pointer;box-shadow:none!important;
}
.pf-c-input-group .pf-c-button:hover{color:var(--amber)!important;background:none!important}
.pf-c-input-group .pf-c-button svg{fill:currentColor!important;width:16px;height:16px}

input[type="submit"],.pf-c-button.pf-m-primary,#kc-login{
  background:var(--amber)!important;border:none!important;border-radius:999px!important;
  color:#2a1a06!important;font-family:'Farabee',sans-serif!important;
  font-size:15px!important;font-weight:500!important;
  padding:13px 20px!important;width:100%!important;margin-top:6px!important;
  cursor:pointer;transition:filter .2s;box-shadow:none!important;
}
input[type="submit"]:hover,#kc-login:hover{filter:brightness(1.08)}

a{color:var(--amber-dim)!important;text-decoration:none;font-size:13px}
a:hover{color:var(--amber)!important}

.alert-error,.pf-c-alert.pf-m-danger,#input-error,.pf-m-error,.pf-c-form__helper-text.pf-m-error{
  background:rgba(209,68,47,.12)!important;border:1px solid #d1442f!important;
  border-radius:9px!important;color:#e0705c!important;font-size:13px!important;
  padding:11px 14px!important;margin-bottom:16px!important;
}
.pf-c-alert__title,.pf-c-alert__icon{color:#e0705c!important}

.checkbox label,#kc-form-options label{color:var(--text-dim)!important;font-size:13px!important}
input[type="checkbox"]{accent-color:var(--amber)!important}

#kc-locale,.kc-social-section,#kc-registration-container,#kc-registration,
.login-pf-page .login-pf-signup,#kc-info-wrapper{display:none!important}

/* убираем фон стандартной темы */
.login-pf body, body.login-pf{background-image:none!important}
#kc-content-wrapper{background:none!important}

/* ===== убираем вложенные рамки: оставляем одну ===== */
#kc-form, #kc-form-wrapper, .pf-c-card, .pf-c-card__body,
.pf-c-card__title, .pf-c-form, .login-pf-page .card-pf > *,
#kc-form-login, .pf-c-login__main, .pf-c-login__main-body,
.pf-c-login__main-header{
  background:none!important;
  border:none!important;
  box-shadow:none!important;
  padding:0!important;
  margin:0!important;
}
/* единственная рамка — внешняя карточка */
#kc-content, .card-pf, .pf-c-login__main{
  background:var(--panel)!important;
  border:1px solid var(--border)!important;
  border-radius:14px!important;
  box-shadow:0 10px 40px rgba(0,0,0,.5)!important;
  padding:32px 28px!important;
}
.pf-c-login__main{padding:32px 28px!important}

/* заголовок отбиваем от полей */
#kc-page-title{margin-bottom:26px!important}

/* ===== звёзды на фоне ===== */
body::before{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    radial-gradient(1.5px 1.5px at 8% 12%,#fff,transparent),
    radial-gradient(1px 1px at 22% 34%,rgba(255,255,255,.7),transparent),
    radial-gradient(1px 1px at 41% 8%,rgba(255,255,255,.55),transparent),
    radial-gradient(2px 2px at 57% 27%,rgba(255,255,255,.8),transparent),
    radial-gradient(1px 1px at 73% 15%,rgba(255,255,255,.6),transparent),
    radial-gradient(1px 1px at 88% 41%,rgba(255,255,255,.5),transparent),
    radial-gradient(1.5px 1.5px at 15% 63%,rgba(255,255,255,.7),transparent),
    radial-gradient(1px 1px at 33% 81%,rgba(255,255,255,.5),transparent),
    radial-gradient(1px 1px at 49% 94%,rgba(255,255,255,.6),transparent),
    radial-gradient(2px 2px at 68% 72%,rgba(255,255,255,.75),transparent),
    radial-gradient(1px 1px at 84% 88%,rgba(255,255,255,.5),transparent),
    radial-gradient(1px 1px at 95% 60%,rgba(255,255,255,.55),transparent),
    radial-gradient(1px 1px at 5% 45%,rgba(255,255,255,.45),transparent),
    radial-gradient(1px 1px at 62% 52%,rgba(255,255,255,.4),transparent);
  background-repeat:no-repeat;
}
#kc-container, .login-pf-page{position:relative;z-index:1}

/* кнопка «показать пароль» — убираем белую рамку */
.pf-c-button.pf-m-control,
button.pf-c-button.pf-m-control,
#kc-form-login .pf-c-input-group > button,
.pf-c-input-group > .pf-c-button{
  background:transparent!important;
  background-color:transparent!important;
  border:none!important;
  border-left:1px solid var(--border)!important;
  color:var(--text-mute)!important;
  box-shadow:none!important;
  outline:none!important;
  --pf-c-button--m-control--BackgroundColor:transparent!important;
  --pf-c-button--m-control--BorderColor:transparent!important;
  --pf-c-button--m-control--after--BorderColor:transparent!important;
  --pf-c-button--m-control--after--BorderWidth:0!important;
}
.pf-c-button.pf-m-control::before,
.pf-c-button.pf-m-control::after{display:none!important;border:none!important}
.pf-c-button.pf-m-control:hover{color:var(--amber)!important;background:transparent!important}
.pf-c-button.pf-m-control svg,.pf-c-button.pf-m-control i{fill:currentColor!important;color:currentColor!important}



/* ===== пещера ===== */
/* никаких карточек и рамок — только камень */
#kc-form, #kc-form-wrapper, .pf-c-card, .pf-c-card__body,
.pf-c-form, #kc-form-login, .pf-c-login__main-body,
.pf-c-login__main-header, #kc-content-wrapper{
  background:none!important;border:none!important;
  box-shadow:none!important;padding:0!important;margin:0!important;
}

#kc-container, #kc-container-wrapper, .login-pf-page{
  max-width:600px!important;
}

/* проём пещеры */
#kc-content, .card-pf, .pf-c-login__main{
  position:relative!important;
  background:none!important;
  border:none!important;
  border-radius:0!important;
  box-shadow:none!important;
  padding:150px 130px 140px!important;
  min-height:auto!important;
  aspect-ratio:1/1;
  display:flex!important;
  flex-direction:column;
  justify-content:center;
  box-sizing:border-box!important;
}

/* камень фоном на всю площадь */
#kc-content::before, .pf-c-login__main::before{
  content:'';position:absolute;inset:0;z-index:0;
  background:url('../img/cave_frame.png') center/100% 100% no-repeat;
  pointer-events:none;
}
#kc-content > *, .pf-c-login__main > *{position:relative;z-index:2}

/* заголовок — над проёмом, на камне не мешает */
#kc-page-title{
  margin:0 0 22px!important;font-size:15px!important;
  color:var(--text)!important;
}

.pf-c-form__group{margin-bottom:15px!important}
input[type="submit"], #kc-login{margin-top:4px!important}

/* ===== убрать серую подложку под камнем ===== */
.login-pf-page,
.login-pf-page .card-pf,
#kc-content,
#kc-content-wrapper,
#kc-container,
#kc-container-wrapper,
.pf-c-login,
.pf-c-login__main,
.pf-c-login__container,
.pf-c-background-image,
.card-pf,
div[class*="card"],
div[class*="login"]{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
}
/* камень возвращаем поверх — он единственный фон */
#kc-content::before, .pf-c-login__main::before{
  background:url('../img/cave_frame.png') center/100% 100% no-repeat!important;
}

/* ===== мобильные экраны ===== */
@media (max-width:640px){
  body{padding:12px!important}
  #kc-container, #kc-container-wrapper, .login-pf-page{max-width:100%!important}
  #kc-content, .card-pf, .pf-c-login__main{
    padding:22% 21% 20%!important;
    aspect-ratio:1/1.12;
  }
  #kc-page-title{font-size:14px!important;margin-bottom:14px!important}
  .pf-c-form-control, input[type="text"], input[type="password"]{
    font-size:16px!important;padding:10px 11px!important;
  }
  label,.pf-c-form__label-text{font-size:11.5px!important;margin-bottom:4px!important}
  .pf-c-form__group{margin-bottom:11px!important}
  input[type="submit"], #kc-login{padding:11px 16px!important;font-size:14px!important}
}
@media (max-width:400px){
  #kc-content, .card-pf, .pf-c-login__main{padding:20% 18% 18%!important}
}

/* ===== шире проём, форма по центру ===== */
@media (max-width:640px){
  #kc-content, .card-pf, .pf-c-login__main{
    padding:30% 15% 28%!important;
    aspect-ratio:1/1.05;
  }
}
@media (max-width:400px){
  #kc-content, .card-pf, .pf-c-login__main{padding:29% 13% 27%!important}
}
@media (min-width:641px){
  #kc-container, #kc-container-wrapper, .login-pf-page{max-width:640px!important}
  #kc-content, .card-pf, .pf-c-login__main{
    padding:27% 17% 25%!important;
  }
}

/* ===== только шире, вертикаль как была ===== */
@media (max-width:640px){
  #kc-content, .card-pf, .pf-c-login__main{
    padding-left:9%!important;
    padding-right:9%!important;
  }
}
@media (min-width:641px){
  #kc-content, .card-pf, .pf-c-login__main{
    padding-left:11%!important;
    padding-right:11%!important;
  }
}

/* ===== пещера шире ===== */
@media (min-width:641px){
  #kc-container, #kc-container-wrapper, .login-pf-page{max-width:760px!important}
  #kc-content, .card-pf, .pf-c-login__main{
    aspect-ratio:1.3/1;
    padding-left:20%!important;
    padding-right:20%!important;
    padding-top:19%!important;
    padding-bottom:18%!important;
  }
}
@media (max-width:640px){
  #kc-content, .card-pf, .pf-c-login__main{
    aspect-ratio:1.05/1;
    padding-left:17%!important;
    padding-right:17%!important;
    padding-top:22%!important;
    padding-bottom:21%!important;
  }
}

/* ===== ещё шире ===== */
@media (min-width:641px){
  #kc-container, #kc-container-wrapper, .login-pf-page{max-width:920px!important}
  #kc-content, .card-pf, .pf-c-login__main{
    aspect-ratio:1.65/1;
    padding-left:26%!important;
    padding-right:26%!important;
    padding-top:16%!important;
    padding-bottom:15%!important;
  }
}
@media (max-width:640px){
  #kc-content, .card-pf, .pf-c-login__main{
    aspect-ratio:1.25/1;
    padding-left:21%!important;
    padding-right:21%!important;
    padding-top:19%!important;
    padding-bottom:18%!important;
  }
}

/* ===== ДЕСКТОП: возвращаем как было ===== */
@media (min-width:641px){
  #kc-container, #kc-container-wrapper, .login-pf-page{max-width:600px!important}
  #kc-content, .card-pf, .pf-c-login__main{
    aspect-ratio:1/1;
    padding:150px 130px 140px!important;
  }
}

/* ===== подписи полей: свечение и обводка ===== */
label, .pf-c-form__label, .pf-c-form__label-text{
  color:var(--text)!important;
  font-weight:500!important;
  font-size:13px!important;
  text-shadow:
    0 0 8px rgba(0,0,0,.95),
    0 0 4px rgba(0,0,0,.95),
    0 1px 2px rgba(0,0,0,1),
    0 0 14px rgba(240,178,92,.35)!important;
}

/* ===== кнопка входа компактнее ===== */
input[type="submit"], .pf-c-button.pf-m-primary, #kc-login{
  width:auto!important;
  min-width:150px;
  padding:11px 34px!important;
  margin:10px auto 0!important;
  display:block!important;
}

/* ===== логотип вместо заголовка, фикс ошибок ===== */

/* убираем заголовок «Вход в учётную запись», на его месте логотип */
#kc-page-title{
  font-size:0!important;
  color:transparent!important;
  margin:0 0 22px!important;
  display:flex!important;
  flex-direction:column;
  align-items:center;
  line-height:1.15;
}
#kc-page-title::before{
  content:'Точка сбора';
  font-family:'Akedoakushon',monospace;
  font-size:19px;letter-spacing:.06em;
  color:var(--text);
}
#kc-page-title::after{
  content:'Гарантируем первый шаг';
  font-family:'Farabee',sans-serif;
  font-size:11.5px;letter-spacing:.03em;
  color:var(--amber);
  margin-top:7px;
}

/* верхний логотип больше не нужен — он теперь внутри */
#kc-header, #kc-header-wrapper{display:none!important;}

/* ошибки: фиксируем место, чтобы форма не прыгала */
.pf-c-form__helper-text, #input-error, #input-error-username, #input-error-password,
.pf-c-form__helper-text.pf-m-error{
  display:block!important;
  min-height:0!important;
  margin:5px 0 0!important;
  padding:0!important;
  background:none!important;
  border:none!important;
  border-radius:0!important;
  font-size:12px!important;
  line-height:1.4!important;
  color:#e0705c!important;
}
.pf-c-form__helper-text::before, #input-error::before{content:none!important;}

/* общее сообщение об ошибке над формой — без скачков */
.alert-error, .pf-c-alert.pf-m-danger, .pf-c-alert.pf-m-inline.pf-m-danger{
  display:block!important;
  background:rgba(209,68,47,.12)!important;
  border:1px solid #d1442f!important;
  border-radius:9px!important;
  padding:11px 14px!important;
  margin:0 0 18px!important;
  font-size:13px!important;
  line-height:1.45!important;
}
.pf-c-alert__icon, .pf-c-alert__action{display:none!important;}
.pf-c-alert__title, .pf-c-alert__description, .kc-feedback-text{
  color:#e0705c!important;font-size:13px!important;padding:0!important;margin:0!important;
}

/* поля не меняют размер при ошибке */
.pf-c-form-control, input[type="text"], input[type="password"]{
  box-sizing:border-box!important;
  height:auto!important;
}
.pf-c-form-control[aria-invalid="true"], input[aria-invalid="true"]{
  border-color:#d1442f!important;
  box-shadow:none!important;
}
.pf-c-form__group{margin-bottom:16px!important;}
.pf-c-form__group-control{display:block!important;}

/* ===== форма не прыгает при ошибке ===== */

/* карточка прижата к верху, а не по центру — высота меняется без сдвигов */
body{
  align-items:flex-start!important;
  padding-top:8vh!important;
  padding-bottom:6vh!important;
}

/* под сообщение об ошибке всегда зарезервировано место */
.form-group, .pf-c-form__group{
  position:relative!important;
  margin-bottom:0!important;
  padding-bottom:26px!important;
}
#input-error, #input-error-username, #input-error-password,
.pf-c-form__helper-text.pf-m-error, .kc-feedback-text{
  position:absolute!important;
  left:0; right:0; bottom:5px;
  display:block!important;
  margin:0!important; padding:0!important;
  background:none!important; border:none!important;
  font-size:12px!important; line-height:1.35!important;
  color:#e0705c!important;
}
.pf-c-form__helper-text::before, #input-error::before{content:none!important;}

/* поле с ошибкой — только цвет рамки, размеры те же */
input[aria-invalid="true"], .pf-c-form-control[aria-invalid="true"]{
  border-color:#d1442f!important;
  box-shadow:none!important;
}

/* кнопка входа отбита от последнего поля */
input[type="submit"], #kc-login{margin-top:10px!important;}

/* ===== пещера не растягивается, сообщения переносятся ===== */

/* фиксируем пропорции проёма — форма внутри, камень не тянется */
#kc-content, .card-pf, .pf-c-login__main{
  aspect-ratio:1/1!important;
  height:auto!important;
}
@media (max-width:640px){
  #kc-content, .card-pf, .pf-c-login__main{aspect-ratio:1.25/1!important;}
}

/* компактнее поля, чтобы форма влезала в проём */
.form-group, .pf-c-form__group{padding-bottom:20px!important;}
.pf-c-form-control, input[type="text"], input[type="password"]{
  padding:10px 13px!important;font-size:15px!important;
}
label, .pf-c-form__label, .pf-c-form__label-text{
  font-size:12px!important;margin-bottom:4px!important;
}
#kc-page-title{margin:0 0 16px!important;}
#kc-page-title::before{font-size:17px;}
#kc-page-title::after{font-size:11px;margin-top:5px;}
input[type="submit"], #kc-login{padding:11px 30px!important;margin-top:6px!important;}

/* длинные сообщения переносятся и не вылезают */
.alert-error, .pf-c-alert, .pf-c-alert.pf-m-danger, .pf-c-alert.pf-m-warning,
.pf-c-alert__title, .pf-c-alert__description, .kc-feedback-text,
#kc-info-message, .instruction{
  overflow-wrap:break-word!important;
  word-break:break-word!important;
  white-space:normal!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  hyphens:auto;
}
.alert-error, .pf-c-alert.pf-m-danger, .pf-c-alert.pf-m-warning{
  padding:10px 12px!important;
  margin:0 0 14px!important;
  font-size:12.5px!important;
  line-height:1.45!important;
}



/* ===== 2026-09-03: ошибки — в потоке, без наложения на поля ===== */
.pf-c-form__group, .form-group{padding-bottom:0!important;margin-bottom:14px!important;}
#input-error, #input-error-username, #input-error-password,
.pf-c-form__helper-text.pf-m-error, .pf-c-form__helper-text{
  position:static!important; left:auto!important; right:auto!important; bottom:auto!important;
  display:block!important; margin:7px 0 0!important; padding:0!important;
  font-size:12.5px!important; line-height:1.45!important; color:#e0705c!important;
  background:none!important; border:none!important; text-align:left!important;
  overflow-wrap:break-word!important; hyphens:manual!important;
}
/* сообщение над формой: текст внутри рамки, в потоке */
.alert-error, .pf-c-alert, .pf-c-alert.pf-m-danger, .pf-c-alert.pf-m-warning, .pf-c-alert.pf-m-inline{
  display:block!important; position:relative!important; height:auto!important; min-height:0!important;
  grid-template-columns:none!important; grid-template-areas:none!important;
  padding:11px 14px!important; margin:0 0 16px!important;
  font-size:13px!important; line-height:1.45!important; text-align:left!important;
}
.pf-c-alert .pf-c-alert__title, .pf-c-alert .pf-c-alert__description, .pf-c-alert .kc-feedback-text{
  position:static!important; display:block!important; margin:0!important; padding:0!important;
  font-size:13px!important; line-height:1.45!important; color:#e0705c!important; hyphens:manual!important;
}
.pf-c-alert.pf-m-warning{border-color:#c9832f!important;background:rgba(240,178,92,.10)!important;}
.pf-c-alert.pf-m-warning .pf-c-alert__title, .pf-c-alert.pf-m-warning .kc-feedback-text{color:#f0b25c!important;}
/* страница подтверждения выхода и прочие информационные страницы */
#kc-logout-confirm .instruction, .instruction, #kc-info-message p, #kc-info-message{
  color:var(--text,#f0e6d8)!important; font-size:15px!important; line-height:1.5!important;
  text-align:center!important; margin:0 0 18px!important;
}
#kc-logout-confirm #kc-form-buttons{margin-top:4px!important;}
#kc-info-message a{font-size:13px!important;}