:root {
  --conexfit-font-family: Manrope, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --conexfit-dark: #18212b;
  --conexfit-yellow: #facc15;
  --conexfit-amber: #f59e0b;
  --conexfit-yellow-soft: #fff8e1;
  --conexfit-bg: #ffffff;
  --conexfit-soft-bg: #f8f7f4;
  --conexfit-secondary: #6b7280;
  --conexfit-border: #e5e7eb;
  --conexfit-success: #16a34a;
  --conexfit-alert: #dc2626;
  --conexfit-whatsapp: #25d366;
  --conexfit-shadow: 0 1px 2px rgb(24 33 43 / 6%), 0 8px 24px rgb(24 33 43 / 8%);
  --primary: var(--conexfit-dark);
  --secondary: var(--conexfit-dark);
  --accent: var(--conexfit-yellow);
  --primary-fg: var(--conexfit-bg);
  --body-fg: var(--conexfit-dark);
  --body-bg: var(--conexfit-soft-bg);
  --body-quiet-color: var(--conexfit-secondary);
  --hairline-color: var(--conexfit-border);
  --link-fg: var(--conexfit-dark);
  --link-selected-fg: var(--conexfit-dark);
}

html,
body,
button,
input,
select,
textarea {
  font-family: var(--conexfit-font-family);
  letter-spacing: 0;
}

body {
  background: var(--conexfit-soft-bg);
  color: var(--conexfit-dark);
}

a:link,
a:visited {
  color: var(--conexfit-dark);
}

#header {
  background: var(--conexfit-dark);
  border-bottom: 4px solid var(--conexfit-yellow);
  box-shadow: none;
  min-height: 64px;
}

.conexfit-brand a {
  align-items: center;
  color: var(--conexfit-bg) !important;
  display: flex;
  font-weight: 800;
  gap: 10px;
  text-decoration: none;
}

.conexfit-mark {
  align-items: center;
  background: var(--conexfit-yellow);
  border-radius: 8px;
  color: var(--conexfit-dark);
  display: inline-flex;
  font-size: 13px;
  height: 34px;
  justify-content: center;
  width: 34px;
}

#user-tools,
#user-tools a,
#logout-form button {
  color: var(--conexfit-yellow) !important;
}

div.breadcrumbs {
  background: var(--conexfit-bg);
  border-bottom: 1px solid var(--conexfit-border);
  color: var(--conexfit-secondary);
}

#content {
  padding: 28px;
}

#content h1 {
  color: var(--conexfit-dark);
  font-size: 28px;
  font-weight: 800;
}

.module,
.dashboard-card,
.conexfit-panel,
#changelist,
.submit-row,
fieldset.module {
  background: var(--conexfit-bg);
  border: 1px solid var(--conexfit-border);
  border-radius: 8px;
  box-shadow: var(--conexfit-shadow);
  overflow: hidden;
}

.module h2,
.module caption,
.inline-group h2 {
  background: var(--conexfit-dark);
  color: var(--conexfit-bg);
  font-weight: 800;
}

.button,
input[type="submit"],
input[type="button"],
.submit-row input,
a.button,
.object-tools a:link,
.object-tools a:visited {
  background: var(--conexfit-yellow);
  border: 1px solid var(--conexfit-yellow);
  border-radius: 8px;
  color: var(--conexfit-dark);
  font-weight: 800;
  min-height: 38px;
}

.button.default,
input[type="submit"].default,
.submit-row input.default {
  background: var(--conexfit-yellow);
  color: var(--conexfit-dark);
}

.button:hover,
input[type="submit"]:hover,
a.button:hover,
.object-tools a:hover {
  background: var(--conexfit-amber);
  border-color: var(--conexfit-amber);
}

input,
select,
textarea,
.vTextField {
  border: 1px solid var(--conexfit-border);
  border-radius: 8px;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--conexfit-dark);
  box-shadow: 0 0 0 2px rgb(250 204 21 / 35%);
  outline: 0;
}

.selector-chosen h2 {
  background: var(--conexfit-dark) !important;
}

