html,
body {
    margin: 0;
    padding: 0;
    width: 100%;
    min-height: 100%;
    font-family: "Segoe UI", Arial, sans-serif;
    background: #f4f6f9;
    color: #1e293b;
}

* {
    box-sizing: border-box;
}

/* =========================================================
   ANA UYGULAMA
   ========================================================= */

.reisai-app {
    display: flex;
    min-height: 100vh;
    width: 100%;
    background: #f4f6f9;
}

/* =========================================================
   SOL MENÜ
   ========================================================= */

.sidebar {
    width: 270px;
    min-width: 270px;
    background: #111827;
    color: white;
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 100;
}

.brand {
    height: 88px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 24px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.brand-logo {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 700;
}

.brand-name {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: .5px;
}

.brand-subtitle {
    margin-top: 3px;
    color: #94a3b8;
    font-size: 11px;
}

.menu-title {
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
    padding: 24px 24px 8px 24px;
}

    .menu-title.second {
        margin-top: 10px;
    }

.menu {
    padding: 0 14px;
}

.menu-link {
    min-height: 46px;
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 0 14px;
    margin: 4px 0;
    border-radius: 9px;
    color: #cbd5e1;
    text-decoration: none;
    font-size: 14px;
    transition: all .15s ease;
}

    .menu-link:hover {
        background: rgba(255,255,255,0.06);
        color: white;
    }

    .menu-link.active {
        background: #2563eb;
        color: white;
    }

    .menu-link.disabled {
        cursor: default;
        opacity: .82;
    }

.menu-icon {
    width: 27px;
    height: 27px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    background: rgba(255,255,255,.07);
    font-size: 11px;
    font-weight: 700;
}

.sidebar-footer {
    margin-top: auto;
    height: 60px;
    display: flex;
    align-items: center;
    padding: 0 25px;
    color: #94a3b8;
    font-size: 12px;
    border-top: 1px solid rgba(255,255,255,.08);
}

.status-dot {
    width: 8px;
    height: 8px;
    background: #22c55e;
    border-radius: 50%;
    margin-right: 9px;
}

/* =========================================================
   ANA İÇERİK
   ========================================================= */

.main {
    width: calc(100% - 270px);
    margin-left: 270px;
    min-height: 100vh;
}

.topbar {
    height: 88px;
    background: white;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 32px;
    position: sticky;
    top: 0;
    z-index: 50;
}

.page-title {
    font-size: 20px;
    font-weight: 700;
}

.page-subtitle {
    color: #64748b;
    font-size: 12px;
    margin-top: 4px;
}

.user-area {
    display: flex;
    align-items: center;
    gap: 12px;
}

.user-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #e8eefc;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.user-name {
    font-size: 13px;
    font-weight: 600;
}

.user-role {
    font-size: 11px;
    color: #94a3b8;
    margin-top: 2px;
}

.content {
    padding: 30px;
}

/* =========================================================
   DASHBOARD
   ========================================================= */

.dashboard {
    max-width: 1600px;
    margin: 0 auto;
}

.welcome {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 28px;
}

    .welcome h1 {
        margin: 0;
        font-size: 26px;
        font-weight: 700;
        color: #0f172a;
    }

    .welcome p {
        margin: 7px 0 0;
        color: #64748b;
        font-size: 13px;
    }

.date-box {
    padding: 10px 15px;
    border-radius: 9px;
    background: #dcfce7;
    color: #15803d;
    font-size: 12px;
    font-weight: 600;
}

.kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-bottom: 22px;
}

.kpi-card {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 21px;
    min-height: 145px;
    box-shadow: 0 1px 2px rgba(0,0,0,.03);
}

.kpi-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .5px;
}

.kpi-tag {
    background: #f1f5f9;
    padding: 5px 8px;
    border-radius: 6px;
    font-size: 10px;
}

.kpi-value {
    font-size: 31px;
    font-weight: 700;
    color: #0f172a;
    margin-top: 19px;
}

.kpi-description {
    color: #94a3b8;
    font-size: 11px;
    margin-top: 8px;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
}

.panel {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    overflow: hidden;
}

.panel-header {
    min-height: 75px;
    padding: 18px 21px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #f1f5f9;
}

    .panel-header h3 {
        margin: 0;
        font-size: 15px;
        color: #0f172a;
    }

    .panel-header p {
        margin: 5px 0 0;
        font-size: 11px;
        color: #94a3b8;
    }

    .panel-header button {
        background: white;
        border: 1px solid #e2e8f0;
        padding: 7px 12px;
        border-radius: 7px;
        cursor: pointer;
        font-size: 11px;
    }

.empty-chart {
    height: 330px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #64748b;
}

.chart-icon {
    font-size: 48px;
    color: #2563eb;
    margin-bottom: 15px;
}

.empty-chart strong {
    font-size: 14px;
    color: #334155;
}

.empty-chart span {
    font-size: 11px;
    margin-top: 7px;
}

/* =========================================================
   AI PANELİ
   ========================================================= */

.ai-content {
    min-height: 330px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 30px;
}

.ai-logo {
    width: 55px;
    height: 55px;
    border-radius: 15px;
    background: #2563eb;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    margin-bottom: 16px;
}

.ai-content h2 {
    font-size: 18px;
    margin: 0;
}

.ai-content p {
    max-width: 330px;
    color: #64748b;
    font-size: 12px;
    line-height: 1.7;
}

.sample-question {
    width: 100%;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 12px;
    border-radius: 9px;
    color: #475569;
    font-size: 11px;
    margin: 5px 0 15px;
}

.ai-button {
    width: 100%;
    border: none;
    background: #2563eb;
    color: white;
    border-radius: 8px;
    padding: 11px;
    font-weight: 600;
    cursor: pointer;
}

    .ai-button:hover {
        background: #1d4ed8;
    }

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .kpi-grid {
        grid-template-columns: repeat(2,1fr);
    }

    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {

    .sidebar {
        width: 78px;
        min-width: 78px;
    }

    .brand {
        padding: 0;
        justify-content: center;
    }

    .brand-text,
    .menu-title,
    .menu-link span:not(.menu-icon),
    .sidebar-footer span {
        display: none;
    }

    .menu {
        padding: 0 10px;
    }

    .menu-link {
        justify-content: center;
        padding: 0;
    }

    .main {
        width: calc(100% - 78px);
        margin-left: 78px;
    }
}

/* =========================================================
   DASHBOARD SATIŞ GRAFİĞİ
   ========================================================= */

.sales-chart {
    padding: 30px;
    min-height: 330px;
}

