/* VDB Frontend Auth – "app" izgled (prilagojeno po navodilih) */

.vdb-auth {
  min-height: 100vh;
  display: flex;
  flex-direction: row;
  background: #0b0f14;
  color: #e7eef7;
  overflow: hidden;
}

/* Naslovi morajo biti zeleni (ne glede na WP temo) */
.vdb-auth h1,
.vdb-auth h2,
.vdb-auth h3,
.vdb-auth h4,
.vdb-auth h5,
.vdb-auth h6 {
  color: #40e2a7 !important;
}

/* Left = 1/3, Right = 2/3 */
.vdb-auth__left {
  flex: 0 0 33.3333%;
  min-width: 320px;
  background: #0b0f14;
  position: relative;
  box-sizing: border-box;
}

.vdb-auth__left-inner {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 48px 36px;
  box-sizing: border-box;
}

.vdb-auth__main {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vdb-auth__panel {
  width: 100%;
  max-width: 420px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  padding: 22px;
  box-sizing: border-box;
  backdrop-filter: blur(8px);
}

/* notices */
.vdb-auth__notice {
  margin: 10px 0 14px 0;
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 15px;
  line-height: 1.35;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.12);
}
.vdb-auth__notice--err {
  border-color: rgba(255, 120, 120, 0.55);
  color: rgba(255, 210, 210, 0.95);
}
.vdb-auth__notice--ok {
  border-color: rgba(64, 226, 167, 0.65);
  color: #40e2a7;
}

/* top-right link */
.vdb-auth__report {
  position: absolute;
  top: 16px;
  right: 18px;
  color: #ffffff;
  text-decoration: none;
  font-size: 13px;
  opacity: 0.90;
}
.vdb-auth__report:hover {
  opacity: 1;
  text-decoration: underline;
}

/* Show "Prijavi napako" only when NOT logged in */
.vdb-auth.vdb-auth--logged-in .vdb-auth__report {
  display: none;
}

/* logo */
.vdb-auth__logo-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 16px;
}
.vdb-auth__logo {
  width: min(260px, 80%);
  height: auto; /* ohrani razmerje 100 : 38,91 */
  display: block;
}

/* Ime in priimek prijavljene osebe (pod logotipom) */
.vdb-auth__left-user {
  text-align: center;
  margin: 6px 0 12px 0;
  opacity: 0.95;
  line-height: 1.25;
}

.vdb-auth__left-user-label {
  font-size: 14px;
  font-weight: 800;
}

.vdb-auth__left-user-name {
  font-size: 16px;
  font-weight: 800;
  margin-top: 2px;
}

.vdb-auth__muted {
  font-size: 13px;
  opacity: 0.78;
  margin: 8px 0 14px 0;
}

.vdb-auth h2 {
  margin: 0 0 6px 0;
  font-size: 18px;
  font-weight: 800;
}

/* Mini button (npr. "Nazaj" v korakih) */
.vdb-auth__btn--mini {
  width: auto !important;
  padding: 7px 12px;
  border-radius: 18px;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}

/* Inline button (npr. "Preveri" ob Hub ID) */
.vdb-auth__btn--inline {
  width: auto !important;
  padding: 14px 16px;
  border-radius: 22px;
  font-size: 13px;
  line-height: 1;
  flex: 0 0 auto;
  white-space: nowrap;
}

/* Hub ID field row */
.vdb-auth__hub-row {
  display: flex;
  gap: 12px;
  align-items: flex-end;
}

.vdb-auth__hub-input {
  flex: 1 1 auto;
  min-width: 0;
}

/* Notice line with action button */
.vdb-auth__notice-line {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
}

.vdb-auth__notice-text {
  flex: 1 1 auto;
}

.vdb-auth__notice-actions {
  flex: 0 0 auto;
  display: flex;
  gap: 12px;
  align-items: center;
}

/* Header za "Dodaj objekt" (naslov + korak + gumb nazaj) */
.vdb-auth__add-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.vdb-auth__add-header h2 {
  margin: 0;
}

.vdb-auth__actions {
  display: flex;
  flex-direction: column;
  gap: 14px; /* razmik med gumboma prve strani */
  margin-top: 10px;
}


