:root {
  --bg: #090b13;
  --text: #ffffff;
  --text-soft: #eaf3ff;
  --muted: #bcc7ec;

  --card-bg: #1A2040;
  --card-bg-2: #191e37;
  --input-bg: #232b47;
  --input-focus-bg: #252f5a;

  --border: #305089;
  --border-soft: #29325b;

  --header-grad: linear-gradient(90deg, #102272 88%, #3898fc 100%);
  --primary-grad: linear-gradient(90deg,#1678fa 0%, #249afd 99%);
  --success-grad: linear-gradient(90deg,#1eb351 0%,#16a34a 99%);
  --danger-grad: linear-gradient(90deg, #ed3b45, #bc1531 90%);

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;

  --shadow-card: 0 2px 28px #00000025;
  --shadow-btn: 0 2px 15px #00339915;

  --font-main: 'Segoe UI', Arial, sans-serif;
}

html, body {
  background: var(--bg);
  min-height: 100vh;
  color: var(--text);
  font-family: var(--font-main);
}

.card,
.card-body,
.shared-panel {
  background: var(--card-bg) !important;
  color: var(--text-soft) !important;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  border: none;
}

.card-header,
.shared-header {
  background: var(--header-grad) !important;
  color: #fff !important;
  font-weight: 700;
  font-size: 1.18rem;
  letter-spacing: 0.03em;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  padding-top: 22px !important;
  padding-bottom: 18px !important;
  box-shadow: 0 2px 22px #101a3f1c;
  border: none;
}

input[type="text"],
input[type="date"],
input[type="number"],
input[type="url"],
input[type="email"],
input[type="search"],
select,
textarea,
textarea.form-control {
  background: var(--input-bg) !important;
  color: #e6f1ff !important;
  border: 1.4px solid var(--border) !important;
  border-radius: var(--radius-sm);
  font-size: 1.04rem;
  box-shadow: none !important;
  margin-bottom: 12px !important;
  padding: 0.74rem 1rem;
}

input:focus,
select:focus,
textarea:focus {
  background: var(--input-focus-bg) !important;
  color: #fff !important;
  border-color: #2896ef !important;
  outline: none;
}

input::placeholder,
textarea::placeholder {
  color: #a5b7d6 !important;
  opacity: 1 !important;
}

textarea.form-control[readonly],
textarea[readonly] {
  background: var(--card-bg-2) !important;
  color: #c7d6f5 !important;
  border: 1.3px solid #395188 !important;
  font-size: 1.03rem;
}

label,
.form-label,
.col-form-label,
.fw-bold {
  color: var(--muted) !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
}

h1, h2, h3, h4, h5, h6,
.card-header h4 {
  color: #fff !important;
  font-family: var(--font-main) !important;
  font-weight: 700 !important;
  letter-spacing: 0.045em !important;
}

hr {
  border-top: 1.5px solid var(--border-soft) !important;
  margin: 24px 0;
}

button,
button[type="submit"],
.btn,
.btn-success,
.btn-primary,
.btn-danger,
.shared-btn {
  border-radius: var(--radius-sm) !important;
  font-weight: 600 !important;
  font-size: 1.04em !important;
  padding: 11px 28px !important;
  border: none !important;
  box-shadow: var(--shadow-btn);
  transition: background 0.17s, transform 0.12s;
}

button:hover,
.btn:hover,
.shared-btn:hover {
  transform: translateY(-1px);
}

.btn-success {
  background: var(--success-grad) !important;
  color: #fff !important;
}

.btn-primary {
  background: var(--primary-grad) !important;
  color: #fff !important;
}

.btn-danger {
  background: var(--danger-grad) !important;
  color: #fff !important;
}

input[type="checkbox"] {
  accent-color: #249afd;
  width: 1.13em;
  height: 1.13em;
  margin-right: 8px;
}

.form-check-label {
  color: #d4e1fe !important;
  font-weight: 500;
}

.mb-3 {
  margin-bottom: 1rem !important;
}

@media (max-width: 600px) {
  .card-body {
    padding: 7px;
  }

  .card-header {
    font-size: 1rem;
  }

  h4,
  .card-header h4 {
    font-size: 1.02rem !important;
  }
}