.chart-row {
    display: grid;
    grid-template-columns: 45px 1fr 100px;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.chart-month {
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
}

.chart-bar-area {
    height: 26px;
    background: #f1f5f9;
    border-radius: 7px;
    overflow: hidden;
}

.chart-bar {
    height: 100%;
    background: #2563eb;
    border-radius: 7px;
    min-width: 2px;
    transition: width .3s ease;
}

.chart-value {
    text-align: right;
    font-size: 12px;
    font-weight: 600;
    color: #334155;
}

/* =========================================================
   AI ASISTAN
   ========================================================= */

.ai-page {
    max-width: 1100px;
    margin: 0 auto;
}

.ai-page-header {
    margin-bottom: 25px;
}

    .ai-page-header h1 {
        margin: 0;
        font-size: 26px;
        color: #0f172a;
    }

    .ai-page-header p {
        margin-top: 7px;
        color: #64748b;
        font-size: 13px;
    }

.ai-chat {
    min-height: 400px;
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 25px;
    margin-bottom: 18px;
}

.assistant-message {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.assistant-avatar {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 12px;
    background: #2563eb;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.assistant-text {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 15px 18px;
    border-radius: 12px;
    white-space: pre-wrap;
    line-height: 1.6;
    font-size: 14px;
}

.ai-question-box {
    display: flex;
    gap: 12px;
}

    .ai-question-box textarea {
        flex: 1;
        resize: vertical;
        border: 1px solid #cbd5e1;
        border-radius: 12px;
        padding: 15px;
        font-family: inherit;
        font-size: 14px;
        outline: none;
    }

        .ai-question-box textarea:focus {
            border-color: #2563eb;
        }

    .ai-question-box button {
        width: 130px;
        border: none;
        border-radius: 12px;
        background: #2563eb;
        color: white;
        font-weight: 600;
        cursor: pointer;
    }

        .ai-question-box button:disabled {
            opacity: .6;
            cursor: default;
        }

.ai-error {
    margin-top: 15px;
    background: #fee2e2;
    color: #b91c1c;
    border-radius: 10px;
    padding: 14px;
    font-size: 13px;
}

.assistant-content {
    flex: 1;
}

.speech-buttons {
    display: flex;
    gap: 8px;
    margin-top: 10px;
}

.speech-button {
    border: 1px solid #cbd5e1;
    background: white;
    color: #334155;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

    .speech-button:hover {
        background: #f1f5f9;
    }

    .speech-button.stop {
        color: #b91c1c;
    }

/* =========================================================
   SESLİ SORU
   ========================================================= */

.mic-button {
    min-width: 135px;
    border: 1px solid #cbd5e1;
    background: white;
    color: #334155;
    border-radius: 12px;
    padding: 0 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all .2s ease;
}

    .mic-button:hover {
        border-color: #2563eb;
        color: #2563eb;
    }

    .mic-button.listening {
        background: #fee2e2;
        border-color: #ef4444;
        color: #b91c1c;
    }

.ask-button {
    min-width: 110px;
    border: none;
    border-radius: 12px;
    background: #2563eb;
    color: white;
    padding: 0 20px;
    font-weight: 600;
    cursor: pointer;
}

    .ask-button:hover {
        background: #1d4ed8;
    }

    .ask-button:disabled,
    .mic-button:disabled {
        opacity: .55;
        cursor: default;
    }

.speech-status {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    font-size: 12px;
    color: #64748b;
}

    .speech-status.active {
        color: #dc2626;
        font-weight: 600;
    }

.listening-dot {
    width: 9px;
    height: 9px;
    background: #ef4444;
    border-radius: 50%;
    animation: reisai-pulse 1s infinite;
}

@keyframes reisai-pulse {

    0% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: .35;
        transform: scale(1.4);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}


/* =========================================================
   SATIŞ RAPORU
   ========================================================= */

.report-page {
    max-width: 1600px;
    margin: 0 auto;
}

.report-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}

    .report-header h1 {
        margin: 7px 0 5px;
        font-size: 27px;
        color: #0f172a;
    }

    .report-header p {
        margin: 0;
        color: #64748b;
        font-size: 13px;
    }

.report-badge {
    display: inline-block;
    background: #dbeafe;
    color: #1d4ed8;
    padding: 5px 9px;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 700;
}

.report-status {
    background: #dcfce7;
    color: #15803d;
    padding: 10px 14px;
    border-radius: 9px;
    font-size: 12px;
    font-weight: 600;
}

.report-kpis {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 15px;
    margin-bottom: 20px;
}

.report-kpi {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 13px;
    padding: 19px;
}

    .report-kpi span {
        display: block;
        color: #64748b;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: .6px;
    }

    .report-kpi strong {
        display: block;
        margin-top: 12px;
        font-size: 24px;
        color: #0f172a;
    }

    .report-kpi small {
        display: block;
        margin-top: 7px;
        color: #94a3b8;
    }

.report-grid-large {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 18px;
    margin-bottom: 18px;
}

.report-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.report-card {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    overflow: hidden;
}

.report-card-header {
    padding: 17px 20px;
    border-bottom: 1px solid #f1f5f9;
}

    .report-card-header h3 {
        margin: 0;
        font-size: 15px;
    }

    .report-card-header p {
        margin: 4px 0 0;
        color: #94a3b8;
        font-size: 11px;
    }


/* AYLIK GRAFİK */

.monthly-chart {
    height: 330px;
    padding: 30px 25px 20px;
    display: flex;
    align-items: flex-end;
    gap: 15px;
}

.month-column {
    flex: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.month-value {
    font-size: 10px;
    font-weight: 600;
    color: #64748b;
    height: 25px;
}

.month-bar-zone {
    flex: 1;
    width: 65%;
    display: flex;
    align-items: flex-end;
    background: #f8fafc;
    border-radius: 7px 7px 0 0;
}

.month-bar {
    width: 100%;
    background: linear-gradient(180deg,#3b82f6,#2563eb);
    border-radius: 7px 7px 0 0;
    min-height: 3px;
}

.month-name {
    margin-top: 9px;
    font-size: 11px;
    font-weight: 600;
    color: #64748b;
}


/* MARKA DONUT */

.brand-chart-container {
    padding: 25px;
}

.brand-donut {
    width: 175px;
    height: 175px;
    border-radius: 50%;
    margin: 0 auto 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.brand-donut-center {
    width: 105px;
    height: 105px;
    border-radius: 50%;
    background: white;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

    .brand-donut-center strong {
        font-size: 16px;
    }

    .brand-donut-center span {
        color: #94a3b8;
        font-size: 10px;
    }

.brand-legend-row {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #f1f5f9;
    padding: 9px 0;
    font-size: 11px;
}

    .brand-legend-row div {
        display: flex;
        gap: 8px;
    }

    .brand-legend-row span {
        color: #94a3b8;
    }


/* MÜŞTERİ */

.customer-bars {
    padding: 20px;
}

.customer-row {
    margin-bottom: 17px;
}

.customer-info {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    margin-bottom: 6px;
}

.customer-track {
    height: 9px;
    background: #f1f5f9;
    border-radius: 10px;
}

.customer-bar {
    height: 100%;
    background: #2563eb;
    border-radius: 10px;
}


/* ÜRÜN */

.product-table {
    padding: 8px 20px 20px;
}

.product-table-header,
.product-table-row {
    display: grid;
    grid-template-columns: 1fr 70px 100px;
    gap: 10px;
    align-items: center;
}

.product-table-header {
    padding: 12px 0;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 700;
}

.product-table-row {
    border-top: 1px solid #f1f5f9;
    padding: 12px 0;
    font-size: 11px;
}


/* ANALİZ */

.analysis-card {
    margin-top: 18px;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 14px;
    padding: 20px;
    display: flex;
    gap: 16px;
}

.analysis-icon {
    width: 45px;
    height: 45px;
    min-width: 45px;
    border-radius: 12px;
    background: #2563eb;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.analysis-card h3 {
    margin: 0 0 7px;
}

.analysis-card p {
    margin: 0;
    color: #475569;
    line-height: 1.7;
    font-size: 12px;
}

.report-loading,
.report-error {
    background: white;
    padding: 30px;
    border-radius: 14px;
}

.report-error {
    color: #b91c1c;
}

@media(max-width:1200px) {

    .report-kpis {
        grid-template-columns: repeat(2,1fr);
    }

    .report-grid-large,
    .report-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   AI SATIŞ ANALİZİ
   ========================================================= */

.report-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ai-analysis-button {
    border: none;
    background: linear-gradient( 135deg, #2563eb, #4f46e5 );
    color: white;
    padding: 11px 18px;
    border-radius: 9px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(37, 99, 235, .15);
    transition: all .2s ease;
}

    .ai-analysis-button:hover {
        transform: translateY(-1px);
        box-shadow: 0 6px 14px rgba(37, 99, 235, .22);
    }

    .ai-analysis-button:disabled {
        opacity: .6;
        cursor: default;
        transform: none;
    }


/* AI YÜKLENİYOR */

.ai-report-loading {
    margin-top: 20px;
    background: white;
    border: 1px solid #dbeafe;
    border-radius: 14px;
    padding: 22px;
    display: flex;
    align-items: center;
    gap: 16px;
}

.ai-report-loading-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 13px;
    background: #2563eb;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    animation: reisai-ai-pulse 1.5s infinite;
}

.ai-report-loading strong {
    color: #0f172a;
}

.ai-report-loading p {
    margin: 5px 0 0;
    color: #64748b;
    font-size: 12px;
}


/* SONUÇ */

.ai-report-result {
    margin-top: 20px;
    background: white;
    border: 1px solid #dbeafe;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 3px 12px rgba(0,0,0,.04);
}

.ai-report-result-header {
    min-height: 85px;
    padding: 18px 22px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #eff6ff;
    background: linear-gradient( 90deg, #f8fbff, #ffffff );
}

.ai-report-title {
    display: flex;
    align-items: center;
    gap: 13px;
}

.ai-report-logo {
    width: 48px;
    height: 48px;
    border-radius: 13px;
    background: linear-gradient( 135deg, #2563eb, #4f46e5 );
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.ai-report-title h2 {
    margin: 0;
    font-size: 17px;
    color: #0f172a;
}

.ai-report-title p {
    margin: 4px 0 0;
    font-size: 11px;
    color: #94a3b8;
}

.ai-refresh-button {
    border: 1px solid #cbd5e1;
    background: white;
    color: #475569;
    padding: 8px 12px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 11px;
}

    .ai-refresh-button:hover {
        border-color: #2563eb;
        color: #2563eb;
    }


/* AI METNİ */

.ai-report-text {
    padding: 25px;
    white-space: pre-wrap;
    color: #334155;
    font-size: 13px;
    line-height: 1.8;
}


/* HATA */

.ai-report-error {
    margin-top: 20px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 12px;
    padding: 16px;
    color: #b91c1c;
    font-size: 12px;
}

    .ai-report-error strong {
        display: block;
        margin-bottom: 6px;
    }


@keyframes reisai-ai-pulse {

    0% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.06);
        opacity: .75;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/* =========================================================
   LOGIN
   ========================================================= */

.login-page {
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at top right, #1e40af 0, #111827 42%, #0f172a 100%);
    padding: 30px;
}

.login-card {
    width: 100%;
    max-width: 420px;
    background: white;
    border-radius: 18px;
    padding: 38px;
    box-shadow: 0 25px 60px rgba(0,0,0,.28);
}

.login-brand {
    text-align: center;
    margin-bottom: 30px;
}

.login-logo-area {
    width: 230px;
    margin: 0 auto 18px auto;
    display: flex;
    justify-content: center;
}

.login-logo-image {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
}

.login-brand h1 {
    margin: 0;
    font-size: 23px;
    color: #0f172a;
}

.login-brand p {
    margin: 7px 0 0;
    color: #64748b;
    font-size: 12px;
}

.login-field {
    margin-bottom: 17px;
}

    .login-field label {
        display: block;
        margin-bottom: 7px;
        color: #334155;
        font-size: 12px;
        font-weight: 600;
    }

    .login-field input {
        width: 100%;
        border: 1px solid #cbd5e1;
        border-radius: 10px;
        padding: 12px 13px;
        font-size: 14px;
        outline: none;
    }

        .login-field input:focus {
            border-color: #2563eb;
            box-shadow: 0 0 0 3px rgba(37,99,235,.08);
        }

.login-button {
    width: 100%;
    margin-top: 6px;
    border: none;
    border-radius: 10px;
    padding: 13px;
    background: #2563eb;
    color: white;
    font-weight: 700;
    cursor: pointer;
}

    .login-button:hover {
        background: #1d4ed8;
    }

.login-error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #b91c1c;
    padding: 11px;
    border-radius: 9px;
    margin-bottom: 18px;
    font-size: 12px;
}

.login-footer {
    text-align: center;
    margin-top: 25px;
    color: #94a3b8;
    font-size: 10px;
}

/* =========================================================
   REISAI LOGO
   ========================================================= */

.brand-logo-container {
    width: 48px;
    height: 48px;
    min-width: 48px;
    background: white;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
    margin-top: 10px;
}

.brand-logo-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
}


/* =========================================================
   REISAI - STOCK ANALYSIS V2
   app.css dosyasının sonuna ekleyin
   ========================================================= */

.stock-v2-page {
    width: 100%;
}

.stock-v2-rule-note {
    margin-bottom: 16px;
    padding: 13px 16px;
    border: 1px solid #bfdbfe;
    border-radius: 11px;
    background: #eff6ff;
    color: #475569;
    font-size: 11px;
    line-height: 1.6;
}

    .stock-v2-rule-note strong {
        color: #1d4ed8;
    }

.stock-v2-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.stock-v2-kpi {
    min-width: 0;
    padding: 17px;
    border: 1px solid #e2e8f0;
    border-radius: 13px;
    background: #fff;
}

    .stock-v2-kpi span {
        display: block;
        color: #64748b;
        font-size: 9px;
        font-weight: 800;
        letter-spacing: .04em;
    }

    .stock-v2-kpi strong {
        display: block;
        margin-top: 7px;
        color: #0f172a;
        font-size: 23px;
    }

    .stock-v2-kpi small {
        display: block;
        margin-top: 5px;
        color: #94a3b8;
        font-size: 9px;
    }

    .stock-v2-kpi.positive {
        border-color: #bbf7d0;
        background: #f0fdf4;
    }

    .stock-v2-kpi.negative {
        border-color: #fecaca;
        background: #fef2f2;
    }

    .stock-v2-kpi.warning {
        border-color: #fde68a;
        background: #fffbeb;
    }

    .stock-v2-kpi.danger {
        border-color: #fecaca;
        background: #fff1f2;
    }

.stock-v2-card {
    margin-bottom: 18px;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .03);
}

    .stock-v2-card.risk-card {
        border-color: #fecaca;
    }

    .stock-v2-card.reorder-card {
        border-color: #fcd34d;
    }

.stock-v2-card-header {
    padding: 16px 19px;
    border-bottom: 1px solid #f1f5f9;
}

    .stock-v2-card-header h3 {
        margin: 0;
        color: #0f172a;
        font-size: 13px;
    }

    .stock-v2-card-header p {
        margin: 5px 0 0;
        color: #94a3b8;
        font-size: 10px;
        line-height: 1.5;
    }

.stock-v2-year-chart {
    height: 290px;
    display: flex;
    align-items: stretch;
    gap: 24px;
    padding: 24px 30px 18px;
}

.stock-v2-year-column {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .stock-v2-year-column > span {
        min-height: 23px;
        color: #475569;
        font-size: 10px;
        font-weight: 600;
    }

.stock-v2-year-track {
    flex: 1;
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.stock-v2-year-bar {
    width: min(70px, 72%);
    min-height: 2px;
    border-radius: 8px 8px 2px 2px;
    background: linear-gradient(180deg, #2563eb, #60a5fa);
}

.stock-v2-year-column > strong {
    margin-top: 9px;
    color: #334155;
    font-size: 11px;
}

.stock-v2-year-column > small {
    margin-top: 3px;
    color: #f59e0b;
    font-size: 8px;
}

.stock-v2-table {
    width: 100%;
    overflow-x: auto;
}

.stock-v2-table-head,
.stock-v2-table-row {
    display: grid;
    min-width: 850px;
    gap: 11px;
    align-items: center;
    padding: 10px 15px;
}

.stock-v2-table-head {
    border-bottom: 1px solid #e2e8f0;
    background: #f8fafc;
    color: #64748b;
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
}

.stock-v2-table-row {
    min-height: 55px;
    border-bottom: 1px solid #f1f5f9;
    color: #475569;
    font-size: 9px;
}

    .stock-v2-table-row:last-child {
        border-bottom: 0;
    }

.stock-v2-product {
    min-width: 0;
}

    .stock-v2-product b {
        display: block;
        overflow: hidden;
        color: #1e293b;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .stock-v2-product small {
        display: block;
        overflow: hidden;
        margin-top: 2px;
        color: #94a3b8;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .stock-v2-product em {
        display: block;
        overflow: hidden;
        margin-top: 2px;
        color: #2563eb;
        font-size: 8px;
        font-style: normal;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

.stock-v2-positive {
    color: #16a34a !important;
}

.stock-v2-negative {
    color: #dc2626 !important;
}

.stock-v2-warning {
    color: #d97706 !important;
}

.stock-v2-trend-grid {
    grid-template-columns: minmax(260px, 2.4fr) .7fr .7fr .7fr .8fr .6fr;
}

.stock-v2-history-grid {
    grid-template-columns: minmax(260px, 2.4fr) .6fr .6fr .6fr .6fr .6fr .6fr;
}

.stock-v2-abnormal-grid {
    grid-template-columns: minmax(260px, 2.4fr) .65fr .65fr .75fr .65fr .75fr .85fr;
}

.stock-v2-stock-grid {
    grid-template-columns: minmax(280px, 2.6fr) .7fr .7fr .7fr .9fr;
}

.stock-v2-best-grid {
    grid-template-columns: minmax(280px, 2.6fr) .8fr .7fr .8fr .7fr;
}

.stock-v2-order-grid {
    grid-template-columns: minmax(260px, 2.5fr) .75fr .85fr .7fr .7fr .7fr .8fr .9fr;
}

.stock-v2-brand-grid {
    grid-template-columns: minmax(170px, 1.5fr) .55fr .55fr .55fr .55fr .55fr .55fr .65fr .65fr;
}

.stock-v2-fast-grid {
    grid-template-columns: minmax(300px, 2.8fr) .9fr .8fr .8fr .9fr;
}

@media (max-width: 1450px) {
    .stock-v2-kpis {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 800px) {
    .stock-v2-kpis {
        grid-template-columns: 1fr 1fr;
    }

    .stock-v2-year-chart {
        gap: 8px;
        padding-left: 10px;
        padding-right: 10px;
    }
}


/* =========================================================
   REISAI PDF REPORT BUTTON
   ========================================================= */

.pdf-report-button {
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #334155;
    padding: 10px 15px;
    border-radius: 9px;
    cursor: pointer;
    font-size: 11px;
    font-weight: 700;
    transition: all .18s ease;
}

    .pdf-report-button:hover {
        border-color: #2563eb;
        color: #2563eb;
        box-shadow: 0 3px 10px rgba(37, 99, 235, .10);
    }

    .pdf-report-button:disabled {
        opacity: .55;
        cursor: default;
        box-shadow: none;
    }

.pdf-report-error {
    margin-bottom: 16px;
    border: 1px solid #fecaca;
    background: #fef2f2;
    color: #b91c1c;
    padding: 12px 14px;
    border-radius: 10px;
    font-size: 11px;
}


/* =========================================================
   REISAI - DYNAMIC STOCK ANALYSIS V3
   wwwroot/app.css sonuna ekleyin
   ========================================================= */

.stock-v3-page {
    width: 100%;
}

.stock-v3-context {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 10px;
    margin-bottom: 14px;
}

    .stock-v3-context > div {
        border: 1px solid #e2e8f0;
        border-radius: 11px;
        background: #fff;
        padding: 12px 14px;
    }

    .stock-v3-context span {
        display: block;
        color: #64748b;
        font-size: 9px;
        font-weight: 700;
    }

    .stock-v3-context strong {
        display: block;
        margin-top: 5px;
        color: #0f172a;
        font-size: 14px;
    }

.stock-v3-rule-note {
    margin-bottom: 16px;
    padding: 13px 16px;
    border: 1px solid #bfdbfe;
    border-radius: 11px;
    background: #eff6ff;
    color: #475569;
    font-size: 10px;
    line-height: 1.65;
}

    .stock-v3-rule-note strong {
        color: #1d4ed8;
    }

.stock-v3-kpis {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.stock-v3-kpi {
    min-width: 0;
    padding: 17px;
    border: 1px solid #e2e8f0;
    border-radius: 13px;
    background: #fff;
}

    .stock-v3-kpi span {
        display: block;
        color: #64748b;
        font-size: 9px;
        font-weight: 800;
    }

    .stock-v3-kpi strong {
        display: block;
        margin-top: 7px;
        color: #0f172a;
        font-size: 23px;
    }

    .stock-v3-kpi small {
        display: block;
        margin-top: 5px;
        color: #94a3b8;
        font-size: 9px;
    }

    .stock-v3-kpi.positive {
        border-color: #bbf7d0;
        background: #f0fdf4;
    }

    .stock-v3-kpi.negative {
        border-color: #fecaca;
        background: #fef2f2;
    }

    .stock-v3-kpi.warning {
        border-color: #fde68a;
        background: #fffbeb;
    }

    .stock-v3-kpi.danger {
        border-color: #fecaca;
        background: #fff1f2;
    }

.stock-v3-card {
    margin-bottom: 18px;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(15,23,42,.03);
}

    .stock-v3-card.risk-card {
        border-color: #fecaca;
    }

    .stock-v3-card.reorder-card {
        border-color: #fcd34d;
    }

.stock-v3-card-header {
    padding: 16px 19px;
    border-bottom: 1px solid #f1f5f9;
}

    .stock-v3-card-header h3 {
        margin: 0;
        color: #0f172a;
        font-size: 13px;
    }

    .stock-v3-card-header p {
        margin: 5px 0 0;
        color: #94a3b8;
        font-size: 10px;
        line-height: 1.5;
    }

.stock-v3-year-chart {
    height: 290px;
    display: flex;
    align-items: stretch;
    gap: 20px;
    padding: 24px 25px 18px;
    overflow-x: auto;
}

.stock-v3-year-column {
    flex: 1 0 90px;
    min-width: 90px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .stock-v3-year-column > span {
        min-height: 23px;
        color: #475569;
        font-size: 10px;
        font-weight: 600;
    }

.stock-v3-year-track {
    flex: 1;
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.stock-v3-year-bar {
    width: 58px;
    min-height: 2px;
    border-radius: 8px 8px 2px 2px;
    background: linear-gradient(180deg,#2563eb,#60a5fa);
}

.stock-v3-year-column > strong {
    margin-top: 9px;
    color: #334155;
    font-size: 11px;
}

.stock-v3-year-column > small {
    margin-top: 3px;
    color: #f59e0b;
    font-size: 8px;
}

.stock-v3-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.stock-v3-table {
    width: 100%;
    min-width: 900px;
    border-collapse: collapse;
}

    .stock-v3-table th {
        position: sticky;
        top: 0;
        padding: 9px 10px;
        border-bottom: 1px solid #dbe4ef;
        background: #0f172a;
        color: #fff;
        font-size: 8px;
        font-weight: 700;
        text-align: left;
        white-space: nowrap;
    }

    .stock-v3-table td {
        padding: 9px 10px;
        border-bottom: 1px solid #f1f5f9;
        color: #475569;
        font-size: 9px;
        white-space: nowrap;
    }

    .stock-v3-table tbody tr:nth-child(even) {
        background: #f8fafc;
    }

    .stock-v3-table tbody tr:hover {
        background: #eff6ff;
    }

.stock-v3-product {
    min-width: 230px;
    max-width: 330px;
    white-space: normal !important;
}

    .stock-v3-product b {
        display: block;
        color: #1e293b;
    }

    .stock-v3-product small {
        display: block;
        margin-top: 3px;
        color: #94a3b8;
        line-height: 1.35;
    }

.stock-v3-positive {
    color: #16a34a !important;
    font-weight: 700;
}

.stock-v3-negative {
    color: #dc2626 !important;
    font-weight: 700;
}

.stock-v3-warning {
    color: #d97706 !important;
    font-weight: 700;
}

@media (max-width:1450px) {
    .stock-v3-context, .stock-v3-kpis {
        grid-template-columns: repeat(3,1fr);
    }
}

@media (max-width:800px) {
    .stock-v3-context, .stock-v3-kpis {
        grid-template-columns: 1fr 1fr;
    }
}


/* =========================================================
   REISAI - ANALYSIS SETTINGS ADMIN
   wwwroot/app.css sonuna ekleyin
   ========================================================= */

.analysis-settings-page {
    width: 100%;
}

.analysis-settings-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 18px;
}

    .analysis-settings-header h1 {
        margin: 7px 0 5px;
        color: #0f172a;
        font-size: 24px;
    }

    .analysis-settings-header p {
        margin: 0;
        color: #64748b;
        font-size: 11px;
    }

.analysis-settings-summary {
    display: flex;
    gap: 10px;
}

    .analysis-settings-summary > div {
        min-width: 100px;
        padding: 12px 15px;
        border: 1px solid #e2e8f0;
        border-radius: 11px;
        background: #fff;
    }

    .analysis-settings-summary span {
        display: block;
        color: #94a3b8;
        font-size: 8px;
        font-weight: 700;
        text-transform: uppercase;
    }

    .analysis-settings-summary strong {
        display: block;
        margin-top: 4px;
        color: #0f172a;
        font-size: 18px;
    }

.analysis-settings-card {
    margin-bottom: 18px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .03);
}

.analysis-settings-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
    border-bottom: 1px solid #f1f5f9;
}

    .analysis-settings-card-header h2 {
        margin: 0;
        color: #0f172a;
        font-size: 14px;
    }

    .analysis-settings-card-header p {
        margin: 4px 0 0;
        color: #94a3b8;
        font-size: 9px;
    }

.analysis-settings-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
    padding: 18px;
}

.analysis-setting-field {
    min-width: 0;
}

    .analysis-setting-field label {
        display: block;
        margin-bottom: 6px;
        color: #334155;
        font-size: 10px;
        font-weight: 700;
    }

    .analysis-setting-field small {
        display: block;
        margin-top: 6px;
        color: #94a3b8;
        font-size: 8px;
        line-height: 1.45;
    }

.analysis-input-unit {
    display: flex;
    align-items: stretch;
}

.analysis-settings-input {
    width: 100%;
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid #cbd5e1;
    border-right: 0;
    border-radius: 8px 0 0 8px;
    outline: none;
    color: #0f172a;
    background: #fff;
    font-size: 11px;
}

.analysis-input-unit > span {
    display: flex;
    align-items: center;
    min-width: 52px;
    justify-content: center;
    padding: 0 9px;
    border: 1px solid #cbd5e1;
    border-radius: 0 8px 8px 0;
    background: #f8fafc;
    color: #64748b;
    font-size: 9px;
}

.analysis-settings-input:focus,
.analysis-brand-input:focus,
.analysis-settings-search input:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, .08);
}

.analysis-settings-primary-button {
    border: 0;
    border-radius: 9px;
    padding: 10px 14px;
    background: #2563eb;
    color: #fff;
    cursor: pointer;
    font-size: 10px;
    font-weight: 700;
}

    .analysis-settings-primary-button:disabled {
        opacity: .55;
        cursor: default;
    }

.analysis-settings-formula {
    display: flex;
    align-items: center;
    gap: 15px;
    margin: 0 18px 18px;
    padding: 12px 14px;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    background: #eff6ff;
    color: #475569;
    font-size: 9px;
}

    .analysis-settings-formula strong {
        color: #1d4ed8;
    }

.analysis-settings-search input {
    width: 220px;
    padding: 9px 11px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    outline: none;
    font-size: 10px;
}

.analysis-brand-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    padding: 11px 18px;
    border-bottom: 1px solid #f1f5f9;
    background: #f8fafc;
}

    .analysis-brand-legend span {
        padding: 5px 8px;
        border: 1px solid #e2e8f0;
        border-radius: 999px;
        background: #fff;
        color: #64748b;
        font-size: 8px;
    }

.analysis-brand-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.analysis-brand-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
}

    .analysis-brand-table th {
        padding: 9px 10px;
        border-bottom: 1px solid #dbe4ef;
        background: #0f172a;
        color: #fff;
        font-size: 8px;
        text-align: left;
        white-space: nowrap;
    }

    .analysis-brand-table td {
        padding: 8px 10px;
        border-bottom: 1px solid #f1f5f9;
        color: #475569;
        font-size: 9px;
        vertical-align: middle;
    }

    .analysis-brand-table tbody tr:nth-child(even) {
        background: #f8fafc;
    }

.analysis-brand-name {
    min-width: 170px;
}

.analysis-table-input-unit {
    display: flex;
    align-items: center;
    min-width: 120px;
}

.analysis-brand-input {
    width: 78px;
    padding: 7px 7px;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    outline: none;
    font-size: 9px;
}

.analysis-table-input-unit span {
    margin-left: 5px;
    color: #94a3b8;
    font-size: 8px;
}

.analysis-effective-value strong {
    display: block;
    color: #0f172a;
}

.analysis-effective-value small {
    display: block;
    margin-top: 2px;
    color: #94a3b8;
    font-size: 8px;
}

.analysis-status-pill {
    display: inline-flex;
    align-items: center;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: 8px;
    font-weight: 700;
}

    .analysis-status-pill.custom {
        background: #dbeafe;
        color: #1d4ed8;
    }

    .analysis-status-pill.global {
        background: #f1f5f9;
        color: #64748b;
    }

.analysis-brand-actions {
    white-space: nowrap;
}

.analysis-row-save,
.analysis-row-reset {
    border: 0;
    border-radius: 7px;
    padding: 6px 8px;
    cursor: pointer;
    font-size: 8px;
    font-weight: 700;
}

.analysis-row-save {
    background: #2563eb;
    color: #fff;
}

.analysis-row-reset {
    margin-left: 4px;
    background: #f1f5f9;
    color: #475569;
}

    .analysis-row-save:disabled,
    .analysis-row-reset:disabled {
        opacity: .5;
        cursor: default;
    }

.analysis-settings-table-note {
    padding: 10px 18px;
    background: #f8fafc;
    color: #64748b;
    font-size: 8px;
}

.analysis-settings-message {
    margin-bottom: 14px;
    padding: 11px 14px;
    border-radius: 10px;
    font-size: 10px;
}

    .analysis-settings-message.success {
        border: 1px solid #bbf7d0;
        background: #f0fdf4;
        color: #15803d;
    }

    .analysis-settings-message.error {
        border: 1px solid #fecaca;
        background: #fef2f2;
        color: #b91c1c;
    }

@media (max-width: 1200px) {
    .analysis-settings-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .analysis-settings-header {
        flex-direction: column;
    }

    .analysis-settings-grid {
        grid-template-columns: 1fr;
    }

    .analysis-settings-card-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .analysis-settings-search input {
        width: 100%;
    }
}


/* =========================================================
   REISAI - CORPORATE LOGIN PAGE
   Add to the END of wwwroot/app.css
   ========================================================= */

.reisai-login-layout {
    min-height: 100vh;
    width: 100%;
    margin: 0;
    padding: 0;
}

.corporate-login-page {
    --login-navy-950: #06152b;
    --login-navy-900: #081b36;
    --login-navy-800: #0c2a55;
    --login-blue-600: #2563eb;
    --login-blue-500: #2f80ed;
    --login-blue-400: #38a6ff;
    --login-slate-900: #0f172a;
    --login-slate-700: #334155;
    --login-slate-600: #475569;
    --login-slate-500: #64748b;
    --login-slate-400: #94a3b8;
    --login-border: #dbe4ef;
    min-height: 100vh;
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(520px, .88fr);
    overflow: hidden;
    background: radial-gradient(circle at 82% 25%, rgba(37, 99, 235, .17), transparent 26%), linear-gradient(125deg, #07172d 0%, #08224a 47%, #06162e 100%);
    font-family: Inter, "Segoe UI", Arial, sans-serif;
}


/* =========================================================
   LEFT SIDE
   ========================================================= */

.corporate-login-hero {
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 42px 62px 34px;
    overflow: hidden;
    color: #ffffff;
    background: radial-gradient(circle at 78% 48%, rgba(28, 116, 255, .23), transparent 30%), radial-gradient(circle at 30% 20%, rgba(31, 110, 255, .11), transparent 32%), linear-gradient(135deg, #07172d 0%, #09234a 57%, #07182e 100%);
}

.corporate-login-grid {
    position: absolute;
    inset: 0;
    opacity: .13;
    background-image: linear-gradient(rgba(90, 159, 255, .12) 1px, transparent 1px), linear-gradient(90deg, rgba(90, 159, 255, .12) 1px, transparent 1px);
    background-size: 55px 55px;
    mask-image: linear-gradient(to right, transparent, #000 40%, #000);
}

    .corporate-login-grid::after {
        content: "";
        position: absolute;
        width: 920px;
        height: 430px;
        left: 24%;
        bottom: -260px;
        border: 1px solid rgba(59, 130, 246, .23);
        border-radius: 50%;
        box-shadow: 0 0 0 55px rgba(59, 130, 246, .035), 0 0 0 115px rgba(59, 130, 246, .025), 0 0 90px rgba(59, 130, 246, .17);
    }

.corporate-login-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(4px);
    pointer-events: none;
}

    .corporate-login-glow.glow-one {
        width: 330px;
        height: 330px;
        right: -100px;
        top: 24%;
        background: radial-gradient(circle, rgba(45, 131, 255, .22), transparent 70%);
    }

    .corporate-login-glow.glow-two {
        width: 260px;
        height: 260px;
        left: 44%;
        bottom: 12%;
        background: radial-gradient(circle, rgba(0, 169, 255, .12), transparent 72%);
    }


.corporate-login-brand {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 13px;
}

.corporate-login-brand-logo {
    width: 58px;
    height: 58px;
    object-fit: contain;
    padding: 5px;
    border-radius: 13px;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .13);
}

.corporate-login-brand-text {
    display: flex;
    flex-direction: column;
}

    .corporate-login-brand-text strong {
        color: #ffffff;
        font-size: 25px;
        font-weight: 700;
        line-height: 1;
    }

        .corporate-login-brand-text strong::first-letter {
            color: #ffffff;
        }

    .corporate-login-brand-text span {
        margin-top: 7px;
        color: rgba(219, 234, 254, .64);
        font-size: 10px;
        font-weight: 400;
    }


.corporate-login-hero-content {
    position: relative;
    z-index: 3;
    width: min(640px, 92%);
    margin-top: auto;
    margin-bottom: auto;
}

.corporate-login-eyebrow {
    margin-bottom: 20px;
    color: #7eb5ff;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .26em;
}

.corporate-login-hero-content h1 {
    margin: 0;
    color: #ffffff;
    font-size: clamp(34px, 3.1vw, 56px);
    font-weight: 700;
    line-height: 1.07;
    letter-spacing: -.035em;
}

    .corporate-login-hero-content h1 span {
        display: block;
        margin-top: 6px;
        color: #2e8dff;
    }

.corporate-login-hero-content > p {
    max-width: 540px;
    margin: 25px 0 0;
    color: rgba(219, 234, 254, .67);
    font-size: 13px;
    line-height: 1.8;
}


.corporate-login-features {
    display: grid;
    gap: 19px;
    margin-top: 34px;
}

.corporate-login-feature {
    display: flex;
    align-items: center;
    gap: 15px;
}

.corporate-login-feature-icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(96, 165, 250, .13);
    border-radius: 50%;
    color: #dbeafe;
    background: linear-gradient(135deg, rgba(37, 99, 235, .24), rgba(30, 64, 175, .12));
    box-shadow: inset 0 0 22px rgba(59, 130, 246, .08);
}

    .corporate-login-feature-icon svg {
        width: 22px;
        height: 22px;
    }

.corporate-login-feature > div:last-child {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.corporate-login-feature strong {
    color: #f8fbff;
    font-size: 12px;
    font-weight: 700;
}

.corporate-login-feature span {
    color: rgba(191, 219, 254, .59);
    font-size: 10px;
}


.corporate-login-hero-footer {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    color: rgba(191, 219, 254, .58);
    font-size: 9px;
}

    .corporate-login-hero-footer > div {
        display: flex;
        align-items: center;
        gap: 10px;
    }

.corporate-login-footer-line {
    width: 28px;
    height: 1px;
    background: #60a5fa;
}

.corporate-login-hero-footer small {
    color: rgba(147, 197, 253, .5);
    font-size: 8px;
    letter-spacing: .22em;
}


/* =========================================================
   RIGHT SIDE
   ========================================================= */

.corporate-login-form-side {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 80px 48px 46px;
    overflow: hidden;
    background: radial-gradient(circle at 88% 40%, rgba(37, 99, 235, .18), transparent 34%), linear-gradient(138deg, #09234a 0%, #071a35 50%, #06152b 100%);
}

    .corporate-login-form-side::before {
        content: "";
        position: absolute;
        width: 620px;
        height: 620px;
        right: -330px;
        top: 19%;
        border: 1px solid rgba(59, 130, 246, .21);
        border-radius: 50%;
        box-shadow: 0 0 0 48px rgba(59, 130, 246, .025), 0 0 0 96px rgba(59, 130, 246, .018);
    }

    .corporate-login-form-side::after {
        content: "";
        position: absolute;
        width: 430px;
        height: 430px;
        right: -220px;
        top: 29%;
        border-radius: 50%;
        background: radial-gradient(circle at 35% 40%, rgba(38, 118, 255, .15), transparent 60%);
        border: 1px solid rgba(59, 130, 246, .10);
    }


.corporate-login-top-message {
    position: absolute;
    top: 42px;
    right: 55px;
    color: rgba(147, 197, 253, .55);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .22em;
}


.corporate-login-card {
    position: relative;
    z-index: 4;
    width: min(100%, 455px);
    padding: 35px 41px 31px;
    border: 1px solid rgba(255, 255, 255, .64);
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
    box-shadow: 0 35px 80px rgba(0, 0, 0, .26), 0 5px 18px rgba(0, 0, 0, .13);
}


.corporate-login-card-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 30px;
}

.corporate-login-card-logo {
    width: 87px;
    height: 87px;
    object-fit: contain;
}

.corporate-login-card-name {
    margin-top: 3px;
    color: #0a326c;
    font-size: 37px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.045em;
}

    .corporate-login-card-name span {
        color: #1497e9;
    }

.corporate-login-card-subtitle {
    margin-top: 7px;
    color: #64748b;
    font-size: 10px;
}


.corporate-login-error {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 0 0 18px;
    padding: 10px 11px;
    border: 1px solid #fecaca;
    border-radius: 8px;
    background: #fef2f2;
    color: #b91c1c;
    font-size: 9px;
    line-height: 1.5;
}

    .corporate-login-error > span {
        width: 18px;
        height: 18px;
        flex: 0 0 18px;
        display: grid;
        place-items: center;
        border-radius: 50%;
        background: #fee2e2;
        font-size: 10px;
        font-weight: 800;
    }


.corporate-login-form {
    display: grid;
    gap: 18px;
}

.corporate-login-field label {
    display: block;
    margin-bottom: 7px;
    color: #0f172a;
    font-size: 10px;
    font-weight: 700;
}

.corporate-login-input {
    height: 48px;
    display: grid;
    grid-template-columns: 38px 1fr;
    align-items: center;
    border: 1px solid #cfd9e6;
    border-radius: 9px;
    overflow: hidden;
    background: #ffffff;
    transition: border-color .18s ease, box-shadow .18s ease;
}

    .corporate-login-input:focus-within {
        border-color: #4c8df5;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, .08);
    }

.corporate-login-input-icon {
    display: grid;
    place-items: center;
    color: #5877a2;
}

    .corporate-login-input-icon svg {
        width: 18px;
        height: 18px;
    }

.corporate-login-input input {
    width: 100%;
    height: 100%;
    border: 0;
    outline: 0;
    padding: 0 12px 0 0;
    background: transparent;
    color: #0f172a;
    font-size: 10px;
}

    .corporate-login-input input::placeholder {
        color: #9aa9be;
    }


.corporate-login-submit {
    height: 48px;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    margin-top: 2px;
    padding: 0 14px 0 42px;
    border: 0;
    border-radius: 9px;
    cursor: pointer;
    color: #ffffff;
    background: linear-gradient(90deg, #2b66ec, #2580f6);
    box-shadow: 0 8px 20px rgba(37, 99, 235, .19);
    font-size: 11px;
    font-weight: 700;
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

    .corporate-login-submit:hover {
        transform: translateY(-1px);
        box-shadow: 0 11px 25px rgba(37, 99, 235, .24);
        filter: saturate(1.08);
    }

    .corporate-login-submit:active {
        transform: translateY(0);
    }

    .corporate-login-submit svg {
        width: 18px;
        height: 18px;
    }


.corporate-login-security {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #e7edf5;
}

.corporate-login-security-icon {
    width: 31px;
    height: 31px;
    flex: 0 0 31px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #426a9d;
    background: #eff6ff;
}

    .corporate-login-security-icon svg {
        width: 18px;
        height: 18px;
    }

.corporate-login-security > div:last-child {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.corporate-login-security strong {
    color: #355278;
    font-size: 8.5px;
}

.corporate-login-security span {
    color: #94a3b8;
    font-size: 7.8px;
}


.corporate-login-form-footer {
    position: absolute;
    left: 50%;
    bottom: 21px;
    transform: translateX(-50%);
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(191, 219, 254, .47);
    font-size: 8px;
}

    .corporate-login-form-footer i {
        width: 3px;
        height: 3px;
        border-radius: 50%;
        background: rgba(147, 197, 253, .45);
    }


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .corporate-login-page {
        grid-template-columns: .95fr 1.05fr;
    }

    .corporate-login-hero {
        padding: 36px 38px 30px;
    }

    .corporate-login-hero-content h1 {
        font-size: 39px;
    }
}


@media (max-width: 900px) {

    .corporate-login-page {
        display: block;
        min-height: 100vh;
    }

    .corporate-login-hero {
        display: none;
    }

    .corporate-login-form-side {
        min-height: 100vh;
        padding: 62px 22px 45px;
    }

    .corporate-login-card {
        width: min(100%, 430px);
        padding: 32px 30px 28px;
    }

    .corporate-login-top-message {
        top: 25px;
        right: 50%;
        transform: translateX(50%);
        width: 100%;
        text-align: center;
    }
}


@media (max-width: 520px) {

    .corporate-login-form-side {
        padding: 45px 14px 36px;
    }

    .corporate-login-card {
        padding: 28px 22px 24px;
        border-radius: 15px;
    }

    .corporate-login-card-logo {
        width: 75px;
        height: 75px;
    }

    .corporate-login-card-name {
        font-size: 32px;
    }

    .corporate-login-top-message {
        display: none;
    }
}



/* =========================================================
   TOPBAR - LOGOUT
   ========================================================= */

.topbar-right {
    display: flex;
    align-items: center;
    gap: 18px;
}

.logout-form {
    margin: 0;
}

.logout-button {
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 13px;
    border: 1px solid #e2e8f0;
    border-radius: 9px;
    background: #ffffff;
    color: #64748b;
    cursor: pointer;
    font-size: 10px;
    font-weight: 700;
    transition: border-color .18s ease, color .18s ease, background .18s ease, box-shadow .18s ease;
}

    .logout-button svg {
        width: 16px;
        height: 16px;
    }

    .logout-button:hover {
        border-color: #fecaca;
        background: #fef2f2;
        color: #dc2626;
        box-shadow: 0 3px 10px rgba(220, 38, 38, .08);
    }

    .logout-button:active {
        transform: translateY(1px);
    }


/* =========================================================
   REISAI - SECURE DATA ASSISTANT V1
   Add to wwwroot/app.css
   ========================================================= */

.data-assistant-page {
    width: 100%;
}

.data-assistant-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 17px;
}

    .data-assistant-header h1 {
        margin: 7px 0 5px;
        color: #0f172a;
        font-size: 24px;
    }

    .data-assistant-header p {
        max-width: 720px;
        margin: 0;
        color: #64748b;
        font-size: 10px;
        line-height: 1.6;
    }

.data-assistant-security {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 12px;
    border: 1px solid #bbf7d0;
    border-radius: 10px;
    background: #f0fdf4;
}

.data-assistant-security-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 4px rgba(34, 197, 94, .10);
}

.data-assistant-security > div:last-child {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.data-assistant-security strong {
    color: #166534;
    font-size: 9px;
}

.data-assistant-security span {
    color: #65a30d;
    font-size: 7.5px;
}


/* =========================================================
   SUGGESTIONS
   ========================================================= */

.data-assistant-suggestions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

    .data-assistant-suggestions button {
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 9px;
        padding: 10px 12px;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        background: #ffffff;
        color: #475569;
        cursor: pointer;
        font-size: 9px;
        font-weight: 600;
        text-align: left;
        transition: all .16s ease;
    }

        .data-assistant-suggestions button:hover {
            border-color: #bfdbfe;
            background: #eff6ff;
            color: #1d4ed8;
            transform: translateY(-1px);
        }

        .data-assistant-suggestions button span {
            width: 24px;
            height: 24px;
            flex: 0 0 24px;
            display: grid;
            place-items: center;
            border-radius: 7px;
            background: #eff6ff;
            color: #2563eb;
            font-size: 7px;
            font-weight: 800;
        }


/* =========================================================
   SHELL
   ========================================================= */

.data-assistant-shell {
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 15px;
    background: #ffffff;
    box-shadow: 0 4px 18px rgba(15, 23, 42, .04);
}


/* =========================================================
   CHAT
   ========================================================= */

.data-assistant-chat {
    min-height: 450px;
    max-height: calc(100vh - 335px);
    overflow-y: auto;
    padding: 22px;
    background: linear-gradient( 180deg, #fbfdff 0%, #ffffff 100% );
}

.data-assistant-empty {
    min-height: 390px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.data-assistant-empty-logo {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    margin-bottom: 13px;
    border: 1px solid #bfdbfe;
    border-radius: 15px;
    color: #2563eb;
    background: linear-gradient( 145deg, #eff6ff, #dbeafe );
    font-size: 14px;
    font-weight: 800;
}

.data-assistant-empty h2 {
    margin: 0;
    color: #0f172a;
    font-size: 17px;
}

.data-assistant-empty > p {
    max-width: 450px;
    margin: 7px 0 0;
    color: #94a3b8;
    font-size: 9px;
    line-height: 1.55;
}

.data-assistant-example {
    max-width: 500px;
    margin-top: 18px;
    padding: 10px 13px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #ffffff;
}

    .data-assistant-example span {
        display: block;
        margin-bottom: 4px;
        color: #94a3b8;
        font-size: 7px;
        font-weight: 700;
    }

    .data-assistant-example strong {
        color: #475569;
        font-size: 9px;
        font-weight: 600;
    }


.data-assistant-message {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-bottom: 18px;
}

    .data-assistant-message.user {
        justify-content: flex-end;
    }

.data-assistant-avatar,
.data-assistant-user-avatar {
    width: 31px;
    height: 31px;
    flex: 0 0 31px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    font-size: 8px;
    font-weight: 800;
}

.data-assistant-avatar {
    border: 1px solid #bfdbfe;
    background: #eff6ff;
    color: #2563eb;
}

.data-assistant-user-avatar {
    background: #0f172a;
    color: #ffffff;
}

.data-assistant-message-content {
    max-width: min(760px, 78%);
}

.data-assistant-message.user .data-assistant-message-content {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.data-assistant-message-bubble {
    white-space: pre-wrap;
    padding: 10px 13px;
    border: 1px solid #e2e8f0;
    border-radius: 5px 13px 13px 13px;
    background: #ffffff;
    color: #334155;
    font-size: 10px;
    line-height: 1.6;
}

.data-assistant-message.user .data-assistant-message-bubble {
    border: 0;
    border-radius: 13px 5px 13px 13px;
    background: linear-gradient( 135deg, #2563eb, #2f80ed );
    color: #ffffff;
}

.data-assistant-message-time {
    display: block;
    margin-top: 5px;
    color: #c0cad7;
    font-size: 7px;
}


/* =========================================================
   FACTS
   ========================================================= */

.data-assistant-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 8px;
}

.data-assistant-fact {
    min-width: 108px;
    padding: 8px 10px;
    border: 1px solid #e2e8f0;
    border-radius: 9px;
    background: #f8fafc;
}

    .data-assistant-fact span {
        display: block;
        color: #94a3b8;
        font-size: 7px;
        font-weight: 700;
    }

    .data-assistant-fact strong {
        display: block;
        margin-top: 3px;
        color: #334155;
        font-size: 10px;
    }

    .data-assistant-fact.primary {
        border-color: #bfdbfe;
        background: #eff6ff;
    }

        .data-assistant-fact.primary strong {
            color: #1d4ed8;
        }

    .data-assistant-fact.danger {
        border-color: #fecaca;
        background: #fef2f2;
    }

        .data-assistant-fact.danger strong {
            color: #dc2626;
        }

    .data-assistant-fact.positive {
        border-color: #bbf7d0;
        background: #f0fdf4;
    }

        .data-assistant-fact.positive strong {
            color: #16a34a;
        }


/* =========================================================
   THINKING
   ========================================================= */

.data-assistant-thinking {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 10px 13px;
    border: 1px solid #e2e8f0;
    border-radius: 5px 13px 13px 13px;
    background: #ffffff;
}

    .data-assistant-thinking > span {
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: #60a5fa;
        animation: reisai-data-thinking 1.1s infinite ease-in-out;
    }

        .data-assistant-thinking > span:nth-child(2) {
            animation-delay: .13s;
        }

        .data-assistant-thinking > span:nth-child(3) {
            animation-delay: .26s;
        }

    .data-assistant-thinking small {
        margin-left: 5px;
        color: #94a3b8;
        font-size: 8px;
    }

@keyframes reisai-data-thinking {

    0%, 60%, 100% {
        opacity: .25;
        transform: translateY(0);
    }

    30% {
        opacity: 1;
        transform: translateY(-3px);
    }
}


/* =========================================================
   CONTEXT
   ========================================================= */

.data-assistant-context {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 9px 15px;
    border-top: 1px solid #e2e8f0;
    background: #f8fafc;
}

    .data-assistant-context > div {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .data-assistant-context span {
        color: #94a3b8;
        font-size: 7px;
        font-weight: 800;
    }

    .data-assistant-context strong {
        color: #1d4ed8;
        font-size: 9px;
    }

    .data-assistant-context small {
        max-width: 380px;
        overflow: hidden;
        color: #64748b;
        font-size: 8px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .data-assistant-context button {
        border: 0;
        background: transparent;
        color: #64748b;
        cursor: pointer;
        font-size: 8px;
    }


/* =========================================================
   INPUT
   ========================================================= */

.data-assistant-input-area {
    padding: 13px 15px;
    border-top: 1px solid #e2e8f0;
    background: #ffffff;
}

.data-assistant-input-box {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: end;
    gap: 10px;
    padding: 7px 7px 7px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    background: #ffffff;
    transition: all .16s ease;
}

    .data-assistant-input-box:focus-within {
        border-color: #60a5fa;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, .07);
    }

    .data-assistant-input-box textarea {
        width: 100%;
        min-height: 42px;
        max-height: 125px;
        resize: vertical;
        padding: 10px 0 4px;
        border: 0;
        outline: 0;
        background: transparent;
        color: #0f172a;
        font-family: inherit;
        font-size: 10px;
        line-height: 1.5;
    }

        .data-assistant-input-box textarea::placeholder {
            color: #94a3b8;
        }

    .data-assistant-input-box button {
        height: 38px;
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 0 13px;
        border: 0;
        border-radius: 9px;
        background: #2563eb;
        color: #ffffff;
        cursor: pointer;
        font-size: 9px;
        font-weight: 700;
    }

        .data-assistant-input-box button:disabled {
            opacity: .45;
            cursor: default;
        }

        .data-assistant-input-box button svg {
            width: 15px;
            height: 15px;
        }

.data-assistant-input-note {
    display: flex;
    justify-content: flex-end;
    gap: 7px;
    margin-top: 6px;
    color: #b0bccb;
    font-size: 7px;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .data-assistant-suggestions {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {

    .data-assistant-header {
        flex-direction: column;
    }

    .data-assistant-suggestions {
        grid-template-columns: 1fr;
    }

    .data-assistant-chat {
        max-height: none;
    }

    .data-assistant-message-content {
        max-width: 86%;
    }

    .data-assistant-context {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* =========================================================
   REISAI DATA ASSISTANT V2 - INLINE BAR CHART
   app.css dosyasının en altına ekleyin.
   ========================================================= */

.data-assistant-chart-card {
    width: min(100%, 820px);
    margin-top: 10px;
    padding: 14px;
    border: 1px solid #dce6f2;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 5px 18px rgba(15, 23, 42, .035);
}

.data-assistant-chart-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid #edf2f7;
}

    .data-assistant-chart-header h3 {
        margin: 0;
        color: #0f172a;
        font-size: 12px;
        font-weight: 800;
    }

    .data-assistant-chart-header p {
        margin: 4px 0 0;
        color: #94a3b8;
        font-size: 8px;
    }

    .data-assistant-chart-header > span {
        flex: 0 0 auto;
        padding: 5px 8px;
        border-radius: 7px;
        background: #eff6ff;
        color: #2563eb;
        font-size: 7px;
        font-weight: 800;
    }

.data-assistant-bar-chart {
    max-height: 440px;
    overflow-y: auto;
    padding-right: 5px;
}

.data-assistant-bar-row {
    display: grid;
    grid-template-columns: minmax(105px, 150px) minmax(180px, 1fr) 80px;
    align-items: center;
    gap: 10px;
    min-height: 29px;
    padding: 4px 0;
}

.data-assistant-bar-label {
    overflow: hidden;
    color: #334155;
    font-size: 8px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.data-assistant-bar-track {
    height: 13px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf3fb;
}

.data-assistant-bar-fill {
    min-width: 2px;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient( 90deg, #2563eb, #4f94ff );
    transition: width .25s ease;
}

.data-assistant-bar-value {
    color: #0f172a;
    font-size: 8px;
    font-weight: 800;
    text-align: right;
}

@media (max-width: 760px) {

    .data-assistant-bar-row {
        grid-template-columns: 90px minmax(100px, 1fr) 62px;
        gap: 7px;
    }

    .data-assistant-chart-card {
        padding: 11px;
    }
}


/* =========================================================
   REISAI DATA ASSISTANT V2.1 - MONTHLY PRODUCT CHART
   ========================================================= */

.data-assistant-monthly-product-chart {
    width: min(100%, 900px);
    margin-top: 10px;
    padding: 14px;
    border: 1px solid #dce6f2;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(15, 23, 42, .035);
}

.monthly-product-series {
    padding: 12px 0;
    border-top: 1px solid #edf2f7;
}

    .monthly-product-series:first-of-type {
        border-top: 0;
    }

.monthly-product-series-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

    .monthly-product-series-title > div {
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .monthly-product-series-title strong {
        color: #0f172a;
        font-size: 9px;
    }

    .monthly-product-series-title span {
        overflow: hidden;
        color: #94a3b8;
        font-size: 7px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .monthly-product-series-title b {
        flex: 0 0 auto;
        color: #2563eb;
        font-size: 8px;
    }

.monthly-product-bars {
    height: 120px;
    display: flex;
    align-items: flex-end;
    gap: 7px;
}

.monthly-product-bar-item {
    min-width: 34px;
    flex: 1;
    height: 100%;
    display: grid;
    grid-template-rows: 18px 1fr 18px;
    align-items: end;
    text-align: center;
}

.monthly-product-value {
    align-self: center;
    color: #475569;
    font-size: 7px;
    font-weight: 700;
}

.monthly-product-bar-zone {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: hidden;
    border-radius: 5px 5px 2px 2px;
    background: linear-gradient(180deg, rgba(239,246,255,.25), rgba(239,246,255,.9));
}

.monthly-product-bar-fill {
    width: 68%;
    min-height: 2px;
    border-radius: 5px 5px 1px 1px;
    background: linear-gradient(180deg, #4f94ff, #2563eb);
}

.monthly-product-month {
    align-self: end;
    padding-top: 5px;
    color: #64748b;
    font-size: 7px;
    font-weight: 700;
}

@media (max-width: 760px) {
    .data-assistant-monthly-product-chart {
        overflow-x: auto;
    }

    .monthly-product-bars {
        min-width: 430px;
    }
}


/* =========================================================
   REISAI DATA ASSISTANT V2.3 - RESULT TABLES
   app.css sonuna ekleyin
   ========================================================= */

.data-assistant-table-card {
    width: min(100%, 980px);
    margin-top: 10px;
    padding: 14px;
    border: 1px solid #dce6f2;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 5px 18px rgba(15, 23, 42, .035);
}

.data-assistant-table-scroll {
    width: 100%;
    overflow-x: auto;
}

.data-assistant-result-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 8px;
}

    .data-assistant-result-table th {
        padding: 8px 9px;
        border-bottom: 1px solid #dbe5f0;
        background: #f8fafc;
        color: #64748b;
        font-size: 7px;
        font-weight: 800;
        text-align: left;
        white-space: nowrap;
    }

    .data-assistant-result-table td {
        padding: 8px 9px;
        border-bottom: 1px solid #edf2f7;
        color: #334155;
        vertical-align: top;
    }

    .data-assistant-result-table tbody tr:last-child td {
        border-bottom: 0;
    }

    .data-assistant-result-table tbody tr:hover td {
        background: #f8fbff;
    }

    .data-assistant-result-table tbody tr.danger td {
        background: #fff8f8;
    }

        .data-assistant-result-table tbody tr.danger td:nth-child(4) {
            color: #dc2626;
            font-weight: 800;
        }

@media (max-width: 760px) {

    .data-assistant-table-card {
        padding: 10px;
    }

    .data-assistant-result-table {
        min-width: 720px;
    }
}

/* =========================================================
   REISAI DATA ASSISTANT V2.3 - RESULT TABLES
   app.css sonuna ekleyin
   ========================================================= */

.data-assistant-table-card {
    width: min(100%, 980px);
    margin-top: 10px;
    padding: 14px;
    border: 1px solid #dce6f2;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 5px 18px rgba(15, 23, 42, .035);
}

.data-assistant-table-scroll {
    width: 100%;
    overflow-x: auto;
}

.data-assistant-result-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 8px;
}

    .data-assistant-result-table th {
        padding: 8px 9px;
        border-bottom: 1px solid #dbe5f0;
        background: #f8fafc;
        color: #64748b;
        font-size: 7px;
        font-weight: 800;
        text-align: left;
        white-space: nowrap;
    }

    .data-assistant-result-table td {
        padding: 8px 9px;
        border-bottom: 1px solid #edf2f7;
        color: #334155;
        vertical-align: top;
    }

    .data-assistant-result-table tbody tr:last-child td {
        border-bottom: 0;
    }

    .data-assistant-result-table tbody tr:hover td {
        background: #f8fbff;
    }

    .data-assistant-result-table tbody tr.danger td {
        background: #fff8f8;
    }

        .data-assistant-result-table tbody tr.danger td:nth-child(4) {
            color: #dc2626;
            font-weight: 800;
        }

@media (max-width: 760px) {

    .data-assistant-table-card {
        padding: 10px;
    }

    .data-assistant-result-table {
        min-width: 720px;
    }
}


/* =========================================================
   SALES / COST IMPORT
   app.css sonuna ekleyin
   ========================================================= */

.sales-cost-import-page {
    width: 100%;
}

.sales-cost-import-header {
    margin-bottom: 18px;
}

    .sales-cost-import-header h1 {
        margin: 7px 0 5px;
        color: #0f172a;
        font-size: 24px;
    }

    .sales-cost-import-header p {
        margin: 0;
        color: #64748b;
        font-size: 10px;
    }

.sales-cost-import-card {
    max-width: 850px;
    padding: 22px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 5px 20px rgba(15, 23, 42, .04);
}

.sales-cost-import-status {
    margin-top: 16px;
    padding: 13px;
    border-radius: 10px;
    font-size: 9px;
}

    .sales-cost-import-status.loading {
        border: 1px solid #bfdbfe;
        background: #eff6ff;
        color: #1d4ed8;
    }

    .sales-cost-import-status.error {
        border: 1px solid #fecaca;
        background: #fef2f2;
        color: #b91c1c;
    }

    .sales-cost-import-status.success {
        border: 1px solid #bbf7d0;
        background: #f0fdf4;
        color: #166534;
    }

.sales-cost-import-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
    margin: 13px 0;
}

    .sales-cost-import-kpis > div {
        padding: 10px;
        border: 1px solid rgba(22, 101, 52, .10);
        border-radius: 9px;
        background: #ffffff;
    }

    .sales-cost-import-kpis span {
        display: block;
        color: #64748b;
        font-size: 7px;
        font-weight: 700;
    }

    .sales-cost-import-kpis b {
        display: block;
        margin-top: 4px;
        color: #0f172a;
        font-size: 11px;
    }

@media (max-width: 760px) {

    .sales-cost-import-kpis {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* =========================================================
   REISAI - REAL SALES / COST ANALYSIS V1
   app.css sonuna ekleyin
   ========================================================= */

.real-sales-page {
    width: 100%;
}

.real-sales-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 16px;
}

    .real-sales-header h1 {
        margin: 7px 0 5px;
        color: #0f172a;
        font-size: 24px;
    }

    .real-sales-header p {
        margin: 0;
        color: #64748b;
        font-size: 10px;
    }

.real-sales-source {
    padding: 8px 11px;
    border: 1px solid #bbf7d0;
    border-radius: 9px;
    background: #f0fdf4;
    color: #15803d;
    font-size: 8px;
    font-weight: 700;
}


/* FILTER */

.real-sales-filter {
    display: flex;
    align-items: end;
    gap: 12px;
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
}

.real-sales-filter-field {
    min-width: 140px;
}

    .real-sales-filter-field label,
    .real-sales-period span {
        display: block;
        margin-bottom: 5px;
        color: #94a3b8;
        font-size: 7px;
        font-weight: 800;
    }

    .real-sales-filter-field select {
        width: 100%;
        height: 37px;
        padding: 0 10px;
        border: 1px solid #cbd5e1;
        border-radius: 8px;
        background: #fff;
        color: #0f172a;
        font-size: 9px;
    }

.real-sales-period {
    margin-left: auto;
    text-align: right;
}

    .real-sales-period strong {
        color: #334155;
        font-size: 9px;
    }


/* KPI */

.real-sales-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.real-sales-kpi {
    padding: 13px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
}

    .real-sales-kpi.primary {
        border-color: #bfdbfe;
        background: #eff6ff;
    }

    .real-sales-kpi.positive {
        border-color: #bbf7d0;
        background: #f0fdf4;
    }

    .real-sales-kpi.negative {
        border-color: #fecaca;
        background: #fef2f2;
    }

    .real-sales-kpi span {
        display: block;
        color: #94a3b8;
        font-size: 7px;
        font-weight: 800;
    }

    .real-sales-kpi strong {
        display: block;
        margin-top: 6px;
        color: #0f172a;
        font-size: 16px;
    }

    .real-sales-kpi small {
        display: block;
        margin-top: 4px;
        color: #94a3b8;
        font-size: 7px;
    }


/* CARD */

.real-sales-card {
    margin-bottom: 14px;
    padding: 15px;
    border: 1px solid #e2e8f0;
    border-radius: 13px;
    background: #ffffff;
    box-shadow: 0 4px 16px rgba(15, 23, 42, .035);
}

.real-sales-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 13px;
}

    .real-sales-card-header h3 {
        margin: 0;
        color: #0f172a;
        font-size: 12px;
    }

    .real-sales-card-header p {
        margin: 4px 0 0;
        color: #94a3b8;
        font-size: 8px;
    }

.real-sales-count {
    padding: 5px 8px;
    border-radius: 7px;
    background: #eff6ff;
    color: #2563eb;
    font-size: 7px;
    font-weight: 800;
}

.real-sales-grid-two {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}


/* MONTHLY */

.real-sales-monthly-chart {
    min-height: 220px;
    display: flex;
    align-items: stretch;
    gap: 8px;
    overflow-x: auto;
}

.real-sales-month {
    min-width: 76px;
    flex: 1;
    display: grid;
    grid-template-rows: 38px 1fr 20px 18px;
    text-align: center;
}

.real-sales-month-values {
    display: flex;
    flex-direction: column;
    gap: 2px;
    color: #94a3b8;
    font-size: 6.5px;
}

.real-sales-month-zone {
    min-height: 145px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    border-bottom: 1px solid #e2e8f0;
    background: linear-gradient( 180deg, rgba(248, 250, 252, .15), #f8fafc );
}

.real-sales-month-pair {
    width: 75%;
    height: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 4px;
}

.real-sales-month-bar {
    width: 42%;
    min-height: 2px;
    border-radius: 4px 4px 1px 1px;
}

    .real-sales-month-bar.sales {
        background: #2563eb;
    }

    .real-sales-month-bar.cost {
        background: #94a3b8;
    }

.real-sales-month > strong {
    align-self: center;
    color: #334155;
    font-size: 8px;
}

.real-sales-month > small {
    font-size: 7px;
    font-weight: 700;
}

    .real-sales-month > small.profit,
    .value-positive {
        color: #16a34a !important;
    }

    .real-sales-month > small.loss,
    .value-negative {
        color: #dc2626 !important;
    }

.real-sales-chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 9px;
    color: #94a3b8;
    font-size: 7px;
}

    .real-sales-chart-legend span.sales::before,
    .real-sales-chart-legend span.cost::before {
        content: "";
        display: inline-block;
        width: 8px;
        height: 8px;
        margin-right: 4px;
        border-radius: 2px;
        vertical-align: -1px;
    }

    .real-sales-chart-legend span.sales::before {
        background: #2563eb;
    }

    .real-sales-chart-legend span.cost::before {
        background: #94a3b8;
    }


/* RANK */

.real-sales-rank-row {
    display: grid;
    grid-template-columns: minmax(120px, 180px) 1fr 110px;
    align-items: center;
    gap: 10px;
    min-height: 39px;
    border-bottom: 1px solid #f1f5f9;
}

    .real-sales-rank-row:last-child {
        border-bottom: 0;
    }

.real-sales-rank-info {
    min-width: 0;
}

    .real-sales-rank-info strong {
        display: block;
        overflow: hidden;
        color: #334155;
        font-size: 8px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .real-sales-rank-info span {
        display: block;
        margin-top: 2px;
        overflow: hidden;
        color: #94a3b8;
        font-size: 6.5px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.real-sales-rank-bar-zone {
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf3fb;
}

.real-sales-rank-bar {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient( 90deg, #2563eb, #60a5fa );
}

.real-sales-rank-value {
    text-align: right;
}

    .real-sales-rank-value strong {
        display: block;
        color: #0f172a;
        font-size: 8px;
    }

    .real-sales-rank-value small {
        display: block;
        margin-top: 2px;
        font-size: 6.5px;
    }


/* TABLE */

.real-sales-table-scroll {
    width: 100%;
    overflow-x: auto;
}

.real-sales-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 8px;
}

    .real-sales-table th {
        padding: 8px;
        border-bottom: 1px solid #dbe5f0;
        background: #f8fafc;
        color: #64748b;
        font-size: 7px;
        font-weight: 800;
        text-align: left;
        white-space: nowrap;
    }

    .real-sales-table td {
        padding: 8px;
        border-bottom: 1px solid #edf2f7;
        color: #334155;
        vertical-align: top;
    }

    .real-sales-table tbody tr:hover td {
        background: #f8fbff;
    }

    .real-sales-table small {
        color: #94a3b8;
        font-size: 6.5px;
    }


/* STATUS */

.real-sales-status-list {
    display: grid;
    gap: 7px;
}

.real-sales-status-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 10px;
    border: 1px solid #edf2f7;
    border-radius: 9px;
    background: #fbfdff;
}

    .real-sales-status-row > div:first-child {
        min-width: 0;
    }

    .real-sales-status-row > div:last-child {
        flex: 0 0 auto;
        text-align: right;
    }

    .real-sales-status-row strong,
    .real-sales-status-row b {
        display: block;
        color: #334155;
        font-size: 8px;
    }

    .real-sales-status-row span,
    .real-sales-status-row small {
        display: block;
        margin-top: 3px;
        color: #94a3b8;
        font-size: 6.5px;
    }


/* RESPONSIVE */

@media (max-width: 1100px) {

    .real-sales-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .real-sales-grid-two {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {

    .real-sales-header,
    .real-sales-filter {
        flex-direction: column;
        align-items: stretch;
    }

    .real-sales-period {
        margin-left: 0;
        text-align: left;
    }

    .real-sales-kpis {
        grid-template-columns: 1fr;
    }

    .real-sales-rank-row {
        grid-template-columns: 110px 1fr 88px;
    }
}

/* =========================================================
   REISAI SALES ANALYSIS V2
   app.css sonuna ekleyin
   ========================================================= */

.real-sales-filter.v2 {
    display: grid;
    grid-template-columns: 110px 130px minmax(160px, .8fr) minmax(230px, 1.2fr) minmax(180px, 1fr);
    align-items: end;
}

.real-sales-filter-field.wide {
    min-width: 0;
}

.real-sales-kpis.v2 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.invoice-category {
    display: inline-flex;
    align-items: center;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: 6.5px;
    font-weight: 800;
    white-space: nowrap;
}

    .invoice-category.sale {
        background: #eff6ff;
        color: #2563eb;
    }

    .invoice-category.return {
        background: #fef2f2;
        color: #dc2626;
    }

    .invoice-category.deduction {
        background: #fff7ed;
        color: #c2410c;
    }

    .invoice-category.cancellation {
        background: #fdf2f8;
        color: #be185d;
    }

    .invoice-category.other {
        background: #f1f5f9;
        color: #64748b;
    }

.real-sales-table tbody tr.analysis-negative-row td {
    background: #fffafa;
}

.real-sales-table tbody tr.analysis-negative-row:hover td {
    background: #fff4f4;
}

@media (max-width: 1250px) {

    .real-sales-filter.v2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {

    .real-sales-filter.v2 {
        display: grid;
        grid-template-columns: 1fr;
    }

    .real-sales-kpis.v2 {
        grid-template-columns: 1fr;
    }
}



/* =========================================================
   REISAI SALES ANALYSIS V3
   app.css sonuna ekleyin
   ========================================================= */

.real-sales-filter.v3 {
    display: grid;
    grid-template-columns: 105px 90px 115px minmax(160px, .85fr) minmax(230px, 1.25fr) minmax(170px, .95fr);
    align-items: end;
}

.real-sales-kpis.v3 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.real-sales-monthly-chart.v3 {
    min-height: 245px;
}

.real-sales-month.v3 {
    min-width: 82px;
}

.real-sales-month-pair.triple {
    width: 80%;
    gap: 3px;
}

    .real-sales-month-pair.triple .real-sales-month-bar {
        width: 30%;
    }

.real-sales-month-bar.profit {
    background: #22c55e;
}

    .real-sales-month-bar.profit.loss {
        background: #ef4444;
    }

.real-sales-chart-legend span.profit-legend::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 4px;
    border-radius: 2px;
    background: #22c55e;
    vertical-align: -1px;
}

.real-sales-count.danger {
    background: #fef2f2;
    color: #dc2626;
}

.missing-cost-card {
    border-color: #fecaca;
}

.real-sales-table tbody tr.missing-cost-row td {
    background: #fffafa;
}

.real-sales-table tbody tr.missing-cost-row:hover td {
    background: #fff4f4;
}

.empty-analysis-result {
    padding: 18px;
    border: 1px dashed #dbe5f0;
    border-radius: 10px;
    background: #f8fafc;
    color: #64748b;
    font-size: 9px;
    text-align: center;
}

@media (max-width: 1400px) {

    .real-sales-filter.v3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 950px) {

    .real-sales-filter.v3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {

    .real-sales-filter.v3 {
        grid-template-columns: 1fr;
    }

    .real-sales-kpis.v3 {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   REISAI VOICE ASSISTANT V1
   app.css sonuna ekleyin
   ========================================================= */

.data-assistant-input-box.voice-enabled {
    grid-template-columns: minmax(0, 1fr) auto auto;
}

.data-assistant-input-box .data-assistant-mic-button {
    min-width: 67px;
    justify-content: center;
    padding: 0 10px;
    border: 1px solid #dbeafe;
    background: #eff6ff;
    color: #2563eb;
}

    .data-assistant-input-box .data-assistant-mic-button:hover:not(:disabled) {
        border-color: #93c5fd;
        background: #dbeafe;
    }

    .data-assistant-input-box .data-assistant-mic-button.recording {
        border-color: #fecaca;
        background: #fef2f2;
        color: #dc2626;
        box-shadow: 0 0 0 3px rgba(220, 38, 38, .07);
    }

.data-assistant-mic-label {
    font-size: 8px;
    font-weight: 800;
}

.voice-note {
    min-height: 18px;
    align-items: center;
}

.voice-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 8px;
    font-weight: 700;
}

    .voice-status.recording {
        color: #dc2626;
    }

    .voice-status.transcribing {
        color: #2563eb;
    }

    .voice-status.error {
        color: #b91c1c;
    }

.voice-status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #ef4444;
    animation: reisaiVoicePulse 1s infinite ease-in-out;
}

.voice-spinner {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(37, 99, 235, .20);
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: reisaiVoiceSpin .75s linear infinite;
}

@keyframes reisaiVoicePulse {

    0%, 100% {
        transform: scale(.85);
        opacity: .55;
    }

    50% {
        transform: scale(1.15);
        opacity: 1;
    }
}

@keyframes reisaiVoiceSpin {

    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 760px) {

    .data-assistant-input-box.voice-enabled {
        grid-template-columns: minmax(0, 1fr) 54px 74px;
    }

    .data-assistant-input-box .data-assistant-mic-button {
        min-width: 54px;
        padding: 0 7px;
    }

    .data-assistant-mic-label {
        display: none;
    }
}


/* =========================================================
   REISAI DATA ASSISTANT - WARNINGS
   app.css sonuna ekleyin
   ========================================================= */

.data-assistant-warnings {
    display: grid;
    gap: 6px;
    margin-top: 8px;
}

.data-assistant-warning {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    padding: 8px 10px;
    border: 1px solid #fde68a;
    border-radius: 9px;
    background: #fffbeb;
    color: #92400e;
    font-size: 8px;
    line-height: 1.45;
}

.data-assistant-warning-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #f59e0b;
    color: #ffffff;
    font-size: 9px;
    font-weight: 800;
}

/* =========================================================
   REISAI VOICE ASSISTANT V2
   app.css sonuna ekleyin
   ========================================================= */

.voice-status.ready {
    color: #15803d;
}


/* REISAI SALES INTELLIGENCE V4 - app.css sonuna ekleyin */
.voice-status.ready {
    color: #15803d;
}

.data-assistant-insights {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
    margin-top: 9px;
}

.data-assistant-insight {
    padding: 10px 11px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f8fafc;
}

    .data-assistant-insight strong {
        display: block;
        margin-bottom: 4px;
        color: #0f172a;
        font-size: 8px;
    }

    .data-assistant-insight span {
        color: #64748b;
        font-size: 7.5px;
        line-height: 1.45;
    }

    .data-assistant-insight.positive {
        border-color: #bbf7d0;
        background: #f0fdf4;
    }

    .data-assistant-insight.danger {
        border-color: #fecaca;
        background: #fef2f2;
    }

    .data-assistant-insight.warning {
        border-color: #fde68a;
        background: #fffbeb;
    }

.data-assistant-series-card {
    margin-top: 10px;
    padding: 13px;
    border: 1px solid #dbe5f0;
    border-radius: 12px;
    background: #fff;
}

.data-assistant-series-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 10px;
    color: #64748b;
    font-size: 7px;
}

    .data-assistant-series-legend span::before {
        content: "";
        display: inline-block;
        width: 8px;
        height: 8px;
        margin-right: 4px;
        border-radius: 2px;
        background: #64748b;
        vertical-align: -1px;
    }

    .data-assistant-series-legend span.primary::before {
        background: #2563eb;
    }

    .data-assistant-series-legend span.positive::before {
        background: #16a34a;
    }

    .data-assistant-series-legend span.warning::before {
        background: #f59e0b;
    }

    .data-assistant-series-legend span.neutral::before {
        background: #94a3b8;
    }

.data-assistant-series-chart {
    min-width: max-content;
    height: 210px;
    display: flex;
    align-items: stretch;
    gap: 8px;
    padding-top: 8px;
    overflow-x: auto;
}

.data-assistant-series-category {
    min-width: 58px;
    flex: 1;
    display: grid;
    grid-template-rows: 1fr 20px;
    text-align: center;
}

.data-assistant-series-bars {
    height: 180px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 3px;
    border-bottom: 1px solid #e2e8f0;
}

.data-assistant-series-bar-wrap {
    width: 11px;
    height: 100%;
    display: flex;
    align-items: flex-end;
}

.data-assistant-series-bar {
    width: 100%;
    min-height: 2px;
    border-radius: 3px 3px 0 0;
    background: #64748b;
}

    .data-assistant-series-bar.primary {
        background: #2563eb;
    }

    .data-assistant-series-bar.positive {
        background: #16a34a;
    }

    .data-assistant-series-bar.warning {
        background: #f59e0b;
    }

    .data-assistant-series-bar.neutral {
        background: #94a3b8;
    }

    .data-assistant-series-bar.negative {
        background: #dc2626;
    }

.data-assistant-series-category > strong {
    align-self: center;
    color: #475569;
    font-size: 6.5px;
    font-weight: 700;
}

@media(max-width:900px) {
    .data-assistant-insights {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   REISAI SALES ANALYSIS V4 - AI / PDF / EXCEL
   app.css sonuna ekleyin
   ========================================================= */

.real-sales-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.sales-export-button,
.sales-ai-button {
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    border-radius: 12px;
    font-weight: 800;
    font-size: 11px;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.sales-export-button {
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #0f172a;
}

    .sales-export-button.excel {
        border-color: #bbf7d0;
        background: #f0fdf4;
        color: #15803d;
    }

.sales-ai-button {
    border: 0;
    background: linear-gradient(135deg, #2563eb, #4f46e5);
    color: #ffffff;
    box-shadow: 0 8px 20px rgba(37, 99, 235, .18);
}

    .sales-export-button:hover:not(:disabled),
    .sales-ai-button:hover:not(:disabled) {
        transform: translateY(-1px);
    }

    .sales-export-button:disabled,
    .sales-ai-button:disabled {
        opacity: .55;
        cursor: not-allowed;
    }

.sales-action-error {
    margin-bottom: 12px;
}

.sales-ai-analysis-card {
    border-color: #bfdbfe;
    background: linear-gradient( 180deg, rgba(239, 246, 255, .55), rgba(255, 255, 255, 1) );
}

.sales-ai-analysis-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    height: 28px;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 10px;
    font-weight: 900;
}

.sales-ai-loading {
    padding: 22px;
    color: #2563eb;
    font-size: 11px;
    font-weight: 800;
    text-align: center;
}

.sales-ai-analysis-text {
    padding: 4px 2px;
    color: #334155;
    font-size: 10px;
    line-height: 1.75;
    white-space: pre-wrap;
}

@media (max-width: 1050px) {

    .real-sales-header-actions {
        justify-content: flex-start;
    }
}


/* =========================================================
   REISAI SALES ANALYSIS V4 - AI / PDF / EXCEL
   app.css sonuna ekleyin
   ========================================================= */

.real-sales-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.sales-export-button,
.sales-ai-button {
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    border-radius: 12px;
    font-weight: 800;
    font-size: 11px;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.sales-export-button {
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #0f172a;
}

    .sales-export-button.excel {
        border-color: #bbf7d0;
        background: #f0fdf4;
        color: #15803d;
    }

.sales-ai-button {
    border: 0;
    background: linear-gradient(135deg, #2563eb, #4f46e5);
    color: #ffffff;
    box-shadow: 0 8px 20px rgba(37, 99, 235, .18);
}

    .sales-export-button:hover:not(:disabled),
    .sales-ai-button:hover:not(:disabled) {
        transform: translateY(-1px);
    }

    .sales-export-button:disabled,
    .sales-ai-button:disabled {
        opacity: .55;
        cursor: not-allowed;
    }

.sales-action-error {
    margin-bottom: 12px;
}

.sales-ai-analysis-card {
    border-color: #bfdbfe;
    background: linear-gradient( 180deg, rgba(239, 246, 255, .55), rgba(255, 255, 255, 1) );
}

.sales-ai-analysis-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    height: 28px;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 10px;
    font-weight: 900;
}

.sales-ai-loading {
    padding: 22px;
    color: #2563eb;
    font-size: 11px;
    font-weight: 800;
    text-align: center;
}

.sales-ai-analysis-text {
    padding: 4px 2px;
    color: #334155;
    font-size: 10px;
    line-height: 1.75;
    white-space: pre-wrap;
}

@media (max-width: 1050px) {

    .real-sales-header-actions {
        justify-content: flex-start;
    }
}


.sales-engine-admin {
    padding: 4px 0 30px;
}

.sales-engine-admin-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 18px;
}

.sales-engine-kicker {
    display: inline-flex;
    padding: 6px 10px;
    border-radius: 8px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 10px;
    font-weight: 900;
}

.sales-engine-admin-header h1 {
    margin: 10px 0 5px;
    color: #0f172a;
    font-size: 28px;
    line-height: 1.1;
}

.sales-engine-admin-header p {
    margin: 0;
    color: #64748b;
    font-size: 12px;
}

.sales-engine-refresh {
    min-width: 92px;
    height: 40px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #fff;
    color: #0f172a;
    font-weight: 800;
    cursor: pointer;
}

.sales-engine-error {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #fecaca;
    border-radius: 10px;
    background: #fef2f2;
    color: #b91c1c;
}

.sales-engine-summary-grid {
    display: grid;
    grid-template-columns: repeat(5,minmax(0,1fr));
    gap: 10px;
    margin-bottom: 10px;
}

.sales-engine-summary-card {
    padding: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
}

    .sales-engine-summary-card.primary {
        border-color: #bfdbfe;
        background: #eff6ff;
    }

    .sales-engine-summary-card span {
        display: block;
        margin-bottom: 5px;
        color: #64748b;
        font-size: 10px;
        font-weight: 700;
    }

    .sales-engine-summary-card strong {
        color: #0f172a;
        font-size: 18px;
    }

.sales-engine-source {
    margin-bottom: 16px;
    padding: 10px 12px;
    border: 1px solid #bbf7d0;
    border-radius: 10px;
    background: #f0fdf4;
    color: #166534;
    font-size: 11px;
}

.sales-engine-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

    .sales-engine-tabs button {
        height: 38px;
        padding: 0 14px;
        border: 1px solid #dbe5f0;
        border-radius: 10px;
        background: #fff;
        color: #475569;
        font-weight: 800;
        cursor: pointer;
    }

        .sales-engine-tabs button.active {
            border-color: #2563eb;
            background: #2563eb;
            color: #fff;
        }

.sales-engine-panel {
    padding: 18px;
    border: 1px solid #dbe5f0;
    border-radius: 14px;
    background: #fff;
}

.sales-engine-panel-header {
    margin-bottom: 14px;
}

    .sales-engine-panel-header h2 {
        margin: 0 0 4px;
        color: #0f172a;
        font-size: 17px;
    }

    .sales-engine-panel-header p {
        margin: 0;
        color: #64748b;
        font-size: 11px;
    }

.sales-engine-form-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 100px 90px;
    gap: 8px;
    margin-bottom: 14px;
}

    .sales-engine-form-grid.four {
        grid-template-columns: 1fr 1.6fr 100px 90px;
    }

    .sales-engine-form-grid input, .sales-engine-form-grid select {
        height: 40px;
        padding: 0 10px;
        border: 1px solid #cbd5e1;
        border-radius: 9px;
        background: #fff;
        color: #0f172a;
    }

    .sales-engine-form-grid button {
        border: 0;
        border-radius: 9px;
        background: #2563eb;
        color: #fff;
        font-weight: 800;
        cursor: pointer;
    }

.sales-engine-table-wrap {
    overflow-x: auto;
}

.sales-engine-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
}

    .sales-engine-table th {
        padding: 10px;
        border-bottom: 1px solid #cbd5e1;
        background: #f8fafc;
        color: #475569;
        text-align: left;
    }

    .sales-engine-table td {
        padding: 10px;
        border-bottom: 1px solid #e2e8f0;
        color: #334155;
    }

@media (max-width:1100px) {
    .sales-engine-summary-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .sales-engine-form-grid, .sales-engine-form-grid.four {
        grid-template-columns: 1fr 1fr;
    }
}



.sales-engine-admin {
    padding: 4px 0 30px;
}

.sales-engine-admin-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 18px;
}

.sales-engine-kicker {
    display: inline-flex;
    padding: 6px 10px;
    border-radius: 8px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 10px;
    font-weight: 900;
}

.sales-engine-admin-header h1 {
    margin: 10px 0 5px;
    color: #0f172a;
    font-size: 28px;
    line-height: 1.1;
}

.sales-engine-admin-header p {
    margin: 0;
    color: #64748b;
    font-size: 12px;
}

.sales-engine-refresh {
    min-width: 92px;
    height: 40px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #fff;
    color: #0f172a;
    font-weight: 800;
    cursor: pointer;
}

.sales-engine-error {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #fecaca;
    border-radius: 10px;
    background: #fef2f2;
    color: #b91c1c;
}

.sales-engine-summary-grid {
    display: grid;
    grid-template-columns: repeat(5,minmax(0,1fr));
    gap: 10px;
    margin-bottom: 10px;
}

.sales-engine-summary-card {
    padding: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
}

    .sales-engine-summary-card.primary {
        border-color: #bfdbfe;
        background: #eff6ff;
    }

    .sales-engine-summary-card span {
        display: block;
        margin-bottom: 5px;
        color: #64748b;
        font-size: 10px;
        font-weight: 700;
    }

    .sales-engine-summary-card strong {
        color: #0f172a;
        font-size: 18px;
    }

.sales-engine-source {
    margin-bottom: 16px;
    padding: 10px 12px;
    border: 1px solid #bbf7d0;
    border-radius: 10px;
    background: #f0fdf4;
    color: #166534;
    font-size: 11px;
}

.sales-engine-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

    .sales-engine-tabs button {
        height: 38px;
        padding: 0 14px;
        border: 1px solid #dbe5f0;
        border-radius: 10px;
        background: #fff;
        color: #475569;
        font-weight: 800;
        cursor: pointer;
    }

        .sales-engine-tabs button.active {
            border-color: #2563eb;
            background: #2563eb;
            color: #fff;
        }

.sales-engine-panel {
    padding: 18px;
    border: 1px solid #dbe5f0;
    border-radius: 14px;
    background: #fff;
}

.sales-engine-panel-header {
    margin-bottom: 14px;
}

    .sales-engine-panel-header h2 {
        margin: 0 0 4px;
        color: #0f172a;
        font-size: 17px;
    }

    .sales-engine-panel-header p {
        margin: 0;
        color: #64748b;
        font-size: 11px;
    }

.sales-engine-form-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 100px 90px;
    gap: 8px;
    margin-bottom: 14px;
}

    .sales-engine-form-grid.four {
        grid-template-columns: 1fr 1.6fr 100px 90px;
    }

    .sales-engine-form-grid input, .sales-engine-form-grid select {
        height: 40px;
        padding: 0 10px;
        border: 1px solid #cbd5e1;
        border-radius: 9px;
        background: #fff;
        color: #0f172a;
    }

    .sales-engine-form-grid button {
        border: 0;
        border-radius: 9px;
        background: #2563eb;
        color: #fff;
        font-weight: 800;
        cursor: pointer;
    }

.sales-engine-table-wrap {
    overflow-x: auto;
}

.sales-engine-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
}

    .sales-engine-table th {
        padding: 10px;
        border-bottom: 1px solid #cbd5e1;
        background: #f8fafc;
        color: #475569;
        text-align: left;
    }

    .sales-engine-table td {
        padding: 10px;
        border-bottom: 1px solid #e2e8f0;
        color: #334155;
    }

@media (max-width:1100px) {
    .sales-engine-summary-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .sales-engine-form-grid, .sales-engine-form-grid.four {
        grid-template-columns: 1fr 1fr;
    }
}


/* V6.1 ENTITY FILTER ADMIN */
.entity-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px
}

.sales-engine-primary-action {
    min-height: 40px;
    padding: 0 16px;
    border: 0;
    border-radius: 10px;
    background: #2563eb;
    color: #fff;
    font-weight: 800;
    cursor: pointer
}

    .sales-engine-primary-action:disabled {
        opacity: .55;
        cursor: not-allowed
    }

.sales-engine-success {
    margin-bottom: 12px;
    padding: 11px 13px;
    border: 1px solid #bbf7d0;
    border-radius: 10px;
    background: #f0fdf4;
    color: #166534;
    font-size: 11px;
    font-weight: 700
}

.entity-search-grid {
    display: grid;
    grid-template-columns: 220px 1fr 90px;
    gap: 8px;
    margin-bottom: 14px
}

    .entity-search-grid input, .entity-search-grid select {
        height: 40px;
        padding: 0 10px;
        border: 1px solid #cbd5e1;
        border-radius: 9px;
        background: #fff
    }

    .entity-search-grid button {
        border: 0;
        border-radius: 9px;
        background: #0f172a;
        color: #fff;
        font-weight: 800
    }

.entity-alias-section {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid #e2e8f0
}

.entity-alias-form {
    grid-template-columns: 160px 1.2fr 1fr 100px 100px
}

@media(max-width:900px) {
    .entity-search-grid, .entity-alias-form {
        grid-template-columns: 1fr
    }

    .entity-header {
        flex-direction: column
    }
}


.sales-engine-admin {
    padding: 4px 0 30px;
}

.sales-engine-admin-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 18px;
}

.sales-engine-kicker {
    display: inline-flex;
    padding: 6px 10px;
    border-radius: 8px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 10px;
    font-weight: 900;
}

.sales-engine-admin-header h1 {
    margin: 10px 0 5px;
    color: #0f172a;
    font-size: 28px;
    line-height: 1.1;
}

.sales-engine-admin-header p {
    margin: 0;
    color: #64748b;
    font-size: 12px;
}

.sales-engine-refresh {
    min-width: 92px;
    height: 40px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #fff;
    color: #0f172a;
    font-weight: 800;
    cursor: pointer;
}

.sales-engine-error {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #fecaca;
    border-radius: 10px;
    background: #fef2f2;
    color: #b91c1c;
}

.sales-engine-summary-grid {
    display: grid;
    grid-template-columns: repeat(5,minmax(0,1fr));
    gap: 10px;
    margin-bottom: 10px;
}

.sales-engine-summary-card {
    padding: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
}

    .sales-engine-summary-card.primary {
        border-color: #bfdbfe;
        background: #eff6ff;
    }

    .sales-engine-summary-card span {
        display: block;
        margin-bottom: 5px;
        color: #64748b;
        font-size: 10px;
        font-weight: 700;
    }

    .sales-engine-summary-card strong {
        color: #0f172a;
        font-size: 18px;
    }

.sales-engine-source {
    margin-bottom: 16px;
    padding: 10px 12px;
    border: 1px solid #bbf7d0;
    border-radius: 10px;
    background: #f0fdf4;
    color: #166534;
    font-size: 11px;
}

.sales-engine-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

    .sales-engine-tabs button {
        height: 38px;
        padding: 0 14px;
        border: 1px solid #dbe5f0;
        border-radius: 10px;
        background: #fff;
        color: #475569;
        font-weight: 800;
        cursor: pointer;
    }

        .sales-engine-tabs button.active {
            border-color: #2563eb;
            background: #2563eb;
            color: #fff;
        }

.sales-engine-panel {
    padding: 18px;
    border: 1px solid #dbe5f0;
    border-radius: 14px;
    background: #fff;
}

.sales-engine-panel-header {
    margin-bottom: 14px;
}

    .sales-engine-panel-header h2 {
        margin: 0 0 4px;
        color: #0f172a;
        font-size: 17px;
    }

    .sales-engine-panel-header p {
        margin: 0;
        color: #64748b;
        font-size: 11px;
    }

.sales-engine-form-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 100px 90px;
    gap: 8px;
    margin-bottom: 14px;
}

    .sales-engine-form-grid.four {
        grid-template-columns: 1fr 1.6fr 100px 90px;
    }

    .sales-engine-form-grid input, .sales-engine-form-grid select {
        height: 40px;
        padding: 0 10px;
        border: 1px solid #cbd5e1;
        border-radius: 9px;
        background: #fff;
        color: #0f172a;
    }

    .sales-engine-form-grid button {
        border: 0;
        border-radius: 9px;
        background: #2563eb;
        color: #fff;
        font-weight: 800;
        cursor: pointer;
    }

.sales-engine-table-wrap {
    overflow-x: auto;
}

.sales-engine-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
}

    .sales-engine-table th {
        padding: 10px;
        border-bottom: 1px solid #cbd5e1;
        background: #f8fafc;
        color: #475569;
        text-align: left;
    }

    .sales-engine-table td {
        padding: 10px;
        border-bottom: 1px solid #e2e8f0;
        color: #334155;
    }

@media (max-width:1100px) {
    .sales-engine-summary-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .sales-engine-form-grid, .sales-engine-form-grid.four {
        grid-template-columns: 1fr 1fr;
    }
}


/* V6.1 ENTITY FILTER ADMIN */
.entity-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px
}

.sales-engine-primary-action {
    min-height: 40px;
    padding: 0 16px;
    border: 0;
    border-radius: 10px;
    background: #2563eb;
    color: #fff;
    font-weight: 800;
    cursor: pointer
}

    .sales-engine-primary-action:disabled {
        opacity: .55;
        cursor: not-allowed
    }

.sales-engine-success {
    margin-bottom: 12px;
    padding: 11px 13px;
    border: 1px solid #bbf7d0;
    border-radius: 10px;
    background: #f0fdf4;
    color: #166534;
    font-size: 11px;
    font-weight: 700
}

.entity-search-grid {
    display: grid;
    grid-template-columns: 220px 1fr 90px;
    gap: 8px;
    margin-bottom: 14px
}

    .entity-search-grid input, .entity-search-grid select {
        height: 40px;
        padding: 0 10px;
        border: 1px solid #cbd5e1;
        border-radius: 9px;
        background: #fff
    }

    .entity-search-grid button {
        border: 0;
        border-radius: 9px;
        background: #0f172a;
        color: #fff;
        font-weight: 800
    }

.entity-alias-section {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid #e2e8f0
}

.entity-alias-form {
    grid-template-columns: 160px 1.2fr 1fr 100px 100px
}

@media(max-width:900px) {
    .entity-search-grid, .entity-alias-form {
        grid-template-columns: 1fr
    }

    .entity-header {
        flex-direction: column
    }
}

/* =========================================================
   V6.2 FORECAST SETTINGS
   ========================================================= */

.forecast-settings-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.forecast-setting-card {
    padding: 14px;
    border: 1px solid #dbe5f0;
    border-radius: 12px;
    background: #fff;
}

.forecast-setting-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}

    .forecast-setting-header strong {
        color: #0f172a;
        font-size: 10px;
    }

    .forecast-setting-header button {
        min-height: 30px;
        padding: 0 10px;
        border: 0;
        border-radius: 8px;
        background: #2563eb;
        color: #fff;
        font-size: 10px;
        font-weight: 800;
        cursor: pointer;
    }

.forecast-setting-card input {
    width: 100%;
    height: 38px;
    padding: 0 10px;
    border: 1px solid #cbd5e1;
    border-radius: 9px;
    color: #0f172a;
    background: #f8fafc;
    font-weight: 800;
}

.forecast-setting-card p {
    margin: 8px 0 0;
    color: #64748b;
    font-size: 10px;
    line-height: 1.45;
}

.forecast-note {
    margin-top: 6px;
}

@media (max-width: 1050px) {
    .forecast-settings-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 720px) {
    .forecast-settings-grid {
        grid-template-columns: 1fr;
    }
}

.dashboard-page {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.dashboard-header-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #ffffff;
    border: 1px solid #dfe7f3;
    border-radius: 18px;
    padding: 22px 24px;
}

    .dashboard-header-card h1 {
        margin: 0;
        font-size: 40px;
        font-weight: 800;
        color: #0f172a;
    }

    .dashboard-header-card p {
        margin: 6px 0 0 0;
        color: #64748b;
        font-size: 15px;
    }

.dashboard-badge {
    background: #e8f6eb;
    color: #16803c;
    border-radius: 12px;
    padding: 14px 18px;
    font-weight: 700;
    font-size: 18px;
}

.dashboard-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 18px;
}

.summary-card,
.dashboard-card {
    background: #ffffff;
    border: 1px solid #dfe7f3;
    border-radius: 18px;
    padding: 22px;
}

.summary-title {
    color: #64748b;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 12px;
}

.summary-value {
    font-size: 38px;
    font-weight: 800;
    color: #0f172a;
}

.summary-sub {
    margin-top: 8px;
    color: #94a3b8;
    font-size: 13px;
}

.card-header {
    display: flex;
    justify-content: space-between;
    align-items: start;
    margin-bottom: 18px;
}

    .card-header h3 {
        margin: 0;
        font-size: 24px;
        font-weight: 800;
        color: #0f172a;
    }

    .card-header span {
        color: #94a3b8;
        font-size: 13px;
    }

.dashboard-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.simple-bar-chart {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.bar-row {
    display: grid;
    grid-template-columns: 130px 1fr 180px;
    gap: 12px;
    align-items: center;
}

.bar-label {
    font-size: 14px;
    font-weight: 700;
    color: #334155;
}

.bar-track {
    height: 16px;
    border-radius: 999px;
    background: #e8eef8;
    overflow: hidden;
}

.bar-fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #2563eb, #3b82f6);
}

.bar-value {
    text-align: right;
    font-size: 14px;
    font-weight: 700;
    color: #0f172a;
}

.dashboard-table {
    width: 100%;
    border-collapse: collapse;
}

    .dashboard-table th {
        text-align: left;
        padding: 12px 10px;
        background: #f8fafc;
        border-bottom: 1px solid #e2e8f0;
        color: #475569;
        font-size: 13px;
    }

    .dashboard-table td {
        padding: 12px 10px;
        border-bottom: 1px solid #edf2f7;
        font-size: 14px;
        color: #0f172a;
    }

.dashboard-loading,
.dashboard-error {
    background: #ffffff;
    border: 1px solid #dfe7f3;
    border-radius: 16px;
    padding: 24px;
    font-size: 16px;
}

.dashboard-error {
    color: #b91c1c;
}

@media (max-width: 1200px) {
    .dashboard-two-col,
    .dashboard-summary-grid {
        grid-template-columns: 1fr;
    }

    .bar-row {
        grid-template-columns: 100px 1fr 140px;
    }
}


/* REISAI PROFESSIONAL DASHBOARD V3 */
.rd-page {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 22px;
    color: #0f172a
}

    .rd-page * {
        box-sizing: border-box
    }

.rd-hero {
    display: flex;
    justify-content: space-between;
    gap: 22px;
    padding: 22px 24px;
    border: 1px solid #dce5f1;
    border-radius: 16px;
    background: linear-gradient(135deg,#fff,#f7faff)
}

.rd-badge, .rd-card-head > div > span {
    display: inline-block;
    padding: 5px 8px;
    border-radius: 6px;
    background: #eff6ff;
    color: #2563eb;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .08em
}

.rd-hero h1 {
    margin: 8px 0 4px;
    font-size: 26px;
    font-weight: 850
}

.rd-hero p {
    margin: 0;
    color: #64748b;
    font-size: 12px
}

.rd-toolbar {
    display: flex;
    align-items: center;
    gap: 9px
}

.rd-period {
    display: grid;
    grid-template-columns: auto auto;
    gap: 0 8px;
    padding: 8px 11px;
    border: 1px solid #dce5f1;
    border-radius: 10px;
    background: #fff
}

    .rd-period span, .rd-period small {
        font-size: 9px;
        color: #94a3b8
    }

    .rd-period strong {
        grid-row: span 2;
        font-size: 18px
    }

.rd-currency {
    display: flex;
    gap: 3px;
    padding: 3px;
    border: 1px solid #dce5f1;
    border-radius: 9px;
    background: #f8fafc
}

.rd-currency-btn {
    height: 32px;
    min-width: 44px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #64748b;
    font-size: 10px;
    font-weight: 800
}

    .rd-currency-btn.active {
        background: #0f172a;
        color: #fff
    }

.rd-refresh {
    height: 40px;
    padding: 0 12px;
    border: 1px solid #dce5f1;
    border-radius: 9px;
    background: #fff;
    color: #334155;
    font-size: 10px;
    font-weight: 750
}

.rd-kpis {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 12px
}

.rd-kpi {
    padding: 17px;
    border: 1px solid #dce5f1;
    border-radius: 14px;
    background: #fff;
    min-width: 0
}

.rd-kpi-primary {
    border-color: #c7dcff;
    background: linear-gradient(145deg,#fff,#f3f7ff)
}

.rd-kpi-label {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 13px;
    color: #64748b;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .05em
}

.rd-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: #eef4ff;
    color: #2563eb;
    font-weight: 900
}

.rd-kpi > strong {
    display: block;
    overflow: hidden;
    font-size: clamp(19px,1.6vw,26px);
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rd-kpi-name {
    font-size: 17px !important
}

.rd-kpi small {
    display: block;
    margin-top: 10px;
    color: #94a3b8;
    font-size: 9.5px
}

.rd-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px
}

.rd-grid-main {
    grid-template-columns: minmax(0,1.6fr) minmax(320px,.8fr)
}

.rd-card {
    min-width: 0;
    padding: 18px;
    border: 1px solid #dce5f1;
    border-radius: 14px;
    background: #fff
}

.rd-card-head {
    margin-bottom: 16px
}

    .rd-card-head h2 {
        margin: 6px 0 2px;
        font-size: 16px;
        font-weight: 800
    }

    .rd-card-head p {
        margin: 0;
        color: #94a3b8;
        font-size: 9.5px
    }

.rd-year-chart, .rd-invoice-list, .rd-ranking, .rd-brand-list {
    display: flex;
    flex-direction: column;
    gap: 11px
}

.rd-year-meta, .rd-row-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px
}

    .rd-year-meta strong {
        font-size: 11px
    }

    .rd-year-meta span, .rd-row-top b {
        font-size: 10px
    }

    .rd-row-top > div {
        min-width: 0
    }

    .rd-row-top strong {
        display: block;
        overflow: hidden;
        font-size: 10.5px;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .rd-row-top span {
        display: block;
        margin-top: 1px;
        color: #94a3b8;
        font-size: 8.5px
    }

.rd-track {
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2f7
}

.rd-fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg,#1d4ed8,#60a5fa)
}

.rd-invoice-row, .rd-year-row {
    padding-bottom: 7px;
    border-bottom: 1px solid #f1f5f9
}

.negative {
    color: #dc2626
}

.positive {
    color: #15803d
}

.rd-rank-row {
    display: grid;
    grid-template-columns: 26px 1fr;
    gap: 9px;
    align-items: center
}

.rd-rank-no, .rd-table-rank {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    border-radius: 7px;
    background: #eef4ff;
    color: #2563eb;
    font-size: 9px;
    font-weight: 850
}

.rd-rank-body {
    min-width: 0
}

.rd-brand-row {
    display: grid;
    grid-template-columns: 120px 1fr 115px;
    gap: 9px;
    align-items: center
}

    .rd-brand-row > span {
        overflow: hidden;
        color: #334155;
        font-size: 9.5px;
        font-weight: 750;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .rd-brand-row > strong {
        font-size: 9.5px;
        text-align: right
    }

.rd-table-wrap {
    overflow: auto
}

.rd-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed
}

    .rd-table th {
        padding: 9px;
        background: #f8fafc;
        border-bottom: 1px solid #dce5f1;
        color: #64748b;
        font-size: 9px;
        text-align: left
    }

    .rd-table td {
        padding: 10px 9px;
        border-bottom: 1px solid #eef2f7;
        color: #334155;
        font-size: 10px
    }

    .rd-table tr:hover {
        background: #fbfdff
    }

.rd-num {
    text-align: right
}

.rd-share {
    display: grid;
    grid-template-columns: 1fr 42px;
    gap: 7px;
    align-items: center
}

    .rd-share span {
        font-size: 9px;
        color: #64748b;
        text-align: right
    }

.rd-source {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 3px;
    color: #16a34a
}

    .rd-source strong {
        color: #475569;
        font-size: 9px
    }

    .rd-source small {
        color: #94a3b8;
        font-size: 8.5px
    }

.rd-state, .rd-error {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 22px;
    padding: 18px;
    border: 1px solid #dce5f1;
    border-radius: 14px;
    background: #fff
}

    .rd-state strong, .rd-error strong {
        display: block;
        font-size: 12px
    }

    .rd-state span, .rd-error span {
        display: block;
        margin-top: 2px;
        color: #64748b;
        font-size: 9.5px
    }

.rd-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid #dbeafe;
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: rdspin .8s linear infinite
}

.rd-error {
    border-color: #fecaca
}

    .rd-error button {
        margin-left: auto;
        height: 34px;
        border: 0;
        border-radius: 8px;
        background: #0f172a;
        color: #fff;
        font-size: 9.5px;
        font-weight: 750
    }

@keyframes rdspin {
    to {
        transform: rotate(360deg)
    }
}

@media(max-width:1300px) {
    .rd-kpis {
        grid-template-columns: repeat(2,1fr)
    }

    .rd-grid-main {
        grid-template-columns: 1fr
    }
}

@media(max-width:900px) {
    .rd-hero {
        flex-direction: column
    }

    .rd-toolbar {
        flex-wrap: wrap
    }

    .rd-grid {
        grid-template-columns: 1fr
    }
}

@media(max-width:620px) {
    .rd-page {
        padding: 14px
    }

    .rd-kpis {
        grid-template-columns: 1fr
    }

    .rd-toolbar {
        align-items: stretch;
        flex-direction: column
    }

    .rd-brand-row {
        grid-template-columns: 90px 1fr
    }

        .rd-brand-row > strong {
            grid-column: 2
        }

    .rd-table {
        min-width: 700px
    }
}



/* ============================================================
   REISAI EXECUTIVE DASHBOARD V4
   Add to the BOTTOM of wwwroot/app.css
   ============================================================ */

.xpd-page {
    width: 100%;
    padding: 22px 24px 28px;
    color: #0f172a;
    font-family: "Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", Arial, sans-serif;
}

    .xpd-page * {
        box-sizing: border-box;
    }


/* ------------------------------------------------------------
   WELCOME
   ------------------------------------------------------------ */

.xpd-welcome {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 104px;
    margin-bottom: 14px;
    padding: 18px 20px;
    overflow: hidden;
    border: 1px solid #e0e8f2;
    border-radius: 14px;
    background: radial-gradient(circle at 63% 55%, rgba(37, 99, 235, 0.08), transparent 24%), linear-gradient(110deg, #ffffff 0%, #ffffff 46%, #f6f9fe 100%);
}

    .xpd-welcome::after {
        content: "";
        position: absolute;
        top: -60px;
        right: 220px;
        width: 260px;
        height: 160px;
        transform: rotate(-12deg);
        border-radius: 50%;
        background: rgba(37, 99, 235, 0.04);
    }

.xpd-welcome-main {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.xpd-welcome-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 12px;
    background: linear-gradient(145deg, #dbeafe, #eff6ff);
}

    .xpd-welcome-icon svg {
        width: 22px;
        height: 22px;
        fill: #3b82f6;
        opacity: 0.7;
    }

.xpd-welcome h1 {
    margin: 0 0 4px;
    color: #10203d;
    font-size: 23px;
    font-weight: 750;
    line-height: 1.15;
    letter-spacing: -0.02em;
}

.xpd-welcome p {
    margin: 0;
    color: #70809b;
    font-size: 11.5px;
    line-height: 1.5;
}

.xpd-welcome-side {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 18px;
    flex-shrink: 0;
}

.xpd-quote {
    max-width: 230px;
    color: #7b8ba5;
    font-size: 10px;
    font-style: italic;
    line-height: 1.45;
    text-align: right;
}

    .xpd-quote i {
        display: block;
        width: 34px;
        height: 2px;
        margin: 6px 0 0 auto;
        border-radius: 2px;
        background: #3977e8;
    }

.xpd-year-card {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 142px;
    padding: 10px 13px;
    border: 1px solid #dfe7f2;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.94);
}

.xpd-year-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    border-radius: 9px;
    background: #eef5ff;
}

    .xpd-year-icon svg,
    .xpd-kpi-icon svg,
    .xpd-section-icon svg,
    .xpd-icon-button svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.xpd-year-icon {
    color: #2b67d4;
}

.xpd-year-card span {
    display: block;
    color: #8795aa;
    font-size: 9px;
}

.xpd-year-card strong {
    display: block;
    margin-top: 1px;
    color: #10203d;
    font-size: 16px;
    font-weight: 750;
}


/* ------------------------------------------------------------
   KPI
   ------------------------------------------------------------ */

.xpd-kpi-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 0.72fr;
    gap: 12px;
    margin-bottom: 14px;
}

.xpd-kpi {
    position: relative;
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
    min-height: 94px;
    padding: 15px 16px;
    border: 1px solid #dfe7f2;
    border-radius: 13px;
    background: #ffffff;
    box-shadow: 0 3px 12px rgba(15, 35, 70, 0.025);
}

.xpd-kpi-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 12px;
}

.xpd-kpi-icon-blue {
    background: #eef5ff;
    color: #2470ef;
}

.xpd-kpi-icon-indigo {
    background: #f0f4ff;
    color: #366bdc;
}

.xpd-kpi-icon-green {
    background: #ebfaf4;
    color: #10a56d;
}

.xpd-kpi-body {
    min-width: 0;
}

    .xpd-kpi-body > span {
        display: block;
        margin-bottom: 4px;
        color: #59708f;
        font-size: 9.5px;
        font-weight: 650;
    }

    .xpd-kpi-body > strong {
        display: block;
        overflow: hidden;
        color: #10203d;
        font-size: clamp(18px, 1.75vw, 25px);
        font-weight: 760;
        line-height: 1.08;
        letter-spacing: -0.03em;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .xpd-kpi-body > small {
        display: block;
        margin-top: 5px;
        color: #8391a7;
        font-size: 9px;
    }

.xpd-kpi-pill {
    margin-left: auto;
    padding: 6px 9px;
    border-radius: 8px;
    background: #f1f5f9;
    color: #60708a;
    font-size: 9px;
    font-weight: 750;
    white-space: nowrap;
}

.xpd-kpi-pill-blue {
    background: #edf4ff;
    color: #2563eb;
}

.xpd-kpi-pill-green {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: #eaf9f1;
    color: #12905f;
}

.xpd-status-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #16b878;
}


/* ------------------------------------------------------------
   CARD BASE
   ------------------------------------------------------------ */

.xpd-card {
    min-width: 0;
    margin-bottom: 14px;
    padding: 16px;
    border: 1px solid #dfe7f2;
    border-radius: 13px;
    background: #ffffff;
    box-shadow: 0 3px 12px rgba(15, 35, 70, 0.022);
}

.xpd-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.xpd-title-with-icon {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.xpd-section-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 10px;
    background: #eef5ff;
    color: #2563eb;
}

.xpd-title-with-icon h2 {
    margin: 0 0 2px;
    color: #13233f;
    font-size: 13.5px;
    font-weight: 750;
    line-height: 1.25;
}

.xpd-title-with-icon p {
    margin: 0;
    color: #8492a7;
    font-size: 9px;
}

.xpd-card-actions {
    display: flex;
    align-items: center;
    gap: 7px;
}

.xpd-currency-switch {
    display: flex;
    gap: 2px;
    padding: 2px;
    border: 1px solid #e0e8f2;
    border-radius: 8px;
    background: #f8fafc;
}

.xpd-currency-button {
    min-width: 40px;
    height: 28px;
    padding: 0 8px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #718097;
    font-size: 8.5px;
    font-weight: 750;
    cursor: pointer;
}

    .xpd-currency-button.active {
        background: #ffffff;
        color: #2563eb;
        box-shadow: 0 1px 5px rgba(30, 64, 175, 0.10);
    }

.xpd-icon-button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    padding: 0;
    border: 1px solid #e0e8f2;
    border-radius: 8px;
    background: #ffffff;
    color: #60708a;
    cursor: pointer;
}

    .xpd-icon-button:hover {
        border-color: #bfd3f4;
        background: #f4f8ff;
        color: #2563eb;
    }


/* ------------------------------------------------------------
   COLUMN CHART
   ------------------------------------------------------------ */

.xpd-trend-card {
    padding-bottom: 12px;
}

.xpd-column-chart {
    display: grid;
    grid-template-columns: 72px 1fr;
    gap: 9px;
    height: 255px;
    padding-top: 3px;
}

.xpd-chart-y-axis {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1px 0 30px;
    color: #7e8da3;
    font-size: 8px;
    text-align: right;
}

.xpd-chart-stage {
    position: relative;
    min-width: 0;
    height: 100%;
}

.xpd-gridline {
    position: absolute;
    right: 0;
    left: 0;
    border-top: 1px solid #e7edf5;
}

.xpd-gridline-1 {
    top: 0;
}

.xpd-gridline-2 {
    top: 23%;
}

.xpd-gridline-3 {
    top: 46%;
}

.xpd-gridline-4 {
    top: 69%;
}

.xpd-gridline-5 {
    top: 92%;
}

.xpd-bars {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: clamp(18px, 5vw, 55px);
    padding: 0 38px 0;
}

.xpd-bar-item {
    position: relative;
    display: grid;
    grid-template-rows: 26px 1fr 25px;
    min-width: 0;
}

.xpd-bar-value {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: hidden;
    color: #172b4d;
    font-size: 8.5px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.xpd-bar-column-wrap {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    min-height: 0;
}

.xpd-bar-column {
    width: min(76%, 105px);
    min-height: 2px;
    border-radius: 5px 5px 1px 1px;
    background: linear-gradient(180deg, #3487fb 0%, #2369df 100%);
    box-shadow: 0 3px 10px rgba(37, 99, 235, 0.10);
}

.xpd-bar-year {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #587093;
    font-size: 9px;
    font-weight: 650;
}


/* ------------------------------------------------------------
   TWO COLUMN
   ------------------------------------------------------------ */

.xpd-two-column {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

    .xpd-two-column > .xpd-card {
        margin-bottom: 14px;
    }


/* ------------------------------------------------------------
   TABLE
   ------------------------------------------------------------ */

.xpd-table-wrap {
    overflow-x: auto;
}

.xpd-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

    .xpd-table thead th {
        padding: 7px 7px;
        border-bottom: 1px solid #dce5ef;
        background: #f7f9fc;
        color: #61728c;
        font-size: 8px;
        font-weight: 750;
        text-align: left;
    }

    .xpd-table tbody td {
        padding: 7px;
        border-bottom: 1px solid #edf1f6;
        color: #2f405c;
        font-size: 8.5px;
        vertical-align: middle;
    }

    .xpd-table tbody tr:last-child td {
        border-bottom: 0;
    }

    .xpd-table tbody tr:hover {
        background: #fbfdff;
    }

.xpd-rank-col {
    width: 36px;
    text-align: center !important;
}

.xpd-number-col {
    width: 135px;
    text-align: right !important;
}

.xpd-rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 6px;
    color: #456386;
    font-size: 8px;
    font-weight: 750;
}

.xpd-table tbody tr:nth-child(-n+3) .xpd-rank-badge {
    background: #edf4ff;
    color: #2563eb;
}

.xpd-code {
    color: #47617e;
    font-family: "Segoe UI Variable Text", "Segoe UI", sans-serif;
    font-size: 8px;
}

.xpd-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* ------------------------------------------------------------
   BRAND BARS
   ------------------------------------------------------------ */

.xpd-brand-list {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.xpd-brand-row {
    display: grid;
    grid-template-columns: minmax(84px, 115px) 1fr minmax(105px, auto);
    gap: 10px;
    align-items: center;
}

.xpd-brand-name {
    overflow: hidden;
    color: #344864;
    font-size: 8.5px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.xpd-brand-track,
.xpd-product-track,
.xpd-invoice-track {
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2f8;
}

.xpd-brand-fill,
.xpd-product-fill,
.xpd-invoice-fill {
    height: 100%;
    min-width: 2px;
    border-radius: inherit;
    background: linear-gradient(90deg, #2470ef, #54a0ff);
}

.xpd-brand-row > strong {
    color: #2d405c;
    font-size: 8.5px;
    font-weight: 700;
    text-align: right;
}


/* ------------------------------------------------------------
   PRODUCT LIST
   ------------------------------------------------------------ */

.xpd-product-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.xpd-product-row {
    display: grid;
    grid-template-columns: 24px 1fr;
    gap: 8px;
    align-items: center;
}

.xpd-product-rank {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 7px;
    background: #edf4ff;
    color: #2563eb;
    font-size: 8px;
    font-weight: 750;
}

.xpd-product-body {
    min-width: 0;
}

.xpd-product-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 4px;
}

    .xpd-product-top > div {
        min-width: 0;
    }

    .xpd-product-top strong {
        display: block;
        color: #314661;
        font-size: 8.5px;
    }

    .xpd-product-top span {
        display: block;
        overflow: hidden;
        margin-top: 1px;
        color: #8492a7;
        font-size: 7.8px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .xpd-product-top b {
        flex-shrink: 0;
        color: #293d59;
        font-size: 8.5px;
    }


/* ------------------------------------------------------------
   INVOICE LIST
   ------------------------------------------------------------ */

.xpd-invoice-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.xpd-invoice-row {
    padding-bottom: 7px;
    border-bottom: 1px solid #eef2f6;
}

    .xpd-invoice-row:last-child {
        padding-bottom: 0;
        border-bottom: 0;
    }

.xpd-invoice-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 5px;
}

    .xpd-invoice-top > div {
        display: flex;
        align-items: center;
        gap: 7px;
        min-width: 0;
    }

.xpd-invoice-code {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 20px;
    padding: 0 6px;
    border-radius: 6px;
    background: #edf4ff;
    color: #2563eb;
    font-size: 7.8px;
    font-weight: 750;
}

.xpd-invoice-top strong {
    overflow: hidden;
    color: #41546e;
    font-size: 8.3px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.xpd-invoice-top b {
    flex-shrink: 0;
    color: #293d59;
    font-size: 8.5px;
}

.xpd-negative {
    color: #dc2626 !important;
}


/* ------------------------------------------------------------
   FOOTER STATUS
   ------------------------------------------------------------ */

.xpd-footer-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 1px 4px 6px;
}

    .xpd-footer-status > div {
        display: flex;
        align-items: center;
        gap: 6px;
    }

.xpd-live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #16b878;
    box-shadow: 0 0 0 3px rgba(22, 184, 120, 0.10);
}

.xpd-footer-status strong {
    color: #4a5e78;
    font-size: 8.5px;
}

.xpd-footer-status small {
    color: #93a0b3;
    font-size: 8px;
}


/* ------------------------------------------------------------
   STATE
   ------------------------------------------------------------ */

.xpd-state,
.xpd-error {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 22px;
    padding: 18px;
    border: 1px solid #dfe7f2;
    border-radius: 13px;
    background: #ffffff;
    font-family: "Segoe UI Variable Text", "Segoe UI", Arial, sans-serif;
}

    .xpd-state strong,
    .xpd-error strong {
        display: block;
        color: #13233f;
        font-size: 11px;
    }

    .xpd-state span,
    .xpd-error span {
        display: block;
        margin-top: 2px;
        color: #8090a7;
        font-size: 9px;
    }

.xpd-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid #dbeafe;
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: xpd-spin 0.8s linear infinite;
}

.xpd-error {
    border-color: #fecaca;
}

.xpd-error-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: #fee2e2;
    color: #dc2626;
    font-size: 12px;
    font-weight: 800;
}

.xpd-error-text {
    flex: 1;
}

.xpd-error button {
    height: 33px;
    padding: 0 11px;
    border: 0;
    border-radius: 7px;
    background: #13233f;
    color: #ffffff;
    font-size: 8.5px;
    font-weight: 700;
    cursor: pointer;
}

.xpd-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 110px;
    border: 1px dashed #d8e1ed;
    border-radius: 9px;
    color: #93a0b3;
    font-size: 9px;
}

@keyframes xpd-spin {
    to {
        transform: rotate(360deg);
    }
}


/* ------------------------------------------------------------
   RESPONSIVE
   ------------------------------------------------------------ */

@media (max-width: 1250px) {

    .xpd-welcome-side .xpd-quote {
        display: none;
    }

    .xpd-kpi-grid {
        grid-template-columns: 1fr 1fr;
    }

        .xpd-kpi-grid .xpd-kpi:last-child {
            grid-column: span 2;
        }

    .xpd-bars {
        gap: 22px;
        padding: 0 22px;
    }
}

@media (max-width: 950px) {

    .xpd-page {
        padding: 16px;
    }

    .xpd-welcome {
        align-items: flex-start;
        flex-direction: column;
    }

    .xpd-welcome-side {
        width: 100%;
    }

    .xpd-two-column {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {

    .xpd-kpi-grid {
        grid-template-columns: 1fr;
    }

        .xpd-kpi-grid .xpd-kpi:last-child {
            grid-column: auto;
        }

    .xpd-welcome-side {
        align-items: stretch;
        flex-direction: column;
    }

    .xpd-year-card {
        width: 100%;
    }

    .xpd-column-chart {
        grid-template-columns: 52px 1fr;
        height: 230px;
    }

    .xpd-bars {
        gap: 10px;
        padding: 0 8px;
    }

    .xpd-bar-value {
        font-size: 7px;
        transform: rotate(-18deg);
    }

    .xpd-brand-row {
        grid-template-columns: 80px 1fr;
    }

        .xpd-brand-row > strong {
            grid-column: 2;
        }

    .xpd-table {
        min-width: 650px;
    }

    .xpd-footer-status {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
    }
}


/* =========================================================
   REISAI SALES ANALYSIS V4.2
   CLICKABLE MONTH CHART + INVOICE DRILLDOWN
   wwwroot/app.css dosyasının EN ALTINA ekleyin
   ========================================================= */

/* ===== MONTHLY CHART ======================================= */

.sales-month-drill-card {
    overflow: hidden;
}

.sales-month-drill-header {
    align-items: center;
    gap: 18px;
}

.sales-month-drill-legend {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 12px;
}

    .sales-month-drill-legend span {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        color: #64748b;
        font-size: 8px;
        font-weight: 750;
        white-space: nowrap;
    }

    .sales-month-drill-legend i {
        width: 8px;
        height: 8px;
        border-radius: 3px;
    }

    .sales-month-drill-legend .sales i {
        background: #2563eb;
    }

    .sales-month-drill-legend .cost i {
        background: #94a3b8;
    }

    .sales-month-drill-legend .profit i {
        background: #22c55e;
    }

    .sales-month-drill-legend .loss i {
        background: #ef4444;
    }

/*.sales-month-drill-grid {
    display: grid;
    grid-template-columns: repeat( auto-fit, minmax(118px, 1fr) );
    gap: 8px;
}*/

/* ============================================================
   AYLIK SATIŞ / MALİYET / KÂR
   Desktop : 6 kart
   Orta    : 3 kart
   Tablet  : 2 kart
   Mobil   : 1 kart
   ============================================================ */

.sales-month-drill-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
    width: 100%;
}

.sales-month-drill-item {
    min-width: 0;
    width: 100%;
}


/* 3 KOLON */
@media (max-width: 1200px) {
    .sales-month-drill-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}


/* 2 KOLON */
@media (max-width: 760px) {
    .sales-month-drill-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* 1 KOLON */
@media (max-width: 480px) {
    .sales-month-drill-grid {
        grid-template-columns: 1fr;
    }
}

.sales-month-drill-item {
    position: relative;
    display: grid;
    grid-template-rows: auto 160px auto;
    min-width: 0;
    min-height: 278px;
    padding: 10px 9px 9px;
    overflow: hidden;
    border: 1px solid #e3eaf3;
    border-radius: 11px;
    background: linear-gradient( 180deg, #ffffff 0%, #fbfdff 100% );
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

    .sales-month-drill-item:hover {
        transform: translateY(-2px);
        border-color: #bcd2f4;
        background: #ffffff;
        box-shadow: 0 8px 20px rgba(37, 99, 235, .09);
    }

    .sales-month-drill-item:focus-visible {
        outline: 2px solid #60a5fa;
        outline-offset: 2px;
    }

.sales-month-drill-values {
    display: grid;
    gap: 3px;
    min-height: 58px;
    margin-bottom: 5px;
}

    .sales-month-drill-values > div {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 5px;
        min-width: 0;
        padding: 2px 4px;
        border-radius: 5px;
    }

    .sales-month-drill-values span {
        overflow: hidden;
        color: #8290a4;
        font-size: 9.2px;
        font-weight: 650;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .sales-month-drill-values strong {
        flex-shrink: 0;
        color: #334155;
        font-size: 9.2px;
        font-weight: 800;
    }

    .sales-month-drill-values .sales {
        background: #f5f8ff;
    }

        .sales-month-drill-values .sales strong {
            color: #1d4ed8;
        }

    .sales-month-drill-values .cost {
        background: #f8fafc;
    }

        .sales-month-drill-values .cost strong {
            color: #64748b;
        }

    .sales-month-drill-values .profit {
        background: #f0fdf4;
    }

        .sales-month-drill-values .profit strong {
            color: #16a34a;
        }

    .sales-month-drill-values .loss {
        background: #fef2f2;
    }

        .sales-month-drill-values .loss strong {
            color: #dc2626;
        }

.sales-month-drill-bars {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 5px;
    height: 160px;
    padding: 10px 5px 0;
    border-bottom: 1px solid #e7edf5;
    background: linear-gradient( to top, rgba(226, 232, 240, .32) 1px, transparent 1px );
    background-size: 100% 25%;
}

.sales-month-drill-bar {
    width: 24%;
    min-width: 8px;
    min-height: 2px;
    max-width: 26px;
    border-radius: 5px 5px 1px 1px;
    transition: filter .15s ease, opacity .15s ease;
}

.sales-month-drill-item:hover
.sales-month-drill-bar {
    filter: saturate(1.08);
}

.sales-month-drill-bar.sales {
    background: linear-gradient( 180deg, #3b82f6, #2563eb );
}

.sales-month-drill-bar.cost {
    background: linear-gradient( 180deg, #a7b5c9, #8fa1b8 );
}

.sales-month-drill-bar.profit {
    background: linear-gradient( 180deg, #2ed071, #22b861 );
}

.sales-month-drill-bar.loss {
    background: linear-gradient( 180deg, #f87171, #ef4444 );
}

.sales-month-drill-footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 6px;
    padding-top: 7px;
}

    .sales-month-drill-footer > div {
        min-width: 0;
    }

    .sales-month-drill-footer strong {
        display: block;
        color: #0f172a;
        font-size: 8px;
        font-weight: 850;
    }

    .sales-month-drill-footer > div > span {
        display: block;
        margin-top: 1px;
        font-size: 6.7px;
        font-weight: 750;
    }

    .sales-month-drill-footer .positive {
        color: #16a34a;
    }

    .sales-month-drill-footer .negative {
        color: #dc2626;
    }

.sales-month-drill-open {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    flex-shrink: 0;
    color: #2563eb;
    font-size: 6.8px;
    font-weight: 800;
    opacity: .82;
}

    .sales-month-drill-open b {
        font-size: 11px;
        line-height: 1;
    }

.sales-month-drill-item:hover
.sales-month-drill-open {
    opacity: 1;
}

.sales-month-drill-help {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 10px;
    padding: 7px 9px;
    border-radius: 8px;
    background: #f8fafc;
    color: #718096;
    font-size: 7.5px;
    line-height: 1.4;
}

.sales-month-drill-help-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    border-radius: 50%;
    background: #e8f0ff;
    color: #2563eb;
    font-size: 9px;
    font-weight: 850;
}


/* ===== MODAL =============================================== */

.sales-invoice-modal-backdrop {
    position: fixed;
    z-index: 5000;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 26px;
    background: rgba( 15, 23, 42, .44 );
    backdrop-filter: blur(3px);
}

.sales-invoice-modal {
    display: flex;
    flex-direction: column;
    width: min( 1260px, 96vw );
    max-height: 90vh;
    overflow: hidden;
    border: 1px solid #dbe4ef;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .26);
}

.sales-invoice-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 15px 17px;
    border-bottom: 1px solid #e5ebf3;
    background: linear-gradient( 180deg, #ffffff, #fbfdff );
}

.sales-invoice-modal-title {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.sales-invoice-modal-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 10px;
    background: #edf4ff;
    color: #2563eb;
}

    .sales-invoice-modal-icon svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.sales-invoice-modal-title h3 {
    margin: 0 0 2px;
    color: #10203d;
    font-size: 13px;
    font-weight: 850;
}

.sales-invoice-modal-title p {
    margin: 0;
    color: #8290a4;
    font-size: 8px;
}

.sales-invoice-modal-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    flex: 0 0 31px;
    padding: 0;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    color: #64748b;
    font-size: 19px;
    line-height: 1;
    cursor: pointer;
}

    .sales-invoice-modal-close:hover {
        border-color: #fecaca;
        background: #fff7f7;
        color: #dc2626;
    }

.sales-invoice-modal-body {
    min-height: 0;
    padding: 13px 16px 15px;
    overflow: auto;
}

.sales-invoice-filter-summary {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 9px;
}

    .sales-invoice-filter-summary span {
        display: inline-flex;
        align-items: center;
        min-height: 22px;
        padding: 0 7px;
        border: 1px solid #e2e8f0;
        border-radius: 999px;
        background: #f8fafc;
        color: #60708a;
        font-size: 7px;
        font-weight: 700;
    }

.sales-invoice-modal-kpis {
    display: grid;
    grid-template-columns: .65fr 1fr 1fr 1.1fr;
    gap: 8px;
    margin-bottom: 11px;
}

    .sales-invoice-modal-kpis > div {
        min-width: 0;
        padding: 10px 11px;
        border: 1px solid #e2e8f0;
        border-radius: 9px;
        background: #fbfdff;
    }

    .sales-invoice-modal-kpis span {
        display: block;
        margin-bottom: 4px;
        color: #8492a7;
        font-size: 6.8px;
        font-weight: 800;
        letter-spacing: .04em;
    }

    .sales-invoice-modal-kpis strong {
        display: block;
        overflow: hidden;
        color: #13233f;
        font-size: 12px;
        font-weight: 850;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .sales-invoice-modal-kpis small {
        display: block;
        margin-top: 2px;
        color: #8290a4;
        font-size: 7px;
    }

    .sales-invoice-modal-kpis
    .positive
    strong,
    .sales-invoice-modal-kpis
    .positive
    small {
        color: #15803d;
    }

    .sales-invoice-modal-kpis
    .negative
    strong,
    .sales-invoice-modal-kpis
    .negative
    small {
        color: #dc2626;
    }

.sales-invoice-modal-table-wrap {
    overflow: auto;
    border: 1px solid #e2e8f0;
    border-radius: 9px;
}

.sales-invoice-modal-table {
    width: 100%;
    min-width: 900px;
    border-collapse: collapse;
}

    .sales-invoice-modal-table thead {
        position: sticky;
        z-index: 2;
        top: 0;
    }

    .sales-invoice-modal-table th {
        padding: 8px 9px;
        border-bottom: 1px solid #dce5ef;
        background: #f6f8fb;
        color: #5c6f89;
        font-size: 7px;
        font-weight: 800;
        text-align: left;
        white-space: nowrap;
    }

    .sales-invoice-modal-table td {
        padding: 8px 9px;
        border-bottom: 1px solid #edf1f5;
        color: #344861;
        font-size: 7.5px;
        vertical-align: middle;
    }

    .sales-invoice-modal-table
    tbody
    tr:hover {
        background: #fafcff;
    }

    .sales-invoice-modal-table
    tbody
    tr:last-child
    td {
        border-bottom: 0;
    }

    .sales-invoice-modal-table td small {
        display: block;
        max-width: 190px;
        margin-top: 1px;
        overflow: hidden;
        color: #8a98ab;
        font-size: 6.8px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .sales-invoice-modal-table
    .numeric {
        text-align: right;
        white-space: nowrap;
    }

.sales-invoice-no {
    color: #254b79;
}

.sales-invoice-customer {
    display: block;
    max-width: 230px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sales-invoice-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 10px;
}

    .sales-invoice-pagination > div:first-child
    strong {
        display: block;
        color: #42556e;
        font-size: 8px;
    }

    .sales-invoice-pagination > div:first-child
    span {
        display: block;
        margin-top: 1px;
        color: #8b98aa;
        font-size: 7px;
    }

.sales-invoice-pagination-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}

    .sales-invoice-pagination-actions button {
        min-width: 72px;
        height: 29px;
        padding: 0 9px;
        border: 1px solid #dce5ef;
        border-radius: 7px;
        background: #ffffff;
        color: #40536d;
        font-size: 7.5px;
        font-weight: 750;
        cursor: pointer;
    }

        .sales-invoice-pagination-actions button:hover:not(:disabled) {
            border-color: #bfd2f3;
            background: #f4f8ff;
            color: #2563eb;
        }

        .sales-invoice-pagination-actions button:disabled {
            opacity: .45;
            cursor: not-allowed;
        }

    .sales-invoice-pagination-actions > span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 28px;
        height: 28px;
        border-radius: 7px;
        background: #edf4ff;
        color: #2563eb;
        font-size: 8px;
        font-weight: 850;
    }

.sales-invoice-modal-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    min-height: 260px;
    padding: 28px;
}

    .sales-invoice-modal-loading strong {
        display: block;
        color: #20344e;
        font-size: 10px;
    }

    .sales-invoice-modal-loading span {
        display: block;
        margin-top: 2px;
        color: #8492a7;
        font-size: 8px;
    }

.sales-invoice-modal-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid #dbeafe;
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: sales-invoice-spin .8s linear infinite;
}

.sales-invoice-modal-error,
.sales-invoice-modal-empty {
    margin: 16px;
    padding: 14px;
    border-radius: 9px;
    font-size: 8.5px;
    text-align: center;
}

.sales-invoice-modal-error {
    border: 1px solid #fecaca;
    background: #fff7f7;
    color: #b91c1c;
}

.sales-invoice-modal-empty {
    border: 1px dashed #d8e1ec;
    background: #f8fafc;
    color: #718096;
}

@keyframes sales-invoice-spin {
    to {
        transform: rotate(360deg);
    }
}


/* ===== RESPONSIVE ========================================== */

@media (max-width: 1000px) {

    .sales-month-drill-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .sales-month-drill-legend {
        justify-content: flex-start;
    }

    .sales-invoice-modal-kpis {
        grid-template-columns: repeat( 2, minmax(0, 1fr) );
    }
}

@media (max-width: 650px) {

    .sales-invoice-modal-backdrop {
        padding: 8px;
    }

    .sales-invoice-modal {
        width: 100%;
        max-height: 94vh;
        border-radius: 12px;
    }

    .sales-invoice-modal-header {
        align-items: flex-start;
    }

    .sales-invoice-modal-title p {
        display: none;
    }

    .sales-invoice-modal-kpis {
        grid-template-columns: 1fr;
    }

    .sales-invoice-pagination {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* ============================================================
   REISAI V6.3.1 - EXTENDED SALES DETAIL FILTERS
   ============================================================ */

.real-sales-filter.v3 {
    grid-template-columns: repeat( auto-fit, minmax(140px, 1fr) );
}

.real-sales-filter-field input[type="text"] {
    width: 100%;
    min-height: 36px;
    padding: 0 10px;
    border: 1px solid #dfe7f2;
    border-radius: 8px;
    background: #ffffff;
    color: #334155;
    font: inherit;
    font-size: 9px;
    outline: none;
}

    .real-sales-filter-field input[type="text"]:focus {
        border-color: #9ec0f2;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, .07);
    }

.accounting-ok,
.accounting-wait {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    padding: 0 6px;
    border-radius: 6px;
    font-size: 6.8px;
    font-weight: 800;
    white-space: nowrap;
}

.accounting-ok {
    background: #ecfdf5;
    color: #15803d;
}

.accounting-wait {
    background: #fff7ed;
    color: #c2410c;
}

.sales-invoice-modal-table {
    min-width: 1320px;
}


/* ============================================================
   REISAI V6.3.2 - MULTI SELECT FILTERS
   ============================================================ */

.sales-filter-default-note {
    margin-left: 5px;
    color: #d97706;
    font-size: 6.5px;
    font-weight: 750;
}

.sales-multi-filter {
    position: relative;
    width: 100%;
}

    .sales-multi-filter summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        width: 100%;
        min-height: 36px;
        padding: 0 10px;
        list-style: none;
        border: 1px solid #dfe7f2;
        border-radius: 8px;
        background: #ffffff;
        color: #334155;
        font-size: 8.5px;
        cursor: pointer;
    }

        .sales-multi-filter summary::-webkit-details-marker {
            display: none;
        }

        .sales-multi-filter summary span {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .sales-multi-filter summary b {
            color: #94a3b8;
            font-size: 9px;
        }

    .sales-multi-filter[open] summary {
        border-color: #9ec0f2;
        box-shadow: 0 0 0 3px rgba(37,99,235,.07);
    }

.sales-multi-filter-menu {
    position: absolute;
    z-index: 2400;
    top: calc(100% + 5px);
    left: 0;
    width: min(360px, 86vw);
    padding: 9px;
    border: 1px solid #dce5ef;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 16px 40px rgba(15,23,42,.16);
}

.sales-multi-filter-menu-stock {
    width: min(390px, 88vw);
}

.sales-multi-filter-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 2px 3px 8px;
    border-bottom: 1px solid #edf1f5;
}

    .sales-multi-filter-head strong {
        display: block;
        color: #304560;
        font-size: 8px;
    }

    .sales-multi-filter-head small {
        display: block;
        margin-top: 1px;
        color: #8a98ab;
        font-size: 6.8px;
    }

    .sales-multi-filter-head button,
    .sales-multi-filter-actions button {
        min-height: 26px;
        padding: 0 7px;
        border: 1px solid #dce5ef;
        border-radius: 6px;
        background: #ffffff;
        color: #2563eb;
        font-size: 6.8px;
        font-weight: 800;
        cursor: pointer;
    }

.sales-multi-filter-actions {
    display: flex;
    gap: 5px;
    padding: 7px 2px;
    border-bottom: 1px solid #edf1f5;
}

    .sales-multi-filter-actions button.default {
        border-color: #fed7aa;
        background: #fff7ed;
        color: #c2410c;
    }

.sales-multi-filter-options {
    max-height: 260px;
    overflow-y: auto;
    padding-top: 4px;
}

.sales-multi-filter-option {
    display: grid;
    grid-template-columns: 18px 42px 1fr auto;
    gap: 6px;
    align-items: center;
    min-height: 32px;
    padding: 5px 4px;
    border-bottom: 1px solid #f1f5f9;
    color: #40546f;
    font-size: 7.5px;
    cursor: pointer;
}

    .sales-multi-filter-option:last-child {
        border-bottom: 0;
    }

    .sales-multi-filter-option:hover {
        background: #f8fbff;
    }

    .sales-multi-filter-option input {
        width: 13px;
        height: 13px;
        accent-color: #2563eb;
    }

.sales-multi-filter-code {
    color: #2563eb;
    font-weight: 850;
}

.sales-multi-filter-option em {
    padding: 3px 5px;
    border-radius: 5px;
    background: #fff7ed;
    color: #c2410c;
    font-size: 6px;
    font-style: normal;
    font-weight: 750;
    white-space: nowrap;
}

.sales-multi-filter-option.special-g {
    background: #fffdf8;
}


/* ============================================================
   REISAI V6.3.1 - EXTENDED SALES DETAIL FILTERS
   ============================================================ */

.real-sales-filter.v3 {
    grid-template-columns: repeat( auto-fit, minmax(140px, 1fr) );
}

.real-sales-filter-field input[type="text"] {
    width: 100%;
    min-height: 36px;
    padding: 0 10px;
    border: 1px solid #dfe7f2;
    border-radius: 8px;
    background: #ffffff;
    color: #334155;
    font: inherit;
    font-size: 9px;
    outline: none;
}

    .real-sales-filter-field input[type="text"]:focus {
        border-color: #9ec0f2;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, .07);
    }

.accounting-ok,
.accounting-wait {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    padding: 0 6px;
    border-radius: 6px;
    font-size: 6.8px;
    font-weight: 800;
    white-space: nowrap;
}

.accounting-ok {
    background: #ecfdf5;
    color: #15803d;
}

.accounting-wait {
    background: #fff7ed;
    color: #c2410c;
}

.sales-invoice-modal-table {
    min-width: 1320px;
}


/* ============================================================
   REISAI V6.3.2 - MULTI SELECT FILTERS
   ============================================================ */

.sales-filter-default-note {
    margin-left: 5px;
    color: #d97706;
    font-size: 6.5px;
    font-weight: 750;
}

.sales-multi-filter {
    position: relative;
    width: 100%;
}

    .sales-multi-filter summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        width: 100%;
        min-height: 36px;
        padding: 0 10px;
        list-style: none;
        border: 1px solid #dfe7f2;
        border-radius: 8px;
        background: #ffffff;
        color: #334155;
        font-size: 8.5px;
        cursor: pointer;
    }

        .sales-multi-filter summary::-webkit-details-marker {
            display: none;
        }

        .sales-multi-filter summary span {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .sales-multi-filter summary b {
            color: #94a3b8;
            font-size: 9px;
        }

    .sales-multi-filter[open] summary {
        border-color: #9ec0f2;
        box-shadow: 0 0 0 3px rgba(37,99,235,.07);
    }

.sales-multi-filter-menu {
    position: absolute;
    z-index: 2400;
    top: calc(100% + 5px);
    left: 0;
    width: min(360px, 86vw);
    padding: 9px;
    border: 1px solid #dce5ef;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 16px 40px rgba(15,23,42,.16);
}

.sales-multi-filter-menu-stock {
    width: min(390px, 88vw);
}

.sales-multi-filter-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 2px 3px 8px;
    border-bottom: 1px solid #edf1f5;
}

    .sales-multi-filter-head strong {
        display: block;
        color: #304560;
        font-size: 8px;
    }

    .sales-multi-filter-head small {
        display: block;
        margin-top: 1px;
        color: #8a98ab;
        font-size: 6.8px;
    }

    .sales-multi-filter-head button,
    .sales-multi-filter-actions button {
        min-height: 26px;
        padding: 0 7px;
        border: 1px solid #dce5ef;
        border-radius: 6px;
        background: #ffffff;
        color: #2563eb;
        font-size: 6.8px;
        font-weight: 800;
        cursor: pointer;
    }

.sales-multi-filter-actions {
    display: flex;
    gap: 5px;
    padding: 7px 2px;
    border-bottom: 1px solid #edf1f5;
}

    .sales-multi-filter-actions button.default {
        border-color: #fed7aa;
        background: #fff7ed;
        color: #c2410c;
    }

.sales-multi-filter-options {
    max-height: 260px;
    overflow-y: auto;
    padding-top: 4px;
}

.sales-multi-filter-option {
    display: grid;
    grid-template-columns: 18px 42px 1fr auto;
    gap: 6px;
    align-items: center;
    min-height: 32px;
    padding: 5px 4px;
    border-bottom: 1px solid #f1f5f9;
    color: #40546f;
    font-size: 7.5px;
    cursor: pointer;
}

    .sales-multi-filter-option:last-child {
        border-bottom: 0;
    }

    .sales-multi-filter-option:hover {
        background: #f8fbff;
    }

    .sales-multi-filter-option input {
        width: 13px;
        height: 13px;
        accent-color: #2563eb;
    }

.sales-multi-filter-code {
    color: #2563eb;
    font-weight: 850;
}

.sales-multi-filter-option em {
    padding: 3px 5px;
    border-radius: 5px;
    background: #fff7ed;
    color: #c2410c;
    font-size: 6px;
    font-style: normal;
    font-weight: 750;
    white-space: nowrap;
}

.sales-multi-filter-option.special-g {
    background: #fffdf8;
}


/* ============================================================
   REISAI V6.3.3 - COMPANY / CONSOLIDATION SELECTOR
   ============================================================ */

.company-scope-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 0 0 14px;
    padding: 11px 13px;
    border: 1px solid #dfe7f2;
    border-radius: 12px;
    background: linear-gradient(135deg,#fff 0%,#f8fbff 100%);
    font-family: "Segoe UI Variable Text","Segoe UI",Arial,sans-serif;
}

.company-scope-main, .company-scope-controls {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0
}

.company-scope-main {
    flex: 1
}

.company-scope-title {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 205px
}

.company-scope-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 9px;
    background: #edf4ff;
    color: #2563eb
}

    .company-scope-icon svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round
    }

.company-scope-title span {
    display: block;
    color: #8a98ab;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .06em
}

.company-scope-title strong {
    display: block;
    margin-top: 1px;
    color: #18304f;
    font-size: 10.5px;
    font-weight: 850
}

.company-scope-title small {
    display: block;
    max-width: 285px;
    margin-top: 1px;
    overflow: hidden;
    color: #8290a4;
    font-size: 7px;
    text-overflow: ellipsis;
    white-space: nowrap
}

.company-scope-presets {
    display: flex;
    gap: 5px
}

.company-scope-preset {
    display: grid;
    gap: 1px;
    min-width: 105px;
    min-height: 39px;
    padding: 5px 9px;
    border: 1px solid #dfe7f2;
    border-radius: 8px;
    background: #fff;
    color: #51657f;
    font-size: 8px;
    font-weight: 800;
    text-align: left;
    cursor: pointer
}

    .company-scope-preset small {
        color: #93a0b3;
        font-size: 6.4px;
        font-weight: 600
    }

    .company-scope-preset.active {
        border-color: #b9d1f7;
        background: #edf4ff;
        color: #2563eb
    }

        .company-scope-preset.active small {
            color: #5682cb
        }

.company-scope-dropdown {
    position: relative
}

    .company-scope-dropdown summary {
        display: flex;
        align-items: center;
        gap: 7px;
        min-height: 36px;
        padding: 0 10px;
        list-style: none;
        border: 1px solid #dfe7f2;
        border-radius: 8px;
        background: #fff;
        color: #596c85;
        font-size: 7.7px;
        cursor: pointer
    }

        .company-scope-dropdown summary::-webkit-details-marker {
            display: none
        }

        .company-scope-dropdown summary strong {
            color: #1f3c63
        }

        .company-scope-dropdown summary b {
            color: #94a3b8
        }

.company-scope-dropdown-body {
    position: absolute;
    z-index: 3000;
    top: calc(100% + 5px);
    right: 0;
    width: 365px;
    padding: 9px;
    border: 1px solid #dce5ef;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 16px 40px rgba(15,23,42,.16)
}

.company-scope-dropdown-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 2px 3px 7px;
    border-bottom: 1px solid #edf1f5
}

    .company-scope-dropdown-head strong {
        color: #304560;
        font-size: 8px
    }

    .company-scope-dropdown-head button {
        padding: 4px 6px;
        border: 0;
        background: transparent;
        color: #2563eb;
        font-size: 7px;
        font-weight: 750;
        cursor: pointer
    }

.company-scope-company {
    display: grid;
    grid-template-columns: 16px 30px 1fr;
    gap: 6px;
    align-items: center;
    min-height: 35px;
    padding: 5px 4px;
    border-bottom: 1px solid #f1f5f9;
    cursor: pointer
}

    .company-scope-company:last-child {
        border-bottom: 0
    }

    .company-scope-company:hover {
        background: #f8fbff
    }

    .company-scope-company input {
        width: 13px;
        height: 13px;
        accent-color: #2563eb
    }

.company-scope-company-code {
    color: #2563eb;
    font-size: 7.5px;
    font-weight: 850
}

.company-scope-company-name {
    overflow: hidden;
    color: #40546f;
    font-size: 7.5px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap
}

.company-scope-intercompany {
    display: flex;
    align-items: center;
    gap: 6px
}

    .company-scope-intercompany > span {
        color: #8492a7;
        font-size: 7px;
        white-space: nowrap
    }

    .company-scope-intercompany > div {
        display: flex;
        gap: 2px;
        padding: 2px;
        border: 1px solid #dfe7f2;
        border-radius: 7px;
        background: #f8fafc
    }

.company-scope-toggle {
    min-width: 43px;
    height: 28px;
    padding: 0 7px;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: #718096;
    font-size: 7px;
    font-weight: 800;
    cursor: pointer
}

    .company-scope-toggle.active {
        background: #fff;
        color: #2563eb;
        box-shadow: 0 1px 4px rgba(30,64,175,.12)
    }

@media(max-width:1100px) {
    .company-scope-panel {
        align-items: stretch;
        flex-direction: column
    }

    .company-scope-main, .company-scope-controls {
        justify-content: space-between
    }
}

@media(max-width:700px) {
    .company-scope-main, .company-scope-controls {
        align-items: stretch;
        flex-direction: column
    }

    .company-scope-presets {
        width: 100%
    }

    .company-scope-preset {
        flex: 1
    }

    .company-scope-intercompany {
        justify-content: space-between
    }

    .company-scope-dropdown-body {
        right: auto;
        left: 0;
        width: min(365px,88vw)
    }
}


/* ============================================================
   REISAI V6.3.1 - EXTENDED SALES DETAIL FILTERS
   ============================================================ */

.real-sales-filter.v3 {
    grid-template-columns: repeat( auto-fit, minmax(140px, 1fr) );
}

.real-sales-filter-field input[type="text"] {
    width: 100%;
    min-height: 36px;
    padding: 0 10px;
    border: 1px solid #dfe7f2;
    border-radius: 8px;
    background: #ffffff;
    color: #334155;
    font: inherit;
    font-size: 9px;
    outline: none;
}

    .real-sales-filter-field input[type="text"]:focus {
        border-color: #9ec0f2;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, .07);
    }

.accounting-ok,
.accounting-wait {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    padding: 0 6px;
    border-radius: 6px;
    font-size: 6.8px;
    font-weight: 800;
    white-space: nowrap;
}

.accounting-ok {
    background: #ecfdf5;
    color: #15803d;
}

.accounting-wait {
    background: #fff7ed;
    color: #c2410c;
}

.sales-invoice-modal-table {
    min-width: 1320px;
}


/* ============================================================
   REISAI V6.3.2 - MULTI SELECT FILTERS
   ============================================================ */

.sales-filter-default-note {
    margin-left: 5px;
    color: #d97706;
    font-size: 6.5px;
    font-weight: 750;
}

.sales-multi-filter {
    position: relative;
    width: 100%;
}

    .sales-multi-filter summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        width: 100%;
        min-height: 36px;
        padding: 0 10px;
        list-style: none;
        border: 1px solid #dfe7f2;
        border-radius: 8px;
        background: #ffffff;
        color: #334155;
        font-size: 8.5px;
        cursor: pointer;
    }

        .sales-multi-filter summary::-webkit-details-marker {
            display: none;
        }

        .sales-multi-filter summary span {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .sales-multi-filter summary b {
            color: #94a3b8;
            font-size: 9px;
        }

    .sales-multi-filter[open] summary {
        border-color: #9ec0f2;
        box-shadow: 0 0 0 3px rgba(37,99,235,.07);
    }

.sales-multi-filter-menu {
    position: absolute;
    z-index: 2400;
    top: calc(100% + 5px);
    left: 0;
    width: min(360px, 86vw);
    padding: 9px;
    border: 1px solid #dce5ef;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 16px 40px rgba(15,23,42,.16);
}

.sales-multi-filter-menu-stock {
    width: min(390px, 88vw);
}

.sales-multi-filter-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 2px 3px 8px;
    border-bottom: 1px solid #edf1f5;
}

    .sales-multi-filter-head strong {
        display: block;
        color: #304560;
        font-size: 8px;
    }

    .sales-multi-filter-head small {
        display: block;
        margin-top: 1px;
        color: #8a98ab;
        font-size: 6.8px;
    }

    .sales-multi-filter-head button,
    .sales-multi-filter-actions button {
        min-height: 26px;
        padding: 0 7px;
        border: 1px solid #dce5ef;
        border-radius: 6px;
        background: #ffffff;
        color: #2563eb;
        font-size: 6.8px;
        font-weight: 800;
        cursor: pointer;
    }

.sales-multi-filter-actions {
    display: flex;
    gap: 5px;
    padding: 7px 2px;
    border-bottom: 1px solid #edf1f5;
}

    .sales-multi-filter-actions button.default {
        border-color: #fed7aa;
        background: #fff7ed;
        color: #c2410c;
    }

.sales-multi-filter-options {
    max-height: 260px;
    overflow-y: auto;
    padding-top: 4px;
}

.sales-multi-filter-option {
    display: grid;
    grid-template-columns: 18px 42px 1fr auto;
    gap: 6px;
    align-items: center;
    min-height: 32px;
    padding: 5px 4px;
    border-bottom: 1px solid #f1f5f9;
    color: #40546f;
    font-size: 7.5px;
    cursor: pointer;
}

    .sales-multi-filter-option:last-child {
        border-bottom: 0;
    }

    .sales-multi-filter-option:hover {
        background: #f8fbff;
    }

    .sales-multi-filter-option input {
        width: 13px;
        height: 13px;
        accent-color: #2563eb;
    }

.sales-multi-filter-code {
    color: #2563eb;
    font-weight: 850;
}

.sales-multi-filter-option em {
    padding: 3px 5px;
    border-radius: 5px;
    background: #fff7ed;
    color: #c2410c;
    font-size: 6px;
    font-style: normal;
    font-weight: 750;
    white-space: nowrap;
}

.sales-multi-filter-option.special-g {
    background: #fffdf8;
}


/* ============================================================
   REISAI V6.3.3 - COMPANY / CONSOLIDATION SELECTOR
   ============================================================ */

.company-scope-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 0 0 14px;
    padding: 11px 13px;
    border: 1px solid #dfe7f2;
    border-radius: 12px;
    background: linear-gradient(135deg,#fff 0%,#f8fbff 100%);
    font-family: "Segoe UI Variable Text","Segoe UI",Arial,sans-serif;
}

.company-scope-main, .company-scope-controls {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0
}

.company-scope-main {
    flex: 1
}

.company-scope-title {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 205px
}

.company-scope-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 9px;
    background: #edf4ff;
    color: #2563eb
}

    .company-scope-icon svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round
    }

.company-scope-title span {
    display: block;
    color: #8a98ab;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .06em
}

.company-scope-title strong {
    display: block;
    margin-top: 1px;
    color: #18304f;
    font-size: 10.5px;
    font-weight: 850
}

.company-scope-title small {
    display: block;
    max-width: 285px;
    margin-top: 1px;
    overflow: hidden;
    color: #8290a4;
    font-size: 7px;
    text-overflow: ellipsis;
    white-space: nowrap
}

.company-scope-presets {
    display: flex;
    gap: 5px
}

.company-scope-preset {
    display: grid;
    gap: 1px;
    min-width: 105px;
    min-height: 39px;
    padding: 5px 9px;
    border: 1px solid #dfe7f2;
    border-radius: 8px;
    background: #fff;
    color: #51657f;
    font-size: 8px;
    font-weight: 800;
    text-align: left;
    cursor: pointer
}

    .company-scope-preset small {
        color: #93a0b3;
        font-size: 6.4px;
        font-weight: 600
    }

    .company-scope-preset.active {
        border-color: #b9d1f7;
        background: #edf4ff;
        color: #2563eb
    }

        .company-scope-preset.active small {
            color: #5682cb
        }

.company-scope-dropdown {
    position: relative
}

    .company-scope-dropdown summary {
        display: flex;
        align-items: center;
        gap: 7px;
        min-height: 36px;
        padding: 0 10px;
        list-style: none;
        border: 1px solid #dfe7f2;
        border-radius: 8px;
        background: #fff;
        color: #596c85;
        font-size: 7.7px;
        cursor: pointer
    }

        .company-scope-dropdown summary::-webkit-details-marker {
            display: none
        }

        .company-scope-dropdown summary strong {
            color: #1f3c63
        }

        .company-scope-dropdown summary b {
            color: #94a3b8
        }

.company-scope-dropdown-body {
    position: absolute;
    z-index: 3000;
    top: calc(100% + 5px);
    right: 0;
    width: 365px;
    padding: 9px;
    border: 1px solid #dce5ef;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 16px 40px rgba(15,23,42,.16)
}

.company-scope-dropdown-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 2px 3px 7px;
    border-bottom: 1px solid #edf1f5
}

    .company-scope-dropdown-head strong {
        color: #304560;
        font-size: 8px
    }

    .company-scope-dropdown-head button {
        padding: 4px 6px;
        border: 0;
        background: transparent;
        color: #2563eb;
        font-size: 7px;
        font-weight: 750;
        cursor: pointer
    }

.company-scope-company {
    display: grid;
    grid-template-columns: 16px 30px 1fr;
    gap: 6px;
    align-items: center;
    min-height: 35px;
    padding: 5px 4px;
    border-bottom: 1px solid #f1f5f9;
    cursor: pointer
}

    .company-scope-company:last-child {
        border-bottom: 0
    }

    .company-scope-company:hover {
        background: #f8fbff
    }

    .company-scope-company input {
        width: 13px;
        height: 13px;
        accent-color: #2563eb
    }

.company-scope-company-code {
    color: #2563eb;
    font-size: 7.5px;
    font-weight: 850
}

.company-scope-company-name {
    overflow: hidden;
    color: #40546f;
    font-size: 7.5px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap
}

.company-scope-intercompany {
    display: flex;
    align-items: center;
    gap: 6px
}

    .company-scope-intercompany > span {
        color: #8492a7;
        font-size: 7px;
        white-space: nowrap
    }

    .company-scope-intercompany > div {
        display: flex;
        gap: 2px;
        padding: 2px;
        border: 1px solid #dfe7f2;
        border-radius: 7px;
        background: #f8fafc
    }

.company-scope-toggle {
    min-width: 43px;
    height: 28px;
    padding: 0 7px;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: #718096;
    font-size: 7px;
    font-weight: 800;
    cursor: pointer
}

    .company-scope-toggle.active {
        background: #fff;
        color: #2563eb;
        box-shadow: 0 1px 4px rgba(30,64,175,.12)
    }

@media(max-width:1100px) {
    .company-scope-panel {
        align-items: stretch;
        flex-direction: column
    }

    .company-scope-main, .company-scope-controls {
        justify-content: space-between
    }
}

@media(max-width:700px) {
    .company-scope-main, .company-scope-controls {
        align-items: stretch;
        flex-direction: column
    }

    .company-scope-presets {
        width: 100%
    }

    .company-scope-preset {
        flex: 1
    }

    .company-scope-intercompany {
        justify-content: space-between
    }

    .company-scope-dropdown-body {
        right: auto;
        left: 0;
        width: min(365px,88vw)
    }
}


/* ============================================================
   REISAI V6.3.3.4
   COMPANY SELECTION - APPLY ONCE
   ============================================================ */

.company-scope-title {
    position: relative;
}

.company-scope-pending-badge {
    display: inline-flex !important;
    align-items: center;
    min-height: 20px;
    margin-left: 4px;
    padding: 0 7px;
    border: 1px solid #fed7aa;
    border-radius: 999px;
    background: #fff7ed;
    color: #c2410c !important;
    font-size: 6.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    white-space: nowrap;
}

.company-scope-dropdown-head > div {
    min-width: 0;
}

.company-scope-dropdown-head small {
    display: block;
    margin-top: 2px;
    color: #8a98ab;
    font-size: 6.6px;
    font-weight: 500;
}

.company-scope-dropdown-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 7px;
    padding: 9px 3px 2px;
    border-top: 1px solid #e7edf5;
}

.company-scope-dropdown-selection-info strong {
    display: block;
    color: #334155;
    font-size: 7.5px;
    font-weight: 800;
}

.company-scope-dropdown-selection-info span {
    display: block;
    margin-top: 2px;
    color: #94a3b8;
    font-size: 6.4px;
}

.company-scope-dropdown-actions {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
}

    .company-scope-dropdown-actions button {
        min-height: 29px;
        padding: 0 9px;
        border-radius: 7px;
        font-size: 7px;
        font-weight: 800;
        cursor: pointer;
    }

        .company-scope-dropdown-actions button.secondary {
            border: 1px solid #dce5ef;
            background: #ffffff;
            color: #64748b;
        }

        .company-scope-dropdown-actions button.primary {
            border: 1px solid #2563eb;
            background: #2563eb;
            color: #ffffff;
        }

        .company-scope-dropdown-actions button:disabled,
        .company-scope-apply-main:disabled {
            opacity: .45;
            cursor: not-allowed;
        }

.company-scope-apply-main {
    min-height: 34px;
    padding: 0 11px;
    border: 1px solid #2563eb;
    border-radius: 8px;
    background: #2563eb;
    color: #ffffff;
    font-size: 7.3px;
    font-weight: 850;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(37,99,235,.15);
}

    .company-scope-apply-main:hover:not(:disabled) {
        background: #1d4ed8;
        border-color: #1d4ed8;
    }

@media(max-width:700px) {
    .company-scope-dropdown-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .company-scope-dropdown-actions {
        justify-content: flex-end;
    }

    .company-scope-apply-main {
        width: 100%;
    }
}


/* ============================================================
   REISAI V6.4 - SALES INSIGHTS + EXCEPTION REPORTS
   app.css dosyasının sonuna ekleyin.
   ============================================================ */

.sales-period-champions {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 10px;
    margin: 14px 0
}

.sales-champion-card {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    gap: 10px;
    align-items: center;
    min-height: 95px;
    padding: 13px;
    border: 1px solid #dfe7f2;
    border-radius: 12px;
    background: #fff;
    position: relative;
    overflow: hidden
}

    .sales-champion-card::after {
        content: "";
        position: absolute;
        top: -30px;
        right: -30px;
        width: 90px;
        height: 90px;
        border-radius: 50%;
        background: rgba(37,99,235,.04)
    }

.sales-champion-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 11px;
    background: #eef5ff;
    color: #2563eb;
    font-size: 19px;
    font-weight: 900
}

.sales-champion-card > div:nth-child(2) {
    min-width: 0
}

.sales-champion-card span {
    display: block;
    color: #8391a5;
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .05em
}

.sales-champion-card > div:nth-child(2) > strong {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: #162b47;
    font-size: 10px;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap
}

.sales-champion-card small {
    display: block;
    margin-top: 2px;
    color: #8b99ab;
    font-size: 6.8px
}

.sales-champion-value {
    grid-column: 1/-1;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid #edf2f7
}

    .sales-champion-value strong {
        color: #172b49;
        font-size: 10px;
        font-weight: 900
    }

    .sales-champion-value small {
        text-align: right
    }

.sales-analysis-section-title {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin: 18px 0 8px
}

    .sales-analysis-section-title span {
        color: #2563eb;
        font-size: 7px;
        font-weight: 900;
        letter-spacing: .08em
    }

    .sales-analysis-section-title h2 {
        margin: 2px 0 0;
        color: #11233f;
        font-size: 14px;
        font-weight: 900
    }

    .sales-analysis-section-title p {
        margin: 3px 0 0;
        color: #8492a7;
        font-size: 7px
    }

.sales-leader-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;
    margin-bottom: 14px
}

.sales-ranking-list, .payment-term-list {
    display: grid;
    gap: 3px
}

.sales-ranking-row {
    display: grid;
    grid-template-columns: 26px minmax(150px,1.2fr) minmax(90px,1fr) 95px;
    gap: 8px;
    align-items: center;
    min-height: 37px;
    padding: 4px 2px;
    border-bottom: 1px solid #eef2f7
}

    .sales-ranking-row:last-child {
        border-bottom: 0
    }

    .sales-ranking-row .rank {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 22px;
        height: 22px;
        border-radius: 7px;
        background: #f1f5f9;
        color: #64748b;
        font-size: 7px;
        font-weight: 900
    }

    .sales-ranking-row .name {
        min-width: 0
    }

        .sales-ranking-row .name strong, .payment-term-name strong {
            display: block;
            overflow: hidden;
            color: #243a58;
            font-size: 7.7px;
            font-weight: 800;
            text-overflow: ellipsis;
            white-space: nowrap
        }

        .sales-ranking-row .name small, .payment-term-name span, .payment-term-values span {
            display: block;
            margin-top: 1px;
            color: #94a3b8;
            font-size: 6.4px
        }

    .sales-ranking-row .bar, .payment-term-bar {
        height: 7px;
        overflow: hidden;
        border-radius: 999px;
        background: #edf2f8
    }

        .sales-ranking-row .bar i, .payment-term-bar i {
            display: block;
            height: 100%;
            border-radius: inherit;
            background: #2f6fed
        }

    .sales-ranking-row .amount {
        color: #182b45;
        font-size: 7.4px;
        font-weight: 850;
        text-align: right
    }

.payment-term-row {
    display: grid;
    grid-template-columns: 95px minmax(100px,1fr) 145px;
    gap: 9px;
    align-items: center;
    min-height: 42px;
    padding: 5px 2px;
    border-bottom: 1px solid #eef2f7
}

    .payment-term-row:last-child {
        border-bottom: 0
    }

.payment-term-values {
    text-align: right
}

    .payment-term-values strong {
        display: block;
        color: #243a58;
        font-size: 7.5px;
        font-weight: 850
    }

.sales-card-header-actions {
    display: flex;
    align-items: center;
    gap: 7px
}

.sales-view-all-button {
    min-height: 28px;
    padding: 0 9px;
    border: 1px solid #cbd8e7;
    border-radius: 7px;
    background: #fff;
    color: #2563eb;
    font-size: 7px;
    font-weight: 850;
    cursor: pointer
}

    .sales-view-all-button:hover {
        background: #f8fbff
    }

    .sales-view-all-button.danger {
        border-color: #fecaca;
        color: #dc2626
    }

.sales-exception-page {
    padding: 20px 22px 32px
}

.sales-exception-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 14px
}

    .sales-exception-header h1 {
        margin: 6px 0 0;
        color: #0f213c;
        font-size: 24px;
        font-weight: 900
    }

    .sales-exception-header p {
        margin: 4px 0 0;
        color: #728198;
        font-size: 9px
    }

.sales-exception-back {
    display: inline-flex;
    margin-bottom: 7px;
    color: #2563eb;
    font-size: 8px;
    font-weight: 800;
    text-decoration: none
}

.sales-exception-excel {
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid #bbf7d0;
    border-radius: 9px;
    background: #f0fdf4;
    color: #15803d;
    font-size: 8px;
    font-weight: 850;
    cursor: pointer
}

.sales-exception-tabs {
    display: inline-flex;
    gap: 3px;
    margin: 0 0 10px;
    padding: 3px;
    border: 1px solid #dfe7f2;
    border-radius: 9px;
    background: #f8fafc
}

    .sales-exception-tabs a {
        padding: 8px 11px;
        border-radius: 7px;
        color: #64748b;
        font-size: 8px;
        font-weight: 800;
        text-decoration: none
    }

        .sales-exception-tabs a.active {
            background: #fff;
            color: #2563eb;
            box-shadow: 0 1px 4px rgba(15,23,42,.08)
        }

.sales-exception-filter {
    display: grid;
    grid-template-columns: 120px 120px 135px minmax(220px,1fr) auto;
    gap: 9px;
    align-items: end;
    margin-bottom: 10px;
    padding: 12px;
    border: 1px solid #dfe7f2;
    border-radius: 12px;
    background: #fff
}

    .sales-exception-filter label {
        display: block;
        margin-bottom: 5px;
        color: #8391a5;
        font-size: 6.7px;
        font-weight: 850
    }

    .sales-exception-filter select, .sales-exception-filter input {
        width: 100%;
        min-height: 36px;
        padding: 0 9px;
        border: 1px solid #dce5ef;
        border-radius: 8px;
        background: #fff;
        color: #334155;
        font-size: 8px;
        outline: none
    }

.sales-exception-filter-button {
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid #2563eb;
    border-radius: 8px;
    background: #2563eb;
    color: #fff;
    font-size: 8px;
    font-weight: 850;
    cursor: pointer
}

.sales-exception-filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    align-items: center;
    margin-bottom: 10px;
    padding: 8px 10px;
    border: 1px solid #e6edf5;
    border-radius: 9px;
    background: #f8fafc;
    color: #7a899d;
    font-size: 6.7px
}

    .sales-exception-filter-chips b {
        padding: 4px 6px;
        border-radius: 6px;
        background: #fff;
        color: #425773;
        font-weight: 800
    }

.sales-exception-kpis {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 10px;
    margin-bottom: 10px
}

    .sales-exception-kpis > div {
        padding: 12px;
        border: 1px solid #dfe7f2;
        border-radius: 11px;
        background: #fff
    }

    .sales-exception-kpis span {
        display: block;
        color: #8a98ab;
        font-size: 6.7px;
        font-weight: 850
    }

    .sales-exception-kpis strong {
        display: block;
        margin-top: 5px;
        color: #132844;
        font-size: 17px;
        font-weight: 900
    }

        .sales-exception-kpis strong.negative {
            color: #dc2626
        }

.sales-exception-card {
    overflow: hidden;
    border: 1px solid #dfe7f2;
    border-radius: 12px;
    background: #fff
}

.sales-exception-table-wrap {
    overflow: auto;
    max-height: 62vh
}

.sales-exception-table {
    width: 100%;
    min-width: 1700px;
    border-collapse: collapse
}

    .sales-exception-table th {
        position: sticky;
        z-index: 2;
        top: 0;
        padding: 9px 8px;
        border-bottom: 1px solid #dfe7f2;
        background: #f8fafc;
        color: #65768e;
        font-size: 6.6px;
        font-weight: 850;
        text-align: left;
        white-space: nowrap
    }

    .sales-exception-table td {
        padding: 8px;
        border-bottom: 1px solid #edf2f7;
        color: #334155;
        font-size: 7px;
        vertical-align: middle
    }

        .sales-exception-table td strong {
            display: block;
            color: #172b48;
            font-size: 7px
        }

        .sales-exception-table td small {
            display: block;
            margin-top: 2px;
            color: #94a3b8;
            font-size: 6.2px
        }

        .sales-exception-table td.numeric {
            text-align: right;
            white-space: nowrap
        }

        .sales-exception-table td.invoice-no {
            color: #162b49;
            font-weight: 850;
            white-space: nowrap
        }

        .sales-exception-table td.danger {
            color: #dc2626;
            font-weight: 800
        }

.sales-exception-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid #dfe7f2;
    border-radius: 10px;
    background: #fff
}

    .sales-exception-pagination strong {
        color: #243a58;
        font-size: 8px
    }

    .sales-exception-pagination span {
        margin-left: 8px;
        color: #8b99ab;
        font-size: 7px
    }

    .sales-exception-pagination > div:last-child {
        display: flex;
        gap: 6px
    }

    .sales-exception-pagination button {
        min-height: 30px;
        padding: 0 9px;
        border: 1px solid #dce5ef;
        border-radius: 7px;
        background: #fff;
        color: #40546f;
        font-size: 7px;
        font-weight: 800;
        cursor: pointer
    }

@media(max-width:1100px) {
    .sales-period-champions, .sales-leader-grid {
        grid-template-columns: repeat(2,minmax(0,1fr))
    }

    .sales-exception-filter {
        grid-template-columns: repeat(2,minmax(0,1fr))
    }
}

@media(max-width:700px) {
    .sales-period-champions, .sales-leader-grid, .sales-exception-kpis {
        grid-template-columns: 1fr
    }

    .sales-exception-filter {
        grid-template-columns: 1fr
    }

    .sales-exception-header {
        flex-direction: column
    }
}


/* ============================================================
   REISAI V6.4.4
   RIGHT SIDE INVOICE DETAIL DRAWER
   Append to wwwroot/app.css
   ============================================================ */

.sales-exception-table .detail-action-column,
.sales-exception-table .detail-action-cell {
    position: sticky;
    left: 0;
    z-index: 4;
    width: 42px;
    min-width: 42px;
    max-width: 42px;
    padding-left: 7px;
    padding-right: 7px;
    background: #ffffff;
    text-align: center;
}

.sales-exception-table thead .detail-action-column {
    z-index: 7;
    background: #f8fafc;
}

.sales-exception-table tbody tr:hover .detail-action-cell {
    background: #f8fbff;
}

.row-detail-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 29px;
    height: 29px;
    padding: 0;
    border: 1px solid #dbe5f1;
    border-radius: 8px;
    background: #ffffff;
    color: #4f6f9e;
    cursor: pointer;
    transition: all .16s ease;
}

    .row-detail-button:hover {
        border-color: #9fc0f5;
        background: #edf5ff;
        color: #2563eb;
        box-shadow: 0 4px 12px rgba(37,99,235,.12);
        transform: translateY(-1px);
    }

    .row-detail-button svg {
        width: 15px;
        height: 15px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.invoice-detail-overlay {
    position: fixed;
    inset: 0;
    z-index: 4990;
    background: rgba(15,23,42,.22);
    backdrop-filter: blur(1.5px);
}

.invoice-detail-drawer {
    position: fixed;
    z-index: 5000;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    width: min(520px, 94vw);
    border-left: 1px solid #dce5ef;
    background: #f7f9fc;
    box-shadow: -18px 0 55px rgba(15,23,42,.18);
    animation: reisaiDrawerIn .18s ease-out;
}

@keyframes reisaiDrawerIn {
    from {
        transform: translateX(24px);
        opacity: .65;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

.invoice-detail-drawer-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 20px 17px;
    border-bottom: 1px solid #e2e9f2;
    background: #ffffff;
}

.invoice-detail-eyebrow {
    display: inline-flex;
    padding: 4px 7px;
    border-radius: 6px;
    background: #eaf2ff;
    color: #2563eb;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .08em;
}

.invoice-detail-drawer-header h2 {
    margin: 8px 0 0;
    color: #11233f;
    font-size: 19px;
    font-weight: 900;
}

.invoice-detail-drawer-header p {
    margin: 3px 0 0;
    color: #7c8ca2;
    font-size: 8px;
}

.invoice-detail-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border: 1px solid #dce5ef;
    border-radius: 9px;
    background: #ffffff;
    color: #64748b;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

    .invoice-detail-close:hover {
        border-color: #c5d3e5;
        background: #f8fafc;
        color: #1f3553;
    }

.invoice-detail-drawer-body {
    flex: 1;
    overflow-y: auto;
    padding: 15px;
}

.invoice-detail-section {
    margin-bottom: 12px;
    padding: 14px;
    border: 1px solid #e0e8f2;
    border-radius: 12px;
    background: #ffffff;
}

.invoice-detail-section-title {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #edf2f7;
}

    .invoice-detail-section-title > span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 27px;
        height: 27px;
        border-radius: 8px;
        background: #edf4ff;
        color: #2563eb;
        font-size: 7px;
        font-weight: 900;
    }

    .invoice-detail-section-title strong {
        display: block;
        color: #243a58;
        font-size: 9px;
        font-weight: 900;
    }

    .invoice-detail-section-title small {
        display: block;
        margin-top: 1px;
        color: #93a0b3;
        font-size: 6.7px;
    }

.invoice-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 8px;
}

    .invoice-detail-grid > div {
        min-width: 0;
        min-height: 58px;
        padding: 9px 10px;
        border: 1px solid #edf2f7;
        border-radius: 9px;
        background: #fbfcfe;
    }

        .invoice-detail-grid > div.wide {
            grid-column: 1 / -1;
        }

    .invoice-detail-grid span,
    .invoice-financial-summary span {
        display: block;
        color: #8a98ab;
        font-size: 6.6px;
        font-weight: 800;
        letter-spacing: .02em;
    }

    .invoice-detail-grid strong {
        display: block;
        margin-top: 4px;
        overflow-wrap: anywhere;
        color: #1f3655;
        font-size: 8.2px;
        font-weight: 850;
    }

    .invoice-detail-grid small {
        display: block;
        margin-top: 2px;
        color: #94a3b8;
        font-size: 6.5px;
    }

    .invoice-detail-grid strong.success {
        color: #059669;
    }

    .invoice-detail-grid strong.warning {
        color: #d97706;
    }

    .invoice-detail-grid .danger-box {
        border-color: #fecaca;
        background: #fff7f7;
    }

        .invoice-detail-grid .danger-box strong {
            color: #dc2626;
        }

.invoice-financial-summary {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
}

    .invoice-financial-summary > div {
        min-height: 72px;
        padding: 11px;
        border: 1px solid #e5ebf3;
        border-radius: 10px;
        background: #fbfcfe;
    }

    .invoice-financial-summary strong {
        display: block;
        margin-top: 7px;
        color: #152b48;
        font-size: 12px;
        font-weight: 900;
    }

    .invoice-financial-summary > div.loss {
        border-color: #fecaca;
        background: #fff7f7;
    }

        .invoice-financial-summary > div.loss strong {
            color: #dc2626;
        }

@media(max-width:700px) {
    .invoice-detail-drawer {
        width: 100vw;
    }

    .invoice-detail-grid,
    .invoice-financial-summary {
        grid-template-columns: 1fr;
    }

        .invoice-detail-grid > div.wide {
            grid-column: auto;
        }
}





/* ============================================================
   REISAI V6.4.6 - SALES EXCEPTION READABILITY REFRESH
   Maliyet Kontrolü / Zarar Eden Faturalar / Sağ Detay Paneli
   ============================================================ */

/* Sayfa genel okunabilirlik */
.sales-exception-page {
    padding: 24px 28px 36px;
}

.sales-exception-header h1 {
    font-size: 28px;
    line-height: 1.2;
}

.sales-exception-header p {
    font-size: 12px;
    line-height: 1.55;
}

.sales-exception-back {
    font-size: 10px;
}

.sales-exception-excel {
    min-height: 42px;
    padding: 0 16px;
    font-size: 11px;
}

.sales-exception-tabs a {
    padding: 10px 14px;
    font-size: 10.5px;
}

/* Firma kapsamı - sadece exception sayfalarında büyüt */
.sales-exception-page .company-scope-title span {
    font-size: 8.5px;
}

.sales-exception-page .company-scope-title strong {
    font-size: 12px;
}

.sales-exception-page .company-scope-title small {
    font-size: 8.5px;
}

.sales-exception-page .company-scope-preset {
    min-width: 120px;
    min-height: 44px;
    font-size: 9.5px;
}

    .sales-exception-page .company-scope-preset small {
        font-size: 8px;
    }

.sales-exception-page .company-scope-dropdown summary {
    min-height: 40px;
    font-size: 9.5px;
}

.sales-exception-page .company-scope-dropdown-head strong,
.sales-exception-page .company-scope-company-code,
.sales-exception-page .company-scope-company-name {
    font-size: 9.5px;
}

.sales-exception-page .company-scope-dropdown-head small {
    font-size: 8px;
}

.sales-exception-page .company-scope-intercompany > span,
.sales-exception-page .company-scope-toggle,
.sales-exception-page .company-scope-apply-main {
    font-size: 9px;
}

.sales-exception-page .company-scope-apply-main {
    min-height: 40px;
    min-width: 95px;
}

/* Filtreler */
.sales-exception-filter {
    grid-template-columns: 150px 150px 165px minmax(280px,1fr) auto;
    gap: 12px;
    padding: 15px;
}

    .sales-exception-filter label {
        margin-bottom: 7px;
        font-size: 9px;
    }

    .sales-exception-filter select,
    .sales-exception-filter input {
        min-height: 42px;
        padding: 0 12px;
        font-size: 11px;
    }

.sales-exception-filter-button {
    min-height: 42px;
    padding: 0 16px;
    font-size: 10.5px;
}

.sales-exception-filter-chips {
    font-size: 9px;
}

    .sales-exception-filter-chips b {
        font-size: 9px;
    }

/* KPI kartları */
.sales-exception-kpis {
    gap: 12px;
    margin-bottom: 14px;
}

    .sales-exception-kpis > div {
        min-height: 92px;
        padding: 16px 18px;
    }

    .sales-exception-kpis span {
        font-size: 9px;
    }

    .sales-exception-kpis strong {
        margin-top: 8px;
        font-size: 22px;
    }

/* Tablo okunabilirliği */
.sales-exception-table-wrap {
    max-height: 64vh;
}

.sales-exception-table {
    min-width: 2050px;
}

    .sales-exception-table th {
        padding: 11px 10px;
        font-size: 9px;
        line-height: 1.3;
    }

    .sales-exception-table td {
        padding: 11px 10px;
        font-size: 10px;
        line-height: 1.35;
    }

        .sales-exception-table td strong {
            font-size: 10px;
            line-height: 1.3;
        }

        .sales-exception-table td small {
            margin-top: 3px;
            font-size: 8.5px;
            line-height: 1.3;
        }

        .sales-exception-table td.invoice-no {
            font-size: 10.5px;
        }

    .sales-exception-table .detail-action-column,
    .sales-exception-table .detail-action-cell {
        width: 52px;
        min-width: 52px;
        max-width: 52px;
        padding-left: 9px;
        padding-right: 9px;
    }

.row-detail-button {
    width: 34px;
    height: 34px;
    border-radius: 9px;
}

    .row-detail-button svg {
        width: 17px;
        height: 17px;
    }

/* Sayfalama */
.sales-exception-pagination {
    padding: 12px 14px;
}

    .sales-exception-pagination strong {
        font-size: 10px;
    }

    .sales-exception-pagination span {
        font-size: 9px;
    }

    .sales-exception-pagination button {
        min-height: 34px;
        padding: 0 11px;
        font-size: 9px;
    }

/* Sağ detay paneli */
.invoice-detail-drawer {
    width: min(640px, 96vw);
}

.invoice-detail-drawer-header {
    padding: 22px 24px 19px;
}

.invoice-detail-eyebrow {
    padding: 5px 8px;
    font-size: 9px;
}

.invoice-detail-drawer-header h2 {
    margin-top: 10px;
    font-size: 24px;
    line-height: 1.15;
}

.invoice-detail-drawer-header p {
    margin-top: 5px;
    font-size: 10px;
}

.invoice-detail-close {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
    font-size: 25px;
}

.invoice-detail-drawer-body {
    padding: 18px;
}

.invoice-detail-section {
    margin-bottom: 14px;
    padding: 17px;
}

.invoice-detail-section-title {
    gap: 11px;
    margin-bottom: 14px;
    padding-bottom: 12px;
}

    .invoice-detail-section-title > span {
        width: 32px;
        height: 32px;
        font-size: 9px;
    }

    .invoice-detail-section-title strong {
        font-size: 11.5px;
    }

    .invoice-detail-section-title small {
        margin-top: 2px;
        font-size: 8.5px;
    }

.invoice-detail-grid {
    gap: 10px;
}

    .invoice-detail-grid > div {
        min-height: 68px;
        padding: 12px 13px;
        border-radius: 10px;
    }

    .invoice-detail-grid span,
    .invoice-financial-summary span {
        font-size: 8.5px;
        line-height: 1.25;
    }

    .invoice-detail-grid strong {
        margin-top: 6px;
        font-size: 10.5px;
        line-height: 1.35;
    }

    .invoice-detail-grid small {
        margin-top: 4px;
        font-size: 8.5px;
        line-height: 1.35;
    }

.invoice-financial-summary {
    gap: 10px;
}

    .invoice-financial-summary > div {
        min-height: 84px;
        padding: 14px;
    }

    .invoice-financial-summary strong {
        margin-top: 9px;
        font-size: 15px;
    }

/* Orta boy ekranda okunabilirliği koru */
@media (max-width: 1450px) {
    .sales-exception-table th {
        font-size: 8.5px;
    }

    .sales-exception-table td,
    .sales-exception-table td strong {
        font-size: 9.5px;
    }

        .sales-exception-table td small {
            font-size: 8px;
        }

    .invoice-detail-drawer {
        width: min(600px, 96vw);
    }
}

@media (max-width: 900px) {
    .sales-exception-page {
        padding: 18px 14px 28px;
    }

    .sales-exception-filter {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .invoice-detail-drawer {
        width: min(560px, 100vw);
    }
}

@media (max-width: 700px) {
    .sales-exception-filter {
        grid-template-columns: 1fr;
    }

    .invoice-detail-drawer {
        width: 100vw;
    }
}


/* ============================================================
   REISAI V6.4.7
   SIDEBAR SCROLL FIX
   ============================================================ */

/*
   Fixed sidebar is a flex column.
   Header and footer stay fixed; only the menu area scrolls.
*/
.sidebar {
    overflow: hidden;
}

.brand {
    flex: 0 0 88px;
}

.menu {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-bottom: 18px;
    scrollbar-width: thin;
    scrollbar-color: rgba(148, 163, 184, .42) transparent;
}

    .menu::-webkit-scrollbar {
        width: 7px;
    }

    .menu::-webkit-scrollbar-track {
        background: transparent;
    }

    .menu::-webkit-scrollbar-thumb {
        background: rgba(148, 163, 184, .35);
        border-radius: 999px;
    }

        .menu::-webkit-scrollbar-thumb:hover {
            background: rgba(148, 163, 184, .58);
        }

.sidebar-footer {
    flex: 0 0 60px;
    margin-top: 0;
    background: #111827;
}

/* Keep last menu item from sitting under the footer. */
.menu > :last-child {
    margin-bottom: 14px;
}

/* Collapsed sidebar keeps the same scroll behavior. */
@media (max-width: 900px) {
    .brand {
        flex-basis: 88px;
    }

    .menu {
        overflow-y: auto;
        overflow-x: hidden;
        padding-bottom: 16px;
    }

    .sidebar-footer {
        flex-basis: 60px;
    }
}


/* ============================================================
   REISAI V6.5 - STOCK COMPARISON INTELLIGENCE
   Append to wwwroot/app.css
   ============================================================ */

.stock-compare-page {
    padding: 22px 26px 34px;
    color: #0f172a;
}

.stock-compare-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px;
}

.stock-compare-badge {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 0 9px;
    border-radius: 7px;
    background: #e7f0ff;
    color: #155eef;
    font-size: 10px;
    font-weight: 850;
}

.stock-compare-header h1 {
    margin: 8px 0 0;
    font-size: 27px;
    font-weight: 900;
    letter-spacing: -.025em;
}

.stock-compare-header p {
    margin: 5px 0 0;
    color: #64748b;
    font-size: 12px;
}

.stock-compare-actions {
    display: flex;
    gap: 8px;
    align-items: center;
}

.stock-compare-btn {
    min-height: 42px;
    padding: 0 14px;
    border: 1px solid #d8e2ee;
    border-radius: 10px;
    background: #fff;
    color: #334155;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

    .stock-compare-btn.ai {
        border-color: #2563eb;
        background: #2563eb;
        color: #fff;
    }

    .stock-compare-btn:disabled,
    .stock-upload-button:disabled,
    .stock-filter-button:disabled {
        opacity: .5;
        cursor: not-allowed;
    }

.stock-upload-card {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto auto;
    gap: 12px;
    align-items: center;
    padding: 14px;
    border: 1px solid #dbe5f0;
    border-radius: 14px;
    background: linear-gradient(135deg, #ffffff 0%, #f7faff 100%);
}

.stock-upload-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: #edf4ff;
    color: #2563eb;
    font-size: 24px;
    font-weight: 900;
}

.stock-upload-main span,
.stock-current-file span,
.stock-kpi-card span,
.stock-ai-card-head span {
    display: block;
    color: #8492a6;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .05em;
}

.stock-upload-main strong {
    display: block;
    margin-top: 3px;
    color: #172b49;
    font-size: 14px;
    font-weight: 850;
}

.stock-upload-main small {
    display: block;
    margin-top: 3px;
    color: #8795a8;
    font-size: 10px;
}

.stock-file-button,
.stock-upload-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 13px;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

.stock-file-button {
    border: 1px solid #d7e1ed;
    background: #fff;
    color: #334155;
}

    .stock-file-button input {
        display: none;
    }

.stock-upload-button {
    border: 1px solid #2563eb;
    background: #2563eb;
    color: #fff;
}

.stock-message {
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 650;
}

    .stock-message.success {
        background: #ecfdf5;
        color: #047857;
        border: 1px solid #bbf7d0;
    }

    .stock-message.warning {
        background: #fffbeb;
        color: #b45309;
        border: 1px solid #fde68a;
    }

    .stock-message.danger {
        background: #fff1f2;
        color: #be123c;
        border: 1px solid #fecdd3;
    }

.stock-current-file {
    display: grid;
    grid-template-columns: 1.25fr 1fr 1fr 1fr;
    gap: 1px;
    margin-top: 12px;
    overflow: hidden;
    border: 1px solid #dfe7f1;
    border-radius: 12px;
    background: #dfe7f1;
}

    .stock-current-file > div {
        padding: 11px 12px;
        background: #fff;
    }

    .stock-current-file strong {
        display: block;
        margin-top: 4px;
        color: #1e3350;
        font-size: 11px;
        font-weight: 850;
    }

.stock-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.stock-kpi-card {
    min-width: 0;
    min-height: 104px;
    padding: 12px;
    border: 1px solid #dfe7f1;
    border-radius: 12px;
    background: #fff;
    text-align: left;
    cursor: pointer;
}

    .stock-kpi-card:hover {
        border-color: #b9d0f5;
        box-shadow: 0 5px 18px rgba(15, 23, 42, .06);
    }

    .stock-kpi-card strong {
        display: block;
        margin-top: 8px;
        color: #102441;
        font-size: 24px;
        font-weight: 900;
    }

    .stock-kpi-card small {
        display: block;
        margin-top: 4px;
        color: #8997aa;
        font-size: 9px;
    }

    .stock-kpi-card.red {
        border-color: #fecaca;
        background: #fffafa;
    }

        .stock-kpi-card.red strong {
            color: #dc2626;
        }

    .stock-kpi-card.amber {
        border-color: #fde68a;
        background: #fffdf7;
    }

        .stock-kpi-card.amber strong {
            color: #b45309;
        }

    .stock-kpi-card.violet {
        border-color: #ddd6fe;
        background: #fbfaff;
    }

        .stock-kpi-card.violet strong {
            color: #7c3aed;
        }

.stock-ai-card {
    margin-top: 12px;
    padding: 14px;
    border: 1px solid #cbdcff;
    border-radius: 13px;
    background: linear-gradient(135deg, #f7faff 0%, #ffffff 70%);
}

.stock-ai-card-head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.stock-ai-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 37px;
    height: 37px;
    border-radius: 10px;
    background: #2563eb;
    color: #fff;
    font-size: 11px;
    font-weight: 900;
}

.stock-ai-card-head strong {
    display: block;
    margin-top: 2px;
    font-size: 13px;
}

.stock-ai-text {
    margin-top: 11px;
    color: #334155;
    font-size: 12px;
    line-height: 1.65;
    white-space: pre-wrap;
}

.stock-filter-card {
    display: grid;
    grid-template-columns: 230px minmax(300px, 1fr) auto;
    gap: 10px;
    align-items: end;
    margin-top: 12px;
    padding: 12px;
    border: 1px solid #dfe7f1;
    border-radius: 12px;
    background: #fff;
}

    .stock-filter-card label {
        display: block;
        margin-bottom: 5px;
        color: #74849a;
        font-size: 9px;
        font-weight: 800;
    }

    .stock-filter-card select,
    .stock-filter-card input {
        width: 100%;
        min-height: 39px;
        padding: 0 10px;
        border: 1px solid #d7e1ed;
        border-radius: 9px;
        background: #fff;
        color: #334155;
        font-size: 11px;
        outline: none;
    }

.stock-filter-button {
    min-height: 39px;
    padding: 0 14px;
    border: 0;
    border-radius: 9px;
    background: #2563eb;
    color: #fff;
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
}

.stock-loading,
.stock-empty-state {
    margin-top: 12px;
    padding: 48px 20px;
    border: 1px solid #e0e7ef;
    border-radius: 14px;
    background: #fff;
    color: #64748b;
    text-align: center;
    font-size: 12px;
}

.stock-empty-icon {
    margin: 0 auto 10px;
    color: #2563eb;
    font-size: 30px;
    font-weight: 900;
}

.stock-empty-state h2 {
    margin: 0;
    color: #19304f;
    font-size: 17px;
}

.stock-empty-state p {
    margin: 6px 0 0;
}

.stock-result-card {
    margin-top: 12px;
    overflow: hidden;
    border: 1px solid #dfe7f1;
    border-radius: 13px;
    background: #fff;
}

.stock-result-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 14px;
    border-bottom: 1px solid #e7edf4;
}

    .stock-result-head h2 {
        margin: 0;
        font-size: 15px;
    }

    .stock-result-head p {
        margin: 3px 0 0;
        color: #8492a6;
        font-size: 10px;
    }

.stock-table-wrap {
    overflow: auto;
    max-height: 62vh;
}

.stock-compare-table {
    width: 100%;
    min-width: 1280px;
    border-collapse: collapse;
}

    .stock-compare-table th {
        position: sticky;
        z-index: 2;
        top: 0;
        padding: 10px 9px;
        border-bottom: 1px solid #dce5ef;
        background: #f8fafc;
        color: #65768e;
        font-size: 9px;
        font-weight: 850;
        text-align: left;
        white-space: nowrap;
    }

    .stock-compare-table td {
        padding: 9px;
        border-bottom: 1px solid #edf2f7;
        color: #334155;
        font-size: 10px;
        vertical-align: middle;
    }

        .stock-compare-table td strong {
            color: #172b48;
            font-size: 10px;
        }

        .stock-compare-table td.description {
            min-width: 310px;
        }

        .stock-compare-table td.numeric {
            text-align: right;
            font-variant-numeric: tabular-nums;
            white-space: nowrap;
        }

        .stock-compare-table td.negative {
            color: #dc2626;
            font-weight: 850;
        }

.stock-eye-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    border: 1px solid #d7e2ef;
    border-radius: 8px;
    background: #fff;
    color: #2563eb;
    cursor: pointer;
}

