.is-noselect {
  user-select: none;            /* Alapértelmezett tiltás */
  -webkit-user-select: none;    /* Safari / Chrome */
  -moz-user-select: none;       /* Firefox */
  -ms-user-select: none;        /* Régi Edge / IE */
}


:root {
  /* Tranzíciók időzítése */
  --transition-time: 500ms;
}

/** {
  font-family: "<%= fontFamily %>", sans-serif;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 1); 
}*/


/*.alert {
  display: flex;
  position: static; 
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 4px 20px 4px 20px;
  width: 100%;
  height: 100%;
  text-decoration: none;
  font-size: 13px;
  line-height: 20px;
  text-shadow: none;
  background-color: #272e3b;
  color: rgba(255, 255, 255, 0.7);
  border: 1px solid #000;
  box-shadow: 0 0 0 1px #363d49 inset, 0 5px 10px rgba(0, 0, 0, 0.75);
  z-index: 100;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 1); 
  text-align: center;
  justify-content: center; 
  align-items: center; 
}*/

/* Alert stílusok */
/*.alert {
  opacity: 0;
  position: fixed;
  width: 90%;
  height: auto;
  top: 35%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 20px;
  border: 1px solid transparent;
  transition: opacity 500ms ease-in-out;
  line-height: 20px;
  text-decoration: none;
  font-size: 16px;
  text-align: center;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.alert-info {
  color: #f0f8ff;
  background-color: #007acc;
  box-shadow: 0 0 0 1px #005c99 inset, 0 5px 10px rgba(0, 0, 0, 0.75);
}

.alert-error {
  color: #f00;
  background-color: #360e10;
  box-shadow: 0 0 0 1px #551e21 inset, 0 5px 10px rgba(0, 0, 0, 0.75);
}

.alert:empty {
  display: none;
}

.alert-success {
  color: #21ec0c;
  background-color: #15360e;
  box-shadow: 0 0 0 1px #2a551e inset, 0 5px 10px rgba(0, 0, 0, 0.75);
}

.close-btn {
  position: absolute;
  top: 3px;
  right: 10px;
  cursor: pointer;
  font-size: 20px;
  background-color: transparent;
  border: none;
  color: #f7f7f7;
}

.alert-error .close-btn {
  color: #f00;
}

.alert-success .close-btn {
  color: #21ec0c;
}

.alert-info .close-btn {
  color: #f7f7f7;
}

.close-btn:hover {
  color: #00aeff;
}*/

/*.flash-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}

.flash-buttons form {
  max-width: 150px;
  width: 150px; 
}

.flash-buttons button {
  width: 100%;
  padding: 10px;
  text-align: center;
  box-sizing: border-box;
  background-color: transparent; 
  color: #fff;
  border: 1px solid red; 
  border-radius: 3px; 
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: background-color 0.3s ease; 
}*/

.flash-buttons button:hover {
  /*background-color: rgba(0, 92, 153, 0.2); /* Slightly colored background on hover */
}

.flash-buttons button:focus {
  /*outline: none;*/
  /*box-shadow: 0 0 0 2px rgba(0, 92, 153, 0.5); /* Box shadow for focus state */
}

.flash-btn-default {
  /*border-color: #ffc107 !important;*/
  /*color: #f7f7f7 !important;*/
}

.btn-default:focus, .btn-default:hover {
  /*background-color: rgba(255, 193, 7, 0.2) !important;*/
  /*box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.5) !important;*/
}

/********************************************/
/* EZ INDEX.CSS BE VAGY MARADJON ITT??????? */
/********************************************/
a {
  color: #00aeff;
  -webkit-transition: color var(--transition-time); /* Chrome & Safari */
  -moz-transition: color var(--transition-time);    /* Mozilla Firefox */
  -ms-transition: color var(--transition-time);     /* Internet Explorer */
  -o-transition: color var(--transition-time);      /* Opera */
  transition: color var(--transition-time);         /* Standard: Chrome, Firefox, IE, and Opera */
}

a:focus,
a:hover {
  color: #ffffff;
}
a.inverse {
  color: rgba(255, 255, 255, 0.7);
}
a.inverse:focus,
a.inverse:hover {
  color: #ffffff;
}

/********************************************/


.content {
    flex-grow: 1;
    overflow: auto;
/*    background-color: rgba(0, 0, 0, 0.4); /* Fekete háttér átlátszósággal */
/*    padding: 20px; /* Szükséges margó a tartalom körül */
}

  /*.panel-content{
    position:relative;
    width:450px;
    margin-left:auto;
    margin-right:auto; 
    border-style: hidden;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.1); 
    color: white; 
    padding: 20px; 

    backdrop-filter: blur(10px); 
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); 

    ::webkit-scrollbar { 
      display: auto; }
  
  }*/

  /* a Formok hoz */
  .module{
    top: 0;
    display: inline-block;
    padding: 20px;
  }

  /* nem látok külömbséget  */
  /*.custom-select,*/
  label,
  input,
  button,
  select,
  textarea,
  .custom-select {
    font-size: 15px;
    font-weight: 400;
    line-height: 20px;
  }


  button, input, optgroup, select, textarea, .custom-select {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
  }  

  button, select, .custom-select {
    text-transform: none;
  }

  label {
/*    display: block;
    margin-bottom: 8px;*/
  }

