/* ewt style - e-WT Cloud モック準拠 */

body[data-style="ewt"] {
  font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  line-height: 1.7;
  background-color: #F5F5F8;

  /* DaisyUI v5 カラー上書き */
  --color-primary: oklch(40% 0.22 264);       /* #0637C0 */
  --color-primary-content: oklch(100% 0 0);
  --color-accent: oklch(66% 0.1 184);          /* #26a69a */
  --color-accent-content: oklch(100% 0 0);
  --color-neutral: #2c3e50;
  --color-neutral-content: oklch(95% 0 0);
  --color-base-100: oklch(100% 0 0);           /* #FFFFFF */
  --color-base-200: oklch(97% 0.004 270);      /* #F5F5F8 */
  --color-base-300: oklch(86% 0.007 255);      /* #D2D6DE */
  --color-base-content: oklch(17% 0.007 255);  /* #222426 */
  --color-secondary: oklch(44% 0.006 255);      /* #5e6166 */
  --color-secondary-content: oklch(100% 0 0);
  --color-error: oklch(56% 0.22 25);           /* #E74C3C */
  --color-error-content: oklch(100% 0 0);

  /* 警報カラー */
  --color-alarm-notification-bg: #FFF3E0;
  --color-alarm-notification: #d35400;
  --color-alarm-error-bg: #FDECEA;
  --color-alarm-error: #C62828;
}

/* コードフォント */
body[data-style="ewt"] code,
body[data-style="ewt"] kbd,
body[data-style="ewt"] pre {
  font-family: 'SF Mono', Consolas, monospace;
}

/* ページレイアウト */
body[data-style="ewt"] {
  gap: 0;
}

body[data-style="ewt"] nav.breadcrumbs {
  background-color: var(--color-base-100);
  border-bottom: 1px solid #D2D6DE;
  min-height: 52px;
  display: flex;
  align-items: center;
  max-width: none;
  margin: 0;
  padding: 0 1.25rem;
}

body[data-style="ewt"] .page-subheader {
  background-color: var(--color-base-100);
  border-bottom: 1px solid #D2D6DE;
  min-height: 52px;
  display: flex;
  align-items: center;
  padding: 0 1.25rem;
  margin: 0 -1.25rem;
  border-radius: 0;
}

/* page-subheader が常に存在するため padding-top は常に 0 */
body[data-style="ewt"] main {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  padding-top: 0;
}

/* ナビゲーション */
body[data-style="ewt"] .navbar {
  background-color: var(--color-neutral);
  color: var(--color-neutral-content);
  height: 52px;
}

body[data-style="ewt"] .navbar .navbar-home-link:hover,
body[data-style="ewt"] .navbar .menu li > a:hover,
body[data-style="ewt"] .navbar .menu li > button:hover {
  background-color: #415162;
}

