/* Shared visual contract for technical record workspaces. */
.app-header,
body > header.app-header{
  min-height:72px;
  padding:12px 24px;
  border-bottom:1px solid #dce3ec;
  background:#fff;
  box-shadow:0 8px 24px rgba(15,23,42,.04);
}

html,
body{
  max-width:100%;
  overflow-x:hidden;
}

.workspace,
.app-shell,
.preview-wrap,
.document{
  box-sizing:border-box;
  max-width:100%;
}

.app-header img{
  max-width:142px;
  max-height:44px;
  object-fit:contain;
}

.app-header h1{
  margin:2px 0 0;
  color:#172033;
  font-size:1.12rem;
  font-weight:700;
  letter-spacing:0;
}

.app-header p,
.app-header small{
  margin:0;
  color:#667085;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.app-header a,
.back-home{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:8px 14px;
  border:1px solid #b9c8db;
  border-radius:8px;
  background:#fff;
  color:#163f73;
  font-size:.84rem;
  font-weight:700;
  text-decoration:none;
}

.tabs{
  gap:6px;
  padding:6px;
  border:1px solid #dce3ec;
  border-radius:12px;
  background:#fff;
}

.tab{
  min-height:38px;
  border-radius:8px;
  font-weight:700;
}

.panel{
  border:1px solid #dce3ec;
  border-radius:12px;
  background:#fff;
  box-shadow:0 10px 28px rgba(15,23,42,.045);
}

.step-actions,
.final-actions,
.import-actions,
.actions,
.section-head{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
}

.step-actions,
.final-actions,
.import-actions,
.actions{
  justify-content:flex-end;
  max-width:100%;
  overflow:hidden;
}

.step-actions > span,
.actions > div{
  margin-right:auto;
}

.step-actions button,
.final-actions button,
.import-actions button,
.import-actions .file-button,
.actions button,
.section-head button{
  min-height:40px;
  min-width:132px;
  padding:9px 14px;
  border-radius:8px;
  font-size:.84rem;
  font-weight:700;
  line-height:1.15;
  white-space:normal;
  min-width:0;
}

.final-actions .danger,
.actions .danger{
  margin-left:4px;
}

.record-tools,
.gas-history-panel,
.history-card,
.import-panel,
.test-card,
.point-card{
  border:1px solid #dce3ec;
  border-radius:12px;
  background:#fff;
  box-shadow:0 8px 22px rgba(15,23,42,.035);
}

.photo-item,
.file-name,
.upload{
  border-radius:10px;
}

@media(max-width:720px){
  .app-header,
  body > header.app-header{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    padding:12px 14px;
  }

  .app-header img{
    max-width:120px;
  }

  .app-header a,
  .back-home,
  .step-actions button,
  .final-actions button,
  .import-actions button,
  .import-actions .file-button,
  .actions button,
  .section-head button{
    width:100%;
  }

  .tabs{
    display:flex;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .tab{
    flex:0 0 auto;
    min-width:max-content;
  }

  .step-actions,
  .final-actions,
  .import-actions,
  .actions,
  .section-head{
    display:grid;
    grid-template-columns:1fr;
  }

  .step-actions > span,
  .actions > div{
    margin-right:0;
  }
}

/* Internal record cards: make rooms, points and assays feel like one system. */
.batch-room.room-card,
.point-card,
.test-card,
.test-block{
  border:1px solid #dce3ec!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:0 8px 22px rgba(15,23,42,.035)!important;
}

.batch-room.room-card,
.point-card{
  overflow:hidden!important;
}

.room-card-header,
.point-head,
.card-head,
.section-head{
  min-height:56px!important;
  padding:14px 16px!important;
  border-bottom:1px solid #dce3ec!important;
  background:#f8fafc!important;
}

.point-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto auto!important;
  align-items:center!important;
  gap:12px!important;
}

.point-title-block,
.room-card-title{
  min-width:0!important;
}

.point-title-block span,
.room-card-title span,
.section-head .eyebrow,
.card-head p{
  color:#667085!important;
}

.point-title-block strong,
.room-card-title strong,
.card-head h3,
.section-head h2,
.test-block h3{
  color:#172033!important;
  font-weight:750!important;
  letter-spacing:0!important;
}

.point-status-badge,
.room-state-badge,
.completion-state{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:28px!important;
  padding:5px 10px!important;
  border:1px solid #dce3ec!important;
  border-radius:999px!important;
  background:#f2f4f7!important;
  color:#475467!important;
  font-size:.72rem!important;
  font-weight:750!important;
  white-space:nowrap!important;
}

.point-card.is-complete .point-status-badge,
.room-card.is-complete .room-state-badge,
.completion-state.complete{
  border-color:#b7e4c7!important;
  background:#ecfdf3!important;
  color:#087443!important;
}

.point-card.is-progress .point-status-badge,
.room-card.is-progress .room-state-badge{
  border-color:#bfdbfe!important;
  background:#eff6ff!important;
  color:#1d4ed8!important;
}

.point-card.is-error .point-status-badge,
.room-card.is-error .room-state-badge,
.completion-state.incomplete{
  border-color:#fecaca!important;
  background:#fff1f2!important;
  color:#b42318!important;
}

.room-card-body,
.point-card > .grid,
.test-block{
  padding:16px!important;
}

.test-block{
  margin:0!important;
  border-width:1px 0 0!important;
  border-radius:0!important;
  box-shadow:none!important;
}

.test-block:first-of-type{
  border-top:0!important;
}

.test-block h3{
  margin:0 0 12px!important;
  padding:0 0 8px!important;
  border-bottom:1px solid #e4e7ec!important;
  font-size:1rem!important;
}

.grid,
.compact,
.point-main-grid,
.test-block .grid.compact,
.room-edit-grid,
.planning-grid{
  gap:12px!important;
}

.grid > label,
.compact > label,
.point-main-grid > label,
.test-block .grid.compact > label,
.room-edit-grid > label,
.planning-grid > label{
  min-width:0!important;
}

input,
select,
textarea{
  border-color:#cbd5e1!important;
  border-radius:8px!important;
  background:#fff!important;
}

input:focus,
select:focus,
textarea:focus{
  border-color:#235a9f!important;
  outline:3px solid rgba(35,90,159,.14)!important;
  outline-offset:0!important;
}

.check-line,
.na-toggle,
.occupancy-field,
.instrument-package-note{
  border:1px solid #dce3ec!important;
  border-radius:10px!important;
  background:#fbfdff!important;
}

.file-name,
.gas-result,
output{
  border:1px solid #dce3ec!important;
  border-radius:9px!important;
  background:#f8fafc!important;
  color:#172033!important;
}

.photo-grid{
  gap:12px!important;
}

.photo-item{
  padding:10px!important;
  border:1px solid #dce3ec!important;
  border-radius:10px!important;
  background:#fff!important;
}

.photo-item img{
  border:1px solid #cbd5e1!important;
  border-radius:8px!important;
  background:#f8fafc!important;
}

.remove,
.remove-speed,
.point-head .remove{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:38px!important;
  border:1px solid #f3b4ae!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#b42318!important;
  font-weight:750!important;
}

.batch-room-actions,
.final-actions,
.actions{
  align-items:stretch!important;
  min-width:0!important;
}

.batch-room-actions button,
.final-actions button,
.actions button{
  width:100%!important;
  min-width:0!important;
}

@media(min-width:1024px){
  .point-main-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }

  .test-block .grid.compact{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}

@media(max-width:920px){
  .point-head{
    grid-template-columns:minmax(0,1fr) auto!important;
  }

  .point-head .remove{
    grid-column:1/-1!important;
    width:100%!important;
  }

  .test-block .grid.compact,
  .point-main-grid,
  .room-edit-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:720px){
  .room-card-header,
  .point-head,
  .card-head,
  .section-head{
    display:grid!important;
    grid-template-columns:1fr!important;
    padding:12px!important;
  }

  .room-card-body,
  .point-card > .grid,
  .test-block{
    padding:12px!important;
  }

  .test-block .grid.compact,
  .point-main-grid,
  .room-edit-grid,
  .planning-grid,
  .grid,
  .compact{
    grid-template-columns:1fr!important;
  }
}
