/* ═══════════════════════════════════════════════════════════════
   GP Assurances – Phase 1: Insurer Data Center styles
   Design-system-aligned (FR/ZH bilingual, data-table)
   ═══════════════════════════════════════════════════════════════ */

/* ── Page shell ────────────────────────────────────────────── */
.idc-page h1 {
  font-size: 1.5rem;
  font-weight: 600;
  margin: 0 0 4px;
  color: var(--gp-brand, #0B63F6);
}
.idc-page .idc-subtitle {
  font-size: 0.875rem;
  color: var(--gp-muted, #64748B);
  margin: 0 0 20px;
}

/* ── Tab panels ────────────────────────────────────────────── */
.idc-panel { display: none; }
.idc-panel.active { display: block; }

/* ── Status badges ─────────────────────────────────────────── */
.idc-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 500;
}
.idc-badge.active { background: #e8f5e9; color: #2e7d32; }
.idc-badge.not_configured { background: #f5f5f5; color: #999; }
.idc-badge.pending { background: #fff3e0; color: #e65100; }
.idc-badge.completed { background: #e8f5e9; color: #2e7d32; }
.idc-badge.error { background: #ffebee; color: #c62828; }
.idc-badge.warning { background: #fff8e1; color: #f57f17; }
.idc-badge.info { background: #e3f2fd; color: #1565c0; }

/* ── Sync button hidden/disabled variants ──────────────────── */
.idc-sync-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.idc-sync-btn.boss-only-btn { display: none; }
body.boss .idc-sync-btn.boss-only-btn,
body.role-boss .idc-sync-btn.boss-only-btn,
body.is-boss .idc-sync-btn.boss-only-btn { display: inline-flex; align-items: center; }

.idc-sync-result {
  font-size: 0.8rem;
  padding: 6px 12px;
  border-radius: var(--gp-radius-sm, 8px);
  display: none;
}
.idc-sync-result.info { background: #e3f2fd; color: #1565c0; display: inline-block; }
.idc-sync-result.warn { background: #fff3e0; color: #e65100; display: inline-block; }

/* ── Connection settings dialog extras ─────────────────────── */
.idc-dialog-head button {
  background: none; border: none; font-size: 1.3rem; cursor: pointer;
  color: var(--gp-muted, #64748B); padding: 4px 8px; border-radius: 4px;
}
.idc-dialog-head button:hover { background: var(--gp-bg2, #F8FAFD); }

.idc-dialog-body .form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 16px;
}
.idc-dialog-body .form-grid label {
  font-size: 0.8rem;
  color: var(--gp-muted, #64748B);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.idc-dialog-body .form-grid input,
.idc-dialog-body .form-grid select,
.idc-dialog-body .form-grid textarea {
  padding: 8px 10px;
  border: 1px solid var(--gp-border3, #E2E8F0);
  border-radius: var(--gp-radius-sm, 8px);
  font-size: 0.85rem;
  font-family: inherit;
  min-height: 36px;
  box-sizing: border-box;
}
.idc-dialog-body .form-grid textarea { resize: vertical; min-height: 60px; }
.idc-dialog-body .form-grid .full { grid-column: 1 / -1; }

.idc-dialog-actions button.danger {
  background: var(--gp-white, #FFFFFF);
  color: #c62828;
  border-color: #c62828;
}
.idc-dialog-actions button.danger:hover { background: #ffebee; }

.idc-connection-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px solid var(--gp-border, #E8ECF2);
}
.idc-connection-row:last-child { border-bottom: none; }
.idc-connection-info { flex: 1; }
.idc-connection-info strong { color: var(--gp-text2, #1E293B); }
.idc-connection-info span {
  font-size: 0.8rem;
  color: var(--gp-muted, #64748B);
  margin-left: 8px;
}
.idc-connection-actions { display: flex; gap: 6px; }

/* ── Contract data tab area ─────────────────────────────────── */
.idc-contract-panels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
@media (max-width: 800px) { .idc-contract-panels { grid-template-columns: 1fr; } }

/* ── Empty state sub-elements ────────────────────────────────── */
.idc-empty .idc-empty-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--gp-muted, #64748B);
  margin-bottom: 4px;
}
.idc-empty .idc-empty-desc {
  font-size: 0.85rem;
  color: var(--gp-muted, #64748B);
}

.idc-table-shell tbody tr:hover { background: var(--gp-bg2, #F8FAFD); }

/* ═══════════════════════════════════════════════════════════════
   2026 unified customer-page visual system
   ═══════════════════════════════════════════════════════════════ */
.idc-page {
  box-sizing: border-box;
  height: 100%;
  padding: 18px 20px 22px;
  overflow: auto;
  background: var(--gp-bg, #F5F7FB);
  color: var(--gp-text2, #1E293B);
}
.idc-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px;
  min-height: unset;
  margin: 0 0 12px;
  padding: 4px 8px;
  border: 1px solid var(--gp-border, #E8ECF2);
  border-radius: var(--gp-radius, 12px);
  background: var(--gp-white, #FFFFFF);
  box-shadow: 0 3px 12px rgba(28, 55, 90, .04);
}
.idc-tabs .idc-tab {
  box-sizing: border-box;
  min-height: 36px;
  margin: 0;
  padding: 5px 12px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--gp-muted, #64748B);
  font-size: var(--gp-fs-body, 12px);
  font-weight: 500;
  cursor: pointer;
  background: none;
  white-space: nowrap;
}
.idc-tabs .idc-tab:hover { color: var(--gp-brand, #0B63F6); background: var(--gp-bg2, #F8FAFD); }
.idc-tabs .idc-tab.active {
  color: var(--gp-brand, #0B63F6);
  background: var(--gp-brand-bg, #EEF4FF);
  border-color: var(--gp-brand, #0B63F6);
  font-weight: 600;
}
.idc-kpi-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}
.idc-kpi {
  min-height: 82px;
  box-sizing: border-box;
  padding: 12px 16px;
  border: 1px solid var(--gp-border, #E8ECF2);
  border-radius: var(--gp-radius, 12px);
  background: var(--gp-white, #FFFFFF);
  box-shadow: 0 3px 12px rgba(28, 55, 90, .04);
}
.idc-kpi .idc-kpi-label {
  color: var(--gp-muted, #64748B);
  font-size: var(--gp-fs-body, 12px);
  font-weight: 500;
  letter-spacing: .04em;
}
.idc-kpi .idc-kpi-value {
  margin-top: 4px;
  color: var(--gp-brand, #0B63F6);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
}
.idc-kpi .idc-kpi-sub { color: var(--gp-muted, #64748B); font-size: 10px; margin-top: 2px; }
.idc-sync-bar {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  min-height: 40px;
  margin: 0 0 10px;
  padding: 6px 12px;
  border: 1px solid var(--gp-border, #E8ECF2);
  border-radius: var(--gp-radius, 12px);
  background: var(--gp-white, #FFFFFF);
}
.idc-sync-btn,
.idc-dialog-actions button {
  box-sizing: border-box;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--gp-border3, #E2E8F0);
  border-radius: var(--gp-radius-sm, 8px);
  background: var(--gp-white, #FFFFFF);
  color: var(--gp-text2, #1E293B);
  font-weight: 500;
  font-size: var(--gp-fs-body, 12px);
  cursor: pointer;
}
.idc-connection-actions button {
  box-sizing: border-box;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--gp-border3, #E2E8F0);
  border-radius: var(--gp-radius-sm, 8px);
  background: var(--gp-white, #FFFFFF);
  color: var(--gp-text2, #1E293B);
  font-weight: 500;
  font-size: var(--gp-fs-body, 12px);
  cursor: pointer;
}
.idc-sync-btn:hover,
.idc-connection-actions button:hover {
  border-color: var(--gp-brand, #0B63F6);
  background: var(--gp-brand-bg, #EEF4FF);
  color: var(--gp-brand, #0B63F6);
}
.idc-table-shell {
  border: 1px solid var(--gp-border, #E8ECF2);
  border-radius: var(--gp-radius, 12px);
  background: var(--gp-white, #FFFFFF);
  box-shadow: 0 3px 12px rgba(28, 55, 90, .04);
  overflow-x: auto;
}
.idc-table-shell table {
  width: 100%;
  min-width: 760px;
  table-layout: fixed;
  border-collapse: collapse;
}
.idc-table-shell thead th {
  height: 36px;
  padding: 0 10px;
  background: var(--gp-bg2, #F8FAFD);
  border-bottom: 1px solid var(--gp-border, #E8ECF2);
  color: var(--gp-muted, #64748B);
  font-size: var(--gp-fs-th, 11px);
  font-weight: 500;
  text-align: left;
  white-space: nowrap;
}
.idc-table-shell tbody td {
  height: 42px;
  padding: 6px 10px;
  border-bottom: 1px solid #F1F5F9;
  color: var(--gp-text2, #1E293B);
}
.idc-empty {
  min-height: 140px;
  box-sizing: border-box;
  padding: 32px 20px;
  color: var(--gp-muted, #64748B);
  text-align: center;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.idc-empty .idc-empty-icon {
  width: 36px;
  height: 36px;
  margin: 0 auto 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--gp-radius-sm, 8px);
  background: var(--gp-brand-bg, #EEF4FF);
  color: var(--gp-brand, #0B63F6);
  font-size: 18px;
}

/* Legacy reconciliation panel uses the same centered, full-card empty state. */
#docSummaryPanel {
  min-height: 240px;
}
#docSummaryCards {
  min-height: 210px;
  width: 100%;
}
#docSummaryCards .doc-summary-empty {
  min-height: 210px;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: var(--gp-muted, #64748B);
  text-align: center;
}
#docSummaryCards .doc-summary-empty-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: var(--gp-radius-sm, 8px);
  background: var(--gp-brand-bg, #EEF4FF);
  color: var(--gp-brand, #0B63F6);
  font-size: 18px;
}
#docSummaryCards .doc-summary-empty p {
  margin: 0;
  font-size: var(--gp-fs-body, 12px);
  font-weight: 400;
}
#docSummaryCards .doc-summary-empty .idc-sync-btn {
  margin-top: 2px;
}
.idc-dialog-overlay {
  position: fixed; inset: 0;
  background: rgba(15,23,42,.34);
  backdrop-filter: blur(2px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}
.idc-dialog {
  display: flex;
  flex-direction: column;
  width: min(760px, calc(100vw - 40px));
  height: min(660px, calc(100vh - 48px));
  overflow: hidden;
  border: 1px solid var(--gp-border, #E8ECF2);
  border-radius: var(--gp-radius, 12px);
  background: var(--gp-white, #FFFFFF);
  box-shadow: 0 24px 70px rgba(15,23,42,.2);
}
.idc-dialog-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 62px;
  box-sizing: border-box;
  padding: 0 20px;
  border-bottom: 1px solid var(--gp-border, #E8ECF2);
}
.idc-dialog-head h2 { margin: 0; color: var(--gp-text2, #1E293B); font-size: 17px; }
.idc-dialog-body { flex: 1; min-height: 0; overflow: auto; padding: 18px 20px; }
.idc-dialog-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  min-height: 62px;
  box-sizing: border-box;
  align-items: center;
  padding: 10px 20px;
  border-top: 1px solid var(--gp-border, #E8ECF2);
}
.idc-dialog-actions button.primary { background: var(--gp-brand, #0B63F6); border-color: var(--gp-brand, #0B63F6); color: var(--gp-white, #FFFFFF); }
@media (max-width: 900px) { .idc-kpi-row { grid-template-columns: repeat(2, minmax(150px, 1fr)); } }

.idc-contract-panel {
  background: var(--gp-white, #FFFFFF);
  border: 1px solid var(--gp-border, #E8ECF2);
  border-radius: var(--gp-radius, 12px);
  padding: 16px;
}
.idc-contract-panel h3 {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--gp-brand, #0B63F6);
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid #F1F5F9;
}

/* ── Page-level not-configured banner ──────────────────────── */
.idc-notice {
  background: #fff3e0;
  border: 1px solid #ffcc80;
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 16px;
  font-size: 0.85rem;
  color: #e65100;
}