/* core/static/css/edc_overrides.css */

/* Layout */
main.container { max-width: 1100px; }
#messages { margin-top: 12px; }

/* Cards / content blocks */
.card,
.content {
  background: #FFFFFF;
  border: 1px solid #CECECE;
  border-radius: 16px;
  box-shadow: 0 12px 24px 0 #3A57791C;
}
.card > h1, .content > h1 { margin-bottom: 12px; }

/* Subnav (second row under navbar) */
.subnav { padding: 14px 0; }
.subnav-wiki a.menu-link {
  text-decoration: none; color: #202842; padding: 8px 12px; border-radius: 8px;
}
.subnav-wiki a.menu-link:hover { background: #E9F5FF; }

/* Buttons – map old classes to brand buttons */
a.cta, .cta,
.btn.btn-primary {
  background: #1879EE; color: #FFFFFF !important; border: 1px solid #1879EE;
  border-radius: 8px; padding: 10px 16px; display: inline-block;
}
a.ghost, .ghost, .btn.btn-secondary {
  background: #FFFFFF; color: #202842 !important; border: 1px solid #1879EE;
  border-radius: 8px; padding: 10px 16px; display: inline-block;
}
.actions { display: flex; gap: 10px; margin-top: 14px; }

/* Forms – unify inputs, labels and grid fields */
.input, select.input,
input[type="text"].input, input[type="number"].input,
input[type="date"].input, input[type="datetime-local"].input, textarea.input {
  border: 1px solid #ced4da; border-radius: .375rem; padding: 10px 12px;
  font-size: 18px; line-height: 27px; color: #202842; background: #fff; width: 100%;
}
.input:focus { border-color: #80bdff; outline: 0; box-shadow: 0 0 0 .2rem rgba(24,121,238,.15); }
label { color: #7E8389; font-weight: 700; font-size: 14px; text-transform: uppercase; }

/* Legacy grid fields */
.grid { gap: 12px; }
.field { display: flex; flex-direction: column; }
.field.third { grid-column: span 4; }
.field.full { grid-column: 1 / -1; }
.help { font-size: 12px; color: #7E8389; margin-top: 6px; }

/* Tables */
.table { width: 100%; border-collapse: collapse; }
.table thead th {
  background: #F4F6F9; color: #202842; font-weight: 700; font-size: 14px;
  border-bottom: 1px solid #CECECE; padding: 10px;
}
.table td { padding: 10px; border-bottom: 1px solid #E5E7EB; }
.table tbody tr:hover { background: #F8FAFF; }

/* “Highlighted” checkbox group used on export page */
.form-checks.highlighted {
  background: #F4F6F9; padding: 14px; border-radius: 10px; border: 1px solid #E5E7EB;
}

/* Footer */
footer.footer { margin: 28px 0 24px; color: #7E8389; font-size: 14px; }

/* Hero section on home */
.hero .card { padding: 18px; }

/* Make date/time inputs stretch nicely */
input[type="date"], input[type="datetime-local"] { width: 100%; }

/* Keep navbar logos tidy on small screens */
.navbar-brand.logo img { height: 36px; }
@media (max-width: 767px){
  .card, .content { padding: 16px; }
  .navbar-brand.logo img { height: 28px; }
}

/* Timeline polish (used on patient timeline) */
.timeline { position:relative; padding-left:24px; }
.timeline::before { content:""; position:absolute; left:8px; top:0; bottom:0; width:2px; background:#CECECE; }
.titem { position:relative; margin:0 0 14px 0; }
.titem::before { content:""; position:absolute; left:-2px; top:6px; width:10px; height:10px; background:#fff; border:2px solid #1879EE; border-radius:50%; }
.kpi { display:flex; gap:10px; flex-wrap:wrap; margin-top:6px; }
.kpi .pill { font-size:12px; padding:6px 8px; background:#F4F6F9; border:1px solid #CECECE; border-radius:999px; }

/* Small utilities */
.muted { color:#7E8389; }
.table-responsive { overflow-x:auto; }

/* Ensure our form “grid” looks good even without Bootstrap grid */
.grid { display:grid; grid-template-columns:repeat(12,1fr); gap:12px; }
.field { display:flex; flex-direction:column; grid-column:span 6; }
.field.third { grid-column:span 4; }
.field.full { grid-column:1 / -1; }


/* Simple branded dropdown (scoped by id to avoid leaks) */
#openFormsMenu.edc-dropdown{
  position:absolute; z-index:2000; min-width:240px;
  background:#FFF; border:1px solid #CECECE; border-radius:8px;
  padding:6px; box-shadow:0 12px 24px 0 #3A57791C;
}
#openFormsMenu .edc-dd-item{
  display:block; width:100%; text-align:left;
  padding:10px 12px; border:none; background:#FFF; border-radius:6px;
  font:inherit; color:#202842; cursor:pointer;
}
#openFormsMenu .edc-dd-item:hover,
#openFormsMenu .edc-dd-item:focus{
  background:#E9F5FF; outline:none;
}


/* Brand tokens used by edc-theme.css (values = your current brand) */
:root{
  --bg:       #f7f7fb;             /* page background */
  --panel:    #ffffff;             /* card background */
  --ink:      #1f2937;             /* main text (≈ #212529 ok too) */
  --muted:    #6b7280;             /* secondary text */
  --line:     #e5e7eb;             /* borders */
  --chip:     #eef2ff;             /* soft chip bg */
  --primary:  var(--brand);        /* already defined in base.html */
  --danger:   #b91c1c;
  --ok:       #065f46;
}
/* keep YOUR fonts; no change needed if body already sets them */