/* SIAPIYA_INTEGRATION_HEALTH_WORKSPACE_UX_V37033
   Integration & Health Workspace UX — Wave 1
   Core, HADIRIYA, Integrasi API. Visual-only. */

#mainContent[data-siapiya-integration-ux="1"]{
  --siapiya-integration-radius:.92rem;
  --siapiya-integration-surface:color-mix(in srgb,var(--bs-tertiary-bg) 70%,var(--bs-body-bg));
  --siapiya-integration-divider:color-mix(in srgb,var(--bs-border-color) 86%,transparent);
  max-width:1280px;
  margin-inline:auto;
  padding-bottom:5.5rem;
}

/* Heading / context */
#mainContent[data-siapiya-integration-ux="1"] :is(h4,h5){
  letter-spacing:-.012em;
}

#mainContent[data-siapiya-integration-ux="1"] > :first-child h4,
#mainContent[data-siapiya-ux-route="core"] .core-workspace > .d-flex:first-child h4{
  line-height:1.25;
  margin-bottom:.28rem!important;
}

#mainContent[data-siapiya-integration-ux="1"] .text-muted{
  line-height:1.4;
}

/* Cards / health surfaces */
#mainContent[data-siapiya-integration-ux="1"] .card{
  border-radius:var(--siapiya-integration-radius);
  border-color:var(--siapiya-integration-divider);
}

#mainContent[data-siapiya-integration-ux="1"] .card.border-0.shadow-sm{
  border:1px solid var(--siapiya-integration-divider)!important;
  box-shadow:0 .4rem 1rem rgba(15,23,42,.055)!important;
}

#mainContent[data-siapiya-integration-ux="1"] :is(#coreHealthCard,#hadiriyaOperationalReportCard,#hadiriyaDistributionCard){
  overflow:hidden;
}

#mainContent[data-siapiya-ux-route="core"] #coreHealthCard{
  border-inline-start:4px solid var(--bs-danger)!important;
}

#mainContent[data-siapiya-ux-route="hadiriya"] :is(#hadiriyaOperationalReportCard,#hadiriyaDistributionCard){
  border-inline-start:4px solid var(--bs-primary)!important;
}

/* Status / alert clarity */
#mainContent[data-siapiya-integration-ux="1"] .alert{
  border-radius:.78rem;
  border-inline-start-width:.28rem;
  padding:.72rem .82rem;
  margin-bottom:.78rem;
}

#mainContent[data-siapiya-integration-ux="1"] .badge{
  line-height:1.2;
  padding:.42rem .58rem;
}

#mainContent[data-siapiya-integration-ux="1"] :is(
  #coreModeBadge,
  #coreConflictBadge,
  #hadiriyaReportRiskBadge,
  #hadiriyaDistributionStatus
){
  min-height:1.9rem;
  display:inline-flex;
  align-items:center;
}

/* Core tabs */
#mainContent[data-siapiya-ux-route="core"] .core-workspace-tabs{
  display:flex;
  gap:.35rem;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-width:none;
  padding:.3rem;
  margin-bottom:.85rem;
  border:1px solid var(--siapiya-integration-divider);
  border-radius:.85rem;
  background:var(--siapiya-integration-surface);
}

#mainContent[data-siapiya-ux-route="core"] .core-workspace-tabs::-webkit-scrollbar{
  display:none;
}

#mainContent[data-siapiya-ux-route="core"] .core-workspace-tab{
  flex:0 0 auto;
  min-height:2.55rem;
  border-radius:.68rem;
}

#mainContent[data-siapiya-ux-route="core"] .core-workspace-tab.active{
  font-weight:700;
}

/* Primary vs secondary integration actions */
#mainContent[data-siapiya-integration-ux="1"] :is(
  [data-siapiya-inspect-action="core-sync-preview"],
  [data-siapiya-core-safe-maintenance-action="safe-reconciliation"],
  [data-siapiya-hadiriya-report-prep-action="generate-report"]
){
  font-weight:700;
  box-shadow:0 .45rem 1rem rgba(15,23,42,.09);
}

#mainContent[data-siapiya-ux-route="core"] .core-action-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}

#mainContent[data-siapiya-ux-route="core"] .core-action-toolbar .btn{
  min-height:2.55rem;
}

/* Related/admin links remain secondary */
#mainContent[data-siapiya-ux-route="core"] .core-related-grid{
  gap:.6rem;
}

#mainContent[data-siapiya-ux-route="core"] .core-related-link{
  border-radius:.78rem;
  min-height:3.6rem;
}

/* Summary / KPI blocks */
#mainContent[data-siapiya-integration-ux="1"] :is(
  #coreSummaryCards,
  #hadiriyaReportSummary
) > [class*="col-"] > :is(.card,.border){
  height:100%;
}