/*  .label {
    font-size: 15px;
    line-height: 18px;
    padding: 0 10px;
    border-radius: 2px;
  }*/

  .label[href]:focus,
  .badge[href]:focus,
  .label[href]:hover,
  .badge[href]:hover {
    color: rgba(255, 255, 255, 0.7);
    background-color: #3b465a;
  }
  .label-important,
  .badge-important,
  .label-danger,
  .badge-danger,
  .label-error,
  .badge-error {
    background-color: #360e10;
    border-color: #551e21;
    /*color:white;*/
  }
  .label-important[href]:focus,
  .badge-important[href]:focus,
  .label-important[href]:hover,
  .badge-important[href]:hover {
    background-color: #5f181c;
  }




/****************************************************/
/***************** KISEGITŐ LINKEK ******************/
/****************************************************/

  /* AZ EREDETI CSS BEN CSAK "a" VOLT, TESZTELNI HOL ZAVAR BE MAJD !!!!!!!!!!!!!!!!! */

  #help-links a {
    color: #00aeff;
    -webkit-transition: color var(--transition-time); /* Chrome & Safari */
    -moz-transition: color var(--transition-time);    /* Mozilla Firefox */
    -ms-transition: color var(--transition-time);     /* Internet Explorer */
    -o-transition: color var(--transition-time);      /* Opera */
    transition: color var(--transition-time);         /* Standard: Chrome, Firefox, IE, and Opera */
  }
  #help-links a:focus,
  #help-links a:hover {
    color: #ffffff;
  }
  #help-links a.inverse {
    color: rgba(255, 255, 255, 0.7);
  }
  #help-links a.inverse:focus,
  #help-links a.inverse:hover {
    color: #ffffff;
  }
  
/***********************************************************************************/

#help-links {
    list-style-type: none;
    margin: 10px 0;
}
#help-links, #sending, .text-center, body .thirdparty-line, body .use-third-party {
    text-align: center;
}
#help-links li {
    display: block;
}




/****************************************************/
/****************** BEVITELI MEZŐK ******************/
/****************************************************/

/* bezavar a custom select !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! nézd át!!!!!!!!!!
select,
*/
/*select,*/
textarea,
input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"] 
  {
  width:100%;;
  padding: 0 10px;
  /*margin-top: 0px;
  margin-bottom: 12px;*/

  cursor: text;
  display: inline-block;
  vertical-align: middle;
  height: 34px;
  font-size: 15px;
  line-height: 20px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  /*outline: 2px solid transparent;*/
  background-color: rgba(0, 0, 0, 0.5);
  color: rgba(255, 255, 255, 0.7);
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 2px;
}

/*select,*/
textarea,
input[type="file"],
input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  -webkit-transition: background-position var(--transition-time), background-color var(--transition-time), border-color var(--transition-time), box-shadow var(--transition-time);
  transition: background-position var(--transition-time), background-color var(--transition-time), border-color var(--transition-time), box-shadow var(--transition-time);
  -moz-transition: background-position var(--transition-time), background-color var(--transition-time), border-color var(--transition-time), box-shadow var(--transition-time);
  -ms-transition: background-position var(--transition-time), background-color var(--transition-time), border-color var(--transition-time), box-shadow var(--transition-time);
  -o-transition: background-position var(--transition-time), background-color var(--transition-time), border-color var(--transition-time), box-shadow var(--transition-time); 
}


/*select:hover,*/
textarea:hover,
input[type="file"]:hover,
input[type="color"]:hover,
input[type="date"]:hover,
input[type="datetime"]:hover,
input[type="datetime-local"]:hover,
input[type="email"]:hover,
input[type="month"]:hover,
input[type="number"]:hover,
input[type="password"]:hover,
input[type="search"]:hover,
input[type="tel"]:hover,
input[type="text"]:hover,
input[type="time"]:hover,
input[type="url"]:hover,
input[type="week"]:hover {
  /*border-color: rgba(255, 255, 255, 0.5);*/
  background-color: rgba(0, 0, 0, 0.5);
  color: rgba(255, 255, 255, 0.7);
  border-color: #00b6ff; 
}

