:root{
  --primary:#2563eb; --primary-dark:#1d4ed8; --border:#e5e7eb; --text:#1f2937; --muted:#6b7280;
  --hi-bg:#fee2e2; --hi-bd:#fca5a5; --hi-tx:#991b1b;
  --md-bg:#fef3c7; --md-bd:#fcd34d; --md-tx:#92400e;
  --lo-bg:#d1fae5; --lo-bd:#6ee7b7; --lo-tx:#065f46;
}
.crt-card{ max-width:980px; margin:32px auto; padding:32px; background:#fff; border-radius:20px; box-shadow:0 25px 50px -12px rgba(0,0,0,0.25); transition:transform .25s ease, box-shadow .25s ease; }

.crt-drop{ border:2px dashed #e5e7eb; border-radius:14px; padding:44px 24px; text-align:center; cursor:pointer; position:relative; overflow:hidden; transition:border-color .25s ease, background .25s ease, box-shadow .25s ease, transform .25s ease; }
.crt-drop.dragover{ background:transparent !important; box-shadow:none; transform:none; border-color:var(--primary); }
.crt-drop.dragover::before{ content:''; position:absolute; inset:0; left:-120%; background:linear-gradient(90deg,transparent,rgba(37,99,235,.10),transparent); animation:crt-shimmer 1.2s infinite; }
@keyframes crt-shimmer{ to{ left:120%; } }
.crt-icon{ color:#2563eb; display:flex; justify-content:center; margin-bottom:12px; }
.crt-icon svg{ animation:crt-bounce 2s infinite; }
@keyframes crt-bounce{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
.crt-head{ font-weight:700; font-size:18px; color:#1f2937; }
.crt-sub{ color:#6b7280; margin:6px 0 16px; }
.crt-btn{ background:#2563eb; color:#fff; border:none; padding:12px 24px; border-radius:10px; font-weight:700; cursor:pointer; transition:transform .2s ease, background .2s ease; text-decoration:none; display:inline-block; }

.crt-btn:focus{ outline:2px solid #1d4ed8; outline-offset:2px; }
.crt-help{ font-size:13px; color:#6b7280; margin-top:12px; }
.crt-error{ margin-top:12px; background:#FEF2F2; color:#991B1B; border:1px solid #FCA5A5; padding:10px 12px; border-radius:10px; }
.crt-state{ text-align:center; padding:28px 16px; }
.crt-spinner{ width:44px; height:44px; margin:0 auto 12px; border:3px solid rgba(37,99,235,.2); border-top-color:#2563eb; border-radius:50%; animation:crt-spin 1s linear infinite; }
@keyframes crt-spin{ to{ transform:rotate(360deg); } }
.crt-check{ width:48px; height:48px; margin:0 auto 12px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#10b981; color:#fff; font-size:28px; animation:crt-fade-in .25s ease both; }
@keyframes crt-fade-in{ from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:translateY(0)} }

/* Results page bits (if present on same file) */
.crt-results-card{ padding:24px 24px 8px; border-radius:16px; }
.crt-actions{ margin-bottom:16px; display:flex; gap:12px; flex-wrap:wrap; }
.crt-strip{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:16px; margin-bottom:8px; }
.crt-strip-item{ background:#f9fafb; border:1px solid #eef2f7; border-radius:12px; padding:12px 14px; box-shadow:0 1px 2px rgba(0,0,0,.03) inset; }
.crt-strip-label{ font-size:12px; color:#6b7280; margin-bottom:4px; text-transform:uppercase; letter-spacing:.02em; }
.crt-strip-value{ font-size:15px; color:#1f2937; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.crt-divider{ border:none; border-top:1px solid #e5e7eb; margin:16px 0; }
.crt-risks{ display:flex; flex-direction:column; gap:12px; }
.crt-risk{ border:1px solid #e5e7eb; border-radius:14px; padding:16px; box-shadow:0 2px 8px rgba(0,0,0,.04); background:#fff; }
.crt-risk-head{ display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.crt-risk-title{ margin:0; font-size:16px; color:#111827; }
.crt-excerpt{ margin:8px 0 8px; padding:10px 12px; background:#f9fafb; border-left:3px solid #e5e7eb; border-radius:10px; color:#374151; font-style:italic; }
.crt-risk-text{ margin:4px 0 10px; color:#374151; }
.crt-badge{ display:inline-flex; align-items:center; padding:4px 10px; border-radius:9999px; font-size:12px; font-weight:700; border:1px solid transparent; letter-spacing:.02em; }
.crt-badge--high{ background:var(--hi-bg); border-color:var(--hi-bd); color:var(--hi-tx); }
.crt-badge--medium{ background:var(--md-bg); border-color:var(--md-bd); color:var(--md-tx); }
.crt-badge--low{ background:var(--lo-bg); border-color:var(--lo-bd); color:var(--lo-tx); }
.crt-suggestion{ margin-top:8px; background:rgba(37,99,235,.04); border:1px dashed rgba(37,99,235,.35); padding:12px; border-radius:12px; }
.crt-suggestion-label{ font-size:12px; color:#1d4ed8; font-weight:700; margin-bottom:6px; text-transform:uppercase; letter-spacing:.03em; }
.crt-suggestion-body{ color:#1f2937; }
.crt-clause-ref{font-size:12px;color:#6b7280;margin:4px 0 6px;} .crt-clause-ref span{font-weight:700;margin-right:6px;color:#374151;}
@media (max-width:840px){ .crt-card{ padding:20px; } .crt-strip{ grid-template-columns:1fr; } }
.crt-logo-bounce{animation:crt-bounce 2s infinite; height:56px; width:auto; display:inline-block;}
/* assets/css/front.css */
@media print { .crt-export-controls { display: none !important; } }

/* === Fix: no vertical lift on results page cards === */
.crt-results .crt-risk,

.crt-results .crt-risk { transition: box-shadow .18s ease, border-color .18s ease; }


/* === Keep the lift only on the upload drop zone === */
.crt-drop { transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; will-change: transform;  position:relative; overflow:hidden;}


/* === Kill any generic card-hover lift that might be defined elsewhere === */


/* === Touch devices: never apply hover transforms === */
@media (hover:none) {
  
}

.crt-results .crt-risk { transform: translateZ(0); }

/* === Results header / meta strip === */
.crt-results { padding: 12px 0 64px; } /* bottom padding fixes page edge */
.crt-results-head{
  background:#f8fafc;
  border-radius:14px;
  padding:16px 20px;
  margin:12px 0 20px;
  box-shadow:0 10px 25px -15px rgba(2,6,23,.18);
}
.crt-results .crt-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:18px;
  font-size:14px;
  line-height:1.5;
  color:#334155; /* slate-700 */
}
.crt-results .crt-meta-item{
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
.crt-results .crt-meta-item span{
  font-weight:600;
  color:#0f172a; /* slate-900 */
}
.crt-results .crt-meta-item + .crt-meta-item::before{
  content:"•";
  color:#94a3b8; /* slate-400 */
  margin-right:8px;
}
@media (max-width:640px){
  .crt-results .crt-meta-item{ white-space:normal; }
}

/* Export controls (top & bottom) */
.crt-export-controls{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:16px 0 40px; /* bottom space after the report */
}


/* Overrides */
.crt-drop{ transition: background .2s ease, border-color .2s ease;  position:relative; overflow:hidden;}

/* === Mockup Upload Widget Styles (merged) === */
.upload-widget{
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(20px);
  border-radius: 20px;
  padding: 40px;
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25), 0 0 0 1px rgba(255,255,255,0.3);
}
/* Drop area */
.upload-area, .crt-drop{
  border: 2px dashed var(--border);
  border-radius: 12px;
  padding: 40px 20px;
  text-align: center;
  transition: all .3s ease;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
/* Hover: border/background only (no lift) */
.upload-area:hover{ background:transparent !important; transform:translateY(-4px); box-shadow:0 16px 32px -12px rgba(0,0,0,.20); border-color:var(--primary); }
/* Dragover state */
.upload-area.dragover, .crt-drop.dragover{ background:transparent !important; box-shadow:none; transform:none; border-color:var(--primary); }
.upload-area.dragover::before, .crt-drop.dragover::before{
  content: '';
  position: absolute;
  top: 0; left: -100%; width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(37, 99, 235, 0.10), transparent);
  animation: mockupShimmer 1.5s infinite;
}
@keyframes mockupShimmer{ 0%{left:-100%;} 100%{left:100%;} }

/* Bouncing icon */
.upload-icon{
  width:64px; height:64px; margin:0 auto 20px; color:var(--primary);
  animation: mockupBounce 2s infinite;
}
@keyframes mockupBounce{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }

.upload-text{ font-size:18px; font-weight:600; margin-bottom:8px; color:var(--text); }
.upload-subtext{ color:var(--text-light); margin-bottom:20px; }

.browse-btn{
  background: var(--primary); color:#fff; border:0; padding:12px 30px;
  border-radius: 8px; font-weight:600; cursor:pointer; transition: all .3s ease;
}
.browse-btn:hover{ background: var(--primary-dark); transform: translateY(-2px); }

/* Processing (reusing plugin states) */
.processing{ display:none; text-align:center; padding:40px 20px; }
.processing.active{ display:block; }
.spinner{
  width:48px; height:48px; border:4px solid rgba(37,99,235,0.2); border-top-color: var(--primary);
  border-radius:50%; animation: mockupSpin 1s linear infinite; margin:0 auto 20px;
}
@keyframes mockupSpin{ to{ transform: rotate(360deg); } }

/* Remove any lift on card/drop from previous styles */
.crt-card:hover{ transform:none !important; box-shadow:inherit !important; }
.crt-drop:hover{ background:transparent !important; transform:translateY(-4px); box-shadow:0 16px 32px -12px rgba(0,0,0,.20); border-color:var(--primary); }


/* Hover -> LIFT (override) */
.crt-drop:hover,
.upload-area:hover{ background:transparent !important; transform:translateY(-4px); box-shadow:0 16px 32px -12px rgba(0,0,0,.20); border-color:var(--primary); }


/* FINAL OVERRIDES: no background color on hover/dragover */
.crt-drop:hover,
.upload-area:hover,
.crt-drop.dragover,
.upload-area.dragover,
.crt-drop:focus-within{
  background: transparent !important;
}
