/* =========================================
   BOOKR Class — Canvas Login (Luxe v3)
   - nagy, éles LOGO (72px)
   - tökéletesen tiszta, animációmentes űrlap
   - konzisztens tipó és terek
   - outline és solid CTA-k Bookr lila palettával
   - csak a login oldalra scope-olva (.ic-Login…)
   ========================================= */

body {
  /* Design tokens */
  --ink: #7D2BE6;
  /* fő szöveg (mély kékes) */
  --muted: #667085;
  /* kísérő szöveg */
  --accent: #7D2BE6;
  /* Bookr lila */
  --accent-press: #5c23d6;
  /* lenyomott */
  --border: #e6e8ec;
  /* lágy kontúr */
  --bg: #ffffff;
  /* tiszta fehér háttér */
  --radius-lg: 24px;
  --radius-md: 14px;
  --shadow: 0 16px 48px rgba(31, 42, 68, .10);
  --orange: rgb(254, 198, 0, .7); 
  --blue-text-color: #1E3466;
  --secondary-bg: rgb(220 227 252);
  --btn-text-color: #ffffff;
}

/* Globális (csak login) tipó és anti-alias */
.ic-Login,
.ic-Login * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.ic-Login-Body #application {
  background-color: #F0F3FE;

}

body.ic-Login-Body #wrapper {
  background: url("https://learn.bookrclass.com/accounts/2/files/137/download?verifier=lo9i46PszA4cph367gCt50cpVN2tZJ90ET2eb0D3");
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: center;
}

body.ic-Login-Body, .ic-Login {
  color:  #1F2330 !important;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji" !important;
}

.ic-Login-Body #main.ic-Layout-columns {
  display: flex;
  align-items: center !important;
  justify-content: center !important;
  background: var(--ic-brand-Login-body-bgd-image);
}

/* ===== Layout: középre tett, arányos kártya ===== */
.ic-Login__content {
  max-width: 660px;
  margin: 0 auto;
  padding: 80px; 
  padding-top: 60px;
  background-color: white;
  border-radius: 20px;
}

.ic-Login .ic-Login__container {
  max-width: 650px !important;
  width: 100% !important;
  margin: 0 auto;
  align-self: center;
  justify-self: center;
}

.ic-Login .ic-Login-header {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.ic-Login-header__logo {
  width: 100% !important;
  text-align: center;
  margin-bottom: 12px;
  flex: auto;
}
} 
.ic-Login__body {
  padding: 0px !important;
  margin: 0px !important;
}
#login_form {
  margin-bottom: 0px;
}

/* Cím (letisztult, erős) */
 h1,
.ic-Login__title,
#login_form h1 {
  font-size: clamp(26px, 3.2vw, 32px) !important;
}

/* Hiba- és súgóüzenetek egységesen */
.ic-Login .ic-Form-message,
.ic-Login .ic-Form-help-text,
.ic-Login .ic-Form-error {
  font-size: 13px !important;
  margin-top: 6px !important;
}

.ic-Login .ic-Form-error {
  color: #b42318 !important;
}
.ic-Login .ic-Login-header__links {
  display: none;
}

.ic-Login .ic-Label {
 color: var(--blue-text-color) !important; 
}
.ic-Login .ic-Form-control .ic-Label {
#  display:none;
}

.ic-Login__actions .ic-Login__actions-timeout {
  width: 100%;
  display: flex !important;
  align-items: center !important;
  flex: auto !important;
  margin-bottom: 1rem;
}
.ic-Login__forgot {
  margin-left: auto;
}

.ic-Login__actions-timeout > label, #pseudonym_session_remember_me {
  margin-bottom: 0px !important;
  margin-top: 0px !important;
  display: block !important;
  margin-right: 5px !important;
}
/* ===== CTA-k: primer & outline, testes tipóval ===== */
.ic-Login .Button--login,
.ic-Login__mobile .Button--primary,
.ic-Login #login_form .Button[type="submit"],
.ic-Login .Button--primary {
  background: var(--accent) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 7px !important;
  padding: 15px 30px !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  text-align: center;
  width: 100%;
  max-width: 350px;
  margin: 0 auto;
  min-height: auto !important;
  height: auto !important;
  line-height: 16px;
}
.ic-Login .Button--login.Button--outline,
.ic-Login__mobile .Button--outline
{
  background-color: transparent !important;
  color: var(--accent) !important;
  border: 2px solid var(--accent) !important;
}