/*select:focus,*/
textarea:focus,
input[type="file"]:focus,
input[type="color"]:focus,
input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="email"]:focus,
input[type="month"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
input[type="week"]:focus {
border-color: #1e5f99;
background-color: rgba(0, 0, 0, 0.5);
color: #ffffff;
}

/*select[disabled],*/
textarea[disabled],
input[type="file"][disabled]:hover,
input[type="color"][disabled]:hover,
input[type="date"][disabled]:hover,
input[type="datetime"][disabled]:hover,
input[type="datetime-local"][disabled]:hover,
input[type="email"][disabled]:hover,
input[type="month"][disabled]:hover,
input[type="number"][disabled]:hover,
input[type="password"][disabled]:hover,
input[type="search"][disabled]:hover,
input[type="tel"][disabled]:hover,
input[type="text"][disabled]:hover,
input[type="time"][disabled]:hover,
input[type="url"][disabled]:hover,
input[type="week"][disabled]:hover,

/*select.disabled,*/
textarea.disabled,
input[type="file"].disabled:hover,
input[type="color"].disabled:hover,
input[type="date"].disabled:hover,
input[type="datetime"].disabled:hover,
input[type="datetime-local"].disabled:hover,
input[type="email"].disabled:hover,
input[type="month"].disabled:hover,
input[type="number"].disabled:hover,
input[type="password"].disabled:hover,
input[type="search"].disabled:hover,
input[type="tel"].disabled:hover,
input[type="text"].disabled:hover,
input[type="time"].disabled:hover,
input[type="url"].disabled:hover,
input[type="week"].disabled:hover {
/*border-color: rgba(255, 255, 255, 0.3) !important;*/
/*border-color: rgba(255, 255, 255, 0.3) !important;*/
background-color: rgba(20, 20, 23, 0.5) !important;
color: #7f7f7f !important;
cursor: default !important;
border-color: red !important; 
/*border-width: 2px;*/
}

/* lehet nem is lehet focusban !!!!!!!!!!*/
/*select[disabled]:focus,*/
textarea[disabled]:focus,
input[type="file"][disabled]:focus,
input[type="color"][disabled]:focus,
input[type="date"][disabled]:focus,
input[type="datetime"][disabled]:focus,
input[type="datetime-local"][disabled]:focus,
input[type="email"][disabled]:focus,
input[type="month"][disabled]:focus,
input[type="number"][disabled]:focus,
input[type="password"][disabled]:focus,
input[type="search"][disabled]:focus,
input[type="tel"][disabled]:focus,
input[type="text"][disabled]:focus,
input[type="time"][disabled]:focus,
input[type="url"][disabled]:focus,
input[type="week"][disabled]:focus,

/*select.disabled:focus,*/
textarea.disabled:focus,
input[type="file"].disabled:focus,
input[type="color"].disabled:focus,
input[type="date"].disabled:focus,
input[type="datetime"].disabled:focus,
input[type="datetime-local"].disabled:focus,
input[type="email"].disabled:focus,
input[type="month"].disabled:focus,
input[type="number"].disabled:focus,
input[type="password"].disabled:focus,
input[type="search"].disabled:focus,
input[type="tel"].disabled:focus,
input[type="text"].disabled:focus,
input[type="time"].disabled:focus,
input[type="url"].disabled:focus,
input[type="week"].disabled:focus {
/*border-color: rgba(255, 255, 255, 0.3) !important;*/
border-color:red !important;
background-color: rgba(20, 20, 23, 0.5) !important;
color: #7f7f7f !important;
cursor: default !important;
border-width: 2px;
}

input[infotext], input.infotext {
  user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;

  pointer-events:none;

  border-color: transparent;
  background: transparent;
  background-color: transparent;
  border-width: 0px !important;
}
input[infotext]:hover, input.infotext:hover {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  border-width: 0px !important;
}
input[infotext]:focus, input.infotext:focus,
input[infotext].focus, input.infotext.focus,
input[infotext]:active, input.infotext:active,
input[infotext].active, input.infotext.active {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  border-width: 0px !important;
}


/* lehet nem is lehet focusban !!!!!!!!!!*/
/*select[disabled]:focus,*/
textarea[disabled]:active,
input[type="file"][disabled]:active,
input[type="color"][disabled]:active,
input[type="date"][disabled]:active,
input[type="datetime"][disabled]:active,
input[type="datetime-local"][disabled]:active,
input[type="email"][disabled]:active,
input[type="month"][disabled]:active,
input[type="number"][disabled]:active,
input[type="password"][disabled]:active,
input[type="search"][disabled]:active,
input[type="tel"][disabled]:active,
input[type="text"][disabled]:active,
input[type="time"][disabled]:active,
input[type="url"][disabled]:active,
input[type="week"][disabled]:active,

/*select.disabled:focus,*/
textarea.disabled:active,
input[type="file"].disabled:active,
input[type="color"].disabled:active,
input[type="date"].disabled:active,
input[type="datetime"].disabled:active,
input[type="datetime-local"].disabled:active,
input[type="email"].disabled:active,
input[type="month"].disabled:active,
input[type="number"].disabled:active,
input[type="password"].disabled:active,
input[type="search"].disabled:active,
input[type="tel"].disabled:active,
input[type="text"].disabled:active,
input[type="time"].disabled:active,
input[type="url"].disabled:active,
input[type="week"].disabled:active {
/*border-color: rgba(255, 255, 255, 0.3) !important;*/
border-color:red !important;
background-color: rgba(20, 20, 23, 0.5) !important;
color: #7f7f7f !important;
cursor: default !important;
border-width: 2px;
}

/*select[disabled]:-moz-placeholder,*/
textarea[disabled]:-moz-placeholder,
input[type="file"][disabled]:-moz-placeholder,
input[type="color"][disabled]:-moz-placeholder,
input[type="date"][disabled]:-moz-placeholder,
input[type="datetime"][disabled]:-moz-placeholder,
input[type="datetime-local"][disabled]:-moz-placeholder,
input[type="email"][disabled]:-moz-placeholder,
input[type="month"][disabled]:-moz-placeholder,
input[type="number"][disabled]:-moz-placeholder,
input[type="password"][disabled]:-moz-placeholder,
input[type="search"][disabled]:-moz-placeholder,
input[type="tel"][disabled]:-moz-placeholder,
input[type="text"][disabled]:-moz-placeholder,
input[type="time"][disabled]:-moz-placeholder,
input[type="url"][disabled]:-moz-placeholder,
input[type="week"][disabled]:-moz-placeholder,

/*select.disabled:-moz-placeholder,*/
textarea.disabled:-moz-placeholder,
input[type="file"].disabled:-moz-placeholder,
input[type="color"].disabled:-moz-placeholder,
input[type="date"].disabled:-moz-placeholder,
input[type="datetime"].disabled:-moz-placeholder,
input[type="datetime-local"].disabled:-moz-placeholder,
input[type="email"].disabled:-moz-placeholder,
input[type="month"].disabled:-moz-placeholder,
input[type="number"].disabled:-moz-placeholder,
input[type="password"].disabled:-moz-placeholder,
input[type="search"].disabled:-moz-placeholder,
input[type="tel"].disabled:-moz-placeholder,
input[type="text"].disabled:-moz-placeholder,
input[type="time"].disabled:-moz-placeholder,
input[type="url"].disabled:-moz-placeholder,
input[type="week"].disabled:-moz-placeholder {
color: #7f7f7f !important;
}


/*select[disabled]:-ms-input-placeholder,*/
textarea[disabled]:-ms-input-placeholder,
input[type="file"][disabled]:-ms-input-placeholder,
input[type="color"][disabled]:-ms-input-placeholder,
input[type="date"][disabled]:-ms-input-placeholder,
input[type="datetime"][disabled]:-ms-input-placeholder,
input[type="datetime-local"][disabled]:-ms-input-placeholder,
input[type="email"][disabled]:-ms-input-placeholder,
input[type="month"][disabled]:-ms-input-placeholder,
input[type="number"][disabled]:-ms-input-placeholder,
input[type="password"][disabled]:-ms-input-placeholder,
input[type="search"][disabled]:-ms-input-placeholder,
input[type="tel"][disabled]:-ms-input-placeholder,
input[type="text"][disabled]:-ms-input-placeholder,
input[type="time"][disabled]:-ms-input-placeholder,
input[type="url"][disabled]:-ms-input-placeholder,
input[type="week"][disabled]:-ms-input-placeholder,

/*select.disabled:-ms-input-placeholder,*/
textarea.disabled:-ms-input-placeholder,
input[type="file"].disabled:-ms-input-placeholder,
input[type="color"].disabled:-ms-input-placeholder,
input[type="date"].disabled:-ms-input-placeholder,
input[type="datetime"].disabled:-ms-input-placeholder,
input[type="datetime-local"].disabled:-ms-input-placeholder,
input[type="email"].disabled:-ms-input-placeholder,
input[type="month"].disabled:-ms-input-placeholder,
input[type="number"].disabled:-ms-input-placeholder,
input[type="password"].disabled:-ms-input-placeholder,
input[type="search"].disabled:-ms-input-placeholder,
input[type="tel"].disabled:-ms-input-placeholder,
input[type="text"].disabled:-ms-input-placeholder,
input[type="time"].disabled:-ms-input-placeholder,
input[type="url"].disabled:-ms-input-placeholder,
input[type="week"].disabled:-ms-input-placeholder {
color: #7f7f7f !important;
opacity: 1;
}


/*select[disabled]::-webkit-input-placeholder,*/
textarea[disabled]::-webkit-input-placeholder,
input[type="file"][disabled]::-webkit-input-placeholder,
input[type="color"][disabled]::-webkit-input-placeholder,
input[type="date"][disabled]::-webkit-input-placeholder,
input[type="datetime"][disabled]::-webkit-input-placeholder,
input[type="datetime-local"][disabled]::-webkit-input-placeholder,
input[type="email"][disabled]::-webkit-input-placeholder,
input[type="month"][disabled]::-webkit-input-placeholder,
input[type="number"][disabled]::-webkit-input-placeholder,
input[type="password"][disabled]::-webkit-input-placeholder,
input[type="search"][disabled]::-webkit-input-placeholder,
input[type="tel"][disabled]::-webkit-input-placeholder,
input[type="text"][disabled]::-webkit-input-placeholder,
input[type="time"][disabled]::-webkit-input-placeholder,
input[type="url"][disabled]::-webkit-input-placeholder,
input[type="week"][disabled]::-webkit-input-placeholder,


/*select.disabled::-webkit-input-placeholder,*/
textarea.disabled::-webkit-input-placeholder,
input[type="file"].disabled::-webkit-input-placeholder,
input[type="color"].disabled::-webkit-input-placeholder,
input[type="date"].disabled::-webkit-input-placeholder,
input[type="datetime"].disabled::-webkit-input-placeholder,
input[type="datetime-local"].disabled::-webkit-input-placeholder,
input[type="email"].disabled::-webkit-input-placeholder,
input[type="month"].disabled::-webkit-input-placeholder,
input[type="number"].disabled::-webkit-input-placeholder,
input[type="password"].disabled::-webkit-input-placeholder,
input[type="search"].disabled::-webkit-input-placeholder,
input[type="tel"].disabled::-webkit-input-placeholder,
input[type="text"].disabled::-webkit-input-placeholder,
input[type="time"].disabled::-webkit-input-placeholder,
input[type="url"].disabled::-webkit-input-placeholder,
input[type="week"].disabled::-webkit-input-placeholder {
color: #7f7f7f !important;
opacity: 1;
}

/*select[disabled]::-moz-placeholder,*/
textarea[disabled]::-moz-placeholder,
input[type="file"][disabled]::-moz-placeholder,
input[type="color"][disabled]::-moz-placeholder,
input[type="date"][disabled]::-moz-placeholder,
input[type="datetime"][disabled]::-moz-placeholder,
input[type="datetime-local"][disabled]::-moz-placeholder,
input[type="email"][disabled]::-moz-placeholder,
input[type="month"][disabled]::-moz-placeholder,
input[type="number"][disabled]::-moz-placeholder,
input[type="password"][disabled]::-moz-placeholder,
input[type="search"][disabled]::-moz-placeholder,
input[type="tel"][disabled]::-moz-placeholder,
input[type="text"][disabled]::-moz-placeholder,
input[type="time"][disabled]::-moz-placeholder,
input[type="url"][disabled]::-moz-placeholder,
input[type="week"][disabled]::-moz-placeholder,

/*select.disabled::-moz-placeholder,*/
textarea.disabled::-moz-placeholder,
input[type="file"].disabled::-moz-placeholder,
input[type="color"].disabled::-moz-placeholder,
input[type="date"].disabled::-moz-placeholder,
input[type="datetime"].disabled::-moz-placeholder,
input[type="datetime-local"].disabled::-moz-placeholder,
input[type="email"].disabled::-moz-placeholder,
input[type="month"].disabled::-moz-placeholder,
input[type="number"].disabled::-moz-placeholder,
input[type="password"].disabled::-moz-placeholder,
input[type="search"].disabled::-moz-placeholder,
input[type="tel"].disabled::-moz-placeholder,
input[type="text"].disabled::-moz-placeholder,
input[type="time"].disabled::-moz-placeholder,
input[type="url"].disabled::-moz-placeholder,
input[type="week"].disabled::-moz-placeholder {
color: #7f7f7f !important;
opacity: 1;
}

/*select:-moz-placeholder,*/
textarea:-moz-placeholder,
input[type="file"]:-moz-placeholder,
input[type="color"]:-moz-placeholder,
input[type="date"]:-moz-placeholder,
input[type="datetime"]:-moz-placeholder,
input[type="datetime-local"]:-moz-placeholder,
input[type="email"]:-moz-placeholder,
input[type="month"]:-moz-placeholder,
input[type="number"]:-moz-placeholder,
input[type="password"]:-moz-placeholder,
input[type="search"]:-moz-placeholder,
input[type="tel"]:-moz-placeholder,
input[type="text"]:-moz-placeholder,
input[type="time"]:-moz-placeholder,
input[type="url"]:-moz-placeholder,
input[type="week"]:-moz-placeholder {
color: rgba(255, 255, 255, 0.3);
}



/*select:-ms-input-placeholder,*/
textarea:-ms-input-placeholder,
input[type="file"]:-ms-input-placeholder,
input[type="color"]:-ms-input-placeholder,
input[type="date"]:-ms-input-placeholder,
input[type="datetime"]:-ms-input-placeholder,
input[type="datetime-local"]:-ms-input-placeholder,
input[type="email"]:-ms-input-placeholder,
input[type="month"]:-ms-input-placeholder,
input[type="number"]:-ms-input-placeholder,
input[type="password"]:-ms-input-placeholder,
input[type="search"]:-ms-input-placeholder,
input[type="tel"]:-ms-input-placeholder,
input[type="text"]:-ms-input-placeholder,
input[type="time"]:-ms-input-placeholder,
input[type="url"]:-ms-input-placeholder,
input[type="week"]:-ms-input-placeholder {
color: rgba(255, 255, 255, 0.3);
}



/*select::-webkit-input-placeholder,*/
textarea::-webkit-input-placeholder,
input[type="file"]::-webkit-input-placeholder,
input[type="color"]::-webkit-input-placeholder,
input[type="date"]::-webkit-input-placeholder,
input[type="datetime"]::-webkit-input-placeholder,
input[type="datetime-local"]::-webkit-input-placeholder,
input[type="email"]::-webkit-input-placeholder,
input[type="month"]::-webkit-input-placeholder,
input[type="number"]::-webkit-input-placeholder,
input[type="password"]::-webkit-input-placeholder,
input[type="search"]::-webkit-input-placeholder,
input[type="tel"]::-webkit-input-placeholder,
input[type="text"]::-webkit-input-placeholder,
input[type="time"]::-webkit-input-placeholder,
input[type="url"]::-webkit-input-placeholder,
input[type="week"]::-webkit-input-placeholder {
color: rgba(255, 255, 255, 0.3);
}



/*select:focus:-moz-placeholder,*/
textarea:focus:-moz-placeholder,
input[type="file"]:focus:-moz-placeholder,
input[type="color"]:focus:-moz-placeholder,
input[type="date"]:focus:-moz-placeholder,
input[type="datetime"]:focus:-moz-placeholder,
input[type="datetime-local"]:focus:-moz-placeholder,
input[type="email"]:focus:-moz-placeholder,
input[type="month"]:focus:-moz-placeholder,
input[type="number"]:focus:-moz-placeholder,
input[type="password"]:focus:-moz-placeholder,
input[type="search"]:focus:-moz-placeholder,
input[type="tel"]:focus:-moz-placeholder,
input[type="text"]:focus:-moz-placeholder,
input[type="time"]:focus:-moz-placeholder,
input[type="url"]:focus:-moz-placeholder,
input[type="week"]:focus:-moz-placeholder {
color: rgba(255, 255, 255, 0.3);
}



/*select:focus:-ms-input-placeholder,*/
textarea:focus:-ms-input-placeholder,
input[type="file"]:focus:-ms-input-placeholder,
input[type="color"]:focus:-ms-input-placeholder,
input[type="date"]:focus:-ms-input-placeholder,
input[type="datetime"]:focus:-ms-input-placeholder,
input[type="datetime-local"]:focus:-ms-input-placeholder,
input[type="email"]:focus:-ms-input-placeholder,
input[type="month"]:focus:-ms-input-placeholder,
input[type="number"]:focus:-ms-input-placeholder,
input[type="password"]:focus:-ms-input-placeholder,
input[type="search"]:focus:-ms-input-placeholder,
input[type="tel"]:focus:-ms-input-placeholder,
input[type="text"]:focus:-ms-input-placeholder,
input[type="time"]:focus:-ms-input-placeholder,
input[type="url"]:focus:-ms-input-placeholder,
input[type="week"]:focus:-ms-input-placeholder {
color: rgba(255, 255, 255, 0.3);
}



/*select:focus::-webkit-input-placeholder,*/
textarea:focus::-webkit-input-placeholder,
input[type="file"]:focus::-webkit-input-placeholder,
input[type="color"]:focus::-webkit-input-placeholder,
input[type="date"]:focus::-webkit-input-placeholder,
input[type="datetime"]:focus::-webkit-input-placeholder,
input[type="datetime-local"]:focus::-webkit-input-placeholder,
input[type="email"]:focus::-webkit-input-placeholder,
input[type="month"]:focus::-webkit-input-placeholder,
input[type="number"]:focus::-webkit-input-placeholder,
input[type="password"]:focus::-webkit-input-placeholder,
input[type="search"]:focus::-webkit-input-placeholder,
input[type="tel"]:focus::-webkit-input-placeholder,
input[type="text"]:focus::-webkit-input-placeholder,
input[type="time"]:focus::-webkit-input-placeholder,
input[type="url"]:focus::-webkit-input-placeholder,
input[type="week"]:focus::-webkit-input-placeholder {
color: rgba(255, 255, 255, 0.3);
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    border-color: rgba(255, 255, 255, 0.3) !important; 
    -webkit-background-clip: text !important;
    background-clip:  text !important;
    /*transition: background-color var(--transition-time) ease-in-out 0s !important;*/
    transition: all var(--transitionDelay) ease;

    -webkit-transition: background-position var(--transition-time), background-color var(--transition-time), border-color var(--transition-time), box-shadow var(--transition-time);
    transition: background-position var(--transition-time), background-color var(--transition-time), border-color var(--transition-time), box-shadow var(--transition-time);
    -moz-transition: background-position var(--transition-time), background-color var(--transition-time), border-color var(--transition-time), box-shadow var(--transition-time);
    -ms-transition: background-position var(--transition-time), background-color var(--transition-time), border-color var(--transition-time), box-shadow var(--transition-time);
    -o-transition: background-position var(--transition-time), background-color var(--transition-time), border-color var(--transition-time), box-shadow var(--transition-time);

    box-shadow: inset 0 0 20px 20px hsla(0, 0%, 0%, 0.5) !important;

    text-shadow: 2px 2px 4px rgba(0, 0, 0, 1) !important; 

}

input:-webkit-autofill{
    -webkit-text-fill-color: rgba(255, 255, 255, 0.5) !important;
}
input:-webkit-autofill:hover{
    -webkit-text-fill-color: rgba(255, 255, 255, 0.7) !important;
    border: 1px solid #00b6ff !important;
}
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-text-fill-color: rgba(255, 255, 255, 1) !important;
    border: 1px solid #1e5f99 !important;
}

