/* Part52 Clause Monitor - Minimal, accessible, responsive */

*,*::before,*::after{box-sizing:border-box}

body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:#1a1a1a;
  background:#fff;
  margin:0;
  padding:0;
  line-height:1.6;
}

a{color:#0056b3;text-decoration:none}
a:hover{text-decoration:underline}

/* Layout */
.header-inner,main,footer{
  max-width:960px;
  margin:0 auto;
  padding:0 1rem;
}

/* Header */
header{
  border-bottom:2px solid #1a1a1a;
  padding:.75rem 0;
}
.header-inner{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem 1.5rem}
.site-name{font-size:1.4rem;font-weight:700;color:#1a1a1a;text-decoration:none}
nav{display:flex;flex-wrap:wrap;gap:.25rem .75rem}
nav a{font-size:.9rem}
nav a:hover{text-decoration:underline}

/* Main */
main{padding:1.5rem 1rem 2rem}
h1{font-size:1.6rem;margin:.5rem 0 1rem;color:#1a1a1a}
h2{font-size:1.25rem;margin:1.5rem 0 .75rem;color:#1a1a1a}
h3{font-size:1.05rem;margin:1rem 0 .5rem}

/* Tables */
table{width:100%;border-collapse:collapse;margin:.75rem 0 1.25rem}
th,td{text-align:left;padding:.4rem .6rem;border-bottom:1px solid #ddd}
th{font-weight:600;border-bottom:2px solid #bbb}
tbody tr:nth-child(even){background:#f9f9f9}
tr.deviation-row{background:#fff3cd!important}
.stats-table td:last-child{font-weight:600;text-align:right}
.meta-table{max-width:600px}
.meta-table td:first-child{font-weight:600;white-space:nowrap;width:180px}

/* Badges */
.badge{
  display:inline-block;
  padding:.15rem .5rem;
  border-radius:3px;
  font-size:.85rem;
  font-weight:600;
}
.badge-current{background:#d4edda;color:#155724}
.badge-recently-modified{background:#cce5ff;color:#004085}
.badge-deviation-active{background:#fff3cd;color:#856404}
.badge-reserved{background:#e2e3e5;color:#383d41}
.badge-active{background:#d4edda;color:#155724}
.badge-archived{background:#e2e3e5;color:#383d41}
.badge-rescinded{background:#e2e3e5;color:#383d41}
.badge-revised{background:#cce5ff;color:#004085}
.badge-superseded_by_rule{background:#e2e3e5;color:#383d41}

/* Warning box */
.warning-box{
  background:#fff3cd;
  color:#856404;
  border:1px solid #ffc107;
  border-radius:4px;
  padding:.75rem 1rem;
  margin:.75rem 0;
  font-weight:500;
}
.warning-box a{color:#856404;text-decoration:underline}

/* Deviation cards */
.deviation-card{
  border:1px solid #ddd;
  border-left:4px solid #ffc107;
  padding:.75rem 1rem;
  margin:.75rem 0;
  border-radius:2px;
}

/* Change entries */
.change-entry{margin:.5rem 0;padding:.25rem 0;border-bottom:1px solid #eee}
.change-icon{font-weight:700;font-family:monospace}
.change-summary{color:#555;margin:.2rem 0 0 1.5rem;font-size:.9rem}

/* RFO entries */
.rfo-entry{margin:1rem 0;padding-bottom:1rem;border-bottom:1px solid #eee}
.rfo-entry .date{color:#666;font-size:.9rem}

/* Code/pre */
pre{
  background:#f5f5f5;
  padding:.75rem;
  overflow-x:auto;
  border-radius:3px;
  font-size:.85rem;
  line-height:1.5;
}
.diff{font-size:.8rem}
.clause-text{white-space:pre-wrap;word-wrap:break-word}

/* Side-by-side deviation comparison - breaks out of main container */
.deviation-compare{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
  margin:.75rem calc(-1 * (50vw - 480px));
  padding:0 1rem;
  width:calc(100vw - 2rem);
  justify-self:center;
}
.compare-panel{
  min-width:0;
}
.compare-panel h4{
  margin:0 0 .4rem;
  font-size:.9rem;
  color:#555;
}
.compare-panel pre,.compare-panel .diff-view{
  max-height:70vh;
  overflow-y:auto;
  margin:0;
  background:#f5f5f5;
  padding:.75rem;
  border-radius:3px;
  font-family:monospace;
  font-size:.85rem;
  line-height:1.5;
}
/* MediaWiki-style diff: line-level backgrounds + word-level highlights */
.diff-view .diff-del{background:#fee7e7}
.diff-view .diff-ins{background:#d8fcd8}
.diff-view .diff-change-del{background:#fee7e7}
.diff-view .diff-change-ins{background:#d8fcd8}
.diff-view .diff-blank{min-height:1.5em;background:#f0f0f0}
.diff-view del{text-decoration:none;background:#fdb8c0;padding:0 1px}
.diff-view ins{text-decoration:none;background:#acf2bd;padding:0 1px}

/* Timeline */
.timeline{list-style:none;padding:0}
.timeline li{padding:.4rem 0;border-left:2px solid #ddd;padding-left:1rem;margin-left:.5rem}

/* Details */
details{margin:.5rem 0}
summary{cursor:pointer;font-weight:600;color:#0056b3}
summary:hover{text-decoration:underline}

/* Footer */
footer{
  border-top:1px solid #ddd;
  padding:1rem;
  color:#666;
  font-size:.85rem;
  margin-top:2rem;
}
footer p{margin:.25rem 0}
.disclaimer{font-style:italic;font-size:.8rem}

/* Responsive */
@media(max-width:768px){
  .header-inner{flex-direction:column}
  nav{gap:.2rem .5rem}
  table{font-size:.85rem}
  th,td{padding:.3rem .4rem}
  .meta-table td:first-child{width:auto}
  .deviation-compare{grid-template-columns:1fr;margin:0;width:auto;padding:0}
}

/* Clause checker */
.checker-input{margin:1rem 0}
.checker-input label{display:block;font-weight:600;margin-bottom:.4rem}
.checker-input textarea{
  width:100%;
  font-family:monospace;
  font-size:.95rem;
  padding:.5rem;
  border:1px solid #bbb;
  border-radius:3px;
  resize:vertical;
}
.checker-buttons{margin:.75rem 0;display:flex;gap:.5rem}
button{
  padding:.45rem 1.1rem;
  font-size:.95rem;
  font-weight:600;
  border:none;
  border-radius:3px;
  cursor:pointer;
  background:#0056b3;
  color:#fff;
}
button:hover{background:#004494}
.btn-secondary{background:#6c757d}
.btn-secondary:hover{background:#565e64}
.checker-status{padding:.5rem .75rem;border-radius:3px;background:#cce5ff;color:#004085;margin:.5rem 0}
.checker-error{background:#f8d7da;color:#721c24}
.checker-actions{margin:.5rem 0;display:flex;align-items:center;gap:.75rem}
.copy-feedback{color:#155724;font-weight:600;font-size:.9rem}
.results-summary{font-size:.9rem;color:#555;margin-top:.5rem}
td.not-found{color:#856404;font-style:italic}

/* Print */
@media print{
  header nav,footer{display:none}
  main{max-width:100%;padding:0}
  a{color:#1a1a1a}
  .badge{border:1px solid #999}
}