.stock-status {
    display: inline-flex;
    align-items: center;
    min-height: 23px;
    padding: 0 7px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #475569;
    font-size: 8.5px;
    font-weight: 850;
    white-space: nowrap;
}

    .stock-status.red {
        background: #fff1f2;
        color: #dc2626;
    }

    .stock-status.amber {
        background: #fffbeb;
        color: #b45309;
    }

    .stock-status.blue {
        background: #eff6ff;
        color: #2563eb;
    }

    .stock-status.violet {
        background: #f5f3ff;
        color: #7c3aed;
    }

.stock-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 13px;
    color: #64748b;
    font-size: 10px;
}

    .stock-pagination > div {
        display: flex;
        gap: 6px;
    }

    .stock-pagination button {
        min-height: 31px;
        padding: 0 10px;
        border: 1px solid #d8e2ed;
        border-radius: 8px;
        background: #fff;
        color: #40546f;
        font-size: 9px;
        font-weight: 800;
        cursor: pointer;
    }

.stock-drawer-backdrop {
    position: fixed;
    z-index: 5000;
    inset: 0;
    background: rgba(15, 23, 42, .38);
    backdrop-filter: blur(2px);
}

.stock-detail-drawer {
    position: fixed;
    z-index: 5001;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(610px, 92vw);
    overflow: auto;
    border-left: 1px solid #dce5ef;
    background: #f8fafc;
    box-shadow: -18px 0 45px rgba(15, 23, 42, .16);
}

