/* Ink-friendly print overrides for pages using cok_style.css (and dark mode) */
@page {
  size: auto;
  margin: 12mm; /* adjust if you want more/less margin */
}

* {
  box-shadow: none !important;
  text-shadow: none !important;
}

/* Page & containers: white background, black text */
html, body {
  background: #fff !important;
  color: #000 !important;
}
.user-management,
.container,
.family-card,
.child-entry,
form {
  background: #fff !important;
  color: #000 !important;
  border: 1px solid #000 !important;
  box-shadow: none !important;
}

/* Tables: clear, bordered, readable */
table {
  background: #fff !important;
  border-collapse: collapse !important;
  width: 100% !important;
}
th, td {
  border: 1px solid #000 !important;
  padding: 8px 10px !important;
  vertical-align: top !important;
}
th {
  background: #eee !important;
  color: #000 !important;
  font-weight: bold !important;
}
tr:hover { background: transparent !important; }

/* Badges look like simple labels in print */
.badge {
  background: #fff !important;
  color: #000 !important;
  border: 1px solid #000 !important;
}

/* Hide nav/buttons/toolbars that waste space in print */
.toolbar,
.actions-footer,
.btn,
button,
.toggle-details,
input[type="submit"],
input[type="button"] {
  display: none !important;
}

/* Always show collapsed sections (e.g., partner details accordions) */
.details {
  display: block !important;
}

/* Inputs look like plain text in print */
input, select, textarea, label {
  color: #000 !important;
  background: #fff !important;
  border-color: #000 !important;
}

/* Optional: append URLs after links so printed copy has destinations */
a[href^="http"]:after {
  content: " (" attr(href) ")";
  font-weight: normal;
  font-size: 90%;
  color: #000 !important;
}

/* Avoid awkward page breaks */
.family-card,
.container,
.child-entry,
table,
tr,
fieldset {
  break-inside: avoid !important; /* page-break-inside for older engines */
  page-break-inside: avoid !important;
}

/* Use the full page width on print */
.user-management,
.wrap,
.container,
.family-card,
form {
  max-width: 100% !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}