*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Segoe UI', Arial, sans-serif;
  background: #f5f0ff;
  color: #333;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* ASP.NET wraps everything in <form> — keep it in the flex chain */
body > form {
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* ── Layout ── */
.page-body {
  display: flex;
  gap: 0;
  flex: 1;             /* grow to fill all space between nav and footer */
}

/* ── Main content ── */
.main-content {
  flex: 1;
  padding: 28px 32px;
}


/* Decorative blob – bottom-right corner */
.blob-br {
  position: fixed;
  bottom: 0; right: 0;
  width: 220px;
  height: 220px;
  background: radial-gradient(circle at 80% 80%, #e0b0ff88, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

/* ── Accordion ── */
.accordion {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.accordion-header {
  background: #ddd5f5;
  color: #5a1a8a;
  padding: 13px 18px;
  border-radius: 7px;
  border: 1px solid #d4b8f0;
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  user-select: none;
  transition: background 0.2s, color 0.2s;
}
.accordion-header:hover { background: #cfc5ee; }
.accordion-header.open {
  background: linear-gradient(135deg, #6034c5, #e02596);
  color: #fff;
  border-color: transparent;
  border-radius: 7px 7px 0 0;
}
.accordion-header i { transition: transform 0.25s; }
.accordion-header.open i { transform: rotate(180deg); }

.accordion-body {
  display: none;
  background: #fff;
  border: 1px solid #e0d4f5;
  border-top: none;
  border-radius: 0 0 7px 7px;
  padding: 24px 28px 28px;
}

/* ── Shared card ── */
.card {
  background: #fff;
  border: 1px solid #e0d4f5;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(90,26,138,0.08);
}

.card-header {
  background: linear-gradient(135deg, #6034c5, #e02596);
  color: #fff;
  padding: 14px 20px;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

/* ── Shared buttons ── */
.btn-primary {
  background: linear-gradient(135deg, #6034c5, #e02596);
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 7px 22px;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  margin-top: 20px;
}
.btn-primary:hover { opacity: 0.87; }

.btn-secondary {
  background: #e8e0f5;
  color: #5a1a8a;
  border: none;
  border-radius: 6px;
  padding: 7px 22px;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  margin-top: 20px;
}
.btn-secondary:hover { background: #d4c4ed; }

.btn-action-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 20px;
  background: linear-gradient(135deg, #6034c5, #e02596);
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 7px 22px;
  font-size: 0.88rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.15s;
  font-family: inherit;
}
.btn-action-link:hover { opacity: 0.88; color: #fff; }
.btn-action-link i { font-size: 1rem; }

/* ── Shared form elements ── */
.form-label {
  font-size: 0.9rem;
  font-weight: 700;
  color: #5a1a8a;
  letter-spacing: 0;
}

.req {
  color: #e02596;
  margin-left: 2px;
}

.form-input,
.form-select,
.form-textarea {
  border: 1px solid #c9b8e8;
  border-radius: 5px;
  padding: 7px 10px;
  font-size: 0.88rem;
  color: #333;
  background: #faf8ff;
  outline: none;
  font-family: inherit;
}
.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  border-color: #6034c5;
  box-shadow: 0 0 0 2px rgba(96,52,197,0.12);
}
.form-textarea { resize: vertical; }

/* ── File input ── */
input[type="file"] {
  font-size: 0.85rem;
  color: #444;
}
input[type="file"]::file-selector-button {
  background: #c9b8e8;
  color: #5a1a8a;
  border: none;
  border-radius: 6px;
  padding: 6px 16px;
  font-size: 0.85rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  margin-right: 10px;
  transition: background 0.15s;
}
input[type="file"]::file-selector-button:hover {
  background: #b8a3de;
}

.form-checkbox,
.form-radio {
  accent-color: #6034c5;
  width: 15px;
  height: 15px;
  cursor: pointer;
}

.field-error {
  font-size: 0.74rem;
  color: #dc2626;
  display: none;
}

/* ── Shared success message ── */
.success-msg {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
  padding: 12px 16px;
  background: #f0fdf4;
  border: 1px solid #86efac;
  border-radius: 7px;
  font-size: 0.88rem;
  font-weight: 600;
  color: #166534;
}
.success-msg i {
  font-size: 1.2rem;
  color: #22c55e;
  flex-shrink: 0;
}