input:autofill {
    background-color: rgba(0, 0, 0, 0.5) !important;
    background-image: none !important;
    color: -internal-light-dark(black, white) !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 1) !important; 
}



/* Chrome, Safari, Edge, Opera */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#chrome
  .no-spin::-webkit-inner-spin-button, .no-spin::-webkit-outer-spin-button {
      -webkit-appearance: none !important;
      margin: 0 !important;
      -moz-appearance:textfield !important;
  }


/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

/* Minden böngészőre (ahol már támogatott) */
input[type="number"] {
  appearance: none;
}

input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  width: 0;
  overflow: hidden;
}
input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
  width: 0;
  overflow: hidden;
}


/* az input mezőből sima label-t csinálunk */
input[type="justtext"] {
  padding: 0 10px;
  cursor: text;
  width: 100%;
  height: 34px;
  border: transparent 1px solid;
  border-radius: 2px;
  background: none;
  /*display: inline;*/
  display: inline-bock;
  vertical-align: middle;
  /*padding: 0;
  margin: 0;*/
  /*font-size: 15px;*/
  line-height: 20px;
  font-size: inherit;
  font-family: inherit;
  /*color: inherit;*/
  color: rgba(255, 255, 255, 0.7);
  /*cursor: default;*/
  outline: none;
  /*-moz-outline-style: none;*/
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-focus-ring-color: transparent;
}


