/* StockFul ユーザー向けスタイル - オレンジベーステーマ */

:root {
  --stock-orange: #F36F35;
  --stock-orange-dark: #E44F0D;
  --stock-orange-light: #FF9665;
  --stock-bg-light: #FFF6F0;
}

/* ログイン画面スタイル */
.auth-header {
  background-color: var(--stock-orange) !important;
  color: white !important;
  border-bottom: none !important;
}

.auth-logo {
  color: white !important;
}

.auth-logo i {
  color: white !important;
}

.btn-primary {
  background-color: var(--stock-orange) !important;
  border-color: var(--stock-orange-dark) !important;
}

.btn-primary:hover {
  background-color: var(--stock-orange-dark) !important;
  border-color: var(--stock-orange-dark) !important;
}

.text-primary {
  color: var(--stock-orange) !important;
}

/* ダッシュボード画面スタイル */
.navbar-dark {
  background-color: var(--stock-orange) !important;
}

/* ナビゲーションバーのブランド部分 */
.navbar-brand {
  background-color: rgba(243, 111, 53, 0.85) !important;
  backdrop-filter: blur(5px);
  border-right: 1px solid rgba(255, 255, 255, 0.3);
}

/* ログアウトボタン */
.navbar-nav .nav-link, 
button.nav-link {
  color: white !important;
}

.sidebar {
  background-color: white !important;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1) !important;
}

.nav-link {
  color: #495057 !important;
}

.nav-link.active {
  background-color: var(--stock-orange) !important;
  color: white !important;
}

.nav-link:hover {
  background-color: rgba(243, 111, 53, 0.1) !important;
}

.sidebar-heading {
  color: var(--stock-orange) !important;
}

.card-header {
  background-color: var(--stock-bg-light) !important;
  border-bottom: 2px solid var(--stock-orange-light) !important;
}

/* アイコン色修正 */
.bi {
  color: inherit;
}

/* ダッシュボードカードスタイル */
.card {
  border: none;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  transition: transform 0.2s, box-shadow 0.2s;
}

.card:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 15px rgba(243, 111, 53, 0.15);
}

/* ダッシュボード数値表示 */
.dashboard-card {
  border-left: 4px solid var(--stock-orange);
}

/* ナビゲーションアイコン色 */
.sidebar .nav-link i {
  color: var(--stock-orange) !important;
}

.sidebar .nav-link.active i {
  color: white !important;
}

/* フッター */
.card-footer {
  background-color: var(--stock-bg-light) !important;
}

/* リンク色 */
a {
  color: var(--stock-orange);
}

a:hover {
  color: var(--stock-orange-dark);
}

/* アクティブなサイドバーリンクのホバー時スタイル */
.sidebar .nav-link.active:hover {
  background-color: var(--stock-orange-dark) !important;
  color: white !important;
}