.vdb-auth__btn--doublegap{margin-top:14px;}
/* buttons */
.vdb-auth__btn {
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
  padding: 12px 14px;
  border-radius: 26px;
  border: 1px solid rgba(64, 226, 167, 0.70);
  background: transparent;
  color: #40e2a7;
  font-weight: 700;
  cursor: pointer;
  text-align: center;
  text-decoration: none; /* tudi za <a> */
}

.vdb-auth__btn:hover { opacity: 0.92; }

.vdb-auth__btn--primary {
  background: rgba(64, 226, 167, 0.16);
}

.vdb-auth__btn[disabled] {
  opacity: 0.6;
  cursor: not-allowed;
}

/* anchor "disabled" (npr. Izhod med odjavo) */
.vdb-auth__btn[aria-disabled="true"] {
  opacity: 0.6;
  pointer-events: none;
  cursor: not-allowed;
}

.vdb-auth__row {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 12px;
}
.vdb-auth__row .vdb-auth__btn { flex: 1; }

/* link-like button */
.vdb-auth__link {
  display: inline-block;
  margin-top: 10px;
  font-size: 13px;
  color: #d9e7ff;
  opacity: 0.9;
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
}
.vdb-auth__link:hover { opacity: 0.75; }

.vdb-auth__link--danger {
  color: #ff9a9a;
}

.vdb-auth__link--danger:hover {
  opacity: 0.85;
}

.vdb-auth__link--inline {
  margin-top: 0;
  font-size: 14px;
}

/* input look (kot na sliki) */
.vdb-auth__inputbox {
  margin-top: 12px;
  background: rgba(255,255,255,0.14);
  border-radius: 14px;
  padding: 16px 18px;
  box-sizing: border-box;
}

.vdb-auth__field { margin: 0; }
.vdb-auth__field + .vdb-auth__field { margin-top: 16px; }

.vdb-auth__label {
  display: block;
  font-size: 12px;
  opacity: 0.85;
  margin: 0 0 6px 0;
}

.vdb-auth__input {
  width: 100%;
  box-sizing: border-box;
  padding: 14px 16px;
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 10px;
  background: rgba(0,0,0,0.10);
  color: #e7eef7;
  outline: none;
  font-size: 14px;
  line-height: 1.2;
  min-height: 52px;
}
.vdb-auth__input::placeholder { color: rgba(231,238,247,0.45); }

.vdb-auth__input:focus {
  border-color: rgba(64, 226, 167, 0.85);
}

/*
  FIX (frontend): nekateri WP temi/plugini prepišejo barvo teksta pri :focus
  in uporabnik med tipkanjem vidi črno besedilo na temni podlagi.
  Zato tukaj eksplicitno (in z višjo specifičnostjo) vsilimo barvo teksta.
*/
.vdb-auth .vdb-auth__input:focus,
.vdb-auth .vdb-auth__input:active,
.vdb-auth .vdb-auth__input--box:focus,
.vdb-auth .vdb-auth__input--box:active,
.vdb-auth .vdb-auth__textarea:focus,
.vdb-auth .vdb-auth__textarea:active,
.vdb-auth select.vdb-auth__input:focus,
.vdb-auth select.vdb-auth__input--box:focus {
  color: #e7eef7 !important;
  -webkit-text-fill-color: #e7eef7 !important;
  caret-color: #e7eef7;
  background: rgba(0,0,0,0.10) !important;
}

/* Chrome/Safari autofill (da ne obarva teksta v črno) */
.vdb-auth input.vdb-auth__input:-webkit-autofill,
.vdb-auth input.vdb-auth__input:-webkit-autofill:hover,
.vdb-auth input.vdb-auth__input:-webkit-autofill:focus {
  -webkit-text-fill-color: #e7eef7 !important;
  transition: background-color 99999s ease-out 0s;
}

/* Divi-like (boxed) inputs – trenutno uporabljamo pri vnosu objekta (korak 3) */
.vdb-auth__input--box {
  /* backwards-compat: zdaj je osnovni .vdb-auth__input že "boxed" */
  padding: 14px 16px;
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 10px;
  background: rgba(0,0,0,0.10);
  min-height: 52px;
}