/****************************************************************/
/****************** WebKit Browsers (Chrome, Safari, etc.) *****/
/****************************************************************/
/* Általános megközelítés Chrome, Safari és más WebKit alapú böngészőkhöz */
/*@-webkit-keyframes autofill {
  to {
    background: rgba(0, 0, 0, 0.5);
    color: rgba(255, 255, 255, 0.7);
  }
}*/

/****************************************************************/
/************************** Firefox *****************************/
/****************************************************************/
/* Eredeti stílusok csak Firefoxra */
/*input:-moz-ui-invalid:-moz-focusring,
input:-moz-read-write:-moz-focusring,
input:-moz-read-only:-moz-focusring {
    -webkit-text-fill-color: white;
    background-color: rgba(0, 0, 0, 0.9);
}*/

/****************************************************************/
/*************** Chrome, Safari, és más WebKit ******************/
/****************************************************************/
/* Általános megközelítés Chrome, Safari és más WebKit alapú böngészőkhöz */
/*input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-text-fill-color: white !important;
    -webkit-box-shadow: 0 0 0px 1000px rgba(0, 0, 0, 1) inset !important;
    transition: background-color 15000s ease-in-out 0s;
}*/

/* Figyelem: Az alábbi stílusok esetleg nem mindig működnek a kívánt módon, 
   mivel a böngészők gyakran változtatják az autofill viselkedését. */
   /*input:not(input:-moz-ui-invalid)::-webkit-autofill,
   input:not(input:-moz-ui-invalid)::-webkit-autofill:hover, 
   input:not(input:-moz-ui-invalid)::-webkit-autofill:focus,
   input:not(input:-moz-ui-invalid)::-webkit-autofill:active {
     -webkit-text-fill-color: white !important; 
     -webkit-box-shadow: 0 0 0px 1000px rgba(0, 0, 0, 1) inset !important; 
     transition: background-color 15000s ease-in-out 0s; 
   }
*/


