/* ============================================================
   Villa Plumbing Field Portal — Bid Tracker Workspace (Preview + Routing)
   Build marker: Bid Tracker Workspace May 11

   Adds:
     1. Bid Preview / Bid Package workspace — an in-shell preview
        of a bid record with enlarge, download, print, and route
        actions. Renders inside the Bid Tracker shell so it never
        opens behind the overlay.
     2. "Open new bid" toast banner styling for the newly-created
        bid open flow.
     3. Subtle highlight ring for the newly-created bid card.

   Layered on top of bid_tracker.css + planhub_bids_improvements.css +
   bid_tracker_button_repair.css. Reuses existing palette.
   ============================================================ */

/* ---------- Bid Preview workspace ---------- */
.btw-preview{
  display:flex;flex-direction:column;gap:14px;
  background:#fff;border:1px solid #d8e8e5;border-radius:14px;
  padding:18px 20px;margin-top:8px;color:#1A1916;
}
.btw-preview-head{
  display:flex;flex-wrap:wrap;justify-content:space-between;
  align-items:flex-start;gap:10px;border-bottom:1px solid #eef4f3;padding-bottom:10px;
}
.btw-preview-title{margin:0;font-family:'Barlow Condensed',sans-serif;font-size:22px;color:#141310;letter-spacing:.4px}
.btw-preview-sub{font-size:12px;color:#4a6b65;margin-top:3px;line-height:1.5}
.btw-preview-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.btw-preview-actions button{
  appearance:none;border:1px solid #FFD4B0;background:#f5fbfa;color:#1A1916;
  font-weight:600;font-size:12px;border-radius:999px;
  padding:8px 12px;min-height:36px;cursor:pointer;line-height:1.2;
}
.btw-preview-actions button:hover{background:#eef4f3}
.btw-preview-actions button.primary{background:#141310;color:#fff;border-color:#141310}
.btw-preview-actions button.primary:hover{background:#1A1916}
.btw-preview-actions button.ghost{background:transparent;border-color:#d8e8e5;color:#4a6b65}

/* Grid of summary cards (package style) */
.btw-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.btw-cell{
  background:#f5fbfa;border:1px solid #d8e8e5;border-radius:10px;padding:10px 12px;
}
.btw-cell h6{
  margin:0 0 6px;font-family:'Barlow Condensed',sans-serif;font-size:12px;
  letter-spacing:.4px;color:#141310;text-transform:uppercase;font-weight:700;
}
.btw-cell .v{font-size:13px;color:#1A1916;line-height:1.5;word-break:break-word}
.btw-cell .v.muted{color:#4a6b65;font-style:italic}

.btw-section{margin-top:6px}
.btw-section h5{
  margin:0 0 6px;font-family:'Barlow Condensed',sans-serif;
  font-size:14px;color:#141310;letter-spacing:.4px;text-transform:uppercase;
}
.btw-section ul{margin:0;padding-left:18px;font-size:13px;color:#1A1916;line-height:1.55}
.btw-section ul li{margin-bottom:2px}
.btw-section .body-text{font-size:13px;color:#1A1916;line-height:1.55;white-space:pre-wrap}
.btw-section .muted{color:#4a6b65;font-style:italic;font-size:12px}

/* Status pill alias for the preview head */
.btw-status{
  display:inline-block;font-size:11px;font-weight:700;letter-spacing:.4px;
  padding:3px 8px;border-radius:999px;background:#eef4f3;color:#141310;
  text-transform:uppercase;border:1px solid #d8e8e5;
}

/* ---------- Enlarge / full-screen preview mode ---------- */
.btw-enlarge-overlay{
  position:fixed;inset:0;z-index:7200;background:rgba(20,19,16,.86);
  display:flex;align-items:stretch;justify-content:center;padding:0;
  overflow:auto;
}
.btw-enlarge-shell{
  background:#fff;width:100%;max-width:none;border-radius:0;
  display:flex;flex-direction:column;
}
.btw-enlarge-bar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:10px 16px;background:#141310;color:#fff;
}
.btw-enlarge-bar h4{margin:0;font-family:'Barlow Condensed',sans-serif;font-size:18px;letter-spacing:.4px}
.btw-enlarge-bar .btw-enlarge-actions{display:flex;gap:6px;flex-wrap:wrap}
.btw-enlarge-bar button{
  appearance:none;border:1px solid rgba(255,255,255,.4);background:transparent;color:#fff;
  font-weight:600;font-size:12px;border-radius:999px;padding:6px 12px;min-height:36px;cursor:pointer;
}
.btw-enlarge-bar button.primary{background:#fff;color:#141310;border-color:#fff}
.btw-enlarge-bar button:hover{filter:brightness(1.1)}
.btw-enlarge-body{padding:24px;overflow:auto;flex:1}

/* Print-friendly: when html has class for printing, hide everything else */
@media print{
  body.btw-printing > *{display:none !important}
  body.btw-printing .btw-print-host{display:block !important;padding:0 !important;margin:0 !important}
  body.btw-printing .btw-print-host *{visibility:visible}
  .btw-no-print{display:none !important}
}
.btw-print-host{display:none}

/* ---------- Newly-created bid open flow ---------- */
.btw-new-banner{
  margin-top:10px;background:#eaf7f3;border:1px solid #b8e2d4;border-radius:12px;
  padding:10px 14px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:8px;color:#141310;font-size:13px;
}
.btw-new-banner b{font-weight:700}
.btw-new-banner-actions{display:flex;gap:6px;flex-wrap:wrap}
.btw-new-banner-actions button{
  appearance:none;border:1px solid #141310;background:#141310;color:#fff;
  font-weight:600;font-size:12px;border-radius:999px;padding:6px 12px;min-height:36px;cursor:pointer;
}
.btw-new-banner-actions button.ghost{background:#fff;color:#141310}

/* Highlight the newly created card briefly */
.pbid-card[data-btw-new="1"]{
  outline:2px solid #FF6B00;outline-offset:2px;
  box-shadow:0 0 0 4px rgba(255,107,0,.18);
  animation:btw-pulse 1.6s ease-out 1;
}
@keyframes btw-pulse{
  0%{box-shadow:0 0 0 0 rgba(255,107,0,.4)}
  100%{box-shadow:0 0 0 8px rgba(255,107,0,0)}
}

/* Mobile tweaks */
@media (max-width: 720px){
  .btw-preview{padding:14px}
  .btw-preview-head{flex-direction:column;align-items:stretch}
  .btw-preview-actions{justify-content:flex-start}
  .btw-preview-actions button{min-height:40px;font-size:13px}
  .btw-grid{grid-template-columns:1fr}
  .btw-enlarge-bar{flex-wrap:wrap;padding:10px}
  .btw-enlarge-bar h4{font-size:16px;flex:1 1 100%}
  .btw-enlarge-body{padding:14px}
  .btw-new-banner{align-items:flex-start;flex-direction:column}
  .btw-new-banner-actions button{min-height:40px}
}