.stock-drawer-head {
    position: sticky;
    z-index: 3;
    top: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 22px;
    border-bottom: 1px solid #dfe7f0;
    background: #fff;
}

    .stock-drawer-head span {
        color: #2563eb;
        font-size: 9px;
        font-weight: 900;
        letter-spacing: .07em;
    }

    .stock-drawer-head h2 {
        margin: 5px 0 0;
        font-size: 22px;
    }

    .stock-drawer-head p {
        margin: 4px 0 0;
        color: #728198;
        font-size: 11px;
    }

    .stock-drawer-head button {
        width: 36px;
        height: 36px;
        border: 1px solid #d9e3ee;
        border-radius: 9px;
        background: #fff;
        color: #64748b;
        font-size: 22px;
        cursor: pointer;
    }

.stock-drawer-body {
    padding: 16px;
}

.stock-detail-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}

    .stock-detail-summary-grid > div {
        min-height: 76px;
        padding: 11px;
        border: 1px solid #e0e7ef;
        border-radius: 10px;
        background: #fff;
    }

    .stock-detail-summary-grid span {
        display: block;
        color: #8a98ab;
        font-size: 9px;
        font-weight: 800;
    }

    .stock-detail-summary-grid strong {
        display: block;
        margin-top: 5px;
        color: #1f3655;
        font-size: 12px;
        overflow-wrap: anywhere;
    }

