:root { --dz-radius: 1rem; }

body {
  min-height: 100vh;
  background:
    radial-gradient(1200px 600px at 10% -20%, rgba(13,110,253,.18), transparent 60%),
    radial-gradient(1000px 500px at 100% 0%, rgba(111,66,193,.16), transparent 60%),
    var(--bs-body-bg);
}

.mobile-nav-container .nav-mobile-header {
  background: #07203C !important;
  color: #fff;
  border-radius: 0;
}

.mobile-nav-container .mobile-logo { font-size: .95rem; }

.dz-mobile-rooms {
  background: #07203C;
  border-top: 1px solid rgba(255,255,255,.12);
}

.auth-wrap { min-height: 100vh; display: grid; place-items: center; padding: 1rem; }
.auth-card { width: 100%; max-width: 460px; border: 1px solid var(--bs-border-color); border-radius: var(--dz-radius); backdrop-filter: blur(6px); }
.brand-pill { font-weight: 700; letter-spacing: .3px; }

.glass-card {
  border: 1px solid var(--bs-border-color);
  border-radius: var(--dz-radius);
  background: color-mix(in srgb, var(--bs-body-bg) 88%, transparent);
  box-shadow: 0 12px 32px rgba(0,0,0,.10);
}

.dz-toolbar {
  border-radius: 0;
  border-bottom: 1px solid var(--bs-border-color);
  background: color-mix(in srgb, var(--bs-body-bg) 96%, transparent);
}

@media (min-width: 768px) {
  .dz-toolbar {
    min-height: 64px;
    padding-top: .55rem !important;
    padding-bottom: .55rem !important;
    box-shadow: 0 6px 18px rgba(0,0,0,.06);
  }

  .dz-toolbar .dz-logo { width: 2rem; height: 2rem; font-size: .9rem; }
  .dz-toolbar .dz-room-select { min-width: 190px; max-width: 250px; }
  .dz-toolbar .badge { font-size: .8rem; }
}
.dz-logo {
  width: 1.8rem;
  height: 1.8rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: .5rem;
  background: linear-gradient(145deg, #0d6efd, #6f42c1);
  color: #fff;
  font-size: .85rem;
}

.dz-icon-btn {
  color: var(--bs-body-color);
  padding: .2rem .35rem;
  font-size: 1.05rem;
}

.dz-room-select { min-width: 150px; max-width: 220px; }

#harta {
  width: 100%;
  height: 440px;
  border-radius: .85rem;
  border: 1px solid var(--bs-border-color);
}

.dz-ptt {
  font-weight: 700;
  border-radius: .9rem;
  box-shadow: 0 10px 22px rgba(220,53,69,.25);
  min-height: 56px;
}

.dz-status {
  font-size: .92rem;
  border: 1px solid var(--bs-border-color);
  background: color-mix(in srgb, var(--bs-body-bg) 76%, var(--bs-secondary-bg));
  border-radius: .75rem;
  padding: .65rem .8rem;
}

#listaParticipanti,
.dz-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

#listaParticipanti li,
.dz-list li {
  border: 1px solid var(--bs-border-color);
  border-radius: .7rem;
  padding: .45rem .65rem;
  margin-bottom: .45rem;
  background: color-mix(in srgb, var(--bs-body-bg) 75%, var(--bs-tertiary-bg));
  display: flex;
  align-items: center;
  gap: .5rem;
}

.user-dot-icon {
  font-size: 14px;
  line-height: 1;
  width: 14px;
  text-align: center;
}
.dot-green { color: #22c55e; }
.dot-yellow { color: #f59e0b; }
.dot-red { color: #ef4444; }
.dot-gray { color: #9ca3af; }

@media (max-width: 991.98px) {
  body { font-size: 14px; }
  main.container-fluid { padding-top: .5rem !important; }
  #harta { height: 260px; }

  .dz-toolbar {
    border-radius: .8rem;
    padding: .5rem .6rem !important;
  }

  .dz-logo { width: 1.7rem; height: 1.7rem; font-size: .8rem; }
  .dz-toolbar .fw-semibold { font-size: .95rem; }

  .dz-m-left, .dz-m-mid, .dz-m-right { min-width: 0; }
  .dz-m-mid { font-size: .95rem; }

  .dz-icon-btn { padding: .15rem .3rem; font-size: 1rem; }

  .dz-room-select {
    min-width: 0;
    max-width: 100%;
    font-size: .85rem;
    padding: .4rem .5rem;
  }

  .glass-card { border-radius: .85rem; }
  .dz-ptt {
    min-height: 46px;
    font-size: .95rem;
    padding: .5rem .75rem;
    margin-bottom: .5rem !important;
  }

  .dz-status {
    font-size: .82rem;
    padding: .45rem .55rem;
    margin-bottom: .5rem !important;
  }

  .dz-list li { padding: .35rem .5rem; margin-bottom: .35rem; font-size: .85rem; }
  .dz-room-select { width: 100%; min-width: 0; }
}