/* ============================================================
   Daily Report — Page-specific styles
   Replaces all inline styles from daily_report.html
   ============================================================ */

/* ---- Container ---- */
.dr-container {
    max-width: 960px;
    margin: 0 auto;
    padding: 1.5rem 1rem;
}

/* ---- Header ---- */
.dr-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 2rem;
}

.dr-header-title {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-bottom: 0.375rem;
}

.dr-header-title i {
    width: 22px;
    height: 22px;
    color: var(--accent, #6366f1);
    flex-shrink: 0;
}

.dr-header-title h1 {
    color: var(--text-primary, #f1f5f9);
    font-size: 1.75rem;
    font-weight: 700;
    margin: 0;
    line-height: 1.2;
}

.dr-header-subtitle {
    color: var(--text-muted, #94a3b8);
    font-size: 0.9rem;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.dr-header-subtitle i {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

/* ---- Date Navigation ---- */
.dr-date-nav {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.dr-date-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 0.875rem;
    background: var(--card-bg, #1e293b);
    color: var(--text-muted, #94a3b8);
    border-radius: 0.5rem;
    text-decoration: none;
    border: 1px solid var(--border-color, #334155);
    font-size: 0.8rem;
    transition: border-color 0.15s, color 0.15s;
}

.dr-date-nav-link:hover {
    border-color: var(--accent, #6366f1);
    color: var(--text-primary, #f1f5f9);
}

.dr-date-nav-link i {
    width: 15px;
    height: 15px;
}

.dr-date-form {
    display: flex;
    align-items: center;
}

.dr-date-input {
    padding: 0.5rem 0.75rem;
    background: var(--card-bg, #1e293b);
    color: var(--text-primary, #f1f5f9);
    border: 1px solid var(--border-color, #334155);
    border-radius: 0.5rem;
    font-size: 0.8rem;
    cursor: pointer;
    outline: none;
}

/* ---- Section (shared) ---- */
.dr-section {
    margin-bottom: 1.5rem;
}

.dr-section--last {
    margin-bottom: 2rem;
}

.dr-section-heading {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.dr-section-heading i {
    width: 17px;
    height: 17px;
}

.dr-section-heading i.icon-overview   { color: var(--accent, #6366f1); }
.dr-section-heading i.icon-movers     { color: #22c55e; }
.dr-section-heading i.icon-sentiment  { color: #a855f7; }
.dr-section-heading i.icon-levels     { color: #f59e0b; }

.dr-section-heading h2 {
    color: var(--text-primary, #f1f5f9);
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0;
}

/* ---- Card (shared) ---- */
.dr-card {
    background: var(--card-bg, #1e293b);
    border-radius: 12px;
    border: 1px solid var(--border-color, #334155);
}

/* ---- Overview ---- */
.dr-overview-text {
    padding: 1.25rem;
    margin-bottom: 1rem;
    color: var(--text-primary, #e2e8f0);
    font-size: 0.9rem;
    line-height: 1.75;
}

/* ---- Index Grid ---- */
.dr-index-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0.875rem;
}

.dr-index-card {
    background: var(--card-bg, #1e293b);
    border-radius: 0.625rem;
    border: 1px solid var(--border-color, #334155);
    padding: 1rem;
    text-align: center;
}

.dr-index-card__name {
    color: var(--text-muted, #94a3b8);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 0.375rem;
}

.dr-index-card__price {
    color: var(--text-primary, #f1f5f9);
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 0.25rem;
}

.dr-index-card__change {
    margin: 0;
    font-size: 0.8rem;
    font-weight: 600;
}

.dr-index-card__change--up   { color: #22c55e; }
.dr-index-card__change--down { color: #ef4444; }

/* ---- Top Movers ---- */
.dr-movers-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.dr-movers-panel {
    background: var(--card-bg, #1e293b);
    border-radius: 12px;
    border: 1px solid var(--border-color, #334155);
    overflow: hidden;
}

.dr-movers-panel__header {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color, #334155);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.dr-movers-panel__header i {
    width: 15px;
    height: 15px;
}

.dr-movers-panel__header--gainers {
    background: color-mix(in srgb, #22c55e 8%, transparent);
}

.dr-movers-panel__header--gainers i,
.dr-movers-panel__header--gainers span {
    color: #22c55e;
}

.dr-movers-panel__header--losers {
    background: color-mix(in srgb, #ef4444 8%, transparent);
}

.dr-movers-panel__header--losers i,
.dr-movers-panel__header--losers span {
    color: #ef4444;
}

.dr-movers-panel__label {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.dr-movers-panel__body {
    padding: 0.5rem 0;
}

.dr-mover-row {
    padding: 0.625rem 1rem;
    border-bottom: 1px solid var(--border-color, #1e293b);
}

.dr-mover-row__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.dr-mover-row__symbol {
    color: var(--text-primary, #f1f5f9);
    font-size: 0.875rem;
    font-weight: 600;
    margin: 0;
    text-decoration: none;
    display: block;
}

.dr-mover-row__symbol:hover {
    text-decoration: underline;
}

.dr-mover-row__name {
    color: var(--text-muted, #64748b);
    font-size: 0.72rem;
    margin: 0.1rem 0 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 130px;
}

.dr-mover-row__change {
    font-size: 0.85rem;
    font-weight: 700;
    white-space: nowrap;
}

.dr-mover-row__change--up   { color: #22c55e; }
.dr-mover-row__change--down { color: #ef4444; }

.dr-movers-empty {
    color: var(--text-muted, #64748b);
    font-size: 0.85rem;
    padding: 1rem;
    margin: 0;
    text-align: center;
}

.mover-reason {
    font-size: 0.72rem;
    font-style: italic;
    color: var(--text-muted, #64748b);
    margin: 0.3rem 0 0;
    line-height: 1.5;
    opacity: 0.85;
}

/* ---- Sentiment ---- */
.dr-sentiment-card {
    padding: 1.25rem;
}

.dr-sentiment-badge-row {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
}

.dr-sentiment-badge-label {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted, #94a3b8);
}

.dr-sentiment-badge {
    padding: 0.35rem 1rem;
    border-radius: 2rem;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.dr-sentiment-badge--bullish {
    background: color-mix(in srgb, #22c55e 15%, transparent);
    color: #22c55e;
}

.dr-sentiment-badge--bearish {
    background: color-mix(in srgb, #ef4444 15%, transparent);
    color: #ef4444;
}

.dr-sentiment-badge--neutral {
    background: color-mix(in srgb, #f59e0b 15%, transparent);
    color: #f59e0b;
}

.dr-sentiment-score {
    color: var(--text-muted, #64748b);
    font-size: 0.8rem;
}

.dr-sentiment-breakdown {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.dr-sentiment-breakdown__item {
    padding: 0.875rem;
    background: var(--bg-primary, #0f172a);
    border-radius: 0.5rem;
    border: 1px solid var(--border-color, #334155);
}

.dr-sentiment-breakdown__label {
    color: var(--text-muted, #94a3b8);
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0 0 0.375rem;
}

.dr-sentiment-breakdown__value {
    font-size: 0.875rem;
    font-weight: 700;
    margin: 0;
}

.dr-sentiment-breakdown__value--bullish { color: #22c55e; }
.dr-sentiment-breakdown__value--bearish { color: #ef4444; }
.dr-sentiment-breakdown__value--neutral { color: #f59e0b; }

.dr-sentiment-narrative {
    color: var(--text-muted, #94a3b8);
    font-size: 0.875rem;
    line-height: 1.7;
    margin: 0;
    border-top: 1px solid var(--border-color, #334155);
    padding-top: 1rem;
}

/* ---- Key Levels Table ---- */
.dr-levels-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.dr-levels-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.dr-levels-table thead tr {
    background: var(--bg-primary, #0f172a);
}

.dr-levels-table th {
    padding: 0.75rem 1rem;
    color: var(--text-muted, #64748b);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--border-color, #334155);
    text-align: start;
}

.dr-levels-table th.text-end {
    text-align: end;
}

.dr-levels-table tbody tr {
    border-bottom: 1px solid var(--border-color, #334155);
    transition: background 0.15s;
}

.dr-levels-table tbody tr:hover {
    background: var(--bg-primary, #0f172a);
}

.dr-levels-table td {
    padding: 0.75rem 1rem;
}

.dr-levels-table__symbol {
    color: var(--text-primary, #f1f5f9);
    font-weight: 600;
}

.dr-levels-table__support {
    text-align: end;
    color: #22c55e;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.dr-levels-table__resistance {
    text-align: end;
    color: #ef4444;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.dr-levels-table__note {
    color: var(--text-muted, #94a3b8);
    font-size: 0.82rem;
}

/* ---- Empty / No-Data States ---- */
.dr-empty {
    padding: 1.5rem;
    text-align: center;
}

.dr-empty p {
    color: var(--text-muted, #64748b);
    font-size: 0.875rem;
    margin: 0;
}

/* ---- No Report State ---- */
.dr-no-report {
    padding: 3rem 2rem;
    text-align: center;
    margin-bottom: 2rem;
}

.dr-no-report__icon {
    width: 48px;
    height: 48px;
    color: var(--text-muted, #64748b);
    display: block;
    margin: 0 auto 1rem;
}

.dr-no-report h2 {
    color: var(--text-primary, #f1f5f9);
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0 0 0.5rem;
}

.dr-no-report p {
    color: var(--text-muted, #94a3b8);
    font-size: 0.9rem;
    margin: 0 0 1.5rem;
    line-height: 1.6;
}

/* ---- CTA Buttons ---- */
.dr-btn-accent {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    background: var(--accent, #6366f1);
    color: #fff;
    border-radius: 0.5rem;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
    transition: opacity 0.15s;
}

.dr-btn-accent:hover {
    opacity: 0.85;
}

.dr-btn-accent i {
    width: 16px;
    height: 16px;
}

/* ---- Subscribe CTA ---- */
.dr-subscribe {
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--accent, #6366f1) 10%, var(--card-bg, #1e293b)),
        var(--card-bg, #1e293b));
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--accent, #6366f1) 25%, var(--border-color, #334155));
    padding: 1.5rem;
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

.dr-subscribe__body {
    flex: 1;
    min-width: 200px;
}

.dr-subscribe__title-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.375rem;
}

.dr-subscribe__title-row i {
    width: 18px;
    height: 18px;
    color: var(--accent, #6366f1);
}

.dr-subscribe__title {
    color: var(--text-primary, #f1f5f9);
    font-weight: 600;
    font-size: 1rem;
    margin: 0;
}

.dr-subscribe__desc {
    color: var(--text-muted, #94a3b8);
    font-size: 0.875rem;
    margin: 0;
    line-height: 1.5;
}

.dr-subscribe__btn {
    white-space: nowrap;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 640px) {
    .dr-movers-grid {
        grid-template-columns: 1fr;
    }

    .dr-card table,
    .dr-levels-table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* ============================================================
   RTL SUPPORT
   ============================================================ */
[dir="rtl"] .dr-container {
    direction: rtl;
    text-align: start;
}

[dir="rtl"] [data-lucide="chevron-left"],
[dir="rtl"] [data-lucide="chevron-right"] {
    transform: scaleX(-1);
}

[dir="rtl"] [data-lucide="arrow-up-right"],
[dir="rtl"] [data-lucide="arrow-down-right"] {
    transform: scaleX(-1);
}

[dir="rtl"] .dr-levels-table {
    direction: rtl;
}

[dir="rtl"] .dr-levels-table th,
[dir="rtl"] .dr-levels-table td {
    text-align: start;
}

[dir="rtl"] .dr-levels-table th.text-end,
[dir="rtl"] .dr-levels-table__support,
[dir="rtl"] .dr-levels-table__resistance {
    text-align: start;
}

/* ============================================================
   LIGHT MODE
   ============================================================ */
[data-theme="light"] .dr-card,
[data-theme="light"] .dr-index-card,
[data-theme="light"] .dr-movers-panel,
[data-theme="light"] .dr-subscribe,
[data-theme="light"] .dr-no-report.dr-card {
    background: var(--card-bg, #fffdf8);
    border-color: var(--border-color, rgba(168, 148, 118, 0.25));
}

[data-theme="light"] .dr-overview-text {
    color: var(--text-primary, #2c2417);
}

[data-theme="light"] .dr-sentiment-breakdown__item,
[data-theme="light"] .dr-levels-table thead tr {
    background: var(--bg-primary, #faf7f2);
}

[data-theme="light"] .dr-levels-table tbody tr:hover {
    background: var(--bg-primary, #faf7f2);
}

[data-theme="light"] .dr-date-input {
    background: var(--card-bg, #fffdf8);
    color: var(--text-primary, #2c2417);
    border-color: var(--border-color, rgba(168, 148, 118, 0.25));
    color-scheme: light;
}

[data-theme="light"] .dr-date-nav-link {
    background: var(--card-bg, #fffdf8);
    border-color: var(--border-color, rgba(168, 148, 118, 0.25));
    color: var(--text-muted, #8a7e6b);
}

[data-theme="light"] .dr-date-nav-link:hover {
    border-color: var(--accent, #6366f1);
    color: var(--text-primary, #2c2417);
}

[data-theme="light"] .dr-header-title h1,
[data-theme="light"] .dr-section-heading h2,
[data-theme="light"] .dr-no-report h2,
[data-theme="light"] .dr-index-card__price,
[data-theme="light"] .dr-mover-row__symbol,
[data-theme="light"] .dr-levels-table__symbol,
[data-theme="light"] .dr-subscribe__title {
    color: var(--text-primary, #2c2417);
}

[data-theme="light"] .dr-header-subtitle,
[data-theme="light"] .dr-index-card__name,
[data-theme="light"] .dr-movers-empty,
[data-theme="light"] .dr-mover-row__name,
[data-theme="light"] .dr-sentiment-badge-label,
[data-theme="light"] .dr-sentiment-score,
[data-theme="light"] .dr-sentiment-narrative,
[data-theme="light"] .dr-sentiment-breakdown__label,
[data-theme="light"] .dr-levels-table th,
[data-theme="light"] .dr-levels-table__note,
[data-theme="light"] .dr-empty p,
[data-theme="light"] .dr-no-report p,
[data-theme="light"] .dr-subscribe__desc,
[data-theme="light"] .mover-reason {
    color: var(--text-muted, #8a7e6b);
}

[data-theme="light"] .dr-movers-panel__header--gainers {
    background: color-mix(in srgb, #22c55e 6%, transparent);
}

[data-theme="light"] .dr-movers-panel__header--losers {
    background: color-mix(in srgb, #ef4444 6%, transparent);
}

[data-theme="light"] .dr-subscribe {
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--accent, #6366f1) 6%, var(--card-bg, #fffdf8)),
        var(--card-bg, #fffdf8));
    border-color: color-mix(in srgb, var(--accent, #6366f1) 15%, var(--border-color, rgba(168, 148, 118, 0.25)));
}