.stock-source-section {
    margin-top: 12px;
    padding: 12px;
    border: 1px solid #dfe7f0;
    border-radius: 11px;
    background: #fff;
}

.stock-source-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 8px;
    border-bottom: 1px solid #edf2f7;
}

    .stock-source-title strong {
        font-size: 12px;
    }

    .stock-source-title span {
        color: #2563eb;
        font-size: 10px;
        font-weight: 850;
    }

.stock-source-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 2px;
    border-bottom: 1px solid #f0f3f7;
    font-size: 10px;
}

    .stock-source-row:last-child {
        border-bottom: 0;
    }

    .stock-source-row span {
        color: #8795a8;
    }

    .stock-source-row strong {
        color: #243a58;
        font-size: 11px;
    }

.stock-source-empty {
    padding: 12px 0 2px;
    color: #94a3b8;
    font-size: 10px;
}

@media(max-width: 1250px) {
    .stock-kpi-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .stock-current-file {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media(max-width: 850px) {
    .stock-compare-header {
        flex-direction: column;
    }

    .stock-compare-actions {
        width: 100%;
        flex-wrap: wrap;
    }

    .stock-upload-card {
        grid-template-columns: 48px 1fr;
    }

    .stock-file-button, .stock-upload-button {
        width: 100%;
    }

    .stock-filter-card {
        grid-template-columns: 1fr;
    }

    .stock-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media(max-width: 560px) {
    .stock-compare-page {
        padding: 16px 12px 26px;
    }

    .stock-kpi-grid, .stock-current-file, .stock-detail-summary-grid {
        grid-template-columns: 1fr;
    }
}



/* ============================================================
   REISAI V6.6 - MALİYET UYUMLULUK ANALİZİ
   ============================================================ */

.cost-compat-page {
    width: 100%;
}

.cost-compat-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

    .cost-compat-header h1 {
        margin: 8px 0 5px;
        color: #0f172a;
        font-size: 28px;
        line-height: 1.15;
    }

    .cost-compat-header p {
        max-width: 900px;
        margin: 0;
        color: #64748b;
        font-size: 13px;
        line-height: 1.6;
    }

.cost-compat-badge {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 7px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
}

.cost-compat-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cost-compat-export {
    min-width: 132px;
    min-height: 44px;
    border: 1px solid #86efac;
    border-radius: 10px;
    background: #f0fdf4;
    color: #15803d;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

    .cost-compat-export:disabled {
        opacity: .45;
        cursor: default;
    }

.cost-compat-filter-card {
    display: grid;
    grid-template-columns: 105px 100px 120px 145px 155px 175px minmax(260px,1fr) 145px;
    gap: 11px;
    align-items: end;
    margin-bottom: 14px;
    padding: 16px;
    border: 1px solid #dbe4ef;
    border-radius: 14px;
    background: #fff;
}

    .cost-compat-filter-card > div {
        min-width: 0;
    }

    .cost-compat-filter-card label {
        display: block;
        margin-bottom: 6px;
        color: #64748b;
        font-size: 10px;
        font-weight: 800;
    }

    .cost-compat-filter-card select,
    .cost-compat-filter-card input {
        width: 100%;
        height: 43px;
        border: 1px solid #cbd5e1;
        border-radius: 9px;
        background: #fff;
        padding: 0 11px;
        color: #0f172a;
        font-family: inherit;
        font-size: 11px;
        outline: none;
    }

        .cost-compat-filter-card select:focus,
        .cost-compat-filter-card input:focus {
            border-color: #2563eb;
            box-shadow: 0 0 0 3px rgba(37,99,235,.08);
        }

.cost-compat-apply {
    height: 43px;
    border: 0;
    border-radius: 9px;
    background: #2563eb;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

    .cost-compat-apply:disabled {
        opacity: .55;
        cursor: default;
    }

.cost-compat-dirty {
    margin-bottom: 13px;
    padding: 9px 12px;
    border: 1px solid #fde68a;
    border-radius: 9px;
    background: #fffbeb;
    color: #92400e;
    font-size: 11px;
}

.cost-compat-empty,
.cost-compat-loading,
.cost-compat-message {
    padding: 30px;
    border: 1px solid #dbe4ef;
    border-radius: 14px;
    background: #fff;
    color: #475569;
}

.cost-compat-empty {
    display: flex;
    min-height: 170px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

    .cost-compat-empty strong {
        color: #0f172a;
        font-size: 17px;
    }

    .cost-compat-empty span {
        margin-top: 7px;
        color: #64748b;
        font-size: 12px;
    }

.cost-compat-message.danger {
    border-color: #fecaca;
    background: #fff7f7;
    color: #b91c1c;
}

.cost-compat-kpis {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 12px;
    margin-bottom: 14px;
}

.cost-compat-kpi {
    min-width: 0;
    min-height: 105px;
    padding: 15px;
    border: 1px solid #dbe4ef;
    border-radius: 13px;
    background: #fff;
    text-align: left;
    cursor: pointer;
}

    .cost-compat-kpi:hover {
        border-color: #93c5fd;
        box-shadow: 0 3px 12px rgba(15,23,42,.05);
    }

    .cost-compat-kpi span {
        display: block;
        color: #64748b;
        font-size: 9px;
        font-weight: 850;
        letter-spacing: .04em;
    }

    .cost-compat-kpi strong {
        display: block;
        margin-top: 9px;
        color: #0f172a;
        font-size: 23px;
        line-height: 1;
    }

    .cost-compat-kpi small {
        display: block;
        margin-top: 8px;
        color: #94a3b8;
        font-size: 9px;
        line-height: 1.35;
    }

    .cost-compat-kpi.good {
        border-color: #bbf7d0;
        background: #f0fdf4;
    }

    .cost-compat-kpi.warning {
        border-color: #fde68a;
        background: #fffbeb;
    }

    .cost-compat-kpi.bad {
        border-color: #fecaca;
        background: #fff1f2;
    }

    .cost-compat-kpi.neutral {
        background: #f8fafc;
    }

.cost-compat-info-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    margin-bottom: 14px;
    padding: 11px 14px;
    border: 1px solid #dbeafe;
    border-radius: 10px;
    background: #f8fbff;
    color: #475569;
    font-size: 10px;
}

    .cost-compat-info-strip b {
        color: #1e3a5f;
    }

.cost-compat-result-card {
    overflow: hidden;
    border: 1px solid #dbe4ef;
    border-radius: 14px;
    background: #fff;
}

.cost-compat-result-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid #edf2f7;
}

    .cost-compat-result-head h2 {
        margin: 0;
        color: #0f172a;
        font-size: 14px;
    }

    .cost-compat-result-head p {
        margin: 4px 0 0;
        color: #94a3b8;
        font-size: 10px;
    }

.cost-compat-table-wrap {
    width: 100%;
    max-height: 590px;
    overflow: auto;
}

.cost-compat-table {
    width: 100%;
    min-width: 1850px;
    border-collapse: collapse;
}

    .cost-compat-table th {
        position: sticky;
        z-index: 2;
        top: 0;
        padding: 10px 9px;
        border-bottom: 1px solid #dbe4ef;
        background: #f8fafc;
        color: #64748b;
        font-size: 9px;
        font-weight: 850;
        text-align: left;
        white-space: nowrap;
    }

    .cost-compat-table td {
        padding: 10px 9px;
        border-bottom: 1px solid #edf2f7;
        color: #334155;
        font-size: 10px;
        vertical-align: middle;
    }

    .cost-compat-table tbody tr:hover {
        background: #f8fbff;
    }

    .cost-compat-table td.material {
        min-width: 125px;
    }

        .cost-compat-table td.material strong {
            display: block;
            color: #102a4c;
            font-size: 10px;
        }

        .cost-compat-table td.material small {
            display: block;
            margin-top: 2px;
            color: #94a3b8;
            font-size: 8px;
        }

    .cost-compat-table td.description {
        min-width: 260px;
        max-width: 370px;
        white-space: normal;
        line-height: 1.35;
    }

    .cost-compat-table td.number {
        text-align: right;
        white-space: nowrap;
        font-variant-numeric: tabular-nums;
    }

        .cost-compat-table td.number.strong {
            color: #102a4c;
            font-weight: 800;
        }

.positive-difference {
    color: #dc2626 !important;
    font-weight: 800;
}

.negative-difference {
    color: #7c3aed !important;
    font-weight: 800;
}

.cost-compat-eye {
    width: 32px;
    height: 32px;
    border: 1px solid #dbe4ef;
    border-radius: 9px;
    background: #fff;
    color: #2563eb;
    font-size: 14px;
    cursor: pointer;
}

    .cost-compat-eye:hover {
        border-color: #93c5fd;
        background: #eff6ff;
    }

.cost-status {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 8px;
    font-weight: 850;
    white-space: nowrap;
}

    .cost-status.good {
        background: #dcfce7;
        color: #15803d;
    }

    .cost-status.warning {
        background: #fef3c7;
        color: #b45309;
    }

    .cost-status.bad {
        background: #fee2e2;
        color: #b91c1c;
    }

    .cost-status.violet {
        background: #f3e8ff;
        color: #7e22ce;
    }

    .cost-status.neutral {
        background: #e2e8f0;
        color: #475569;
    }

.cost-compat-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 11px;
    padding: 11px 13px;
    border: 1px solid #dbe4ef;
    border-radius: 11px;
    background: #fff;
}

    .cost-compat-pagination > div {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .cost-compat-pagination strong {
        color: #1e293b;
        font-size: 11px;
    }

    .cost-compat-pagination span {
        color: #94a3b8;
        font-size: 10px;
    }

    .cost-compat-pagination button {
        min-height: 34px;
        padding: 0 12px;
        border: 1px solid #cbd5e1;
        border-radius: 8px;
        background: #fff;
        color: #334155;
        font-size: 10px;
        font-weight: 700;
        cursor: pointer;
    }

        .cost-compat-pagination button:disabled {
            opacity: .45;
            cursor: default;
        }

/* DETAIL DRAWER */
.cost-detail-overlay {
    position: fixed;
    z-index: 900;
    inset: 0;
    background: rgba(15,23,42,.38);
    backdrop-filter: blur(2px);
}

.cost-detail-drawer {
    position: fixed;
    z-index: 910;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(660px, 92vw);
    display: flex;
    flex-direction: column;
    border-left: 1px solid #dbe4ef;
    background: #f8fafc;
    box-shadow: -18px 0 45px rgba(15,23,42,.15);
}

.cost-detail-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 22px 24px;
    border-bottom: 1px solid #dbe4ef;
    background: #fff;
}

    .cost-detail-header span {
        display: inline-flex;
        padding: 5px 8px;
        border-radius: 6px;
        background: #dbeafe;
        color: #1d4ed8;
        font-size: 9px;
        font-weight: 850;
    }

    .cost-detail-header h2 {
        margin: 9px 0 3px;
        color: #0f172a;
        font-size: 24px;
    }

    .cost-detail-header p {
        margin: 0;
        color: #94a3b8;
        font-size: 10px;
    }

    .cost-detail-header > button {
        width: 38px;
        height: 38px;
        border: 1px solid #dbe4ef;
        border-radius: 10px;
        background: #fff;
        color: #64748b;
        font-size: 24px;
        line-height: 1;
        cursor: pointer;
    }

.cost-detail-scroll {
    flex: 1;
    overflow-y: auto;
    padding: 18px;
}

.cost-detail-section {
    margin-bottom: 14px;
    padding: 16px;
    border: 1px solid #dbe4ef;
    border-radius: 14px;
    background: #fff;
}

.cost-detail-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 13px;
    padding-bottom: 11px;
    border-bottom: 1px solid #edf2f7;
}

    .cost-detail-title > b {
        display: inline-flex;
        width: 30px;
        height: 30px;
        align-items: center;
        justify-content: center;
        border-radius: 9px;
        background: #edf4ff;
        color: #2563eb;
        font-size: 9px;
    }

    .cost-detail-title strong {
        display: block;
        color: #243a58;
        font-size: 11px;
    }

    .cost-detail-title small {
        display: block;
        margin-top: 2px;
        color: #94a3b8;
        font-size: 8px;
    }

.cost-detail-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
}

    .cost-detail-grid > div {
        min-width: 0;
        min-height: 65px;
        padding: 10px 11px;
        border: 1px solid #edf2f7;
        border-radius: 10px;
        background: #fbfcfe;
    }

        .cost-detail-grid > div.wide {
            grid-column: 1 / -1;
        }

    .cost-detail-grid span {
        display: block;
        color: #8a98ab;
        font-size: 8.5px;
        font-weight: 800;
    }

    .cost-detail-grid strong {
        display: block;
        margin-top: 5px;
        overflow-wrap: anywhere;
        color: #1f3655;
        font-size: 10.5px;
        font-weight: 800;
    }

    .cost-detail-grid small {
        display: block;
        margin-top: 3px;
        color: #94a3b8;
        font-size: 8px;
    }

    .cost-detail-grid strong.success {
        color: #15803d;
    }

    .cost-detail-grid strong.warning-text {
        color: #b45309;
    }

    .cost-detail-grid strong.danger-text {
        color: #dc2626;
    }

@media (max-width: 1500px) {
    .cost-compat-filter-card {
        grid-template-columns: repeat(4,minmax(0,1fr));
    }

        .cost-compat-filter-card .search {
            grid-column: span 3;
        }

    .cost-compat-kpis {
        grid-template-columns: repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .cost-compat-header {
        flex-direction: column;
    }

    .cost-compat-filter-card {
        grid-template-columns: 1fr 1fr;
    }

        .cost-compat-filter-card .search {
            grid-column: 1 / -1;
        }

    .cost-compat-kpis {
        grid-template-columns: 1fr 1fr;
    }

    .cost-detail-grid {
        grid-template-columns: 1fr;
    }

        .cost-detail-grid > div.wide {
            grid-column: auto;
        }
}


/* ============================================================
   REISAI V6.6 - MALİYET UYUMLULUK ANALİZİ
   ============================================================ */

.cost-compat-page {
    width: 100%;
}

.cost-compat-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

    .cost-compat-header h1 {
        margin: 8px 0 5px;
        color: #0f172a;
        font-size: 28px;
        line-height: 1.15;
    }

    .cost-compat-header p {
        max-width: 900px;
        margin: 0;
        color: #64748b;
        font-size: 13px;
        line-height: 1.6;
    }

.cost-compat-badge {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 7px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
}

.cost-compat-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cost-compat-export {
    min-width: 132px;
    min-height: 44px;
    border: 1px solid #86efac;
    border-radius: 10px;
    background: #f0fdf4;
    color: #15803d;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

    .cost-compat-export:disabled {
        opacity: .45;
        cursor: default;
    }

.cost-compat-filter-card {
    display: grid;
    grid-template-columns: 105px 100px 120px 145px 155px 175px minmax(260px,1fr) 145px;
    gap: 11px;
    align-items: end;
    margin-bottom: 14px;
    padding: 16px;
    border: 1px solid #dbe4ef;
    border-radius: 14px;
    background: #fff;
}

    .cost-compat-filter-card > div {
        min-width: 0;
    }

    .cost-compat-filter-card label {
        display: block;
        margin-bottom: 6px;
        color: #64748b;
        font-size: 10px;
        font-weight: 800;
    }

    .cost-compat-filter-card select,
    .cost-compat-filter-card input {
        width: 100%;
        height: 43px;
        border: 1px solid #cbd5e1;
        border-radius: 9px;
        background: #fff;
        padding: 0 11px;
        color: #0f172a;
        font-family: inherit;
        font-size: 11px;
        outline: none;
    }

        .cost-compat-filter-card select:focus,
        .cost-compat-filter-card input:focus {
            border-color: #2563eb;
            box-shadow: 0 0 0 3px rgba(37,99,235,.08);
        }

.cost-compat-apply {
    height: 43px;
    border: 0;
    border-radius: 9px;
    background: #2563eb;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

    .cost-compat-apply:disabled {
        opacity: .55;
        cursor: default;
    }

.cost-compat-dirty {
    margin-bottom: 13px;
    padding: 9px 12px;
    border: 1px solid #fde68a;
    border-radius: 9px;
    background: #fffbeb;
    color: #92400e;
    font-size: 11px;
}

.cost-compat-empty,
.cost-compat-loading,
.cost-compat-message {
    padding: 30px;
    border: 1px solid #dbe4ef;
    border-radius: 14px;
    background: #fff;
    color: #475569;
}

.cost-compat-empty {
    display: flex;
    min-height: 170px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

    .cost-compat-empty strong {
        color: #0f172a;
        font-size: 17px;
    }

    .cost-compat-empty span {
        margin-top: 7px;
        color: #64748b;
        font-size: 12px;
    }

.cost-compat-message.danger {
    border-color: #fecaca;
    background: #fff7f7;
    color: #b91c1c;
}

.cost-compat-kpis {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 12px;
    margin-bottom: 14px;
}

.cost-compat-kpi {
    min-width: 0;
    min-height: 105px;
    padding: 15px;
    border: 1px solid #dbe4ef;
    border-radius: 13px;
    background: #fff;
    text-align: left;
    cursor: pointer;
}

    .cost-compat-kpi:hover {
        border-color: #93c5fd;
        box-shadow: 0 3px 12px rgba(15,23,42,.05);
    }

    .cost-compat-kpi span {
        display: block;
        color: #64748b;
        font-size: 9px;
        font-weight: 850;
        letter-spacing: .04em;
    }

    .cost-compat-kpi strong {
        display: block;
        margin-top: 9px;
        color: #0f172a;
        font-size: 23px;
        line-height: 1;
    }

    .cost-compat-kpi small {
        display: block;
        margin-top: 8px;
        color: #94a3b8;
        font-size: 9px;
        line-height: 1.35;
    }

    .cost-compat-kpi.good {
        border-color: #bbf7d0;
        background: #f0fdf4;
    }

    .cost-compat-kpi.warning {
        border-color: #fde68a;
        background: #fffbeb;
    }

    .cost-compat-kpi.bad {
        border-color: #fecaca;
        background: #fff1f2;
    }

    .cost-compat-kpi.neutral {
        background: #f8fafc;
    }

.cost-compat-info-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    margin-bottom: 14px;
    padding: 11px 14px;
    border: 1px solid #dbeafe;
    border-radius: 10px;
    background: #f8fbff;
    color: #475569;
    font-size: 10px;
}

    .cost-compat-info-strip b {
        color: #1e3a5f;
    }

.cost-compat-result-card {
    overflow: hidden;
    border: 1px solid #dbe4ef;
    border-radius: 14px;
    background: #fff;
}

.cost-compat-result-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid #edf2f7;
}

    .cost-compat-result-head h2 {
        margin: 0;
        color: #0f172a;
        font-size: 14px;
    }

    .cost-compat-result-head p {
        margin: 4px 0 0;
        color: #94a3b8;
        font-size: 10px;
    }

.cost-compat-table-wrap {
    width: 100%;
    max-height: 590px;
    overflow: auto;
}

.cost-compat-table {
    width: 100%;
    min-width: 1850px;
    border-collapse: collapse;
}

    .cost-compat-table th {
        position: sticky;
        z-index: 2;
        top: 0;
        padding: 10px 9px;
        border-bottom: 1px solid #dbe4ef;
        background: #f8fafc;
        color: #64748b;
        font-size: 9px;
        font-weight: 850;
        text-align: left;
        white-space: nowrap;
    }

    .cost-compat-table td {
        padding: 10px 9px;
        border-bottom: 1px solid #edf2f7;
        color: #334155;
        font-size: 10px;
        vertical-align: middle;
    }

    .cost-compat-table tbody tr:hover {
        background: #f8fbff;
    }

    .cost-compat-table td.material {
        min-width: 125px;
    }

        .cost-compat-table td.material strong {
            display: block;
            color: #102a4c;
            font-size: 10px;
        }

        .cost-compat-table td.material small {
            display: block;
            margin-top: 2px;
            color: #94a3b8;
            font-size: 8px;
        }

    .cost-compat-table td.description {
        min-width: 260px;
        max-width: 370px;
        white-space: normal;
        line-height: 1.35;
    }

    .cost-compat-table td.number {
        text-align: right;
        white-space: nowrap;
        font-variant-numeric: tabular-nums;
    }

        .cost-compat-table td.number.strong {
            color: #102a4c;
            font-weight: 800;
        }

.positive-difference {
    color: #dc2626 !important;
    font-weight: 800;
}

.negative-difference {
    color: #7c3aed !important;
    font-weight: 800;
}

.cost-compat-eye {
    width: 32px;
    height: 32px;
    border: 1px solid #dbe4ef;
    border-radius: 9px;
    background: #fff;
    color: #2563eb;
    font-size: 14px;
    cursor: pointer;
}

    .cost-compat-eye:hover {
        border-color: #93c5fd;
        background: #eff6ff;
    }

.cost-status {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 8px;
    font-weight: 850;
    white-space: nowrap;
}

    .cost-status.good {
        background: #dcfce7;
        color: #15803d;
    }

    .cost-status.warning {
        background: #fef3c7;
        color: #b45309;
    }

    .cost-status.bad {
        background: #fee2e2;
        color: #b91c1c;
    }

    .cost-status.violet {
        background: #f3e8ff;
        color: #7e22ce;
    }

    .cost-status.neutral {
        background: #e2e8f0;
        color: #475569;
    }

.cost-compat-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 11px;
    padding: 11px 13px;
    border: 1px solid #dbe4ef;
    border-radius: 11px;
    background: #fff;
}

    .cost-compat-pagination > div {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .cost-compat-pagination strong {
        color: #1e293b;
        font-size: 11px;
    }

    .cost-compat-pagination span {
        color: #94a3b8;
        font-size: 10px;
    }

    .cost-compat-pagination button {
        min-height: 34px;
        padding: 0 12px;
        border: 1px solid #cbd5e1;
        border-radius: 8px;
        background: #fff;
        color: #334155;
        font-size: 10px;
        font-weight: 700;
        cursor: pointer;
    }

        .cost-compat-pagination button:disabled {
            opacity: .45;
            cursor: default;
        }

/* DETAIL DRAWER */
.cost-detail-overlay {
    position: fixed;
    z-index: 900;
    inset: 0;
    background: rgba(15,23,42,.38);
    backdrop-filter: blur(2px);
}

.cost-detail-drawer {
    position: fixed;
    z-index: 910;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(660px, 92vw);
    display: flex;
    flex-direction: column;
    border-left: 1px solid #dbe4ef;
    background: #f8fafc;
    box-shadow: -18px 0 45px rgba(15,23,42,.15);
}

.cost-detail-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 22px 24px;
    border-bottom: 1px solid #dbe4ef;
    background: #fff;
}

    .cost-detail-header span {
        display: inline-flex;
        padding: 5px 8px;
        border-radius: 6px;
        background: #dbeafe;
        color: #1d4ed8;
        font-size: 9px;
        font-weight: 850;
    }

    .cost-detail-header h2 {
        margin: 9px 0 3px;
        color: #0f172a;
        font-size: 24px;
    }

    .cost-detail-header p {
        margin: 0;
        color: #94a3b8;
        font-size: 10px;
    }

    .cost-detail-header > button {
        width: 38px;
        height: 38px;
        border: 1px solid #dbe4ef;
        border-radius: 10px;
        background: #fff;
        color: #64748b;
        font-size: 24px;
        line-height: 1;
        cursor: pointer;
    }

.cost-detail-scroll {
    flex: 1;
    overflow-y: auto;
    padding: 18px;
}

.cost-detail-section {
    margin-bottom: 14px;
    padding: 16px;
    border: 1px solid #dbe4ef;
    border-radius: 14px;
    background: #fff;
}

.cost-detail-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 13px;
    padding-bottom: 11px;
    border-bottom: 1px solid #edf2f7;
}

    .cost-detail-title > b {
        display: inline-flex;
        width: 30px;
        height: 30px;
        align-items: center;
        justify-content: center;
        border-radius: 9px;
        background: #edf4ff;
        color: #2563eb;
        font-size: 9px;
    }

    .cost-detail-title strong {
        display: block;
        color: #243a58;
        font-size: 11px;
    }

    .cost-detail-title small {
        display: block;
        margin-top: 2px;
        color: #94a3b8;
        font-size: 8px;
    }

.cost-detail-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
}

    .cost-detail-grid > div {
        min-width: 0;
        min-height: 65px;
        padding: 10px 11px;
        border: 1px solid #edf2f7;
        border-radius: 10px;
        background: #fbfcfe;
    }

        .cost-detail-grid > div.wide {
            grid-column: 1 / -1;
        }

    .cost-detail-grid span {
        display: block;
        color: #8a98ab;
        font-size: 8.5px;
        font-weight: 800;
    }

    .cost-detail-grid strong {
        display: block;
        margin-top: 5px;
        overflow-wrap: anywhere;
        color: #1f3655;
        font-size: 10.5px;
        font-weight: 800;
    }

    .cost-detail-grid small {
        display: block;
        margin-top: 3px;
        color: #94a3b8;
        font-size: 8px;
    }

    .cost-detail-grid strong.success {
        color: #15803d;
    }

    .cost-detail-grid strong.warning-text {
        color: #b45309;
    }

    .cost-detail-grid strong.danger-text {
        color: #dc2626;
    }