input:valid,
input:required {
  box-shadow: inherit;
}
input:invalid {
  box-shadow: inherit;
  /*border-color: red;*/
}

.invalid {
  /*outline: 2px solid red !important;*/
  border: 1px solid red !important; /* Piros szegély az érvénytelen mezők számára */
  background-color: rgba(255, 0, 0, 0.1) !important;
  /*background-color: #ffe6e6 !important; /* Halvány piros háttérszín az érvénytelen mezők számára */
  
  outline: none !important;
  box-shadow: 0 0 5px red !important;
}

.invalid:hover {
  outline: 2px solid red !important;
  /*border: 1px solid red !important; /* Piros szegély az érvénytelen mezők számára */
}

.invalid::placeholder {
  color: #cc0000 !important; /* Sötétebb piros szín a placeholder szövegéhez, ha az mező érvénytelen */
}

/*.invalid:focus {
  outline: none; /* Eltávolítja az alapértelmezett fókuszt, ha az mező érvénytelen */
/*  box-shadow: 0 0 5px red; /* Piros árnyékot ad a mezőnek fókuszáláskor, ha az érvénytelen */
/*}*/

input[type="color"] {
  padding: 0;
  margin: 0;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-color: transparent;
}



input::-webkit-color-swatch-wrapper {
  border: 0;
  /*border: 1px solid rgba(255, 255, 255, 0.3);*/
  /*padding: 5px 0;*/
  padding: 0;
}
input::-webkit-color-swatch {
  border: 1px solid rgba(255, 255, 255, 0.3);
  /*border: transparent;*/
  border-radius: 4px;
  padding: 0;
}