.ic-Login__mobile .Button--outline {
  margin-top: 16px !important;

}

.ic-Login .Button--login:active,
.ic-Login .Button--primary:active,
.ic-Login__mobile .Button--primary:active {
  background: var(--accent-press) !important;
}

.ic-Login .Button--secondary,
.ic-Login .bookr-sso,
.ic-Login .Button.GoogleButton,
.ic-Login .Button.MicrosoftButton,
.ic-Login .Button.SAMLButton {
  height: 48px;
  background: #fff !important;
  color: var(--accent) !important;
  border: 2px solid var(--accent) !important;
  border-radius: var(--radius-md) !important;
  padding: 0 20px !important;
  font-weight: 800 !important;
  box-shadow: none !important;
  transition: none !important;
}


/* Akciók elrendezése: szépen lélegző rács */
.ic-Login .ic-Login__actions,
.ic-Login #login_form .ic-Form-actions {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-top: 22px !important;
}

.ic-Login__actions .ic-Login__actions-timeout label {
  color: var(--ink) !important;
  font-size: 14px;
  font-weight: 500;
}

/* Linkek */
.ic-Login .ic-Login__link,
.ic-Login #forgot_password_link {
  color: var(--ink) !important;
  text-decoration: none !important;
  font-size: 14px;
  font-weight: 500;
}

.ic-Login .ic-Login__link:hover {
  opacity: 1;
  text-decoration: underline !important;
}

/* Zavaró elemek le */
.ic-Login__illustration,
.ic-Login-footer {
  display: none !important;
}

.ic-Login .ic-Form-control--login {
  text-align: center;
  margin-bottom: 31px;
}

.ic-Login .ic-Form-control.ic-Form-control--login:last-child {
  margin-bottom: 0px;	
}
.ic-Login .ic-Login__actions .ic-Form-control--login {
  margin-bottom: 16px !important;
}

/* ===== Reszponzív finomhangolás ===== */
@media (max-width: 760px) {
  .ic-Login__innerContent {
    padding: 32px 20px 24px;
    border-radius: 20px;
  }

}

/* ===== Felső app menü rejtések (kérésed szerint) ===== */
.ic-app-header__menu-list [href*="/calendar"],
.ic-app-header__menu-list [href*="/conversations"],
.ic-app-header__menu-list [href*="/help"] {
  display: none !important;
}

#course_show_secondary,
#left-side,
#courseMenuToggle{
  display: none !important; 
}

body.is-admin #course_show_secondary,
body.is-admin #left-side,
body.is-admin #courseMenuToggle {
  display: block !important;
}
body:not(.is-admin) #main {

margin-left: 0px !important;
}

.ic-Login__forgot-text {
  color: var(--ink) !important;
}

.Button
.Button--primary,
.btn,
.btn-primary,
#expand_collapse_all > span,
.module-sequence-footer a > span {
  background-color: var(--accent) !important;
  color: var(--btn-text-color) !important;
  border-radius: 16px !important;
  border-color: var(--accent) !important;
}
button.btn.btn-success {
   background-color: var(--orange) !important;
   color: var(--accent) !important;
   border-color: var(--orange) !important;
}


.Button:hover,
.Button--primary:hover,
.btn:hover,
.btn-primary:hover,
#expand_collapse_all:hover > span,
.module-sequence-footer a:hover > span {
  background-color: var(--accent-press) !important;
  color: var(--btn-text-color) !important;
}


#quiz_show ul#quiz_student_details {
  display: grid;
  grid-template-columns: auto auto;
  row-gap: 1.5rem;
  border: 0px;
}