@media (max-width: 1500px) {
    .cost-compat-filter-card {
        grid-template-columns: repeat(4,minmax(0,1fr));
    }

        .cost-compat-filter-card .search {
            grid-column: span 3;
        }

    .cost-compat-kpis {
        grid-template-columns: repeat(3,minmax(0,1fr));
    }
}

@media (max-width: 900px) {
    .cost-compat-header {
        flex-direction: column;
    }

    .cost-compat-filter-card {
        grid-template-columns: 1fr 1fr;
    }

        .cost-compat-filter-card .search {
            grid-column: 1 / -1;
        }

    .cost-compat-kpis {
        grid-template-columns: 1fr 1fr;
    }

    .cost-detail-grid {
        grid-template-columns: 1fr;
    }

        .cost-detail-grid > div.wide {
            grid-column: auto;
        }
}

/* ============================================================
   REISAI V6.6.2 - HESAP + FINANSAL ÖZET
   ============================================================ */

.cost-compat-financial-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 14px;
}

    .cost-compat-financial-summary > div {
        min-width: 0;
        padding: 17px 18px;
        border: 1px solid #dfe7f2;
        border-radius: 13px;
        background: #fff;
    }

    .cost-compat-financial-summary span {
        display: block;
        color: #64748b;
        font-size: 9px;
        font-weight: 850;
        letter-spacing: .04em;
    }

    .cost-compat-financial-summary strong {
        display: block;
        margin-top: 7px;
        color: #0f172a;
        font-size: 21px;
        line-height: 1.15;
    }

    .cost-compat-financial-summary small {
        display: block;
        margin-top: 6px;
        color: #94a3b8;
        font-size: 9px;
        line-height: 1.45;
    }

    .cost-compat-financial-summary > div.positive {
        border-color: #bbf7d0;
        background: #f0fdf4;
    }

        .cost-compat-financial-summary > div.positive strong {
            color: #15803d;
        }

    .cost-compat-financial-summary > div.negative {
        border-color: #fecaca;
        background: #fef2f2;
    }

        .cost-compat-financial-summary > div.negative strong {
            color: #dc2626;
        }