#mainContent[data-siapiya-ux-route="hadiriya"] .row.g-2 > [class*="col-"] > .border.rounded-3{
  border-color:var(--siapiya-integration-divider)!important;
  border-radius:.78rem!important;
  background:var(--siapiya-integration-surface);
}

/* Tables / diagnostics */
#mainContent[data-siapiya-integration-ux="1"] .table-responsive{
  border:1px solid var(--siapiya-integration-divider);
  border-radius:.78rem;
  overflow:auto;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
}

#mainContent[data-siapiya-integration-ux="1"] .table{
  margin-bottom:0;
}

#mainContent[data-siapiya-integration-ux="1"] .table thead th{
  white-space:nowrap;
  font-size:.74rem;
  text-transform:uppercase;
  letter-spacing:.025em;
  color:var(--bs-secondary-color);
  background:var(--siapiya-integration-surface);
}

#mainContent[data-siapiya-integration-ux="1"] .table > :not(caption) > * > *{
  padding:.6rem .62rem;
  border-color:var(--siapiya-integration-divider);
}

/* Forms in integration workspaces */
#mainContent[data-siapiya-integration-ux="1"] .form-label{
  margin-bottom:.3rem;
  font-size:.8rem;
  font-weight:650;
}

#mainContent[data-siapiya-integration-ux="1"] :is(.form-control,.form-select){
  min-height:2.55rem;
  border-radius:.68rem;
}

/* Accordions and advanced config are clearly secondary */
#mainContent[data-siapiya-integration-ux="1"] .accordion{
  border-radius:.82rem;
  overflow:hidden;
}

#mainContent[data-siapiya-integration-ux="1"] .accordion-button{
  min-height:2.85rem;
}

#mainContent[data-siapiya-integration-ux="1"] .accordion-button:not(.collapsed){
  box-shadow:none;
}

/* Generic Integrasi API SPA support */
#mainContent[data-siapiya-ux-route="integrasi_api"] :is(.card,.alert,.table-responsive){
  border-color:var(--siapiya-integration-divider);
}

#mainContent[data-siapiya-ux-route="integrasi_api"] :is(.btn-primary,.btn-success){
  font-weight:700;
}

/* Focus */
#mainContent[data-siapiya-integration-ux="1"] :is(
  button,a,input,select,textarea,summary,[role="tab"],[tabindex]:not([tabindex="-1"])
):focus-visible{
  outline:3px solid color-mix(in srgb,var(--bs-primary) 46%,transparent);
  outline-offset:2px;
}

/* Mobile */
@media (max-width:767.98px){
  #mainContent[data-siapiya-integration-ux="1"]{
    padding-inline:.05rem;
    padding-bottom:calc(5.8rem + env(safe-area-inset-bottom));
  }

  #mainContent[data-siapiya-integration-ux="1"] .card-body{
    padding:.82rem!important;
  }

  #mainContent[data-siapiya-ux-route="core"] .core-workspace-tabs{
    margin-inline:-.05rem;
  }

  #mainContent[data-siapiya-ux-route="core"] .core-workspace-tab{
    min-height:2.75rem;
    padding-inline:.75rem;
  }

  #mainContent[data-siapiya-integration-ux="1"] :is(
    .btn,
    .form-control,
    .form-select,
    .accordion-button
  ){
    min-height:2.75rem;
  }

  #mainContent[data-siapiya-ux-route="core"] .core-action-toolbar{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  #mainContent[data-siapiya-ux-route="core"] .core-action-toolbar .btn-primary{
    grid-column:1 / -1;
  }

  #mainContent[data-siapiya-ux-route="core"] .core-related-grid{
    grid-template-columns:1fr!important;
  }

  #mainContent[data-siapiya-ux-route="hadiriya"] .row.g-2 > .col-6{
    padding-inline:.25rem;
  }

  #mainContent[data-siapiya-integration-ux="1"] .table{
    font-size:.86rem;
  }

  #mainContent[data-siapiya-integration-ux="1"] .table > :not(caption) > * > *{
    padding:.52rem .56rem;
  }
}

@media (max-width:420px){
  #mainContent[data-siapiya-ux-route="core"] .core-action-toolbar{
    grid-template-columns:1fr;
  }

  #mainContent[data-siapiya-ux-route="core"] .core-action-toolbar .btn-primary{
    grid-column:auto;
  }

  #mainContent[data-siapiya-integration-ux="1"] .d-flex.flex-wrap.gap-2 > .btn{
    flex:1 1 100%;
  }
}

@media (prefers-reduced-motion:reduce){
  #mainContent[data-siapiya-integration-ux="1"] *{
    scroll-behavior:auto!important;
  }
}