.vdb-auth__input--box:focus {
  border-color: rgba(64, 226, 167, 0.85);
}

select.vdb-auth__input,
select.vdb-auth__input--box {
  padding-right: 34px;
}

/*
  FIX: Native <select> dropdown (options) pogosto podeduje barvo teksta iz <select>.
  Ker ima naš UI svetel tekst na temni podlagi, OS dropdown (svetla podlaga)
  postane neberljiv (bel tekst na skoraj beli podlagi).
  Zato za option/optgroup vsilimo temen tekst na svetli podlagi.
*/
.vdb-auth select.vdb-auth__input option,
.vdb-auth select.vdb-auth__input--box option,
.vdb-auth select.vdb-auth__input optgroup,
.vdb-auth select.vdb-auth__input--box optgroup {
  color: #0b0f14 !important;
  background: #ffffff !important;
}

.vdb-auth select.vdb-auth__input option[disabled],
.vdb-auth select.vdb-auth__input--box option[disabled] {
  color: #6f7b8a !important;
}

.vdb-auth__input[readonly] {
  opacity: 0.85;
}

/* cards used for consents/done/forgot – keep them clean inside panel */
.vdb-auth__card {
  margin-top: 6px;
  padding: 0;
  background: transparent;
  border: none;
}

.vdb-auth__consents {
  border-top: 1px solid rgba(255,255,255,0.10);
  padding-top: 12px;
  margin-top: 10px;
}

.vdb-auth__consent {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 10px 0;
}

.vdb-auth__consent input { margin-top: 4px; }

.vdb-auth__consent-title {
  font-weight: 700;
  font-size: 13px;
  margin: 0;
}

.vdb-auth__consent-body {
  font-size: 12px;
  opacity: 0.85;
  margin: 4px 0 0 0;
  white-space: pre-wrap;
}

.vdb-auth__done p { margin: 10px 0; }

/* footer (exit button) */
.vdb-auth__footer {
  display: flex;
  justify-content: center;
  margin-top: 18px;
}
.vdb-auth__footer .vdb-auth__btn {
  max-width: 420px;
}

/* Show "Odjava" only when logged in */
.vdb-auth:not(.vdb-auth--logged-in) #vdb-exit {
  display: none;
}

/* right side background */
.vdb-auth__right {
  flex: 1 1 0;
  position: relative;
  background: #0b0f14;
}

/* ====================== Top navigation (Glavni menu + podmenu) ====================== */

.vdb-auth__topnav {
  position: relative;
  z-index: 3;
  width: 100%;
  box-sizing: border-box;
  padding: 18px 48px 0 48px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

.vdb-auth__menu-row,
.vdb-auth__submenu-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  flex-wrap: wrap;
}

.vdb-auth__menu-row {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 14px;
  padding: 10px 14px;
  backdrop-filter: blur(8px);
}

.vdb-auth__menubtn {
  appearance: none;
  border: none;
  background: transparent;
  color: #e7eef7;
  font-weight: 800;
  font-size: 14px;
  padding: 6px 10px;
  cursor: pointer;
  opacity: 0.85;
}

.vdb-auth__menubtn:hover { opacity: 1; }

.vdb-auth__menubtn--active {
  color: #40e2a7;
  opacity: 1;
}

.vdb-auth__menu-sep {
  opacity: 0.35;
  font-weight: 700;
}

.vdb-auth__submenu-row {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;
  padding: 8px 12px;
  backdrop-filter: blur(8px);
}

.vdb-auth__submenubtn {
  appearance: none;
  border: none;
  background: transparent;
  color: rgba(231,238,247,0.90);
  font-weight: 700;
  font-size: 13px;
  padding: 6px 10px;
  cursor: pointer;
  opacity: 0.70;
}

.vdb-auth__submenubtn:hover { opacity: 0.95; }

.vdb-auth__submenubtn--active {
  color: #40e2a7;
  opacity: 1;
}

.vdb-auth__headertext {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  word-break: break-word;
}

.vdb-auth__eyebrow {
  font-size: 12px;
  font-weight: 700;
  color: rgba(231,238,247,0.82);
}

