/*!
 * theme.css - Flink UNITE カラーテーマ
 * sg-base.cssの後に読み込む
 *
 * ブランドカラー:
 *   ティール #198996（FLinkロゴ・fhweb.jpナビゲーションカラー）
 *   オレンジ #E07A30（「UNITE」ロゴ文字色）
 *   赤      #E8251A（FLinkロゴ赤・警告・削除）
 */

:root {
  /* Flink UNITEブランドカラーでsg-base.cssのCSS変数を上書き */
  --sg-primary:       #198996;
  --sg-primary-hover: #1AA8B9;
  --sg-primary-pale:  #E6F5F6;
  --sg-primary-dark:  #0D4A52;

  /* UNITEアクセント（ロゴオレンジ）*/
  --sg-unite-orange:  #E07A30;

  /* アクセント（ロゴ赤・削除・危険）*/
  --sg-accent:        #E8251A;
  --sg-danger:        #E8251A;
}


/* 注意: .fu-header / .fu-logo / .fu-header-user は
   app.css側で定義されている（白背景・通常テキスト色の新デザイン）。
   以前ここにも別の配色（ティール背景・白文字）で重複定義されていたため、
   app.cssの背景色（白）だけが上書きされ、ボタン文字色（白）が
   theme.css側に取り残されて「白背景に白文字で見えない」状態になっていた。
   theme.cssは本来sg-base.cssのCSS変数を上書きするだけのファイルであり
   （ファイル冒頭のコメント参照）、コンポーネントの再定義はスコープ外のため、
   ここでは削除してapp.cssの定義に一本化する。


/* ============================================================
   管理画面サイドバー
   ============================================================ */
.fu-admin-layout {
  display: flex;
  min-height: calc(100vh - 60px);
}
.fu-sidebar {
  width: 220px;
  background: var(--sg-primary);
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
}
.fu-sidebar-logo {
  font-family: var(--sg-font-serif);
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.08em;
  padding: 18px 18px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.15);
}
.fu-sidebar-logo span { color: var(--sg-unite-orange); }

.fu-sidebar-label {
  font-size: var(--sg-text-xs);
  color: rgba(255,255,255,0.5);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 14px 18px 5px;
}
.fu-nav-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  color: rgba(255,255,255,0.8);
  font-size: var(--sg-text-sm);
  cursor: pointer;
  transition: all var(--sg-transition);
  border-left: 3px solid transparent;
  text-decoration: none;
}
.fu-nav-item:hover { background: rgba(255,255,255,0.12); color: #fff; text-decoration: none; }
.fu-nav-item.fu-nav-active {
  background: rgba(255,255,255,0.18);
  color: #fff;
  border-left-color: #fff;
  font-weight: 700;
}
.fu-sidebar-footer {
  margin-top: auto;
  padding: 14px 18px;
  border-top: 1px solid rgba(255,255,255,0.15);
  font-size: var(--sg-text-xs);
  color: rgba(255,255,255,0.6);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.fu-admin-main { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
.fu-topbar {
  background: var(--sg-surface);
  border-bottom: 1px solid var(--sg-border);
  padding: 12px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 56px;
}
.fu-page-title {
  font-family: var(--sg-font-serif);
  font-size: var(--sg-text-lg);
  font-weight: 700;
  color: var(--sg-text);
}
.fu-page-sub {
  font-size: var(--sg-text-xs);
  color: var(--sg-text-muted);
  margin-top: 2px;
}
.fu-content { padding: 20px 24px; overflow-y: auto; flex: 1; }


/* ============================================================
   ログイン画面
   ============================================================ */
.fu-login-wrap {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--sg-bg);
  padding: 20px;
}
.fu-login-card {
  background: var(--sg-surface);
  border: 1px solid var(--sg-border);
  border-radius: var(--sg-radius-lg);
  padding: 48px 44px;
  width: 100%;
  max-width: 420px;
  box-shadow: var(--sg-shadow-lg);
}
.fu-login-logo {
  text-align: center;
  margin-bottom: 32px;
}
.fu-login-logo-text {
  font-family: var(--sg-font-serif);
  font-size: 26px;
  font-weight: 700;
  color: var(--sg-text);
  letter-spacing: 0.10em;
}
.fu-login-logo-text span { color: var(--sg-unite-orange); }
.fu-login-badge {
  display: inline-block;
  margin-top: 8px;
  background: var(--sg-primary);
  color: #fff;
  font-size: var(--sg-text-xs);
  letter-spacing: 0.18em;
  padding: 3px 12px;
  border-radius: var(--sg-radius-full);
  text-transform: uppercase;
}


/* ============================================================
   発注タイプ選択ボタン（マイページ）
   ============================================================ */
.fu-order-type-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 90px;
  background: var(--sg-primary);
  color: #fff;
  border: none;
  border-radius: var(--sg-radius-lg);
  font-family: var(--sg-font-sans);
  font-size: var(--sg-text-md);
  font-weight: 700;
  cursor: pointer;
  transition: background var(--sg-transition);
  text-decoration: none;
  width: 100%;
}
.fu-order-type-btn:hover { background: var(--sg-primary-hover); color: #fff; text-decoration: none; }
.fu-order-type-btn .fu-icon { font-size: 24px; }


/* ============================================================
   受注詳細（受付入力フォーム）固有スタイル
   ============================================================ */
.fu-price-ok {
  background: var(--sg-success-pale);
  border: 2px solid var(--sg-success);
  border-radius: var(--sg-radius);
  padding: 12px 16px;
  text-align: center;
}
.fu-price-ok-label { font-size: var(--sg-text-xs); color: var(--sg-text-muted); margin-bottom: 4px; letter-spacing: 0.1em; }
.fu-price-ok-value { font-size: 18px; font-weight: 800; color: var(--sg-success); }

/* 得単無しバッジ */
.fu-badge-tokutan {
  display: inline-block;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 3px;
  background: var(--sg-danger-pale);
  color: #C0180E;
  border: 1px solid #f5b3ae;
  font-weight: 700;
  white-space: nowrap;
}
