/* Container (för scroll på små skärmar) */

.table-container {
				overflow-x: auto;
				
}

/* Grundstil */
.modern-table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Inter', sans-serif;
    /*border-radius: 5px;*/
    overflow: hidden;
    
}
.modern-table th,
.modern-table td {
				padding: 5px 6px;
				font-size: 1em;
				font-family: Inter, sans-serif;
}
/* Header */
.modern-table th {
				background: #FF9D5B;
				color: white;
				text-align: left;
				padding: 2px 12px 2px 12px;
				font-weight: 600;
}

/* Celler */
.modern-table td {
    /*padding: 12px;*/
    				/*padding: 2px 12px 2px 12px;*/

}
.modern-table tr {
        /*margin-bottom: 10px;*/
        border: 1px solid #FF9D5B;
       /* border-radius: 3px;*/
        overflow: hidden;
        
    }

/* Zebra stripes */
.modern-table tr:nth-child(even) {
    background-color: #f8fafc;
}

.modern-table tr:nth-child(odd) {
    background-color: #ffffff;
}

/* Hover-effekt */
.modern-table tbody tr:hover {
    background-color: #e2e8f0;
    transition: 0.2s;
}

/* Linjer */
.modern-table td {
    /*border-bottom: 1px solid #FF9D5B;*/
}

/* 📱 Mobilanpassning */
@media (max-width: 768px) {

    .modern-table {
        border: none;
    }

    .modern-table thead {
        display: none;
    }

    .modern-table, 
    .modern-table tbody {
        display: block;
    }
        .modern-table tr {
        display: block;
        margin-bottom: 12px;
        /*padding: 10px;*/
         padding: 10px 10px 10px 8px; /* mindre vänsterpadding */
        border-radius: 10px;
        background: #ffffff;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06);
        border: 1px solid #eee;
    }

    .modern-table td {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        padding: 6px 0;
        border: none;
        font-size: 0.95em;
        gap: 6px;
    }

    .modern-table td::before {
        content: attr(data-label);
        font-weight: 600;
        color: #555;
        flex-shrink: 0;
    }

    .modern-table td span {
        text-align: right;
        word-break: break-word;
    }
}