/****************************************************/
/********************* CHECKBOX *********************/
/****************************************************/
input[type="checkbox"] {
  display: none;
}

/*A teljes checkbox és kerete */
input[type="checkbox"] + label {
  padding: 0px 3px 0px 3px ;
  display: flex;
  align-items: center;
  position: relative;
  margin-bottom: 10px;
  cursor: pointer;
  border: solid 1px rgba(0, 0, 0, 0.5);
  border-radius: 2px;
  color: rgba(255, 255, 255, 0.3);
}

/* A nyégyzet megjelenése */
input[type="checkbox"] + label:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 15px;
  border: 1px solid white;
  position: relative;
  flex-shrink: 0;
  margin-right: 12px;
  border-radius: 3px;
}

/*Todo: ezt nem tudom pontosan mit csinál */
input[type="checkbox"]:checked + label:before {
  /*background-color: #999999;*/
  content: "";
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
}

/* A pipa tulajdonságai: amikor bekerül a pipa a pipa szine fehér*/
input[type="checkbox"] + label:after {
  /*content: "X";
  top: 0px;
  left: 3px;
  */
  content: "";
  position: absolute;
  width: 4px;
  height: 10px;
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  left: 9px;
  
/*  top: 50%; */
/*top: 4px;*/
top: calc(50% - 7px);
  display: none;

  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}

input[type="checkbox"]:checked + label:after {
  display: block;
}

input[type="checkbox"]:checked + label {
  color: white;
}


input[type="checkbox"]:hover {
}

input[type="checkbox"] + label:hover {
  /*border: solid #00aeff;*/
  /*border-width: 1px;*/
  /*border: solid 1px #00aeff;*/
  /*background-color: #00aeff;*/

  color: rgba(255, 255, 255, 0.7);
/*  color: #00aeff;*/
}


/*************************************************/
/*********** Avatar, fájl kiválasztás ************/
/*************************************************/
/* Válassz avatart fájl választó beviteli mezője */
.inputfile {
  display: none;
}

/* Slide-sidebar v1 css ek itt voltak!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/


/* Globális scrollbar stílus */
*::-webkit-scrollbar {
  width: 5px; /* A gördítősáv szélessége */
  height: 5px; /* A vízszintes gördítősáv magassága */
}

/* A gördítősáv háttére */
*::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  background-color: rgba(0, 0, 0, 0);
  border-radius: 10px;
}

/* A gördítősáv csúszka stílusa */
*::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0.44, rgba(122,153,217,0.8)),
    color-stop(0.72, rgba(73,125,189,0.6)),
    color-stop(0.86, rgba(28,58,148,0.4))
  );
}

/* A gördítősáv csúszka stílusa hover állapotban */
*::-webkit-scrollbar-thumb:hover {
  background: rgba(122,153,217,1); /* Csúszka színe amikor ráviszed az egeret */
}
*::-webkit-scrollbar-thumb:active {
  background: rgba(122,153,217,1); /* Csúszka színe amikor aktiv */
}

/* Firefoxhoz */
* {
  scrollbar-width: thin; 
  scrollbar-color: rgba(122,153,217,0.8) rgba(0, 0, 0, 0); /* Először a csúszka színe, majd a háttérszín */
}

/* A gördítősáv csúszka stílusa hover állapotban Firefoxban */
*:hover {
  scrollbar-color: rgba(122,153,217,1) rgba(0, 0, 0, 0);
}
*:active {
  scrollbar-color: rgba(122,153,217,1) rgba(0, 0, 0, 0);
}

.avatar_file_input {
  pointer-events: none;
}

/* ===================================================================== */
/* ✅ KIEGÉSZÍTÉS: TEXTAREA + FILE INPUT részletesen, input-stílus szerint */
/* ===================================================================== */