@media (max-width: 1250px) {
    .cost-compat-financial-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .cost-compat-financial-summary {
        grid-template-columns: 1fr;
    }
}


/* ============================================================
   REISAI V6.6.2.1 - FILTER GRID FIX
   9 controls: Firma, Yıl, Ay, Hesap, Uyum %, Kontrol %, Durum, Ara, Uygula
   ============================================================ */

@media (min-width: 1501px) {
    .cost-compat-filter-card {
        grid-template-columns: 105px 90px 105px 135px 145px 145px 165px minmax(240px, 1fr) 145px;
    }
}

@media (max-width: 1500px) {
    .cost-compat-filter-card {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

        .cost-compat-filter-card .search {
            grid-column: span 3;
        }
}

@media (max-width: 900px) {
    .cost-compat-filter-card {
        grid-template-columns: 1fr 1fr;
    }

        .cost-compat-filter-card .search {
            grid-column: 1 / -1;
        }
}

@media (min-width: 1501px) {
    .cost-compat-filter-card {
        grid-template-columns: 95px 82px 100px 125px 165px 135px 135px 155px minmax(220px, 1fr) 135px;
    }
}

/* ============================================================
   REISAI V6.7.3 - FLOATING AI ASSISTANT FINAL
   ============================================================ */

.reisai-floating-assistant {
    position: fixed;
    right: 22px;
    bottom: 20px;
    z-index: 1200;
    font-family: inherit;
}

/* ------------------------------------------------------------
   Küçük, yuvarlak launcher
   ------------------------------------------------------------ */

.reisai-floating-launcher {
    position: relative;
    width: 54px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    overflow: hidden;
    isolation: isolate;
    border: 0;
    border-radius: 50%;
    background: #0f2a65;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .24), 0 3px 8px rgba(15, 23, 42, .12);
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
}

    .reisai-floating-launcher:hover {
        transform: translateY(-2px) scale(1.035);
        box-shadow: 0 14px 30px rgba(37, 99, 235, .30), 0 4px 10px rgba(15, 23, 42, .14);
    }

    .reisai-floating-launcher:focus-visible {
        outline: 3px solid rgba(59, 130, 246, .25);
        outline-offset: 3px;
    }



.reisai-floating-launcher::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 3px;
    border-radius: 50%;
    background: #15336f;
}