.messagelist li.success,
.success {
  background: color-mix(in srgb, var(--conexfit-success) 12%, white);
  border-color: var(--conexfit-success);
}

.messagelist li.error,
.errornote,
.errorlist {
  color: var(--conexfit-alert);
}

.conexfit-dashboard {
  display: grid;
  gap: 18px;
  margin-bottom: 28px;
}

.conexfit-hero {
  align-items: end;
  background: linear-gradient(135deg, var(--conexfit-dark), #263443);
  border-radius: 8px;
  color: var(--conexfit-bg);
  display: flex;
  justify-content: space-between;
  min-height: 132px;
  padding: 24px;
}

.conexfit-hero h1,
.conexfit-hero p {
  color: inherit;
  margin: 0;
}

.conexfit-hero p {
  color: #d1d5db;
  margin-top: 8px;
}

.conexfit-hero strong {
  color: var(--conexfit-yellow);
}

.dashboard-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.dashboard-card {
  padding: 18px;
}

.dashboard-card span {
  color: var(--conexfit-secondary);
  display: block;
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 10px;
}

.dashboard-card strong {
  display: block;
  font-size: 28px;
  line-height: 1;
}

.dashboard-card.is-warm {
  background: var(--conexfit-yellow-soft);
}

.dashboard-lists {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.conexfit-panel h2 {
  border-bottom: 1px solid var(--conexfit-border);
  font-size: 16px;
  margin: 0;
  padding: 14px 16px;
}

.conexfit-panel ul {
  list-style: none;
  margin: 0;
  padding: 8px 16px 16px;
}

.conexfit-panel li {
  border-bottom: 1px solid var(--conexfit-border);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 10px 0;
}

.conexfit-panel li:last-child {
  border-bottom: 0;
}

.conexfit-muted {
  color: var(--conexfit-secondary);
}

.conexfit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.conexfit-actions a {
  background: var(--conexfit-yellow);
  border-radius: 8px;
  color: var(--conexfit-dark);
  font-weight: 800;
  padding: 11px 14px;
  text-decoration: none;
}

.public-shell {
  background: var(--conexfit-soft-bg);
  min-height: 100vh;
}

.public-layout {
  display: grid;
  gap: 28px;
  grid-template-columns: minmax(0, 0.9fr) minmax(320px, 1.1fr);
  margin: 0 auto;
  max-width: 1120px;
  padding: 40px 20px;
}

.public-intro,
.public-form {
  background: var(--conexfit-bg);
  border: 1px solid var(--conexfit-border);
  border-radius: 8px;
  box-shadow: var(--conexfit-shadow);
  padding: 28px;
}

.public-intro {
  background: var(--conexfit-dark);
  color: var(--conexfit-bg);
}

.public-intro h1 {
  font-size: 40px;
  line-height: 1.05;
  margin: 0 0 16px;
}

.public-intro p {
  color: #d1d5db;
  line-height: 1.6;
}

.public-badge {
  background: var(--conexfit-yellow);
  border-radius: 8px;
  color: var(--conexfit-dark);
  display: inline-block;
  font-weight: 800;
  margin-bottom: 22px;
  padding: 8px 10px;
}

.public-form h2 {
  margin-top: 0;
}

.public-form label {
  color: var(--conexfit-dark);
  display: block;
  font-weight: 800;
  margin-bottom: 6px;
}

.public-form input,
.public-form select {
  box-sizing: border-box;
  margin-bottom: 14px;
  min-height: 44px;
  padding: 9px 11px;
  width: 100%;
}

.public-form button {
  background: var(--conexfit-yellow);
  border: 0;
  border-radius: 8px;
  color: var(--conexfit-dark);
  cursor: pointer;
  font-weight: 900;
  min-height: 46px;
  padding: 12px 16px;
  width: 100%;
}

@media (max-width: 760px) {
  #content {
    padding: 18px;
  }

  .conexfit-hero {
    align-items: start;
    flex-direction: column;
  }

  .public-layout {
    grid-template-columns: 1fr;
    padding: 20px 14px;
  }

  .public-intro h1 {
    font-size: 32px;
  }
}