/* --- TEXTAREA: ne legyen 34px magas (a te listád fix 34px-et ad) --- */
textarea,
textarea.form-control {
  height: auto !important;
  padding: 8px 10px !important;     /* textarea-nál kell a vertikális padding */
  min-height: 140px;                /* ugyanaz, mint amit eddig az EJS-ben adtál */
  resize: vertical;
  cursor: text;
}

/* Hover/focus ugyanaz a logika, mint inputnál (csak biztos felülírjuk) */
textarea:hover,
textarea.form-control:hover {
  background-color: rgba(0, 0, 0, 0.5) !important;
  color: rgba(255, 255, 255, 0.7) !important;
  border-color: #00b6ff !important;
}
textarea:focus,
textarea.form-control:focus {
  border-color: #1e5f99 !important;
  background-color: rgba(0, 0, 0, 0.5) !important;
  color: #ffffff !important;
  outline: none !important;
}

/* Disabled ugyanaz */
textarea[disabled],
textarea.form-control[disabled],
textarea.disabled,
textarea.form-control.disabled {
  background-color: rgba(20, 20, 23, 0.5) !important;
  color: #7f7f7f !important;
  cursor: default !important;
  border-color: red !important;
}

/* Placeholder színek textarea-ra is (ugyanaz a hangulat) */
textarea:-moz-placeholder { color: rgba(255, 255, 255, 0.3) !important; }
textarea:-ms-input-placeholder { color: rgba(255, 255, 255, 0.3) !important; }
textarea::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.3) !important; }
textarea:focus:-moz-placeholder { color: rgba(255, 255, 255, 0.3) !important; }
textarea:focus:-ms-input-placeholder { color: rgba(255, 255, 255, 0.3) !important; }
textarea:focus::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.3) !important; }

/****************************************************/
/*************** FILE INPUT (BTN-INFO) **************/
/****************************************************/

/* 1) Maga a file input mező */
input[type="file"]{
  width: 100% !important;
  height: 34px !important;
  padding: 0 10px !important;

  font-size: 15px !important;
  line-height: 20px !important;

  background-color: rgba(0,0,0,0.5) !important;
  color: rgba(255,255,255,0.7) !important;

  border: 1px solid rgba(255,255,255,0.3) !important;
  border-radius: 2px !important;
  box-sizing: border-box !important;

  cursor: pointer !important;

  -webkit-appearance: none !important;
  appearance: none !important;

  transition: background-color var(--transition-time),
              border-color var(--transition-time),
              box-shadow var(--transition-time) !important;
}

input[type="file"]:hover{
  background-color: rgba(0,0,0,0.5) !important;
  border-color: #00b6ff !important;
  color: rgba(255,255,255,0.7) !important;
}

input[type="file"]:focus{
  background-color: rgba(0,0,0,0.5) !important;
  border-color: #1e5f99 !important;
  outline: none !important;
  color: #ffffff !important;
}

/* 2) A gomb (Chrome/Edge + Safari/WebKit) */
input[type="file"]::file-selector-button,
input[type="file"]::-webkit-file-upload-button{

  /* --- BTN-INFO alap --- */
  background-color: rgba(10,104,208,0.35) !important;   /* soha ne legyen fehér */
  color: rgb(185,216,250) !important;
  border: 1px solid #0a5ea8 !important;
  border-radius: 2px !important;

  /* --- Méretezés / tipó --- */
  height: 34px !important;
  padding: 0 20px !important;            /* függőleges 0 -> flex középre */
  font-size: 15px !important;
  line-height: 20px !important;
  box-sizing: border-box !important;

  /* --- Optikai közép --- */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  /* ✅ CSAK BAL OLDALI HÉZAG + fájlnév előtt */
  margin: 0 10px 0 -10px;


  /* ✅ Finom optikai korrekció (felül/alul azonos) */
  transform: translateY(-0.5px) !important;

  cursor: pointer !important;
  box-shadow: 0 0 rgba(0,0,0,0) !important;

  -webkit-appearance: none !important;
  appearance: none !important;

  transition: background-color var(--transition-time),
              border-color var(--transition-time),
              box-shadow var(--transition-time) !important;
}

/* 3) Hover / Focus – KIVILÁGOSODÓ KERET (mint success/alarm) */
input[type="file"]:hover::file-selector-button,
input[type="file"]:focus::file-selector-button,
input[type="file"]:hover::-webkit-file-upload-button,
input[type="file"]:focus::-webkit-file-upload-button{

  background-color: rgba(10,104,208,0.35) !important;   /* fix: ne fehéredjen */
  color: rgb(185,216,250) !important;
  border-color: #0ab6ff !important;                     /* világosabb */
}

/* 4) Active */
input[type="file"]::file-selector-button:active,
input[type="file"]::-webkit-file-upload-button:active{
  background-color: rgba(10,104,208,0.25) !important;
  border-color: #0a5ea8 !important;
  box-shadow: inset 1.5px 1.5px 3px rgba(0,0,0,0.5) !important;
}

/* 5) Disabled */
input[type="file"][disabled]{
  background-color: rgba(20,20,23,0.5) !important;
  color: #7f7f7f !important;
  cursor: default !important;
  border-color: red !important;
}

input[type="file"][disabled]::file-selector-button,
input[type="file"][disabled]::-webkit-file-upload-button{
  background-color: rgba(10,104,208,0.15) !important;
  color: rgba(185,216,250,0.3) !important;
  border-color: rgba(10,182,255,0.2) !important;
  cursor: default !important;
  transform: translateY(-0.5px) !important;
}
