/* A simple CSS grid for the "header" row and each job row, plus summary rows */
.joblist-scale {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.joblist-container {
    width: 1842px;
    transform-origin: top left;
}

.report-scale {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.report-scale__container {
    display: inline-block;
    transform-origin: top left;
}

.report-person-section {
    break-inside: avoid;
    page-break-inside: avoid;
}

.report-person-block {
    break-inside: avoid;
    page-break-inside: avoid;
}

.joblist-grid {
    display: grid;
    /* 20 columns: [Link] [Sel] [Symbol] [Maschine] [Datum] [Startzeit] [Ende] [Dauer] [Auflage] [Kennung] [Auftrags-Nr.] [Artikel] [Bediener] [Schichtleiter] [OEE] [Prod] [Ruest] [Abfall] [Verf.] [Kunde] */
    grid-template-columns: 20px 30px 40px 70px 90px 70px 70px 70px 100px 200px 100px 100px 80px 80px 80px 80px 80px 90px 90px 150px;
    gap: 8px;
    align-items: center;
    padding: 4px 0;
}

.joblist-item {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.joblist-header {
    font-weight: bold;
    background-color: #f0f0f0;
    border-bottom: 1px solid #ccc;
}

.joblist-row {
    border-bottom: 1px solid #eee;
}

.summary-row {
    font-weight: bold;
    background-color: #fafafa;
    border-top: 2px solid #ccc;
    border-bottom: 2px solid #ccc;
}

/* OEE color classes (examples).  You can customize or expand as needed. */
.oee-high {
    color: green;
}

.oee-mid {
    color: darkorange;
}

.oee-low {
    color: red;
}

.pdf-link-top,
.pdf-link-bottom {
    position: fixed;
    right: 10px;
    z-index: 1000;
}

.pdf-link-top {
    top: 10px;
}

.pdf-link-bottom {
    bottom: 10px;
}

.team-pulse-container {
    padding-bottom: 24px;
}

.team-pulse-title-bar {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}

.team-pulse-title-group {
    display: flex;
    align-items: center;
    gap: 12px;
}

.team-pulse-logo {
    width: 72px;
    height: 48px;
}

.team-pulse-heart {
    fill: #e53935;
    transform-box: fill-box;
    transform-origin: center;
    animation: team-pulse-heartbeat 1.8s ease-in-out infinite;
}

.team-pulse-wave {
    fill: none;
    stroke: #ff8a80;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 120;
    stroke-dashoffset: 120;
    animation: team-pulse-wave 2.4s ease-in-out infinite;
}

.team-pulse-title {
    margin: 0;
}

@keyframes team-pulse-heartbeat {
    0%,
    30%,
    60%,
    100% {
        transform: scale(1);
    }
    15%,
    45% {
        transform: scale(1.1);
    }
}

@keyframes team-pulse-wave {
    0% {
        stroke-dashoffset: 120;
        opacity: 0.2;
    }
    30% {
        opacity: 1;
    }
    60% {
        stroke-dashoffset: 0;
        opacity: 1;
    }
    100% {
        stroke-dashoffset: -120;
        opacity: 0.2;
    }
}

.team-pulse-table {
    width: 100%;
    border-collapse: collapse;
}

.team-pulse-details-table-wrapper {
    overflow: hidden;
    margin-bottom: 24px;
    width: 100%;
}

.team-pulse-details-table {
    width: 1800px;
    border-collapse: collapse;
    min-width: 1200px;
    table-layout: fixed;
}

.team-pulse-details-table th,
.team-pulse-details-table td {
    padding: 10px 12px;
    white-space: normal;
}

.team-pulse-details-table th {
    position: sticky;
    top: 0;
    background: #f5f5f5;
    z-index: 1;
}

.team-pulse-details-table tbody tr:nth-child(even) {
    background-color: #fafafa;
}

.team-pulse-table th,
.team-pulse-table td {
    padding: 8px 12px;
    text-align: left;
}

.team-pulse-table tbody tr:nth-child(even) {
    background-color: #f8f8f8;
}

.team-pulse-chart-card {
    height: 100%;
}

.team-pulse-chart {
    height: 220px;
}

.team-pulse-history-chart {
    height: 480px;
}

.team-pulse-details-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    font-weight: 600;
}

.team-pulse-details-link-inline {
    color: inherit;
    text-decoration: none;
    font-weight: 600;
}

.team-pulse-details-link-inline:hover,
.team-pulse-details-link:hover {
    text-decoration: underline;
}

.team-pulse-details-summary {
    border-left: 4px solid #1565c0;
}

.team-pulse-details-chart-card {
    margin-top: 12px;
    width: 100%;
}

.team-pulse-scale {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.team-pulse-scale__container {
    display: inline-block;
    transform-origin: top left;
}

.team-pulse-details-chart-card .team-pulse-history-chart {
    width: 100%;
}

.team-pulse-donut-grid .mud-grid-item {
    display: flex;
}

.team-pulse-donut-grid .mud-grid-item > .mud-paper {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.team-pulse-history .mud-paper {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.team-pulse-history .team-pulse-history-chart {
    flex: 1;
}

.team-pulse-history-chart {
    width: 100%;
    max-width: 100%;
}

.team-pulse-material-table {
    max-height: 480px;
    overflow-y: auto;
}

.team-pulse-material-table .mud-table {
    min-width: 100%;
}

.material-sparkline {
    height: 70px;
    width: 100%;
}

.job-breakdown {
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: linear-gradient(135deg, #ffffff 0%, #f4f7ff 100%);
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
    padding: 16px 20px;
}

.job-breakdown__header {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.job-breakdown__title {
    font-weight: 600;
    padding: 6px 16px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    background-color: #f5f7ff;
    color: #1e3a8a;
}

.job-breakdown__trigger {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0.01em;
}

.job-breakdown__expand-icon {
    margin-left: 8px;
    font-size: 1.5rem;
}

.job-breakdown__panel {
    margin-top: 16px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    padding-top: 16px;
}

.job-breakdown__table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.05);
    background-color: #ffffff;
}

.job-breakdown__table th,
.job-breakdown__table td {
    padding: 10px 14px;
    text-align: left;
    font-size: 0.95rem;
}

.job-breakdown__table thead tr:first-child th {
    background: linear-gradient(120deg, #1e3a8a, #312e81);
    color: #ffffff;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 0.08em;
}

.job-breakdown__table thead tr:nth-child(2) th {
    background-color: #e8ecff;
    color: #1e3a8a;
    font-weight: 700;
}

.job-breakdown__table tbody tr:nth-child(even) {
    background-color: #f5f7ff;
}

.job-breakdown__table tbody tr:hover {
    background-color: #eef2ff;
}

.job-breakdown__table tfoot td {
    font-weight: 700;
    background-color: #e4e7ff;
}

.job-breakdown__head-index,
.job-breakdown__index {
    text-align: center;
    width: 3.25rem;
}

.job-breakdown__index {
    font-weight: 600;
    color: #475569;
}

.job-breakdown__head-main {
    min-width: 180px;
}

.job-breakdown__head-time {
    white-space: nowrap;
}

.job-breakdown__link {
    color: #1e3a8a;
    font-weight: 600;
    text-decoration: none;
}

.job-breakdown__link:hover {
    text-decoration: underline;
}

.team-pulse-home-overview {
    margin-bottom: 24px;
}

.team-pulse-overview-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.top-nav-menu .mud-nav-link {
    white-space: nowrap;
}

@media print {
    .report-person-section,
    .report-person-block,
    .report-person-section .report-scale,
    .report-person-section .report-scale__container {
        break-inside: auto;
        page-break-inside: auto;
    }

    .report-person-section table {
        break-inside: auto;
        page-break-inside: auto;
    }

    .report-person-section thead,
    .report-person-section tfoot,
    .report-person-section tr {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .report-oee-summary,
    .report-charts,
    .job-breakdown,
    .job-breakdown__panel,
    .job-breakdown__table {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .report-person-section thead {
        display: table-header-group;
    }

    .report-person-section tfoot {
        display: table-footer-group;
    }

    .team-pulse-table {
        break-after: page;
        page-break-after: always;
    }

    .team-pulse-chart-card,
    .team-pulse-history .mud-paper,
    .team-pulse-donut-grid .mud-grid-item > .mud-paper {
        break-inside: avoid;
        page-break-inside: avoid;
    }
}