#quiz_show ul#quiz_student_details li .value {
 color: var(--muted) !important;
}

#quiz_show ul#quiz_student_details li span.title {
  display: block;
}


#module_prerequisites_list .module > ul {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

#quiz_show .lock_explanation .spinner {
   display:none;
}

.quiz-header h1 {
  margin-bottom: 1.5rem;
}

#quiz-instructions {
  display: none;
}
.quiz-header > h2 {
  display: none;
}

.flag_question {
 display: none;
}

#submit_quiz_form #questions .question {
margin: 0 !important;
    margin-bottom: 0px;
  border: 1px solid var(--border);
  margin-bottom: 2rem !important;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  box-shadow: var(--shadow);
}
#submit_quiz_form #questions .question .header
{
border-bottom: 1px solid var(--border);
  background-color: var(--secondary-bg);
}
#submit_quiz_form #questions {
  padding: 0px !important;
}
.loaded > .quiz-header {
  border-bottom: 0px !important;
  margin-bottom: 2rem;
}

.question .text .question_text {
  margin-top: 0.5rem !important;
  margin-bottom: 0.5rem !important;
}

#questions.assessing .answer {
  padding: 0.75rem 0 !important;
  border-top: none !important;
}

body.quizzes #right-side-wrapper {
display: none;
}


.ic-app-header__logomark-container {

text-align: center;
  background-color: var(--secondary-bg);
  align-items: center;
  justify-content: center;
  display: flex;
  margin-bottom: 1rem;
}

.ic-app-header__logomark {
  width: 75%;
  height: 71px !important;
}

.ic-app-header__menu-list-item.ic-app-header__menu-list-item--active .ic-app-header__menu-list-link {
  background-color: var(--secondary-bg);
  
}

#right-side-wrapper .ic-sidebar-logo {
  display:none;
}

.module-sequence-footer-right {
  display: flex;
  gap: 1rem;
}


.context-modules-v2-feedback-block {
  display: none !important;
}

.ic-Login-header__text {
  width: 100%;
  text-align: center !important;
  color: var(--ink) !important;  
  font-weight: 800;
  font-size: 18px;
  margin-bottom: 2px;
}

.ic-Login-Body .ic-Form-control button[type="button"] {
  background-color: #FFF;
  color: var(--accent);
  border: 2px solid var(--accent);
}

.ic-Login-Body .ic-Input {
  border: 1px solid #4D4555 !important;
  border-radius: 7px !important;

}




#login_form .ic-Form-control {
  position: relative;
}

/* input */
#login_form input.ic-Input {
  transition: border-color .2s ease;
  padding: 22px 16px 12px !important;
  height: 52px;
  line-height: 16px;
  font-size: 16px;
  font-weight: 400;
}

/* placeholder elrejtése */
#login_form input.ic-Input::placeholder {
  color: transparent;
}

/* label */
#login_form  .ic-Label {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  padding: 0 4px;
  transition: .2s ease;
  line-height: 16px;
  font-size: 16px;
  font-weight: 400;

}
#login_form  .ic-Form-control:focus-within .ic-Label,
#login_form  .ic-Form-control:has(input.ic-Input:not(:placeholder-shown)) .ic-Label {
  top: 7px;
  left: 7px;
  transform: translateY(-20%) scale(0.85);
  color: #BA325A;
}


.ic-Login__mobile {
  width: 100vw;
  height: 100vh;
  position: absolute;
  top: 0px;
  left: 0px;
  background-color: #F0F3FE;
}