/* profile panel (right side) */
.vdb-auth__right-inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 28px;
  padding: 32px 48px 48px;
  box-sizing: border-box;
  flex-wrap: wrap;
}

.vdb-auth__profile {
  position: relative;
  max-width: 560px;
  margin: 0;
  width: 560px;
  flex: 0 1 560px;
  padding: 22px;
  box-sizing: border-box;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  backdrop-filter: blur(8px);
}

.vdb-auth__profile--welcome {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 300px;
}

.vdb-auth__welcome-card {
  width: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.vdb-auth__welcome-message {
  margin: 0;
  color: #40e2a7;
  font-size: 32px;
  font-weight: 800;
  line-height: 1.15;
}

.vdb-auth__welcome-name {
  color: #e7eef7;
  font-size: 28px;
  font-weight: 800;
  line-height: 1.2;
  word-break: break-word;
}

.vdb-auth__objects-filters {
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
}

.vdb-auth__objects-filterlabel {
  font-size: 12px;
  opacity: 0.85;
}

.vdb-auth__objects-filterbuttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.vdb-auth__filterbtn {
  appearance: none;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.04);
  color: #e7eef7;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  opacity: 0.86;
}

.vdb-auth__filterbtn:hover {
  opacity: 1;
  border-color: rgba(64,226,167,0.34);
}

.vdb-auth__filterbtn--active {
  border-color: rgba(64,226,167,0.72);
  background: rgba(64,226,167,0.10);
  color: #40e2a7;
  opacity: 1;
}

.vdb-auth__filterdot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  display: inline-block;
}

