:root {
  /* Warm Ranch Color Palette */
  --background: 45 15% 96%; /* Warm cream */
  --foreground: 25 15% 25%; /* Rich brown */

  --card: 0 0% 100%;
  --card-foreground: 25 15% 25%;

  --popover: 0 0% 100%;
  --popover-foreground: 25 15% 25%;

  /* Ranch Primary - Sage Green */
  --primary: 100 20% 40%;
  --primary-foreground: 0 0% 100%;
  --primary-hover: 100 25% 35%;

  /* Ranch Secondary - Warm Tan */
  --secondary: 35 25% 85%;
  --secondary-foreground: 25 15% 25%;

  --muted: 35 20% 90%;
  --muted-foreground: 25 10% 55%;

  --accent: 35 25% 85%;
  --accent-foreground: 25 15% 25%;

  /* Ranch Shadows */
  --shadow-card: 0 1px 3px 0 hsl(25 15% 35% / 0.08), 0 1px 2px -1px hsl(25 15% 35% / 0.06);
  --shadow-elevated: 0 4px 12px -2px hsl(25 15% 35% / 0.12), 0 2px 4px -2px hsl(25 15% 35% / 0.08);
  --shadow-floating: 0 20px 25px -5px hsl(25 15% 35% / 0.15), 0 8px 10px -6px hsl(25 15% 35% / 0.1);
  --shadow-glow: 0 0 20px hsl(100 20% 40% / 0.3);

  /* Ranch Gradients */
  --gradient-primary: linear-gradient(135deg, hsl(100 20% 40%), hsl(100 25% 35%));
  --gradient-hero: linear-gradient(135deg, hsl(100 20% 40%), hsl(85 25% 30%));
  --gradient-blue: linear-gradient(135deg, hsl(210 75% 55%), hsl(210 75% 50%));
  --gradient-warm: linear-gradient(145deg, hsl(45 15% 96%), hsl(35 20% 90%));
  --gradient-premium: linear-gradient(135deg, hsl(100 25% 35%), hsl(85 30% 30%));
  --gradient-success: linear-gradient(135deg, hsl(100 20% 40%), hsl(120 25% 45%));
  --gradient-amber: linear-gradient(135deg, hsl(45 50% 55%), hsl(42 45% 50%));
  --gradient-card: linear-gradient(145deg, hsl(0 0% 100%), hsl(35 15% 98%));
  --gradient-glass: linear-gradient(145deg, hsl(0 0% 100% / 0.9), hsl(35 15% 98% / 0.8));

  --success: 100 25% 50%;
  --success-foreground: 25 15% 10%;
  --success-light: 100 20% 20%;

  --warning: 38 75% 60%;
  --warning-foreground: 25 15% 10%;
  --warning-light: 38 50% 25%;

  --destructive: 15 70% 55%;
  --destructive-foreground: 0 0% 100%;
  --destructive-light: 15 50% 25%;

  --blue-cta: 210 75% 60%;
  --blue-cta-foreground: 0 0% 100%;
  --blue-cta-light: 210 50% 25%;

  --amber: 45 50% 58%;
  --amber-foreground: 25 15% 10%;
  --amber-light: 45 35% 25%;

  --premium: 100 30% 45%;
  --premium-foreground: 0 0% 100%;
  --premium-light: 100 20% 20%;

  --pending: 35 60% 65%;
  --pending-foreground: 25 15% 10%;
  --pending-light: 35 40% 25%;

  --border: 35 12% 25%;
  --input: 35 12% 25%;
  --ring: 100 25% 50%;


}

.inline { display: inline; }
div.underline { border-bottom: 1px solid #333; margin-bottom: 1rem; }
.row-inputs input[type=number] { width: 6rem; }
.row-inputs > span  { display: inline-block; width: 6rem; margin-right: 0.225rem; }
.row-inputs > span.palpate  { display: inline-block; width: 4rem; margin-right: 0.225rem; }
.row-inputs label { display: inline; }
img#rove-logo { height:3rem; }

section.heading h1 {
  color: hsl(var(--primary));
  margin-left: 1em;
}

.livestock-card {
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: 0.5rem;
  padding: 0.5rem 1.5rem 1.5rem;
  margin-bottom: 1.5rem;
  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1);
}

.livestock-card-header {
  font-size: 1.125rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: hsl(var(--secondary-foreground));
  padding: 0.5rem;
  border-bottom: 1px solid hsl(var(--border));
}

/* hacks before I put in flexbox */
hr { border-color: #697A4B; clear: both;}
hr.clear { margin: 0; padding: 0; border: 0; clear: both; }
.right { width: 100%; text-align: right; }
.float-left { float: left; }

.flash-error {
  background-color: #fee;
  border-color: #f99;
  padding: 1rem;

}
.error  code { color: #f99; }

fieldset.row-inputs { margin-bottom: 0; }

.label-row {
  display: flex;
  column-gap: 0.6rem;
}

.label-row > label {
  flex-grow: 1;
}
.label-row > label > input { width: 100%; }


//* { outline: 1px dotted green; }

/* Consignment table */
table.weekly-consignments {
  table-layout: auto;
  width: 100%;
}

table { display: table; }
table tr {display: table-row;}
table td {display: table-cell !important;}

table.weekly-consignments .consignment-header td {
  border-bottom: 1px solid #333 !important;
}

table.weekly-consignments td, table.weekly-consignments th {
  text-overflow: ellipsis;
  white-space: nowrap;
}

tr.consignment :nth-child(1),
tr.consignment :nth-child(2) {
}
tr.consignment :nth-child(3) {

}

tr.consignment :nth-child(4) {
  // date received
  max-width: 30%;
  background: "goldenrod";
}

tr.consignment :nth-child(5),
tr.consignment :nth-child(6),
tr.consignment :nth-child(7),
tr.consignment :nth-child(8),
tr.consignment :nth-child(9),
tr.consignment :nth-child(10),
tr.consignment :nth-child(11),
tr.consignment :nth-child(12) {
  max-width: 11%;
  text-align: right;
}

/* UI logic */
.palpate-checkbox { width: 4rem; visibility: hidden ; }
.livestock-entry-type:has(> option:checked[value="cow"]) ~ .palpate-checkbox { visibility: visible;}
.livestock-entry-type:has(> option:checked[value="heifer"]) ~ .palpate-checkbox { visibility: visible;}
input.livestock-entry-tag-number:not(:valid) { background: hsl(var(--warning));}

// only show the     [-] [+] buttons on the last livestock entry
// but show just         [+] if there is only one row
fieldset.livestock-entry-input button { visibility: hidden; }
fieldset.livestock-entry-input button { visibility: hidden; }
fieldset.livestock-entry-input:last-of-type button { visibility: visible; }
fieldset.livestock-entry-input:only-of-type button.livestock-entry-remover { visibility: hidden ; }
input.livestock-entry-tag-number:not(:valid) ~ button.livestock-entry-adder { visibility: hidden; }


/* overrides of tacit styles */
h1,h2,h3,h4,h5 { margin-top: unset; }
p { margin-bottom: unset; }
span.b { font-weight: bold; }