/* ── ArcPrice TOOL STYLES ── */
.form-section { margin-bottom: 28px; }
.form-section-title { font-size: 13px; font-weight: 700; color: var(--charcoal); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 14px; padding-bottom: 8px; border-bottom: 1px solid var(--gray-100); display: flex; align-items: center; justify-content: space-between; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
@media (max-width:600px) { .form-grid,.form-grid-3 { grid-template-columns: 1fr; } }

/* Mobile table optimizations */
@media (max-width: 768px) {
  .labor-table, .odc-bom-table, .arcprice-table {
    font-size: 12px;
  }
  
  .labor-table th, .labor-table td,
  .odc-bom-table th, .odc-bom-table td {
    padding: 4px 3px;
  }
  
  .labor-table th:first-child,
  .odc-bom-table th:first-child {
    min-width: 120px;
  }
  
  .labor-table th:nth-child(2),
  .odc-bom-table th:nth-child(2) {
    min-width: 100px;
  }
  
  .labor-table input, .labor-table textarea, .labor-table select,
  .odc-bom-table input, .odc-bom-table textarea, .odc-bom-table select {
    font-size: 14px;
    padding: 6px 7px;
    min-height: 32px;
  }
  
  .labor-table textarea, .odc-bom-table textarea {
    min-height: 38px;
  }
  
  /* Button optimizations for mobile */
  .btn, .labor-add-btn, .odc-add-btn {
    min-height: 44px;
    font-size: 14px;
    padding: 10px 16px;
  }
  
  .ai-analyze-btn {
    padding: 12px 20px;
    font-size: 15px;
  }
  
  /* Cost summary mobile styling */
  .cost-summary-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    text-align: left;
  }
  
  .cost-summary-amount {
    font-size: 24px;
  }
  
  .cost-summary-details {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  
  /* Timeline steps mobile optimization */
  .steps-timeline-inner {
    padding: 0 16px;
  }
  
  .step-item {
    min-height: 44px;
  }
  
  /* Form inputs mobile optimization */
  .form-field input, .form-field select, .form-field textarea {
    font-size: 16px; /* Prevents iOS zoom */
    min-height: 44px;
    padding: 12px 14px;
  }
  
  .scope-textarea {
    min-height: 120px;
  }
  
  /* Modal and overlay optimizations */
  .ai-overlay {
    margin: 20px;
    max-width: calc(100vw - 40px);
  }
  
  /* Navigation mobile improvements */
  #pane-1, #pane-2 {
    padding: 0 16px;
    max-width: 100%;
  }
  
  /* Hero section mobile */
  .tool-hero {
    padding: 40px 0 20px;
  }
  
  .tool-hero h1 {
    font-size: 28px;
  }
  
  .tool-hero p {
    font-size: 16px;
  }
  
  .tool-hero-meta {
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
  }
  
  .tool-meta-dot {
    display: none;
  }
  
  /* Modal mobile optimizations */
  .modal-box {
    width: 95vw;
    max-width: 350px;
    padding: 24px 20px;
    margin: 20px;
  }
  
  .modal-title {
    font-size: 18px;
  }
  
  .modal-body {
    font-size: 13px;
  }
  
  .modal-input {
    font-size: 16px; /* Prevent iOS zoom */
    padding: 14px 16px;
  }
}
.form-field label { display: block; font-size: 12px; font-weight: 600; color: var(--gray-500); margin-bottom: 5px; }
.form-field input, .form-field select, .form-field textarea { width: 100%; font-family: var(--font-body); font-size: 14px; color: var(--ink); border: 1.5px solid var(--gray-300); border-radius: var(--radius-md); padding: 9px 12px; background: var(--white); transition: border-color .15s; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { outline: none; border-color: var(--red); }
.form-field input[type="number"] { -moz-appearance: textfield; }
.labor-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.labor-table th { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); padding: 6px 8px; text-align: left; border-bottom: 1px solid var(--gray-200); }
.labor-table td { padding: 5px 5px; vertical-align: top; }
.labor-table td input, .labor-table td textarea, .labor-table td select { width: 100%; box-sizing: border-box; font-family: var(--font-body); font-size: 13px; color: var(--ink); border: 1.5px solid var(--gray-200); border-radius: var(--radius-sm); padding: 7px 9px; background: var(--white); transition: border-color .15s; }
.labor-table td input:focus, .labor-table td textarea:focus, .labor-table td select:focus { outline: none; border-color: var(--red); }
.labor-table td select { cursor: pointer; }
.labor-add-btn { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--red); background: var(--red-light); border: 1px solid #ffd0d0; border-radius: var(--radius-sm); padding: 7px 14px; cursor: pointer; margin-top: 10px; }
.labor-add-btn:hover { background: #ffe0e0; }
.labor-del { background: none; border: none; cursor: pointer; color: var(--gray-300); font-size: 18px; line-height: 1; padding: 2px 4px; }
.labor-del:hover { color: var(--red); }
.odc-table-wrap { overflow-x: auto; margin: 0 -5px; }
.odc-bom-table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 800px; }
@media (max-width: 768px) {
  .odc-table-wrap {
    margin: 0 -16px;
    padding: 0 16px;
  }
}
.odc-bom-table th { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); padding: 6px 8px; text-align: left; border-bottom: 1px solid var(--gray-200); }
.odc-bom-table td { padding: 5px 5px; vertical-align: top; }
.odc-bom-table td input, .odc-bom-table td textarea, .odc-bom-table td select { width: 100%; font-family: var(--font-body); font-size: 13px; color: var(--ink); border: 1.5px solid var(--gray-200); border-radius: var(--radius-sm); padding: 7px 9px; background: var(--white); transition: border-color .15s; box-sizing: border-box; }
.odc-bom-table td input:focus, .odc-bom-table td textarea:focus, .odc-bom-table td select:focus { outline: none; border-color: var(--red); }
.odc-unit { cursor: pointer; }
.odc-unit:hover { border-color: var(--red); background: var(--red-light); }
.odc-bom-table td select, .labor-table td select { cursor: pointer; padding-right: 26px; }
/* Wrapping description fields — auto-grow textareas styled like the inputs */
.labor-table td textarea, .odc-bom-table td textarea { display: block; resize: none; overflow: hidden; line-height: 1.45; min-height: 36px; }
.odc-bom-table .odc-ext { font-weight: 600; color: var(--gray-700); padding-right: 6px; white-space: nowrap; }
.odc-add-btn { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--red); background: var(--red-light); border: 1px solid #ffd0d0; border-radius: var(--radius-sm); padding: 6px 12px; cursor: pointer; margin-top: 8px; }
.odc-add-btn:hover { background: #ffe0e0; }
.odc-year-total { font-size: 13px; font-weight: 600; color: var(--gray-700); margin-top: 8px; text-align: right; }
.odc-year-total span { color: var(--primary, var(--red)); }

/* Cost summary section - clean style like labor table */
.cost-summary-section { 
  margin: 24px 0; 
}
.cost-summary-header { 
  display: flex; 
  justify-content: space-between; 
  align-items: center; 
  margin-bottom: 8px; 
  padding-bottom: 8px; 
  border-bottom: 1px solid var(--gray-200); 
}
.cost-summary-title { 
  font-size: 13px; 
  font-weight: 700; 
  color: var(--charcoal); 
  text-transform: uppercase; 
  letter-spacing: .05em; 
}
.cost-summary-amount { 
  font-size: 18px; 
  font-weight: 700; 
  color: var(--red); 
}
.cost-summary-details { 
  display: flex; 
  justify-content: space-between; 
  font-size: 13px; 
  color: var(--gray-600); 
}
.loc-option { padding: 8px 12px; font-size: 13px; cursor: pointer; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.loc-option:hover, .loc-option.active { background: var(--red-light); color: var(--red); }
.scope-textarea { 
  width: 100%; 
  min-height: 130px; 
  resize: vertical; 
  font-family: var(--font-body); 
  font-size: 14px; 
  color: var(--ink); 
  border: 1.5px solid var(--gray-300); 
  border-radius: var(--radius-md); 
  padding: 10px 14px; 
  background: var(--white); 
  transition: border-color .15s; 
  line-height: 1.55;
  position: relative;
}

/* Initial highlight for empty textarea */
.scope-textarea.highlight-empty:placeholder-shown {
  border-color: var(--red);
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}

/* Initial highlight for sample prompt container */
.arcprice-card.highlight-initial {
  border-color: var(--red);
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.08);
  background: rgba(220, 38, 38, 0.02);
}

/* Highlight for textarea with content (after sample load) */
.scope-textarea.highlight-editable {
  border-color: var(--red);
  box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.08);
}