.vdb-auth__filterdot--red { background: #ff3510; }
.vdb-auth__filterdot--yellow { background: #dfe500; }
.vdb-auth__filterdot--green { background: #00ff2a; }

/* Moji objekti – seznam */
.vdb-auth__objectlist {
  list-style: none;
  margin: 12px 0 0 0;
  padding: 0;
}

.vdb-auth__objectitem {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  border-radius: 14px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
  margin: 0 0 12px 0;
  overflow: hidden;
}

.vdb-auth__objectcontent {
  flex: 1 1 auto;
  min-width: 0;
  padding: 16px 18px;
}

.vdb-auth__objectstate {
  flex: 0 0 40px;
  align-self: stretch;
}

.vdb-auth__objectstate--red {
  background: #ff3510;
}

.vdb-auth__objectstate--yellow {
  background: #dfe500;
}

.vdb-auth__objectstate--green {
  background: #00ff2a;
}

.vdb-auth__objectstate--neutral {
  background: rgba(255, 255, 255, 0.18);
}

.vdb-auth__objectlink {
  display: inline;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  color: #65fbd0;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.vdb-auth__objectlink:hover {
  text-decoration: underline;
}

.vdb-auth__objectname {
  font-weight: 800;
  margin: 0;
}

.vdb-auth__objectmeta {
  margin: 4px 0 0 0;
  font-size: 13px;
  opacity: 0.85;
}

/* Naprave v objektu – seznam */
.vdb-auth__devicelist {
  list-style: none;
  margin: 12px 0 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.vdb-auth__deviceitem {
  border-radius: 14px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
  padding: 14px 16px;
}

.vdb-auth__deviceitem--clickable {
  cursor: pointer;
}

.vdb-auth__deviceitem--clickable:hover {
  border-color: rgba(64, 226, 167, 0.55);
}

.vdb-auth__deviceitem-title {
  font-weight: 800;
  color: var(--vdb-accent);
}

.vdb-auth__deviceitem-meta {
  margin: 6px 0 0 0;
  font-size: 13px;
  opacity: 0.85;
}

/* Naprava – dovoljenih dogodki */
.vdb-auth__events {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.vdb-auth__eventrow {
  border-radius: 14px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.10);
  padding: 12px 14px;
}

.vdb-auth__eventrow-top {
  display: flex;
  align-items: center;
  gap: 10px;
}

.vdb-auth__eventcheck {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-weight: 800;
}

.vdb-auth__eventcheck input {
  width: 18px;
  height: 18px;
  accent-color: var(--vdb-accent);
}

.vdb-auth__eventname {
  font-size: 15px;
}

.vdb-auth__eventdefault {
  margin: 8px 0 10px;
  font-size: 13px;
  opacity: 0.85;
}

.vdb-auth__eventmsg {
  width: 100%;
}

/* Status objekta v vogalu (urejanje objekta / prihodnji podpogledi objekta) */
.vdb-auth__corner-state {
  position: absolute;
  top: 0;
  right: 0;
  width: 74px;
  height: 74px;
  overflow: hidden;
  border-top-right-radius: 16px;
  pointer-events: none;
  z-index: 4;
}

.vdb-auth__corner-state::before {
  content: '';
  position: absolute;
  inset: 0;
  clip-path: polygon(100% 0, 0 0, 100% 100%);
  background: #00ff2a;
}

.vdb-auth__corner-state--red::before {
  background: #ff3510;
}

.vdb-auth__corner-state--yellow::before {
  background: #dfe500;
}

.vdb-auth__corner-state--green::before {
  background: #00ff2a;
}

/* Desni blok z navodili/sporočilom (Moj VDB račun) */
.vdb-auth__note {
  width: 420px;
  flex: 0 1 420px;
  max-width: 420px;
  margin: 0;
}

.vdb-auth__note-box {
  margin-top: 0;
}

.vdb-auth__note-content {
  color: #e7eef7;
  font-size: 13px;
  line-height: 1.45;
}


/* ====================== Modes ====================== */

/* Dodaj objekt (mode):
 * - skrij "Moj VDB račun" (account) panel + pripadajoče navodilo
 * - pokaži add-object panel + status
 */
.vdb-auth--mode-add-object .vdb-auth__profile--account,
.vdb-auth--mode-add-object #vdb-profile-note-wrap {
  display: none !important;
}

.vdb-auth:not(.vdb-auth--mode-add-object) .vdb-auth__profile--add-object,
.vdb-auth:not(.vdb-auth--mode-add-object) .vdb-auth__note--status {
  display: none !important;
}

/* Add-object panel je vizualno enak "profile" panelu */
.vdb-auth__profile--add-object {
  min-height: 240px;
}

/* Semafor */
.vdb-auth__semaphore-area {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 200px;
}

.vdb-auth__semaphore {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
}

.vdb-auth__light {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.22);
  background: rgba(255,255,255,0.12);
  opacity: 0.20; /* neaktivne luči */
  box-shadow: none;
}

.vdb-auth__light--red { background: rgba(255, 88, 88, 0.55); }
.vdb-auth__light--yellow { background: rgba(255, 212, 88, 0.55); }
.vdb-auth__light--green { background: rgba(64, 226, 167, 0.55); }

.vdb-auth__semaphore--red .vdb-auth__light--red,
.vdb-auth__semaphore--yellow .vdb-auth__light--yellow,
.vdb-auth__semaphore--green .vdb-auth__light--green {
  opacity: 1;
  border-color: rgba(255,255,255,0.30);
  box-shadow: 0 0 0 6px rgba(255,255,255,0.03);
}

.vdb-auth__semaphore--red .vdb-auth__light--red {
  background: rgba(255, 88, 88, 0.90);
  box-shadow: 0 0 0 6px rgba(255, 88, 88, 0.10);
}
.vdb-auth__semaphore--yellow .vdb-auth__light--yellow {
  background: rgba(255, 212, 88, 0.92);
  box-shadow: 0 0 0 6px rgba(255, 212, 88, 0.10);
}
.vdb-auth__semaphore--green .vdb-auth__light--green {
  background: rgba(64, 226, 167, 0.92);
  box-shadow: 0 0 0 6px rgba(64, 226, 167, 0.10);
}

.vdb-auth__semaphore-title {
  font-size: 13px;
  font-weight: 800;
  color: #e7eef7;
  text-align: center;
  opacity: 0.95;
}

/* V note besedilu naj bodo tudi naslovi beli (ne zeleni kot ostali h*) */
.vdb-auth__note-content h1,
.vdb-auth__note-content h2,
.vdb-auth__note-content h3,
.vdb-auth__note-content h4,
.vdb-auth__note-content h5,
.vdb-auth__note-content h6 {
  color: #e7eef7 !important;
}

.vdb-auth__note-content p { margin: 0 0 10px 0; }
.vdb-auth__note-content p:last-child { margin-bottom: 0; }

.vdb-auth__note-content a { color: #d9e7ff; text-decoration: underline; }

.vdb-auth__profile h3 {
  margin: 16px 0 6px 0;
  font-size: 14px;
  font-weight: 800;
}

.vdb-auth__statusbox {
  margin-top: 10px;
}

.vdb-auth__statuslist {
  margin: 6px 0 0 0;
  padding-left: 18px;
}

.vdb-auth__statuslist li {
  font-size: 13px;
  margin: 4px 0;
}

.vdb-auth__textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 14px 16px;
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 10px;
  background: rgba(0,0,0,0.10);
  color: #e7eef7;
  outline: none;
  resize: vertical;
  min-height: 110px;
  font-size: 14px;
  line-height: 1.3;
}
.vdb-auth__textarea::placeholder { color: rgba(231,238,247,0.45); }
.vdb-auth__textarea:focus { border-color: rgba(64, 226, 167, 0.85); }

.vdb-auth__input[disabled],
.vdb-auth__textarea[disabled] {
  opacity: 0.62;
  cursor: not-allowed;
}

.vdb-auth__bg {
  position: absolute;
  inset: 0;
  background-image: var(--vdb-right-bg, radial-gradient(circle at 40% 10%, rgba(64,226,167,0.22), rgba(11,15,20,0.0) 55%),
                                     radial-gradient(circle at 70% 60%, rgba(97,163,255,0.14), rgba(11,15,20,0.0) 65%),
                                     linear-gradient(135deg, rgba(0,0,0,0.35), rgba(0,0,0,0.15)));
  background-size: cover;
  background-position: center;
  opacity: 0.95;
}

.vdb-auth--logged-in .vdb-auth__bg {
  background-image: none !important;
}

/* Boot overlay (prevents login flicker while checking session state) */
.vdb-auth__boot {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.82);
  backdrop-filter: blur(2px);
}

.vdb-auth__boot-card {
  width: calc(100% - 48px);
  max-width: 360px;
  background: rgba(28, 28, 28, 0.92);
  border: 1px solid rgba(64, 226, 167, 0.25);
  border-radius: 18px;
  padding: 18px 22px;
  text-align: center;
  box-shadow: 0 10px 30px rgba(0,0,0,.45);
}

.vdb-auth__boot-spinner {
  width: 34px;
  height: 34px;
  margin: 0 auto 10px;
  border-radius: 999px;
  border: 4px solid rgba(64, 226, 167, 0.25);
  border-top-color: #40e2a7;
  animation: vdb-spin 0.9s linear infinite;
}

.vdb-auth__boot-text {
  color: #ffffff;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: .2px;
}

@keyframes vdb-spin {
  to { transform: rotate(360deg); }
}

.vdb-auth__brand {
  position: absolute;
  right: 24px;
  bottom: 18px;
  font-size: 14px;
  opacity: 0.85;
}

.vdb-auth__brand-name { margin-right: 8px; }

.vdb-auth__brand-link {
  color: inherit;
  text-decoration: none;
}
.vdb-auth__brand-link:hover {
  text-decoration: underline;
}

.vdb-auth__brand-ver {
  font-size: 12px;
  opacity: 0.80;
}

.vdb-auth__hidden { display: none !important; }

/* responsive */
@media (max-width: 980px) {
  .vdb-auth { flex-direction: column; }
  .vdb-auth__left { flex: none; width: 100%; min-width: 0; }
  .vdb-auth__left-inner { padding: 38px 22px; }
  .vdb-auth__right { width: 100%; min-height: 280px; }
  .vdb-auth__report { top: 12px; right: 14px; }

  .vdb-auth__corner-state {
    width: 66px;
    height: 66px;
  }

  /* Telefon: desno polje brez slike v ozadju */
  .vdb-auth__bg {
    background-image: none !important;
    opacity: 1;
  }

  .vdb-auth__topnav {
    padding: 14px 22px 0 22px;
  }

  .vdb-auth__menu-row,
  .vdb-auth__submenu-row {
    width: 100%;
    justify-content: flex-start;
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .vdb-auth__right-inner {
    flex-direction: column;
    padding: 22px;
    gap: 18px;
  }

  .vdb-auth__profile {
    max-width: none;
    width: 100%;
    flex: 1 1 auto;
  }


  .vdb-auth__welcome-message {
    font-size: 28px;
  }

  .vdb-auth__welcome-name {
    font-size: 24px;
  }

  .vdb-auth__note {
    max-width: none;
    width: 100%;
  }
  /* Dodaj objekt: na telefonu je account panel skrit, add-object panel se prikaže */
  .vdb-auth--mode-add-object .vdb-auth__profile--account {
    display: none;
  }

}


/* step 3 (Dodaj objekt) helpers */
.vdb-auth__grid2 {
  display: flex;
  gap: 14px;
}
.vdb-auth__grid2 > .vdb-auth__field {
  flex: 1;
}

.vdb-auth__grid3 {
  display: flex;
  gap: 14px;
}
.vdb-auth__grid3 > .vdb-auth__field {
  flex: 1;
}

/* V gridih ne želimo navpičnega zamika med polji */
.vdb-auth__grid2 > .vdb-auth__field + .vdb-auth__field,
.vdb-auth__grid3 > .vdb-auth__field + .vdb-auth__field {
  margin-top: 0;
}

.vdb-auth__hint {
  font-size: 13px;
  margin-top: 8px;
}

@media (max-width: 860px) {
  .vdb-auth__grid3 {
    flex-direction: column;
    gap: 0;
  }
}

@media (max-width: 720px) {
  .vdb-auth__grid2 {
    flex-direction: column;
    gap: 0;
  }
}

/* Ensure VDB form fields remain usable even when global "copy protection" plugins
   disable selection/context menus. We scope this strictly to the VDB UI. */
.vdb-auth input,
.vdb-auth textarea,
.vdb-auth select {
  -webkit-user-select: text !important;
  user-select: text !important;
  -webkit-touch-callout: default !important;
}


/* divider (za ločevanje sekcij) */
.vdb-auth__divider {
  height: 1px;
  background: rgba(255,255,255,0.12);
  margin: 18px 0;
  border-radius: 1px;
}


/* modal (pop-up navodila) */
.vdb-auth__modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px;
  box-sizing: border-box;
}

.vdb-auth__modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.65);
}

