/* ============================================================
   style-dark.css  --  DividendDesk Theme (Claude Design inspired)
   haitou-bunseki (analysis app) overlay

   - Loaded AFTER style.css
   - Uses !important to override inline <style> blocks
   - Remove this <link> to revert to original mode
   ============================================================ */

/* ===== Google Fonts ===== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans+JP:wght@400;500;600;700&display=swap');

/* ===== Base ===== */
body {
  background: #f5f7fa !important;
  color: #333 !important;
  font-family: 'Inter', 'Noto Sans JP', 'Helvetica Neue', Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

/* ===== Header / Footer ===== */
header {
  background: #366CAB !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.1) !important;
}

footer {
  background: #2c3e50 !important;
  color: rgba(255,255,255,0.7) !important;
}

footer a {
  color: rgba(255,255,255,0.7) !important;
}
footer a:hover {
  color: #ffffff !important;
}

/* ===== Navigation ===== */
@media (max-width: 900px) {
  .app-nav {
    background: #2c5f9e !important;
  }
}

.app-nav-link:hover {
  color: #f59e0b !important;
}
.app-nav-link.active {
  color: #ffffff !important;
  border-bottom: 3px solid #f59e0b !important;
}
.app-nav-back {
  color: rgba(255,255,255,0.6) !important;
}
.app-nav-back:hover {
  color: #f59e0b !important;
}

/* ===== Buttons ===== */
.btn-logout {
  background: rgba(255,255,255,0.15) !important;
  border-color: rgba(255,255,255,0.3) !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.btn-logout:hover {
  background: rgba(255,255,255,0.25) !important;
}

.btn-search {
  background: #366CAB !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.btn-search:hover {
  background: #2c5f9e !important;
  box-shadow: 0 2px 6px rgba(54,108,171,0.25) !important;
}
.btn-search:disabled {
  background: #e2e8f0 !important;
  color: #94a3b8 !important;
}

/* ===== Form elements ===== */
.search-input {
  background: #ffffff !important;
  color: #333 !important;
  border-color: #cbd5e1 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.search-input:focus {
  border-color: #366CAB !important;
  box-shadow: 0 0 0 3px rgba(54,108,171,0.15) !important;
}

/* ===== Search section ===== */
.search-section {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.search-section-title {
  color: #64748b !important;
}
.search-field label {
  color: #64748b !important;
}
.search-name-hint {
  color: #366CAB !important;
}

/* ===== Suggest dropdown ===== */
.suggest-dropdown {
  background: #ffffff !important;
  border-color: #e0e0e0 !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.1) !important;
  border-radius: 6px !important;
}
.suggest-section-label {
  color: #94a3b8 !important;
}
.suggest-item {
  border-bottom-color: #f1f5f9 !important;
  transition: all 0.15s ease !important;
}
.suggest-item:hover,
.suggest-item.active {
  background: #e8f0fe !important;
}
.suggest-code {
  color: #366CAB !important;
}
.suggest-name {
  color: #64748b !important;
}
.suggest-industry {
  color: #94a3b8 !important;
}

/* ===== History items ===== */
.history-item {
  border-bottom-color: #f1f5f9 !important;
  transition: all 0.15s ease !important;
}
.history-item:hover,
.history-item.active {
  background: #e8f0fe !important;
}
.history-icon {
  color: #cbd5e1 !important;
}

/* ===== Empty state ===== */
.empty-state {
  color: #94a3b8 !important;
}

/* ===== Error ===== */
.error-msg {
  background: rgba(169,68,66,0.06) !important;
  color: #A94442 !important;
  border-radius: 6px !important;
}

/* ===== Loading ===== */
.loading-overlay {
  color: #64748b !important;
}

/* ===== Gain / Loss ===== */
.gain { color: #3C763D !important; }
.loss { color: #A94442 !important; }

/* ===== Login page ===== */
.login-wrap {
  background: #f5f7fa !important;
}
.login-card {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 8px !important;
}
.login-card h2 {
  color: #2c5f9e !important;
}
.login-card p {
  color: #64748b !important;
}
.login-card .sub {
  color: #64748b !important;
}
.login-error {
  background: rgba(169,68,66,0.06) !important;
  border-color: rgba(169,68,66,0.2) !important;
  color: #A94442 !important;
  border-radius: 6px !important;
}
.login-loading {
  color: #64748b !important;
}
.btn-google {
  background: #ffffff !important;
  color: #333 !important;
  border-color: #e0e0e0 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.btn-google:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
  border-color: #366CAB !important;
}
.login-divider {
  border-top-color: #e0e0e0 !important;
}
.login-note {
  color: #64748b !important;
}
.login-note a {
  color: #366CAB !important;
}

/* ===== Stock header ===== */
.stock-header {
  background: #2c5f9e !important;
  color: #ffffff !important;
}

/* ===== KPI grid ===== */
.kpi-card {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
  border: 1px solid #e8ecf1 !important;
  border-radius: 4px !important;
  transition: all 0.2s ease !important;
}
.kpi-card:hover {
  box-shadow: 0 3px 10px rgba(0,0,0,0.1) !important;
}
.kpi-label {
  color: #64748b !important;
}
.kpi-value {
  color: #2c5f9e !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}
.kpi-sub {
  color: #94a3b8 !important;
}
.kpi-up {
  color: #366CAB !important;
}
.kpi-down {
  color: #A94442 !important;
}
.kpi-flat {
  color: #94a3b8 !important;
}

/* ===== KPI color coding (Buffett Code style, 6 categories) ===== */
/* 1. Dividend Yield - primary (blue) */
.kpi-card:nth-child(1) {
  background: #e8f0fe !important;
  border-color: #bdd4f0 !important;
}
.kpi-card:nth-child(1) .kpi-value {
  color: #2c5f9e !important;
}

/* 2. Dividend Per Share - success (green) */
.kpi-card:nth-child(2) {
  background: #DFF0D8 !important;
  border-color: #c3e6b5 !important;
}
.kpi-card:nth-child(2) .kpi-value {
  color: #3C763D !important;
}

/* 3. Payout Ratio - warning (yellow) */
.kpi-card:nth-child(3) {
  background: #FCF8DF !important;
  border-color: #eee8b8 !important;
}
.kpi-card:nth-child(3) .kpi-value {
  color: #8A6D3B !important;
}

/* 4. EPS - info (light blue) */
.kpi-card:nth-child(4) {
  background: #D9EDF7 !important;
  border-color: #b8daea !important;
}
.kpi-card:nth-child(4) .kpi-value {
  color: #31708F !important;
}

/* 5. Equity Ratio - danger (red) */
.kpi-card:nth-child(5) {
  background: #F2DEDE !important;
  border-color: #e4c4c4 !important;
}
.kpi-card:nth-child(5) .kpi-value {
  color: #A94442 !important;
}

/* 6. Consecutive Dividend Increase Years - default (grey) */
.kpi-card:nth-child(6) {
  background: #f0f4f8 !important;
  border-color: #dde3ea !important;
}
.kpi-card:nth-child(6) .kpi-value {
  color: #424242 !important;
}

/* ===== Chart grid ===== */
.chart-card {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.chart-card:hover {
  box-shadow: 0 2px 6px rgba(0,0,0,0.12) !important;
}
.chart-card-title {
  color: #333 !important;
  border-bottom-color: #e0e0e0 !important;
}
.chart-note {
  color: #94a3b8 !important;
}

/* ===== Price chart ===== */
.price-period-btn {
  background: #ffffff !important;
  color: #333 !important;
  border-color: #e0e0e0 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.price-period-btn:hover {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}
.price-period-btn.active {
  background: #366CAB !important;
  color: #ffffff !important;
  border-color: #366CAB !important;
}
.price-chart-meta {
  color: #64748b !important;
}
.price-chart-meta span b {
  color: #2c5f9e !important;
}

/* ===== Yield history ===== */
.yield-history-label--cheap {
  background: rgba(60,118,61,0.1) !important;
  color: #3C763D !important;
  border-radius: 20px !important;
}
.yield-history-label--expensive {
  background: rgba(169,68,66,0.08) !important;
  color: #A94442 !important;
  border-radius: 20px !important;
}
.yield-history-label--nodata {
  background: #f1f5f9 !important;
  color: #94a3b8 !important;
  border-radius: 20px !important;
}
.yield-history-nodata {
  color: #94a3b8 !important;
}

/* ============================================================
   Screener page
   ============================================================ */
.screener-info-card {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.screener-info-title {
  color: #2c5f9e !important;
}
.screener-info-desc {
  color: #64748b !important;
}
.screener-info-meta {
  color: #94a3b8 !important;
}

.screener-filter-bar {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.screener-filter-group {
  color: #333 !important;
}
.screener-filter-group label {
  color: #64748b !important;
}
.screener-filter-input,
.screener-filter-select {
  background: #ffffff !important;
  color: #333 !important;
  border-color: #cbd5e1 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.screener-filter-input:focus,
.screener-filter-select:focus {
  border-color: #366CAB !important;
  box-shadow: 0 0 0 3px rgba(54,108,171,0.15) !important;
}
.screener-filter-number {
  background: #ffffff !important;
  color: #333 !important;
  border-color: #cbd5e1 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.screener-filter-number:focus {
  border-color: #366CAB !important;
  box-shadow: 0 0 0 3px rgba(54,108,171,0.15) !important;
}
.screener-filter-reset {
  background: #ffffff !important;
  color: #333 !important;
  border-color: #e0e0e0 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.screener-filter-reset:hover {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}
.screener-filter-summary {
  color: #64748b !important;
}
.screener-filter-summary b {
  color: #2c5f9e !important;
}
.screener-range-sep {
  color: #94a3b8 !important;
}
.screener-range-unit {
  color: #94a3b8 !important;
}

/* Advanced filter */
.screener-advanced-bar {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.screener-advanced-header:hover {
  background: #e8f0fe !important;
}
.screener-advanced-label {
  color: #366CAB !important;
}
.screener-advanced-chevron {
  color: #94a3b8 !important;
}
.screener-advanced-body {
  border-top-color: #e0e0e0 !important;
}
.screener-filter-disabled input {
  background: #f1f5f9 !important;
  color: #cbd5e1 !important;
}
.screener-badge-coming {
  background: #f1f5f9 !important;
  color: #94a3b8 !important;
  border-radius: 20px !important;
}

/* Screener table card */
.screener-table-card {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.screener-loading {
  color: #64748b !important;
}
.screener-no-data {
  color: #94a3b8 !important;
}

/* Scroll fade override */
.screener-table-wrap {
  background:
    linear-gradient(to right, #ffffff 30%, rgba(255,255,255,0)),
    linear-gradient(to left, #ffffff 30%, rgba(255,255,255,0)),
    linear-gradient(to right, rgba(0,0,0,0.06), rgba(0,0,0,0)),
    linear-gradient(to left, rgba(0,0,0,0.06), rgba(0,0,0,0)) !important;
  background-position: left center, right center, left center, right center !important;
  background-repeat: no-repeat !important;
  background-size: 20px 100%, 20px 100%, 10px 100%, 10px 100% !important;
  background-attachment: local, local, scroll, scroll !important;
}

/* Screener table */
.screener-table th {
  background: #366CAB !important;
  color: #ffffff !important;
  border-bottom-color: rgba(255,255,255,0.1) !important;
}
.screener-table th:hover {
  background: #2c6da0 !important;
}
.screener-table td {
  border-bottom-color: #e0e0e0 !important;
  color: #333 !important;
}
.screener-table tbody tr:nth-child(even) td {
  background: #f8fafc !important;
}
.screener-table tbody tr:hover td {
  background: #e8f0fe !important;
}

.scr-stock-code {
  color: #366CAB !important;
  text-decoration-color: rgba(54,108,171,0.3) !important;
}
.scr-stock-code:hover {
  color: #2c5f9e !important;
  text-decoration-color: #2c5f9e !important;
}
.scr-stock-name {
  color: #64748b !important;
}
.scr-high-date {
  color: #94a3b8 !important;
}
.scr-drop-cell {
  color: #A94442 !important;
}
.scr-yield-good {
  color: #3C763D !important;
}

/* Pager */
.screener-pager {
  color: #64748b !important;
}
.screener-pager-btn {
  background: #ffffff !important;
  color: #333 !important;
  border-color: #e0e0e0 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.screener-pager-btn:hover {
  background: #e8f0fe !important;
  border-color: #366CAB !important;
}
.screener-page-info {
  color: #94a3b8 !important;
}

/* ============================================================
   ETF page
   ============================================================ */
.etf-section-card {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.etf-section-title--high {
  color: #A94442 !important;
  border-bottom-color: #A94442 !important;
}
.etf-section-title--bond {
  color: #366CAB !important;
  border-bottom-color: #366CAB !important;
}
.etf-kpi-card {
  background: #f8fafc !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.etf-kpi-card:hover {
  box-shadow: 0 2px 6px rgba(0,0,0,0.1) !important;
}
.etf-kpi-ticker {
  color: #333 !important;
}
.etf-kpi-status--cheap {
  color: #366CAB !important;
}
.etf-kpi-status--expensive {
  color: #A94442 !important;
}
.etf-kpi-avg {
  color: #94a3b8 !important;
}
.etf-kpi-price {
  color: #333 !important;
}
.etf-kpi-price-sub {
  color: #94a3b8 !important;
}
.etf-updated {
  color: #94a3b8 !important;
}

/* ============================================================
   Holdings panel (index.html)
   ============================================================ */
.holdings-panel {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.holdings-toggle {
  color: #366CAB !important;
  transition: all 0.2s ease !important;
}
.holdings-toggle:hover {
  background: #e8f0fe !important;
}
.holdings-badge {
  background: rgba(54,108,171,0.1) !important;
  color: #366CAB !important;
  border-radius: 20px !important;
}
.holdings-chevron {
  color: #94a3b8 !important;
}
.holdings-body {
  border-top-color: #e0e0e0 !important;
}
.holdings-search {
  background: #ffffff !important;
  color: #333 !important;
  border-color: #cbd5e1 !important;
  border-radius: 6px !important;
}
.holdings-search:focus {
  border-color: #366CAB !important;
  box-shadow: 0 0 0 3px rgba(54,108,171,0.15) !important;
}
.holding-item {
  background: #f8fafc !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.holding-item:hover {
  background: #366CAB !important;
  color: white !important;
  border-color: #366CAB !important;
  box-shadow: 0 2px 6px rgba(54,108,171,0.25) !important;
}
.holding-code {
  color: #366CAB !important;
}
.holding-name {
  color: #64748b !important;
}
.holding-item:hover .holding-code,
.holding-item:hover .holding-name {
  color: white !important;
}
.holdings-empty {
  color: #94a3b8 !important;
}

/* ============================================================
   Compare page
   ============================================================ */
.compare-info-card {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.compare-info-title {
  color: #2c5f9e !important;
}
.compare-info-desc {
  color: #64748b !important;
}
.compare-add-section {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.compare-slot-info {
  color: #64748b !important;
}
.compare-tag {
  background: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.compare-tag:hover {
  box-shadow: 0 2px 6px rgba(0,0,0,0.08) !important;
}
.compare-tag-code {
  color: #366CAB !important;
}
.compare-tag-name {
  color: #64748b !important;
}
.compare-tag-remove {
  color: #94a3b8 !important;
}
.compare-tag-remove:hover {
  color: #A94442 !important;
}

/* ============================================================
   Watchlist page
   ============================================================ */
.watchlist-info-card {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.watchlist-info-title {
  color: #2c5f9e !important;
}
.watchlist-info-desc {
  color: #64748b !important;
}
.watchlist-add-section {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.watchlist-card {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
}
.watchlist-header {
  border-bottom-color: #e0e0e0 !important;
}
.watchlist-count {
  color: #366CAB !important;
}
.watchlist-clear-btn {
  background: rgba(169,68,66,0.06) !important;
  color: #A94442 !important;
  border-color: rgba(169,68,66,0.2) !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.watchlist-clear-btn:hover {
  background: rgba(169,68,66,0.12) !important;
}
.watchlist-empty {
  color: #94a3b8 !important;
}
.watchlist-item {
  background: #f8fafc !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}
.watchlist-item:hover {
  background: #e8f0fe !important;
  border-color: #366CAB !important;
  box-shadow: 0 1px 3px rgba(54,108,171,0.1) !important;
}
.watchlist-item-code {
  color: #366CAB !important;
}
.watchlist-item-name {
  color: #333 !important;
}
.watchlist-item-industry {
  color: #94a3b8 !important;
}
.watchlist-item-remove {
  color: #cbd5e1 !important;
}
.watchlist-item-remove:hover {
  color: #A94442 !important;
}

/* ============================================================
   Scrollbar styling
   ============================================================ */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* ===== Ad Container ===== */
.ad-container {
  text-align: center;
  margin: 24px auto;
  max-width: 728px;
  overflow: hidden;
  min-height: 0;
}
.ad-container ins.adsbygoogle[data-ad-status="unfilled"] {
  display: none !important;
}
.ad-container:has(ins.adsbygoogle[data-ad-status="unfilled"]) {
  margin: 0 auto !important;
  min-height: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}
@media (max-width: 768px) {
  .ad-container {
    max-width: 100%;
    margin: 16px auto;
  }
}