.ic-Login__mobile .ic-Login__container {
  background: url("https://learn.bookrclass.com/accounts/2/files/138/download?verifier=veTrDp6wr7sTwzGmc4AtXBfqNuvJ4lTWOvyc34dI");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding: 24px;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.ic-Login .ic-Login__innerContent{
  margin: 0px !important;
  padding: 0px !important;
}

.ic-Login__mobile .ic-Login__content {
  padding: 24px !important;
}

.ic-Login__mobile .ic-Login-header__logo {
  margin-bottom: 0px;
}

.ic-Login__mobile .ic-Login-header__text {
  max-width: 78%;
  margin: 28px auto;
}
.ic-Login__mobile .forgotBlock  {
 text-align: right;
 margin-bottom: 25px;
}

.ic-Login__mobile .forgotBlock a.forgot-password  {
  text-aling: right;
  color: #7D2BE6;
  font-size: 14px;
  font-weight: 500;
}

.ic-Login__mobile .error {
  position: fixed;
  top: 50px;
  left: 50%;
  max-width: 80%;
  width: 100%;
  transform: translateX(-50%);
  background-color: #f9e9ec;
  color: #1F2330;
  border: 2px solid #C62348;
  border-radius: 8px;
  padding: 16px 24px;
  font-size: 14px;
  font-weight: 500;
  margin: 0 auto;
  box-sizing: border-box;
  display: flex;
  gap: 18px;
  align-items: center;
  justify-content: flex-start;
  text-align:left;
}

.ic-Login__mobile .error::before {
  content: " ";
  width: 25px;
  height: 25px;
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='17' viewBox='0 0 20 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.00137 17.0075H17.0614C18.6014 17.0075 19.5614 15.3375 18.7914 14.0075L11.2614 0.9975C10.4914 -0.3325 8.57137 -0.3325 7.80137 0.9975L0.271371 14.0075C-0.498629 15.3375 0.461371 17.0075 2.00137 17.0075ZM9.53137 10.0075C8.98137 10.0075 8.53137 9.5575 8.53137 9.0075V7.0075C8.53137 6.4575 8.98137 6.0075 9.53137 6.0075C10.0814 6.0075 10.5314 6.4575 10.5314 7.0075V9.0075C10.5314 9.5575 10.0814 10.0075 9.53137 10.0075ZM10.5314 14.0075H8.53137V12.0075H10.5314V14.0075Z' fill='%23C62348'/%3E%3C/svg%3E%0A");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  flex-shrink: 0; 
}


.ic-Login-Body .error_box,
.ic-Login-Body .ic-flash-error {
    position: fixed;
    top: 50px !important;
    left: 50% !important;
    max-width: min(80%, 650px);
    width: 100%;
    transform: translateX(-50%);
    background-color: #f9e9ec;
    color: #1F2330;
    border: 2px solid #C62348;
    border-radius: 8px;
    padding: 16px 24px;
    font-size: 14px;
    font-weight: 500;
    margin: 0 auto;
    box-sizing: border-box;
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: flex-start;
    text-align:left;
}

.ic-Login-Body .error_box::before,
.ic-Login-Body .ic-flash-error::before {
	content: " ";
	width: 25px;
	height: 25px;
	background-image: url("data:image/svg+xml,%3Csvg width='20' height='17' viewBox='0 0 20 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.00137 17.0075H17.0614C18.6014 17.0075 19.5614 15.3375 18.7914 14.0075L11.2614 0.9975C10.4914 -0.3325 8.57137 -0.3325 7.80137 0.9975L0.271371 14.0075C-0.498629 15.3375 0.461371 17.0075 2.00137 17.0075ZM9.53137 10.0075C8.98137 10.0075 8.53137 9.5575 8.53137 9.0075V7.0075C8.53137 6.4575 8.98137 6.0075 9.53137 6.0075C10.0814 6.0075 10.5314 6.4575 10.5314 7.0075V9.0075C10.5314 9.5575 10.0814 10.0075 9.53137 10.0075ZM10.5314 14.0075H8.53137V12.0075H10.5314V14.0075Z' fill='%23C62348'/%3E%3C/svg%3E%0A");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	flex-shrink: 0;
}
.ic-Login-Body .error_box .error_bottom,
.ic-Login-Body .ic-flash-error .ic-flash__icon,
.ic-Login-Body .ic-flash-error .Button {
    display: none;
}

.ic-Login-Body .error_box .error_text {
  max-height: auto !important;
  overflow: auto;
  margin: 0 !important;
  background-color: transparent !important;
  border: none !important;
  padding: 0px !important;
  
}