.vdb-auth__modal-card {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 760px;
  background: rgba(17,24,33,0.96);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 16px;
  padding: 18px 18px 16px;
  box-sizing: border-box;
  box-shadow: 0 16px 50px rgba(0,0,0,0.45);
}

.vdb-auth__modal-close {
  position: absolute;
  top: 10px;
  right: 12px;
  border: none;
  background: transparent;
  color: #e7eef7;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  opacity: 0.8;
}
.vdb-auth__modal-close:hover { opacity: 1; }

.vdb-auth__modal-title {
  margin: 0 34px 12px 0;
  font-size: 18px;
}

.vdb-auth__modal-body {
  max-height: 70vh;
  overflow: auto;
  font-size: 15px;
  line-height: 1.45;
  color: #e7eef7;
}

.vdb-auth__modal-body p { margin-top: 0; }

/* Simple tables (used for Fire Unit people list) */
.vdb-auth__tablewrap {
  overflow-x: auto;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 12px;
}
.vdb-auth__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.vdb-auth__table th,
.vdb-auth__table td {
  text-align: left;
  padding: 10px 12px;
  vertical-align: top;
}
.vdb-auth__table th {
  color: #bcd0e3;
  font-weight: 600;
  background: rgba(0,0,0,0.16);
}
.vdb-auth__table td {
  border-top: 1px solid rgba(255,255,255,0.10);
  color: #e7eef7;
}

/* Checkbox row layout */
.vdb-auth__checks {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
}
.vdb-auth__checks label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
}

@media (max-width: 720px) {
  .vdb-auth__modal {
    padding: 14px;
  }
  .vdb-auth__modal-card {
    padding: 16px 14px 14px;
  }
  .vdb-auth__modal-body {
    max-height: 72vh;
  }
}