.scope-textarea:focus { outline: none; border-color: var(--red); }

/* Mobile auto-resize for textarea */
@media (max-width: 768px) {
  .scope-textarea {
    min-height: 80px;
    font-size: 16px; /* Prevents iOS zoom */
    resize: none; /* Disable manual resize on mobile, use auto-height */
    overflow: hidden; /* Prevent scrollbar while auto-sizing */
  }
}

.ai-analyze-btn { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--white); background: var(--red); border: none; border-radius: var(--radius-md); padding: 11px 22px; cursor: pointer; transition: all .15s; }
.ai-analyze-btn:hover:not(:disabled) { filter: brightness(.88); }
.ai-analyze-btn:disabled { opacity: .5; cursor: default; }
/* Analyzed state - white button */
.ai-analyze-btn.analyzed { background: var(--white); color: var(--gray-600); border: 1.5px solid var(--gray-300); }
.ai-analyze-btn.analyzed:hover:not(:disabled) { background: var(--gray-50); filter: none; }
/* First-visit attention pulse — removed on first click */
@keyframes aiPulse { 0% { box-shadow: 0 0 0 0 rgba(220,38,38,.40); } 70% { box-shadow: 0 0 0 12px rgba(220,38,38,0); } 100% { box-shadow: 0 0 0 0 rgba(220,38,38,0); } }
/* Brief flash confirming a sample populated the scope field (no scroll needed) */
.scope-flash { animation: scopeFlash 1s ease-out; }
@keyframes scopeFlash { 0% { border-color: var(--red); box-shadow: 0 0 0 3px rgba(220,38,38,.18); } 100% { border-color: var(--gray-300); box-shadow: 0 0 0 0 rgba(220,38,38,0); } }
/* Flash animation for step 3 after AI analysis completes */
.step-flash { animation: stepFlash 2s ease-out; }
@keyframes stepFlash { 
  0%, 20% { background-color: var(--red); color: var(--white); box-shadow: 0 0 0 0 rgba(220,38,38,.6); } 
  10% { box-shadow: 0 0 0 8px rgba(220,38,38,.3); }
  100% { background-color: transparent; color: var(--gray-700); box-shadow: 0 0 0 0 rgba(220,38,38,0); } 
}
.ai-analyze-btn.pulse { animation: aiPulse 2.2s ease-out infinite; background: var(--red); color: var(--white); border: none; }
.start-here-chip { display: inline-block; vertical-align: 2px; margin-left: 10px; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #16a34a; background: #dcfce7; border: 1px solid rgba(22,163,74,.30); border-radius: 99px; padding: 3px 10px; }
.ai-inline-status { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--gray-500); }
.ai-inline-spinner { width: 15px; height: 15px; border: 2px solid var(--gray-200); border-top-color: var(--charcoal); border-radius: 50%; animation: spin .7s linear infinite; flex-shrink: 0; }
.ai-success-check { color: #16a34a; font-weight: 600; }
/* Animated loading ellipsis — append <span class="dots"></span> after status text */
.dots::after { content: ''; display: inline-block; width: 1.1em; text-align: left; animation: dotsAnim 1.4s steps(1, end) infinite; }
@keyframes dotsAnim { 0% { content: ''; } 25% { content: '.'; } 50% { content: '..'; } 75% { content: '...'; } 100% { content: ''; } }
.assumptions-panel { background: #f0fdf4; border: 1px solid #86efac; border-radius: var(--radius-md); padding: 14px 18px; margin-top: 14px; }
.assumptions-title { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: #065f46; margin-bottom: 8px; }
.assumptions-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 5px; }
.assumptions-list li { font-size: 13px; color: #166534; padding-left: 14px; position: relative; line-height: 1.45; }
.assumptions-list li::before { content: '•'; position: absolute; left: 0; }
.assumptions-note { font-size: 12px; color: #15803d; margin-top: 10px; padding-top: 9px; border-top: 1px solid #bbf7d0; line-height: 1.5; }
.assumptions-note strong { font-weight: 700; }
.labor-empty-hint { font-size: 13px; color: var(--gray-400); padding: 18px 0 6px; text-align: center; }
.tool-hero { background: var(--gray-50); border-bottom: 1px solid var(--gray-300); padding: clamp(48px,7vw,80px) var(--gutter) clamp(40px,5vw,64px); }
.tool-hero-inner { max-width: 860px; margin-inline: auto; }
.tool-hero-meta { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 20px; }
.tool-meta-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--gray-500); }
.tool-meta-badge svg { flex-shrink: 0; }
.tool-meta-dot { width: 3px; height: 3px; border-radius: 50%; background: var(--gray-300); }

.tool-wrap { max-width: 1280px; margin-inline: auto; padding: clamp(32px,5vw,56px) var(--gutter) clamp(48px,6vw,80px); }
/* Keep the input form at a comfortable reading width; let the OUTPUT (wide
   year-column tables, CLIN schedule) use the full 1280px to avoid horizontal
   scrolling inside the table wrappers. */
#pane-1, #pane-2 { max-width: 980px; margin-inline: auto; }

/* Progress Timeline/Steps Navigation */
.steps-timeline {
  background: var(--white);
  border-bottom: 1px solid var(--gray-200);
  padding: 20px 0;
  position: sticky;
  top: 73px;
  z-index: 100;
}
.steps-timeline-inner {
  max-width: 980px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.steps-list {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.step-item {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  position: relative;
}
.step-number {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--gray-100);
  border: 2px solid var(--gray-300);
  color: var(--gray-500);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
  transition: all .2s;
  cursor: pointer;
}
.step-item.clickable .step-number:hover {
  background: var(--gray-200);
  border-color: var(--gray-400);
  color: var(--gray-600) !important;
}
.step-item.clickable .step-text:hover {
  color: var(--gray-600);
}
.step-text {
  font-size: 13px;
  color: var(--gray-500);
  font-weight: 500;
  line-height: 1.3;
  transition: color .2s;
}
.step-item:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 28px;
  right: -4px;
  height: 2px;
  background: var(--gray-200);
  top: 13px;
  z-index: -1;
}
.step-item.active .step-number {
  background: var(--red, #dc2626);
  border-color: var(--red, #dc2626);
  color: var(--white, #ffffff) !important;
}
.step-item.active .step-text {
  color: var(--charcoal);
  font-weight: 600;
}
.step-item.completed .step-number {
  background: var(--red, #dc2626);
  border-color: var(--red, #dc2626);
  color: var(--white, #ffffff) !important;
  font-weight: 500;
}
.step-item.completed::after {
  background: var(--gray-400);
}
@media (max-width: 768px) {
  .steps-timeline {
    padding: 12px 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .steps-timeline-inner {
    padding: 0;
    min-width: fit-content;
  }
  .steps-list {
    gap: 8px;
    padding: 0 16px;
    min-width: 500px;
  }
  .step-item {
    gap: 6px;
  }
  .step-number {
    width: 26px;
    height: 26px;
    font-size: 12px;
  }
  .step-text {
    font-size: 11px;
    white-space: nowrap;
  }
  .step-item::after {
    left: 26px;
    right: -4px;
  }
}
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}

/* Progress bar */

/* Cards */
.arcprice-card { background: var(--white); border: 1px solid var(--gray-300); border-radius: var(--radius-lg); padding: clamp(24px,4vw,40px); margin-bottom: 24px; }
.arcprice-card-title { font-size: 16px; font-weight: 700; color: var(--charcoal); margin-bottom: 4px; }
.arcprice-card-sub   { font-size: 14px; color: var(--gray-500); margin-bottom: 24px; line-height: 1.5; }


.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.chip { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 500; color: var(--gray-500); background: var(--gray-50); border: 1px solid var(--gray-300); border-radius: 20px; padding: 5px 12px; cursor: pointer; transition: all .15s; }
.chip:hover { border-color: var(--red); color: var(--red); background: var(--red-light); }
.chip.active { border-color: var(--red); color: #fff; background: var(--red); font-weight: 600; }
.chip.active:hover { color: #fff; background: var(--red); }
.chip-label { font-size: 10px; font-weight: 700; color: var(--gray-500); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 6px; }

/* Loading */
.arcprice-loading { text-align: center; padding: 48px 24px; min-height: 200px; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.arcprice-spinner { width: 40px; height: 40px; border: 3px solid var(--gray-100); border-top-color: var(--red); border-radius: 50%; animation: spin .7s linear infinite; margin: 0 auto 16px; }
@keyframes spin { to { transform: rotate(360deg); } }
.arcprice-loading-status { font-size: 14px; color: var(--gray-500); min-height: 20px; max-width: 400px; }

/* Clarify form */
.clarify-field { margin-bottom: 20px; }
.clarify-field label { display: block; font-size: 13px; font-weight: 600; color: var(--charcoal); margin-bottom: 6px; }
.clarify-field input, .clarify-field select, .clarify-field textarea { width: 100%; font-family: var(--font-body); font-size: 14px; color: var(--ink); border: 1.5px solid var(--gray-300); border-radius: var(--radius-md); padding: 10px 14px; background: var(--white); transition: border-color .15s; }
.clarify-field input:focus, .clarify-field select:focus, .clarify-field textarea:focus { outline: none; border-color: var(--red); }
.clarify-field textarea { min-height: 80px; resize: vertical; }

/* ArcPrice Output */
.arcprice-controls { display: flex; align-items: flex-start; gap: 28px; flex-wrap: wrap; margin-bottom: 28px; padding: 16px 20px; background: var(--gray-50); border: 1px solid var(--gray-300); border-radius: var(--radius-md); }
.arcprice-control-group { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; }
.arcprice-control-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); white-space: nowrap; }
.rate-tabs { display: flex; border: 1px solid var(--gray-300); border-radius: var(--radius-sm); overflow: hidden; }
.rate-tab { font-size: 12px; font-weight: 600; padding: 6px 12px; cursor: pointer; background: var(--white); color: var(--gray-500); border: none; transition: all .15s; }
.rate-tab.active { background: var(--red); color: var(--white); }
.arcprice-num-input { width: 64px; font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--ink); border: 1px solid var(--gray-300); border-radius: var(--radius-sm); padding: 5px 8px; text-align: center; }
.arcprice-num-input:focus { outline: none; border-color: var(--red); }

.arcprice-header-card { background: var(--charcoal); color: var(--white); border-radius: var(--radius-lg); padding: clamp(24px,4vw,36px); margin-bottom: 20px; }
.arcprice-header-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px,1fr)); gap: 20px; margin-top: 20px; }
.arcprice-header-item { }
.arcprice-header-item-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.5); margin-bottom: 4px; }
.arcprice-header-item-value { font-size: 15px; font-weight: 600; color: var(--white); }
.arcprice-total-value { font-family: var(--font-display); font-size: clamp(28px,4vw,42px); color: var(--white); margin-top: 4px; }
.arcprice-section-title { font-size: 14px; font-weight: 700; color: var(--charcoal); margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.live-badge { font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 10px; background: #d1fae5; color: #065f46; }
.est-badge  { font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 10px; background: #fef3c7; color: #92400e; }
.user-badge { font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 10px; background: #dbeafe; color: #1e40af; }
[data-tip] { cursor: help; }
.boe-method { border-top: 1px solid var(--gray-200); }
.boe-row { display: grid; grid-template-columns: 158px 1fr; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--gray-100); font-size: 13.5px; line-height: 1.6; }
.boe-row:last-child { border-bottom: none; }
.boe-k { font-weight: 700; color: var(--charcoal); }
.boe-v { color: var(--gray-700); }
@media (max-width: 560px) { .boe-row { grid-template-columns: 1fr; gap: 3px; } }
.ai-think { font-size: 12.5px; color: var(--gray-400); font-style: italic; margin-top: 10px; height: 36px; line-height: 18px; opacity: 0; transition: opacity .25s; overflow: hidden; }
/* Generate button before there's anything to estimate — muted, not red.
   Still clickable so the explanatory notice can say what's missing. */
.btn.btn-primary.btn-inactive { background: var(--gray-300); border-color: var(--gray-300); color: #fff; box-shadow: none; }
.btn.btn-primary.btn-inactive:hover { background: var(--gray-400); border-color: var(--gray-400); transform: none; box-shadow: none; }
/* "Source live market prices" before any ODC/material line exists — grey, not blue.
   Still clickable so the explanatory notice can say what's missing. */
#odc-price-btn.odc-price-inactive { color: var(--gray-500) !important; background: var(--gray-100) !important; border-color: var(--gray-200) !important; }
#odc-price-btn.odc-price-inactive:hover { background: var(--gray-200) !important; }
#bx-tooltip { position: fixed; z-index: 9999; max-width: 300px; background: #111318; color: #fff; font-family: var(--font-body); font-size: 12px; font-weight: 400; line-height: 1.55; letter-spacing: 0; text-transform: none; padding: 9px 12px; border-radius: 7px; box-shadow: 0 6px 24px rgba(0,0,0,.28); pointer-events: none; opacity: 0; transition: opacity .12s; }

/* Tables */
.arcprice-table-wrap { overflow-x: auto; margin-bottom: 20px; }
.arcprice-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.arcprice-table th { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); padding: 6px 8px; text-align: right; border-bottom: 1px solid var(--gray-200); white-space: nowrap; }
.arcprice-table th:first-child { text-align: left; }
.arcprice-table td { padding: 5px 5px; text-align: right; color: var(--ink); vertical-align: top; }
.arcprice-table td:first-child { text-align: left; font-weight: 500; }
.arcprice-table tr:last-child td { border-bottom: none; }
.arcprice-table .subtotal td { background: var(--gray-50); font-weight: 700; border-top: 1px solid var(--gray-300); }
.arcprice-table .grand-total td { background: var(--charcoal); color: var(--white); font-weight: 700; font-size: 14px; }
.arcprice-table .summary-fee td { background: var(--red-light); }
/* Comparable awards table — stacked cells, description gets the room */
.arcprice-table.comparable td { vertical-align: top; }
.arcprice-table.comparable td:nth-child(2) { text-align: left; min-width: 260px; }
.arcprice-table.comparable th:nth-child(2) { text-align: left; }
.rate-cell { display: flex; align-items: center; gap: 6px; justify-content: flex-end; }
.rate-pill { font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 6px; white-space: nowrap; }
.rate-control-group { width: 240px; }
.rate-pct-value { font-size: 13px; font-weight: 700; color: var(--charcoal); line-height: 1.3; min-height: 17px; }
.rate-slider-col { display:flex; flex-direction:column; gap:2px; }
.rate-slider-col input[type=range] { width:160px; accent-color:var(--red); cursor:pointer; margin:0; }
.rate-slider-ticks { display:flex; justify-content:space-between; width:160px; font-size:10px; color:var(--gray-500); line-height:1; padding:0 1px; }

/* Benchmark cards */

/* Export bar */
.export-bar { display: flex; gap: 10px; flex-wrap: wrap; padding-top: 20px; border-top: 1px solid var(--gray-300); margin-top: 8px; }

/* CLIN Schedule */
.clin-period-label { font-size: 13px; font-weight: 700; color: var(--charcoal); background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius-sm); padding: 6px 12px; margin: 16px 0 6px; display: inline-block; }
.clin-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.clin-table th { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-500); padding: 7px 10px; text-align: left; border-bottom: 2px solid var(--gray-200); background: var(--gray-50); }
.clin-table td { padding: 6px 10px; border-bottom: 1px solid var(--gray-100); vertical-align: middle; }
.clin-parent-row td { background: #fafafa; font-weight: 600; border-top: 2px solid var(--gray-200); }
.clin-slin-row td { color: var(--gray-700); }
.clin-slin-row:last-of-type td { border-bottom: 1px solid var(--gray-200); }
.clin-subtotal-row td { color: var(--gray-600); font-size: 12px; border-top: 1px solid var(--gray-200); }
.clin-total-row td { font-weight: 700; font-size: 13px; border-top: 2px solid var(--gray-300); background: #f0f4ff; }
.clin-type-pill { display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: .04em; border-radius: 4px; padding: 2px 7px; }
.clin-type-pill.tm  { background: #dbeafe; color: #1e40af; }
.clin-type-pill.ffp { background: #dcfce7; color: #166534; }
.clin-type-pill.cr  { background: #fef9c3; color: #854d0e; }
.clin-type-pill.cpff{ background: #ede9fe; color: #5b21b6; }
.clin-note { font-size: 11px; font-weight: 400; color: var(--gray-400); margin-left: 6px; }
.clin-stats { display: flex; gap: 20px; flex-wrap: wrap; margin-bottom: 20px; padding: 14px 18px; background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius-md); }
.clin-stat-val { font-size: 22px; font-weight: 700; color: var(--charcoal); line-height: 1.1; }
.clin-stat-lbl { font-size: 11px; color: var(--gray-500); text-transform: uppercase; letter-spacing: .06em; margin-top: 2px; }
.clin-ceiling { margin-left: auto; text-align: right; }
.clin-ceiling .clin-stat-val { color: var(--red); }
.btn-clin { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: #1e40af; background: #dbeafe; border: 1px solid #bfdbfe; border-radius: var(--radius-sm); padding: 9px 16px; cursor: pointer; transition: all .15s; }
.btn-clin:hover { background: #bfdbfe; }
@media print { #clin-schedule-container { page-break-before: always; } }

/* "Do more with this estimate" — inline teaser cards co-located with where
   CLIN Schedule / Comparable Awards render, so the features are discoverable. */
.next-steps-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 640px) { .next-steps-grid { grid-template-columns: 1fr; } }

/* Additional mobile optimizations for smaller screens */
@media (max-width: 480px) {
  /* Ultra-compact tables for small phones */
  .labor-table, .odc-bom-table {
    font-size: 11px;
  }
  
  .labor-table th, .labor-table td,
  .odc-bom-table th, .odc-bom-table td {
    padding: 3px 2px;
  }
  
  .labor-table th:first-child,
  .odc-bom-table th:first-child {
    min-width: 100px;
  }
  
  .labor-table th:nth-child(2),
  .odc-bom-table th:nth-child(2) {
    min-width: 80px;
  }
  
  /* Numeric inputs smaller on phones */
  .labor-table input[type="number"],
  .odc-bom-table input[type="number"] {
    font-size: 14px;
    width: 50px;
    min-width: 50px;
  }
  
  /* Rate input optimization */
  .labor-rate {
    width: 60px !important;
    font-size: 12px !important;
  }
  
  /* Hero section very compact */
  .tool-hero {
    padding: 20px 0 10px;
  }
  
  .tool-hero h1 {
    font-size: 24px;
    margin-bottom: 8px;
  }
  
  .tool-hero p {
    font-size: 14px;
  }
  
  /* Step timeline even more compact */
  .steps-timeline-inner {
    padding: 0 8px;
  }
  
  .step-item {
    padding: 8px 12px;
  }
  
  .step-number {
    width: 24px;
    height: 24px;
    font-size: 12px;
  }
  
  /* Form sections tighter spacing */
  .form-section {
    margin-bottom: 20px;
  }
  
  .form-section-title {
    font-size: 12px;
    margin-bottom: 10px;
  }
  
  /* Buttons full width on small screens */
  .ai-analyze-btn,
  .btn.btn-primary {
    width: 100%;
    justify-content: center;
  }
  
  .labor-add-btn,
  .odc-add-btn {
    width: 100%;
    justify-content: center;
    margin-top: 12px;
  }
  
  /* Cost summary ultra-mobile */
  .cost-summary-amount {
    font-size: 20px;
  }
  
  .cost-summary-details {
    font-size: 12px;
  }
}
.next-step-card { display: flex; gap: 13px; align-items: flex-start; text-align: left; width: 100%; background: var(--white); border: 1.5px solid var(--gray-200); border-radius: var(--radius-md); padding: 16px 18px; cursor: pointer; font-family: var(--font-body); transition: border-color .15s, box-shadow .15s, transform .15s; }
.next-step-card:hover { border-color: var(--red); box-shadow: 0 6px 18px rgba(0,0,0,.07); transform: translateY(-2px); }
.next-step-icon { width: 40px; height: 40px; border-radius: 9px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.next-step-title { font-size: 14.5px; font-weight: 700; color: var(--charcoal); }
.next-step-desc { font-size: 12.5px; color: var(--gray-500); line-height: 1.5; margin-top: 2px; }
.next-step-link { display: inline-block; margin-top: 8px; font-size: 12.5px; font-weight: 700; color: var(--red); }
.next-step-card:hover .next-step-link { text-decoration: underline; }
@media print { #next-steps-panel { display: none; } }

/* UNIFIED MODAL SYSTEM */
/* Base modal backdrop - used for all modals */
.modal-backdrop, #ai-overlay { 
  position: fixed; 
  inset: 0; 
  background: rgba(17,19,24,.6); 
  backdrop-filter: blur(4px); 
  z-index: 600; 
  display: none; 
  align-items: center; 
  justify-content: center; 
  padding: 20px; 
  opacity: 0; 
  transition: opacity .25s; 
}
.modal-backdrop.visible, #ai-overlay.visible { opacity: 1; display: flex; }

/* Unified modal box - auto-sizing for content */
.modal-box, .ai-overlay-box { 
  background: var(--white); 
  border: 1px solid var(--gray-200);
  border-radius: 12px; 
  box-shadow: 0 12px 40px rgba(0,0,0,.14); 
  width: 420px; 
  max-width: calc(100vw - 40px);
  max-height: calc(100vh - 40px);
  padding: 32px;
  box-sizing: border-box;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform: translateY(20px); 
  transition: transform .25s;
}
.modal-backdrop.visible .modal-box, #ai-overlay.visible .ai-overlay-box { transform: translateY(0); }

/* AI overlay specific styles */
#ai-overlay .ai-overlay-box {
  text-align: center;
  justify-content: center;
  height: 300px; /* Keep AI overlay fixed height */
}

/* Standard modal content layout */
.modal-box {
  text-align: left;
}

/* Modal content wrapper with scrolling if needed */
.modal-content {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
}
.modal-icon { width: 48px; height: 48px; background: var(--red-light); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 16px; flex-shrink: 0; }
.modal-title { font-family: var(--font-display); font-size: 20px; color: var(--charcoal); margin-bottom: 6px; line-height: 1.2; flex-shrink: 0; }
.modal-body  { font-size: 14px; color: var(--gray-500); line-height: 1.5; margin-bottom: 16px; overflow-wrap: break-word; }
.modal-actions { margin-top: auto; flex-shrink: 0; }
.modal-input { width: 100%; font-family: var(--font-body); font-size: 15px; border: 1.5px solid var(--gray-300); border-radius: var(--radius-md); padding: 12px 16px; margin-bottom: 12px; }
.modal-input:focus { outline: none; border-color: var(--red); }
.modal-error { font-size: 13px; color: var(--red); margin-top: 8px; display: none; }
.modal-backdrop label:has(input[name="arcprice-format"]:checked) { border-color: var(--red) !important; }
.modal-backdrop label:has(input[name="arcprice-format"]:not(:checked)) { border-color: var(--gray-200) !important; }

/* Utilities */
[hidden] { display: none !important; }
.data-note { font-size: 12px; color: var(--gray-500); background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius-sm); padding: 10px 14px; margin-bottom: 16px; display: flex; align-items: flex-start; gap: 8px; }

@media print {
  .nav, .tool-hero, .arcprice-controls, .export-bar, footer, .modal-backdrop { display: none !important; }
  .arcprice-card { box-shadow: none; border: 1px solid #ddd; page-break-inside: avoid; }
  body { font-size: 12px; }
  .arcprice-header-card { background: #fff !important; border: 2px solid #222 !important; border-radius: 6px; }
  .arcprice-header-card * { color: #111 !important; }
  .arcprice-total-value { font-size: 32px !important; }
  .arcprice-header-item-label { color: #555 !important; }
}