/* 体験デモ専用 — 1080p埋め込み向けにコンパクト化 */

.demo-readonly-note {
  margin: 0.35rem 0 0;
  padding: 0.3rem 0.45rem;
  font-size: 0.68rem;
  line-height: 1.3;
  color: #64748b;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

.system-status-bar--compact {
  min-height: 22px !important;
  padding: 0.15rem 0.6rem !important;
  font-size: 0.68rem !important;
}

.system-status-bar--compact .status-bar-links {
  display: none !important;
}

html.demo-embed .app-header--compact {
  padding: 0.28rem 0.7rem !important;
}

html.demo-embed .app-status {
  font-size: 0.75rem !important;
}

/*
 * 埋め込み向け: 横並び維持 + 全体を密度高く（1080pで収まりやすく）
 */
html.demo-embed,
html.demo-embed body,
html.demo-embed #app {
  width: 100%;
  max-width: none;
}

html.demo-embed .shell {
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  padding: 4px !important;
  min-width: 0;
  align-items: stretch !important;
  gap: 0;
}

html.demo-embed .dashboard-panel-container {
  width: var(--sidebar-panel-width, 280px) !important;
  max-width: min(300px, 30%) !important;
  flex: 0 0 auto !important;
  max-height: none !important;
  min-width: 220px;
  align-self: stretch !important;
}

html.demo-embed .shell.sidebar-collapsed .dashboard-panel-container {
  width: 0 !important;
  max-width: 0 !important;
  min-width: 0 !important;
}

html.demo-embed .shell-splitter {
  display: block !important;
  flex: 0 0 8px !important;
  width: 8px !important;
  margin: 0 2px !important;
}

html.demo-embed .side-panel.sidebar {
  max-height: none !important;
  height: 100% !important;
}

html.demo-embed .map-wrap {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  align-self: stretch !important;
}

html.demo-embed .sidebar-content {
  gap: 0.45rem !important;
  padding: 0.35rem !important;
}

html.demo-embed .panel.hero {
  padding: 0.55rem 0.65rem !important;
}

html.demo-embed .sidebar-title {
  font-size: 0.95rem !important;
  line-height: 1.3 !important;
}

html.demo-embed .subtext,
html.demo-embed .panel-hint {
  font-size: 0.72rem !important;
  line-height: 1.35 !important;
}

html.demo-embed .stats-panel {
  padding: 0.45rem 0.55rem !important;
}

html.demo-embed .stats .stat .label {
  font-size: 0.65rem !important;
}

html.demo-embed .stats .stat .value {
  font-size: 0.9rem !important;
}

html.demo-embed .stats-breakdown,
html.demo-embed .stats-settings-note {
  font-size: 0.68rem !important;
}

html.demo-embed .map-controls {
  font-size: 0.7rem !important;
  padding: 0.35rem 0.45rem !important;
}

@media (max-width: 1080px) {
  html.demo-embed .shell {
    flex-direction: row !important;
  }

  html.demo-embed .dashboard-panel-container {
    width: var(--sidebar-panel-width, 280px) !important;
    max-width: min(300px, 30%) !important;
    flex: 0 0 auto !important;
    max-height: none !important;
  }

  html.demo-embed .shell-splitter {
    display: block !important;
  }

  html.demo-embed .side-panel.sidebar {
    max-height: none !important;
  }
}

/*
 * 農地コントロールパネル
 * - 縦は中身に合わせる（旧 480px 固定を完全解除）
 * - box-shadow は白背景の __inner にだけ付ける
 *   （外側に付けると高さ残骸＋透明領域に影が伸びて見える）
 * - 一覧は thead + 約3行
 */
.farm-control-panel {
  width: 300px !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  bottom: 18px !important;
  right: 10px !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.farm-control-panel__inner {
  flex: 0 0 auto !important;
  height: auto !important;
  min-height: 0 !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.22) !important;
  overflow: hidden !important;
}

.farm-control-panel__header {
  padding: 5px 8px !important;
}

.farm-control-panel__title {
  font-size: 11px !important;
}

.farm-control-panel__close {
  width: 22px !important;
  height: 22px !important;
  font-size: 14px !important;
}

.integrated-mode-toolbar {
  padding: 4px 8px !important;
  gap: 3px !important;
}

.integrated-mode-toolbar-label {
  font-size: 9px !important;
}

.panel-mode-btn {
  padding: 3px 6px !important;
  font-size: 10px !important;
}

.farm-control-panel__content {
  flex: 0 0 auto !important;
  overflow: visible !important;
  padding: 6px 8px !important;
  min-height: 0 !important;
  font-size: 11px !important;
}

.farm-control-panel__content--plot {
  padding: 6px 8px !important;
}

.farm-control-panel .integrated-danchi-records {
  flex: 0 0 auto !important;
  overflow: visible !important;
}

.farm-control-panel .danchi-records-title {
  font-size: 12px !important;
  line-height: 1.25 !important;
}

.farm-control-panel .integrated-danchi-title-row {
  margin: 0 0 4px !important;
}

.farm-control-panel .danchi-records-summary {
  margin-bottom: 2px !important;
  padding: 4px 7px !important;
  font-size: 10px !important;
}

.farm-control-panel .danchi-table-container {
  /* thead 1行 + tbody 約3行（超過はスクロール） */
  --danchi-row-h: 24px;
  flex: none !important;
  height: calc(var(--danchi-row-h) * 4) !important;
  max-height: calc(var(--danchi-row-h) * 4) !important;
  min-height: calc(var(--danchi-row-h) * 4) !important;
  overflow-y: auto !important;
  overflow-x: auto !important;
}

.farm-control-panel .danchi-records-table {
  font-size: 10px !important;
}

.farm-control-panel .danchi-records-table th,
.farm-control-panel .danchi-records-table td {
  padding: 4px 4px !important;
}

.farm-control-panel .danchi-records-empty-msg-inner {
  padding: 8px 6px !important;
  font-size: 10px !important;
}

.farm-control-panel .fude-main-info-heading {
  font-size: 10px !important;
  margin-bottom: 2px !important;
}

.farm-control-panel .feature-info-grid {
  gap: 1px 4px !important;
}

.farm-control-panel .feature-info-label,
.farm-control-panel .feature-info-value {
  font-size: 10px !important;
}

.farm-control-panel .fude-adjust-section-title {
  font-size: 10px !important;
  margin-bottom: 4px !important;
}

.farm-control-panel .feature-action-btn {
  padding: 4px 8px !important;
  font-size: 10px !important;
}

.farm-control-panel .integrated-fude-panel-inner,
.farm-control-panel .integrated-fude-scroll {
  flex: 0 0 auto !important;
  overflow: visible !important;
  max-height: none !important;
}