body[data-style="ewt"] .navbar .menu li > a.navbar-user-pill:hover { background-color: #5a6a78; }

body[data-style="ewt"] .navbar .menu li > a.menu-active {
  background-color: #1a252f;
  border-bottom: 3px solid #26a69a;
}

body[data-style="ewt"] .navbar .navbar-dark-toggle        { background-color: #4c5a68; outline: none; }
body[data-style="ewt"] .navbar .navbar-dark-toggle:hover  { background-color: #5a6a78; color: var(--color-neutral-content); }
body[data-style="ewt"] .navbar .navbar-user-pill          { background-color: #4c5a68; }

/* テーブル */
body[data-style="ewt"] .table thead th {
  background-color: var(--color-neutral);
  color: var(--color-neutral-content);
  font-size: var(--text-sm);
}

/* 警報行: 未復旧（警報） */
body[data-style="ewt"] .table .alarm-row-notification td { background-color: var(--color-alarm-notification-bg); color: var(--color-alarm-notification); font-weight: 700; }

/* 警報行: 未復旧（異常） */
body[data-style="ewt"] .table .alarm-row-error td { background-color: var(--color-alarm-error-bg); color: var(--color-alarm-error); font-weight: 700; }

/* 区分バッジ */
body[data-style="ewt"] .alarm-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: var(--text-xs);
  font-weight: 500;
}
body[data-style="ewt"] .alarm-badge-notification { background-color: var(--color-alarm-notification-bg); color: var(--color-alarm-notification); }
body[data-style="ewt"] .alarm-badge-error        { background-color: var(--color-alarm-error-bg); color: var(--color-alarm-error); }

/* ダッシュボード: 稼働ステータスカラー・フォントサイズ */
body[data-style="ewt"] {
  --color-status-running:             #2ecc71;
  --color-status-stopped:             #95a5a6;
  --color-status-abnormally-stopped:  #e67e22;
  --color-status-emergency-stopped:   #e74c3c;
  --color-status-communication-error: #8e44ad;
  --color-text-muted:                 #5E6166;
  --color-hover-bg:                   #f8f9fa;

  --font-size-status-badge:  13px; /* status-badge: xs(12px) と sm(14px) の中間 */
  --font-size-factory-name:  15px; /* factory-name: sm(14px) と base(16px) の中間 */
  --font-size-panel-arrow:   22px; /* customer-panel の開閉矢印 */
}

/* サマリーバー */
body[data-style="ewt"] .summary-item { display: flex; align-items: center; gap: 8px; padding: 6px 12px; }
body[data-style="ewt"] .summary-dot { width: 14px; height: 14px; border-radius: 3px; flex-shrink: 0; }
body[data-style="ewt"] .summary-label { font-size: var(--text-xs); font-weight: 500; }
body[data-style="ewt"] .summary-count { font-size: var(--text-sm); font-weight: 500; }
body[data-style="ewt"] .summary-item-running              .summary-dot { background-color: var(--color-status-running); }
body[data-style="ewt"] .summary-item-stopped              .summary-dot { background-color: var(--color-status-stopped); }
body[data-style="ewt"] .summary-item-abnormally-stopped   .summary-dot { background-color: var(--color-status-abnormally-stopped); }
body[data-style="ewt"] .summary-item-emergency-stopped    .summary-dot { background-color: var(--color-status-emergency-stopped); }
body[data-style="ewt"] .summary-item-communication-error  .summary-dot { background-color: var(--color-status-communication-error); }

/* すべて閉じる/開くボタン */
body[data-style="ewt"] .toggle-all-btn {
  font-size: var(--text-xs);
  padding: 5px 14px;
  border: 1px solid #D2D6DE;
  border-radius: 4px;
  background-color: var(--color-base-100);
  color: var(--color-text-muted);
  cursor: pointer;
  transition: all 0.15s;
}
body[data-style="ewt"] .toggle-all-btn:hover { background-color: var(--color-hover-bg); color: var(--color-base-content); }

/* 顧客パネル */
body[data-style="ewt"] .customer-panel {
  border: 1px solid #D2D6DE;
  border-left-width: 10px;
  border-radius: 0;
  background-color: var(--color-base-100);
  overflow: hidden;
}
body[data-style="ewt"] .customer-panel-running              { border-left-color: var(--color-status-running); }
body[data-style="ewt"] .customer-panel-stopped              { border-left-color: var(--color-status-stopped); }
body[data-style="ewt"] .customer-panel-abnormally-stopped   { border-left-color: var(--color-status-abnormally-stopped); }
body[data-style="ewt"] .customer-panel-emergency-stopped    { border-left-color: var(--color-status-emergency-stopped); }
body[data-style="ewt"] .customer-panel-communication-error  { border-left-color: var(--color-status-communication-error); }

body[data-style="ewt"] .customer-panel-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  cursor: pointer;
}
body[data-style="ewt"] .customer-panel-header:hover { background-color: var(--color-hover-bg); }
body[data-style="ewt"] .customer-panel-header::-webkit-details-marker { display: none; }
body[data-style="ewt"] .customer-panel-header::before {
  content: "▾";
  font-size: var(--font-size-panel-arrow);
  color: #6b7280;
  width: 22px;
  text-align: center;
  flex-shrink: 0;
  line-height: 1;
  transition: transform 0.25s ease;
}
body[data-style="ewt"] details:not([open]) .customer-panel-header::before { transform: rotate(-90deg); }
body[data-style="ewt"] .customer-name { font-size: var(--text-base); font-weight: 500; }
body[data-style="ewt"] .customer-badges { display: flex; gap: 14px; margin-left: auto; flex-shrink: 0; }
body[data-style="ewt"] .status-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: var(--font-size-status-badge);
}
body[data-style="ewt"] .status-badge-dot {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  flex-shrink: 0;
}
body[data-style="ewt"] .status-badge-running              .status-badge-dot { background-color: var(--color-status-running); }
body[data-style="ewt"] .status-badge-stopped              .status-badge-dot { background-color: var(--color-status-stopped); }
body[data-style="ewt"] .status-badge-abnormally-stopped   .status-badge-dot { background-color: var(--color-status-abnormally-stopped); }
body[data-style="ewt"] .status-badge-emergency-stopped    .status-badge-dot { background-color: var(--color-status-emergency-stopped); }
body[data-style="ewt"] .status-badge-communication-error  .status-badge-dot { background-color: var(--color-status-communication-error); }

/* 工場行 */
body[data-style="ewt"] .factory-row {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 10px 20px 10px 54px;
  background-image: linear-gradient(to right, #D2D6DE 5px, transparent 5px);
  background-size: 10px 1px;
  background-repeat: repeat-x;
  background-position: top;
}
body[data-style="ewt"] .factory-info { flex: 0 0 220px; min-width: 0; }
body[data-style="ewt"] .factory-name { font-size: var(--font-size-factory-name); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body[data-style="ewt"] .factory-addr { font-size: var(--text-xs); color: var(--color-text-muted); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 系列ボタン */
body[data-style="ewt"] .system-buttons { display: flex; flex-wrap: wrap; gap: 0.5rem; }
body[data-style="ewt"] .system-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: var(--text-sm);
  font-weight: 500;
  text-decoration: none;
  transition: opacity 0.15s;
}
body[data-style="ewt"] .system-btn:hover { opacity: 0.85; }
body[data-style="ewt"] .system-btn .s-chip { width: 14px; height: 14px; border-radius: 3px; flex-shrink: 0; }
body[data-style="ewt"] .system-btn-running              .s-chip { background-color: var(--color-status-running); }
body[data-style="ewt"] .system-btn-stopped              .s-chip { background-color: var(--color-status-stopped); }
body[data-style="ewt"] .system-btn-abnormally-stopped   .s-chip { background-color: var(--color-status-abnormally-stopped); }
body[data-style="ewt"] .system-btn-emergency-stopped    .s-chip { background-color: var(--color-status-emergency-stopped); }
body[data-style="ewt"] .system-btn-communication-error  .s-chip { background-color: var(--color-status-communication-error); }
body[data-style="ewt"] .system-btn .s-arrow { flex-shrink: 0; transition: transform 0.15s; }
body[data-style="ewt"] .system-btn:hover .s-arrow { transform: translateX(3px); }
body[data-style="ewt"] .system-btn-running {
  background-color: rgba(46, 204, 113, 0.06);
  color: #1a7a42;
  border: 1px solid var(--color-status-running);
}
body[data-style="ewt"] .system-btn-stopped {
  background-color: rgba(149, 165, 166, 0.05);
  color: #546e7a;
  border: 1px solid var(--color-status-stopped);
}
body[data-style="ewt"] .system-btn-abnormally-stopped {
  background-color: var(--color-status-abnormally-stopped);
  color: white;
  border: 1px solid var(--color-status-abnormally-stopped);
}
body[data-style="ewt"] .system-btn-emergency-stopped {
  background-color: var(--color-status-emergency-stopped);
  color: white;
  border: 1px solid var(--color-status-emergency-stopped);
}
body[data-style="ewt"] .system-btn-communication-error {
  background-color: var(--color-status-communication-error);
  color: white;
  border: 1px solid var(--color-status-communication-error);
}

/* プレースホルダー色 */
body[data-style="ewt"] .input input::placeholder {
  color: oklch(17% 0.007 255 / 0.25);
}

/* システムサブナビ */
body[data-style="ewt"] .subnav-tab {
  font-size: var(--text-sm);
  padding: 4px 12px;
  border-radius: 4px;
  color: var(--color-text-muted);
  text-decoration: none;
  transition: all 0.15s;
}
body[data-style="ewt"] .subnav-tab:hover { background-color: var(--color-hover-bg); color: var(--color-base-content); }
body[data-style="ewt"] .subnav-tab-active {
  background-color: var(--color-primary);
  color: var(--color-primary-content);
}
body[data-style="ewt"] .subnav-tab-active:hover { background-color: var(--color-primary); opacity: 0.9; }

/* ダークモード */
body[data-style="ewt"][data-theme="dark"] {
  --color-base-100: oklch(22% 0.008 255);
  --color-base-200: oklch(18% 0.007 255);
  --color-base-300: oklch(28% 0.008 255);
  --color-base-content: oklch(88% 0.004 255);
}