.reisai-floating-robot-icon {
    position: relative;
    z-index: 2;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
    background: #fff;
}

    .reisai-floating-robot-icon img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        object-position: center;
        border-radius: 50%;
    }

.reisai-floating-status-dot {
    position: absolute;
    z-index: 4;
    right: 3px;
    bottom: 4px;
    width: 10px;
    height: 10px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 0 rgba(34, 197, 94, .45);
    animation: reisai-floating-online-pulse 1.8s ease-out infinite;
}

/* Panel açıkken launcher aynen robot kalır; ikinci kapatma işareti yoktur. */
.reisai-floating-assistant.open .reisai-floating-launcher {
    box-shadow: 0 8px 20px rgba(37, 99, 235, .20), 0 2px 7px rgba(15, 23, 42, .10);
}


/* ------------------------------------------------------------
   Panel
   ------------------------------------------------------------ */

.reisai-floating-panel {
    position: absolute;
    right: 0;
    bottom: 68px;
    width: 400px;
    height: min(560px, calc(100vh - 120px));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #dbe4ef;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 26px 65px rgba(15, 23, 42, .18), 0 8px 22px rgba(15, 23, 42, .08);
    transform-origin: right bottom;
    animation: reisai-floating-panel-open .18s ease-out;
}

@keyframes reisai-floating-panel-open {
    from {
        opacity: 0;
        transform: translateY(10px) scale(.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}


/* ------------------------------------------------------------
   Header
   ------------------------------------------------------------ */

.reisai-floating-header {
    flex: 0 0 auto;
    min-height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 14px;
    border-bottom: 1px solid #e7edf5;
    background: linear-gradient(90deg, #f8fbff 0%, #ffffff 72%);
}

.reisai-floating-header-left {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.reisai-floating-header-robot {
    width: 38px;
    height: 38px;
    min-width: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 2px;
    border-radius: 11px;
    background: linear-gradient(135deg, #22d3ee, #2563eb, #7c3aed);
}

    .reisai-floating-header-robot img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        object-position: center;
        border-radius: 9px;
    }

.reisai-floating-header-copy {
    min-width: 0;
}

    .reisai-floating-header-copy strong {
        display: block;
        overflow: hidden;
        color: #0f172a;
        font-size: 14px;
        font-weight: 800;
        line-height: 1.2;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .reisai-floating-header-copy span {
        display: block;
        margin-top: 3px;
        overflow: hidden;
        color: #94a3b8;
        font-size: 10px;
        line-height: 1.2;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

.reisai-floating-header-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}

.reisai-floating-expand,
.reisai-floating-close {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    border: 1px solid #dbe4ef;
    border-radius: 9px;
    background: #fff;
    color: #64748b;
    text-decoration: none;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}

    .reisai-floating-expand:hover,
    .reisai-floating-close:hover {
        border-color: #93c5fd;
        background: #eff6ff;
        color: #2563eb;
    }

.reisai-floating-close {
    font-size: 21px;
    line-height: 1;
}


/* ------------------------------------------------------------
   Body / Welcome
   ------------------------------------------------------------ */

.reisai-floating-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    background: #f8fafc;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
}

    .reisai-floating-body::-webkit-scrollbar {
        width: 7px;
    }

    .reisai-floating-body::-webkit-scrollbar-track {
        background: transparent;
    }

    .reisai-floating-body::-webkit-scrollbar-thumb {
        border-radius: 999px;
        background: #cbd5e1;
    }

.reisai-floating-welcome {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 28px 24px;
    text-align: center;
}

.reisai-floating-welcome-icon {
    width: 58px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin-bottom: 14px;
    padding: 3px;
    border-radius: 17px;
    background: linear-gradient(135deg, #22d3ee, #2563eb, #7c3aed);
    box-shadow: 0 8px 20px rgba(37, 99, 235, .14);
}

    .reisai-floating-welcome-icon img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        object-position: center;
        border-radius: 14px;
    }

.reisai-floating-welcome > strong {
    color: #0f172a;
    font-size: 16px;
    font-weight: 800;
}

.reisai-floating-welcome > span {
    max-width: 290px;
    margin-top: 7px;
    color: #64748b;
    font-size: 11px;
    line-height: 1.55;
}

.reisai-floating-suggestions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 19px;
}

    .reisai-floating-suggestions button {
        min-height: 40px;
        border: 1px solid #dbe4ef;
        border-radius: 10px;
        background: #fff;
        color: #334155;
        font-size: 10px;
        font-weight: 750;
        cursor: pointer;
    }

        .reisai-floating-suggestions button:hover {
            border-color: #93c5fd;
            background: #eff6ff;
            color: #1d4ed8;
        }


/* ------------------------------------------------------------
   Messages
   ------------------------------------------------------------ */

.reisai-floating-messages {
    padding: 15px 13px 18px;
}

.reisai-floating-message {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    margin-bottom: 10px;
}

    .reisai-floating-message.user {
        justify-content: flex-end;
    }

.reisai-floating-mini-avatar {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin-top: 2px;
    padding: 2px;
    border-radius: 9px;
    background: linear-gradient(135deg, #22d3ee, #2563eb, #7c3aed);
}

    .reisai-floating-mini-avatar img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        object-position: center;
        border-radius: 7px;
    }

.reisai-floating-bubble {
    max-width: 82%;
    padding: 10px 12px;
    border: 1px solid #e2e8f0;
    border-radius: 12px 12px 12px 4px;
    background: #fff;
    color: #334155;
    font-size: 11px;
    line-height: 1.55;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.reisai-floating-message.user .reisai-floating-bubble {
    border-color: #2563eb;
    border-radius: 12px 12px 4px 12px;
    background: #2563eb;
    color: #fff;
}

.reisai-floating-thinking {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 51px;
}

    .reisai-floating-thinking span {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #94a3b8;
        animation: reisai-floating-thinking-dot 1.1s infinite ease-in-out;
    }

        .reisai-floating-thinking span:nth-child(2) {
            animation-delay: .15s;
        }

        .reisai-floating-thinking span:nth-child(3) {
            animation-delay: .30s;
        }

@keyframes reisai-floating-thinking-dot {
    0%, 70%, 100% {
        opacity: .35;
        transform: translateY(0);
    }

    35% {
        opacity: 1;
        transform: translateY(-3px);
    }
}


/* ------------------------------------------------------------
   Composer
   ------------------------------------------------------------ */

.reisai-floating-composer {
    flex: 0 0 auto;
    padding: 10px 11px 9px;
    border-top: 1px solid #e7edf5;
    background: #fff;
}

.reisai-floating-context {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 7px;
    padding: 6px 8px;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    background: #eff6ff;
    color: #64748b;
    font-size: 9px;
}

    .reisai-floating-context strong {
        overflow: hidden;
        color: #1d4ed8;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .reisai-floating-context button {
        margin-left: auto;
        border: 0;
        background: transparent;
        color: #64748b;
        cursor: pointer;
    }

.reisai-floating-input-row {
    display: flex;
    align-items: flex-end;
    gap: 8px;
}

    .reisai-floating-input-row textarea {
        flex: 1;
        min-height: 43px;
        max-height: 95px;
        resize: vertical;
        border: 1px solid #cbd5e1;
        border-radius: 11px;
        padding: 10px 11px;
        color: #0f172a;
        font-family: inherit;
        font-size: 11px;
        line-height: 1.45;
        outline: none;
    }

        .reisai-floating-input-row textarea:focus {
            border-color: #2563eb;
            box-shadow: 0 0 0 3px rgba(37, 99, 235, .08);
        }

.reisai-floating-send {
    width: 43px;
    height: 43px;
    min-width: 43px;
    border: 0;
    border-radius: 11px;
    background: #2563eb;
    color: #fff;
    font-size: 17px;
    cursor: pointer;
}

    .reisai-floating-send:hover {
        background: #1d4ed8;
    }

    .reisai-floating-send:disabled {
        opacity: .45;
        cursor: default;
    }

.reisai-floating-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 7px;
}

    .reisai-floating-footer span {
        color: #94a3b8;
        font-size: 8px;
    }

    .reisai-floating-footer button {
        border: 0;
        background: transparent;
        color: #64748b;
        font-size: 8px;
        font-weight: 700;
        cursor: pointer;
    }

        .reisai-floating-footer button:hover {
            color: #2563eb;
        }


/* ------------------------------------------------------------
   Animations
   ------------------------------------------------------------ */

@keyframes reisai-floating-rgb-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes reisai-floating-online-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(34, 197, 94, .42);
    }

    70% {
        box-shadow: 0 0 0 7px rgba(34, 197, 94, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
    }
}


/* ------------------------------------------------------------
   Responsive
   ------------------------------------------------------------ */

@media (max-width: 700px) {
    .reisai-floating-assistant {
        right: 13px;
        bottom: 13px;
    }

    .reisai-floating-launcher {
        width: 50px;
        height: 50px;
    }

    .reisai-floating-robot-icon {
        width: 40px;
        height: 40px;
    }

    .reisai-floating-panel {
        position: fixed;
        right: 10px;
        bottom: 75px;
        left: 10px;
        width: auto;
        height: min(570px, calc(100vh - 95px));
    }
}

@media (prefers-reduced-motion: reduce) {
    .reisai-floating-rgb-ring,
    .reisai-floating-status-dot,
    .reisai-floating-thinking span {
        animation: none !important;
    }
}

/* ============================================================
   REISAI V6.7.4 - BLUE / WHITE ROBOT RING
   Dış halka sadece mavi -> açık mavi -> beyaz geçiş yapar.
   ============================================================ */

.reisai-floating-rgb-ring {
    position: absolute;
    z-index: 0;
    inset: -35%;
    border-radius: 50%;
    background: conic-gradient( from 0deg, #1d4ed8 0deg, #2563eb 55deg, #60a5fa 110deg, #bfdbfe 155deg, #ffffff 190deg, #dbeafe 225deg, #93c5fd 270deg, #3b82f6 320deg, #1d4ed8 360deg );
    animation: reisai-floating-rgb-spin 6s linear infinite;
}

/* Dış parlama da yalnız mavi tonlarında */
.reisai-floating-launcher {
    box-shadow: 0 10px 24px rgba(37, 99, 235, .24), 0 0 16px rgba(96, 165, 250, .18), 0 3px 8px rgba(15, 23, 42, .10);
}

    .reisai-floating-launcher:hover {
        box-shadow: 0 14px 30px rgba(37, 99, 235, .30), 0 0 22px rgba(147, 197, 253, .24), 0 4px 10px rgba(15, 23, 42, .12);
    }



/* ============================================================
   REISAI V6.8 - AI PROMPT MANAGEMENT
   ============================================================ */

.prompt-admin-page {
    width: 100%;
}

.prompt-admin-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 16px;
}

    .prompt-admin-header h1 {
        margin: 8px 0 5px;
        color: #0f172a;
        font-size: 28px;
    }

    .prompt-admin-header p {
        max-width: 820px;
        margin: 0;
        color: #64748b;
        font-size: 12px;
        line-height: 1.6;
    }

.prompt-admin-header-actions,
.prompt-editor-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.prompt-primary-button,
.prompt-secondary-button,
.prompt-danger-button,
.prompt-test-button {
    min-height: 38px;
    padding: 0 14px;
    border-radius: 9px;
    font-family: inherit;
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
}

.prompt-primary-button,
.prompt-test-button {
    border: 1px solid #2563eb;
    background: #2563eb;
    color: #fff;
}

    .prompt-primary-button:hover,
    .prompt-test-button:hover {
        background: #1d4ed8;
    }

.prompt-secondary-button {
    border: 1px solid #dbe4ef;
    background: #fff;
    color: #475569;
}

.prompt-danger-button {
    border: 1px solid #fecaca;
    background: #fff;
    color: #dc2626;
}

    .prompt-primary-button:disabled,
    .prompt-test-button:disabled,
    .prompt-danger-button:disabled {
        opacity: .55;
        cursor: default;
    }

.prompt-alert {
    margin-bottom: 12px;
    padding: 11px 13px;
    border-radius: 9px;
    font-size: 10px;
    font-weight: 650;
}

    .prompt-alert.error {
        border: 1px solid #fecaca;
        background: #fef2f2;
        color: #b91c1c;
    }

    .prompt-alert.success {
        border: 1px solid #bbf7d0;
        background: #f0fdf4;
        color: #15803d;
    }

.prompt-admin-help {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #bfdbfe;
    border-radius: 12px;
    background: #eff6ff;
}

.prompt-help-number {
    width: 30px;
    height: 30px;
    min-width: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #2563eb;
    color: #fff;
    font-size: 11px;
    font-weight: 900;
}

.prompt-admin-help > div:nth-child(2) {
    flex: 1;
    min-width: 0;
}

.prompt-admin-help strong {
    display: block;
    color: #1e3a5f;
    font-size: 11px;
}

.prompt-admin-help span {
    display: block;
    margin-top: 3px;
    color: #526881;
    font-size: 9px;
    line-height: 1.5;
}

.prompt-admin-help button {
    min-height: 33px;
    padding: 0 11px;
    border: 1px solid #93c5fd;
    border-radius: 8px;
    background: #fff;
    color: #1d4ed8;
    font-size: 9px;
    font-weight: 800;
    cursor: pointer;
}

.prompt-admin-layout {
    display: grid;
    grid-template-columns: 310px minmax(0,1fr);
    gap: 14px;
    align-items: start;
}

.prompt-list-panel,
.prompt-editor-panel {
    border: 1px solid #dfe7f2;
    border-radius: 14px;
    background: #fff;
}

.prompt-list-panel {
    position: sticky;
    top: 102px;
    overflow: hidden;
}

.prompt-list-toolbar {
    display: grid;
    grid-template-columns: 1fr 105px;
    gap: 7px;
    padding: 11px;
    border-bottom: 1px solid #edf2f7;
}

    .prompt-list-toolbar input,
    .prompt-list-toolbar select,
    .prompt-form-grid input,
    .prompt-form-grid textarea,
    .prompt-test-card > textarea {
        width: 100%;
        border: 1px solid #d7e0ec;
        border-radius: 8px;
        background: #fff;
        color: #253a56;
        font-family: inherit;
        outline: none;
    }

    .prompt-list-toolbar input,
    .prompt-list-toolbar select,
    .prompt-form-grid input {
        min-height: 36px;
        padding: 0 9px;
        font-size: 9px;
    }

        .prompt-list-toolbar input:focus,
        .prompt-list-toolbar select:focus,
        .prompt-form-grid input:focus,
        .prompt-form-grid textarea:focus,
        .prompt-test-card > textarea:focus {
            border-color: #7aa7ed;
            box-shadow: 0 0 0 3px rgba(37,99,235,.06);
        }

.prompt-list-summary {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 9px 12px;
    border-bottom: 1px solid #edf2f7;
    background: #f8fafc;
    font-size: 8px;
}

    .prompt-list-summary strong {
        color: #1e3a5f;
    }

    .prompt-list-summary span {
        color: #8492a7;
    }

    .prompt-list-summary i {
        width: 1px;
        height: 12px;
        margin: 0 4px;
        background: #dbe4ef;
    }

.prompt-list {
    max-height: calc(100vh - 260px);
    overflow-y: auto;
    padding: 7px;
}

.prompt-list-empty {
    padding: 24px 12px;
    color: #94a3b8;
    font-size: 9px;
    text-align: center;
}

.prompt-list-item {
    width: 100%;
    margin-bottom: 5px;
    padding: 10px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

    .prompt-list-item:hover {
        background: #f8fafc;
    }

    .prompt-list-item.active {
        border-color: #bfdbfe;
        background: #eff6ff;
    }

.prompt-list-item-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}

.prompt-code {
    overflow: hidden;
    color: #2563eb;
    font-size: 8px;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.prompt-status {
    flex: 0 0 auto;
    padding: 3px 6px;
    border-radius: 999px;
    font-size: 7px;
    font-weight: 800;
}

    .prompt-status.active {
        background: #dcfce7;
        color: #15803d;
    }

    .prompt-status.passive {
        background: #f1f5f9;
        color: #64748b;
    }

.prompt-list-item > strong {
    display: block;
    margin-top: 5px;
    color: #243a58;
    font-size: 10px;
}

.prompt-list-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
    color: #94a3b8;
    font-size: 7.5px;
}

.prompt-editor-panel {
    min-width: 0;
    padding: 15px;
}

.prompt-editor-empty {
    padding: 60px 20px;
    color: #94a3b8;
    font-size: 11px;
    text-align: center;
}

.prompt-editor-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;
    padding-bottom: 13px;
    border-bottom: 1px solid #edf2f7;
}

    .prompt-editor-top > div:first-child > span,
    .prompt-section-title > div > span {
        display: block;
        color: #2563eb;
        font-size: 8px;
        font-weight: 850;
        letter-spacing: .06em;
    }

    .prompt-editor-top h2 {
        margin: 4px 0 0;
        color: #14263f;
        font-size: 18px;
    }

.prompt-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
    padding-top: 14px;
}

    .prompt-form-grid > div {
        min-width: 0;
    }

        .prompt-form-grid > div.wide {
            grid-column: 1 / -1;
        }

    .prompt-form-grid label {
        display: block;
        margin-bottom: 5px;
        color: #64748b;
        font-size: 8px;
        font-weight: 800;
    }

    .prompt-form-grid textarea,
    .prompt-test-card > textarea {
        padding: 9px 10px;
        resize: vertical;
        font-size: 9px;
        line-height: 1.55;
    }

.prompt-main-textarea {
    min-height: 330px;
    font-family: Consolas,"Courier New",monospace !important;
    font-size: 10px !important;
}

.prompt-form-grid small {
    display: block;
    margin-top: 5px;
    color: #94a3b8;
    font-size: 8px;
    line-height: 1.45;
}

.prompt-checkbox-field {
    padding-top: 17px;
}

    .prompt-checkbox-field > label {
        display: flex;
        align-items: center;
        gap: 7px;
        color: #334155;
        font-size: 9px;
    }

    .prompt-checkbox-field input {
        width: 15px;
        height: 15px;
        min-height: 0;
    }

.prompt-test-card,
.prompt-version-card {
    margin-top: 14px;
    padding: 13px;
    border: 1px solid #dfe7f2;
    border-radius: 12px;
    background: #fbfcfe;
}

.prompt-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

    .prompt-section-title strong {
        display: block;
        margin-top: 3px;
        color: #243a58;
        font-size: 11px;
    }

.prompt-match-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 7px;
    margin-top: 10px;
}

.prompt-match-card {
    min-width: 0;
    padding: 9px;
    border: 1px solid #dbeafe;
    border-radius: 9px;
    background: #fff;
}

    .prompt-match-card strong {
        display: block;
        color: #2563eb;
        font-size: 8px;
    }

    .prompt-match-card span {
        display: block;
        margin-top: 3px;
        color: #334155;
        font-size: 8px;
        font-weight: 700;
    }

    .prompt-match-card small {
        display: block;
        margin-top: 4px;
        color: #94a3b8;
        font-size: 7px;
    }

.prompt-compiled-details {
    margin-top: 10px;
    border-top: 1px solid #e5ebf3;
    padding-top: 9px;
}

    .prompt-compiled-details summary {
        color: #475569;
        font-size: 9px;
        font-weight: 750;
        cursor: pointer;
    }

    .prompt-compiled-details pre {
        max-height: 440px;
        overflow: auto;
        padding: 11px;
        border-radius: 9px;
        background: #0f172a;
        color: #dbeafe;
        font-family: Consolas,"Courier New",monospace;
        font-size: 8.5px;
        line-height: 1.55;
        white-space: pre-wrap;
    }

.prompt-version-list {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

    .prompt-version-list > div {
        display: grid;
        grid-template-columns: 55px 140px 1fr;
        gap: 8px;
        align-items: center;
        padding: 7px 8px;
        border-radius: 7px;
        background: #fff;
        font-size: 8px;
    }

    .prompt-version-list strong {
        color: #2563eb;
    }

    .prompt-version-list span {
        color: #475569;
    }

    .prompt-version-list small {
        color: #94a3b8;
    }

@media (max-width:1250px) {
    .prompt-admin-layout {
        grid-template-columns: 270px minmax(0,1fr);
    }

    .prompt-match-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width:900px) {
    .prompt-admin-header {
        flex-direction: column;
    }

    .prompt-admin-layout {
        grid-template-columns: 1fr;
    }

    .prompt-list-panel {
        position: static;
    }

    .prompt-list {
        max-height: 320px;
    }

    .prompt-form-grid {
        grid-template-columns: 1fr;
    }

        .prompt-form-grid > div.wide {
            grid-column: auto;
        }

    .prompt-match-grid {
        grid-template-columns: 1fr;
    }
}

/* V6.8.2 Prompt Execution Hints */
.prompt-execution-card {
    padding: 12px;
    border: 1px solid #dbeafe;
    border-radius: 10px;
    background: #f8fbff
}

.prompt-execution-title {
    margin-bottom: 10px
}

    .prompt-execution-title strong {
        display: block;
        color: #1e3a5f;
        font-size: 10px
    }

    .prompt-execution-title span {
        display: block;
        margin-top: 3px;
        color: #64748b;
        font-size: 8px
    }

.prompt-execution-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 9px
}

    .prompt-execution-grid select {
        width: 100%;
        min-height: 36px;
        padding: 0 9px;
        border: 1px solid #d7e0ec;
        border-radius: 8px;
        background: #fff;
        color: #253a56;
        font-size: 9px
    }

.prompt-execution-checks {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-top: 18px
}

    .prompt-execution-checks label {
        display: flex;
        align-items: center;
        gap: 6px;
        margin: 0
    }

    .prompt-execution-checks input {
        width: 14px;
        height: 14px;
        min-height: 0
    }

@media(max-width:1100px) {
    .prompt-execution-grid {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:700px) {
    .prompt-execution-grid {
        grid-template-columns: 1fr
    }
}

/* ============================================================
   REISAI V6.8.2.1 - COMPANY ALIAS MANAGEMENT
   ============================================================ */
.company-alias-page {
    padding: 4px 0 30px;
}

.company-alias-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

    .company-alias-header h1 {
        margin: 5px 0 4px;
        color: #10243f;
        font-size: 22px;
    }

    .company-alias-header p {
        margin: 0;
        color: #64748b;
        font-size: 10px;
    }

.company-alias-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(300px, .8fr);
    gap: 14px;
}

.company-alias-card {
    padding: 15px;
    border: 1px solid #dbe5f0;
    border-radius: 14px;
    background: #fff;
}

    .company-alias-card h2 {
        margin: 0 0 12px;
        color: #10243f;
        font-size: 13px;
    }

.company-alias-table-wrap {
    overflow: auto;
}

.company-alias-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 9px;
}

    .company-alias-table th,
    .company-alias-table td {
        padding: 9px 8px;
        border-bottom: 1px solid #edf2f7;
        text-align: left;
        white-space: nowrap;
    }

    .company-alias-table th {
        color: #64748b;
        font-size: 8px;
        text-transform: uppercase;
    }

    .company-alias-table td strong,
    .company-alias-table td span {
        display: block;
    }

    .company-alias-table td span {
        margin-top: 2px;
        color: #64748b;
        font-size: 8px;
    }

.company-alias-form {
    display: grid;
    gap: 11px;
}

    .company-alias-form label {
        display: block;
        margin-bottom: 4px;
        color: #52657e;
        font-size: 8px;
        font-weight: 800;
    }

    .company-alias-form input,
    .company-alias-form select {
        width: 100%;
        min-height: 38px;
        padding: 0 10px;
        border: 1px solid #d7e0ec;
        border-radius: 9px;
        background: #fff;
        color: #1f334d;
        font-family: inherit;
        font-size: 9px;
    }

    .company-alias-form small {
        display: block;
        margin-top: 4px;
        color: #94a3b8;
        font-size: 8px;
    }

.company-alias-checkbox {
    display: flex !important;
    align-items: center;
    gap: 7px;
    margin: 0 !important;
}

    .company-alias-checkbox input {
        width: 14px;
        min-height: 14px;
        height: 14px;
    }

.company-alias-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.company-alias-primary,
.company-alias-secondary,
.company-alias-danger,
.company-alias-link {
    min-height: 36px;
    padding: 0 13px;
    border-radius: 9px;
    font-family: inherit;
    font-size: 9px;
    font-weight: 800;
    cursor: pointer;
}

.company-alias-primary {
    border: 0;
    background: #2563eb;
    color: #fff;
}

.company-alias-secondary {
    border: 1px solid #d7e0ec;
    background: #fff;
    color: #334155;
}

.company-alias-danger {
    border: 1px solid #fecaca;
    background: #fff5f5;
    color: #b91c1c;
}

.company-alias-link {
    min-height: 28px;
    border: 0;
    background: #eff6ff;
    color: #2563eb;
}

.company-alias-alert {
    margin-bottom: 12px;
    padding: 10px 12px;
    border-radius: 9px;
    font-size: 9px;
}

    .company-alias-alert.error {
        background: #fef2f2;
        color: #b91c1c;
    }

    .company-alias-alert.success {
        background: #f0fdf4;
        color: #15803d;
    }

.company-alias-empty {
    padding: 18px;
    color: #94a3b8;
    text-align: center;
    font-size: 9px;
}

@media (max-width: 950px) {
    .company-alias-layout {
        grid-template-columns: 1fr;
    }
}


/* ============================================================
   REISAI COST AUDIT
   ============================================================ */

.xpd-cost-page {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.xpd-cost-header {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: flex-start;
}

    .xpd-cost-header h1 {
        margin: 4px 0 6px;
        font-size: 30px;
        color: #111827;
    }

    .xpd-cost-header p {
        margin: 0;
        color: #6b7280;
    }

.xpd-cost-eyebrow {
    color: #2563eb;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
}

.xpd-cost-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.xpd-cost-period {
    border: 1px solid #e5e7eb;
    background: white;
    border-radius: 10px;
    padding: 9px 12px;
    font-size: 13px;
    color: #4b5563;
}

    .xpd-cost-period span {
        margin: 0 6px;
        color: #9ca3af;
    }

.xpd-cost-refresh {
    border: 0;
    border-radius: 10px;
    background: #111827;
    color: white;
    padding: 10px 16px;
    font-weight: 700;
    cursor: pointer;
}

    .xpd-cost-refresh:disabled {
        opacity: .55;
        cursor: default;
    }

.xpd-cost-section {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.xpd-cost-section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px;
}

.xpd-cost-section-title {
    font-size: 16px;
    font-weight: 800;
    color: #111827;
}

.xpd-cost-muted {
    font-size: 13px;
    color: #6b7280;
    margin-top: 3px;
}

.xpd-cost-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}

.xpd-cost-kpi,
.xpd-cost-active-card,
.xpd-cost-status-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
}

.xpd-cost-kpi {
    padding: 18px;
}

    .xpd-cost-kpi span,
    .xpd-cost-active-card span {
        display: block;
        font-size: 12px;
        color: #6b7280;
        margin-bottom: 7px;
    }

    .xpd-cost-kpi strong {
        display: block;
        font-size: 24px;
        color: #111827;
    }

    .xpd-cost-kpi small {
        display: block;
        margin-top: 6px;
        color: #9ca3af;
    }

.xpd-cost-kpi-good {
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.xpd-cost-active-badge {
    border-radius: 999px;
    padding: 7px 12px;
    background: #fff7ed;
    color: #c2410c;
    font-size: 12px;
    font-weight: 800;
}

.xpd-cost-active-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.xpd-cost-active-card {
    padding: 15px 17px;
}

    .xpd-cost-active-card strong {
        font-size: 21px;
        color: #111827;
    }

.xpd-cost-status-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.xpd-cost-status-card {
    padding: 16px;
}

.xpd-cost-status-name {
    min-height: 38px;
    font-size: 12px;
    font-weight: 800;
    color: #374151;
}

.xpd-cost-status-card > strong {
    display: block;
    margin: 5px 0 10px;
    font-size: 25px;
    color: #111827;
}

.xpd-cost-status-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

    .xpd-cost-status-meta span {
        background: #f3f4f6;
        border-radius: 999px;
        padding: 4px 7px;
        font-size: 11px;
        color: #6b7280;
    }

.xpd-cost-worklist {
    padding: 0;
    overflow: hidden;
}

.xpd-cost-worklist-head {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 20px;
    border-bottom: 1px solid #e5e7eb;
}

.xpd-cost-filter {
    display: flex;
    gap: 8px;
}

    .xpd-cost-filter input,
    .xpd-cost-filter select {
        height: 38px;
        border: 1px solid #d1d5db;
        border-radius: 9px;
        background: white;
        padding: 0 11px;
        outline: none;
    }

    .xpd-cost-filter input {
        width: 260px;
    }

.xpd-cost-table-wrap {
    overflow-x: auto;
}

.xpd-cost-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

    .xpd-cost-table th {
        background: #f9fafb;
        color: #6b7280;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .03em;
        text-align: left;
        padding: 11px 13px;
        border-bottom: 1px solid #e5e7eb;
        white-space: nowrap;
    }

    .xpd-cost-table td {
        padding: 12px 13px;
        border-bottom: 1px solid #f3f4f6;
        vertical-align: middle;
    }

    .xpd-cost-table tbody tr:hover {
        background: #f9fafb;
    }

    .xpd-cost-table .num {
        text-align: right;
        font-variant-numeric: tabular-nums;
    }

.xpd-cost-material {
    min-width: 250px;
}

    .xpd-cost-material strong {
        display: block;
        color: #111827;
    }

    .xpd-cost-material span {
        display: block;
        color: #6b7280;
        font-size: 12px;
        margin-top: 2px;
    }

.xpd-cost-pill {
    display: inline-block;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
    background: #f3f4f6;
    color: #4b5563;
}

.xpd-cost-pill-critical {
    background: #fef2f2;
    color: #b91c1c;
}

.xpd-cost-pill-warning {
    background: #fff7ed;
    color: #c2410c;
}

.xpd-cost-pill-info {
    background: #eff6ff;
    color: #1d4ed8;
}

.xpd-cost-state,
.xpd-cost-error {
    padding: 30px;
}

.xpd-cost-error {
    border-color: #fecaca;
    background: #fef2f2;
    color: #991b1b;
}

@media (max-width: 1400px) {
    .xpd-cost-kpi-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .xpd-cost-active-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .xpd-cost-header,
    .xpd-cost-worklist-head {
        flex-direction: column;
    }

    .xpd-cost-kpi-grid,
    .xpd-cost-active-grid,
    .xpd-cost-status-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .xpd-cost-filter {
        width: 100%;
        flex-direction: column;
    }

        .xpd-cost-filter input {
            width: 100%;
        }
}

.xpd-cost-material-link {
    text-decoration: none;
}

    .xpd-cost-material-link strong {
        color: #2563eb;
    }

    .xpd-cost-material-link:hover strong {
        text-decoration: underline;
    }

.xpd-cost-detail-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}

    .xpd-cost-detail-header h1 {
        margin: 6px 0 3px;
        font-size: 29px;
    }

    .xpd-cost-detail-header p {
        margin: 0;
        color: #6b7280;
    }

.xpd-cost-back {
    display: inline-block;
    margin-bottom: 13px;
    text-decoration: none;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}

    .xpd-cost-back:hover {
        color: #2563eb;
    }

.xpd-cost-date-value {
    font-size: 18px !important;
}

.xpd-cost-pill-good {
    background: #ecfdf5;
    color: #047857;
}

.xpd-cost-row-active {
    background: #fff7ed;
}

    .xpd-cost-row-active:hover {
        background: #ffedd5 !important;
    }

.xpd-cost-spinner {
    width: 18px;
    height: 18px;
    border: 2px solid #e5e7eb;
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: xpd-cost-spin .7s linear infinite;
}

@keyframes xpd-cost-spin {
    to {
        transform: rotate(360deg);
    }
}