.profile-container {
  max-width: 1170px;
  margin: 48px auto;
  display: flex;
  gap: 32px;
  padding: 0 15px;
}

.profile-main {
  flex: 2 1 0;
  min-width: 0;
}

/* LOGIN + REGISTER side by side */
.login-register-row {
  display: flex;
  gap: 28px;
  justify-content: center;
}

.login-card, .register-card {
  flex: 1 1 0;
  background: #1f2937;
  padding: 32px 28px 28px 28px;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.18);
  color: #f9fafb;
  display: flex;
  flex-direction: column;
  align-items: center;    /* centriraj sve u kartici */
}

.login-card h2, .register-card h2 {
  margin-bottom: 20px;
  font-size: 1.5rem;
  color: #f9fafb;
  text-align: center;
}

.login-form, .register-form {
  width: 100%;
  max-width: 320px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.register-card {
  text-align: center;
}
.register-card .user-button {
  margin: 0 auto;
}


.form-group {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  margin-bottom: 18px;
}
.login-form label, .register-form label {
  font-weight: 600;
  margin-bottom: 5px;
  display: block;
  color: #e5e7eb;
  text-align: left;
}
.login-form input, .register-form input {
  width: 100%;
  padding: 10px 14px;
  background: #e5eeff;
  border: 1px solid #374151;
  border-radius: 5px;
  color: #212b36;
  font-size: 1rem;
  box-sizing: border-box;
}

/* Novi user button stilovi */
.user-button {
  display: inline-block;
  width: 100%;
  max-width: 220px;
  padding: 10px 22px;
  border-radius: 5px;
  text-decoration: none;
  font-weight: 600;
  cursor: pointer;
  border: none;
  font-size: 1rem;
  transition: background 0.2s;
  align-self: center;
  margin-top: 5px;
}

.user-button-primary {
  background: #2563eb;
  color: #fff;
}
.user-button-primary:hover {
  background: #1d4ed8;
}
.user-button-secondary {
  background: #10b981;
  color: #fff;
}
.user-button-secondary:hover {
  background: #059669;
}

/* Sidebar widgets */
.profile-sidebar { flex: 1 1 0; min-width: 250px; }
.sidebar-widget {
  background: #1f2937;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.16);
  padding: 22px 18px 20px 18px;
  margin-bottom: 22px;
  color: #f9fafb;
}
.sidebar-widget h3 {
  margin-bottom: 12px;
  font-size: 1.1rem;
}
.sidebar-banner {
  width: 100%;
  border-radius: 4px;
  display: block;
}
.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.tag-list a {
  background: #111827;
  padding: 6px 14px;
  border-radius: 20px;
  color: #f9fafb;
  text-decoration: none;
  font-size: 0.97rem;
}

/* Responsive */
@media (max-width: 900px) {
  .profile-container { flex-direction: column; gap: 20px; }
  .login-register-row { flex-direction: column; gap: 20px; }
  .profile-sidebar { min-width: 0; }
}
