/* Drag-Feedback */
.myDragClass {
    background-color: #ffffcc !important;
    opacity: 0.8;
    cursor: move !important;
}

/* Drag-Handle sichtbar machen */
.linecolmove {
    cursor: move;
}

/* Section-Header nicht ziehbar */
tr.section-header {
    cursor: default !important;
}

tr.section-header .linecolmove {
    cursor: default !important;
    pointer-events: none;
}

/* Subtotal-Zeile nicht ziehbar */
tr.subtotal-row .linecolmove {
    cursor: default !important;
    pointer-events: none;
}

/* ========== COLLAPSE FUNKTIONEN ========== */

/* Eingeklappte Produkte verstecken */
tr.section-collapsed {
    display: none;
}

/* Section-Header Collapse-Icon */
.section-toggle {
    cursor: pointer;
    margin-right: 8px;
    user-select: none;
}

/* Section-Header Buttons mehr Abstand */
tr.section-header a {
    padding: 5px 8px;
    display: inline-block;
}

/* Produkt-Anzahl Badge */
.section-count {
    background: #666;
    color: white;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    margin-left: 10px;
}

/* Collapse-Buttons unten */
.section-collapse-buttons {
    margin-top: 10px;
    margin-bottom: 10px;
}

.section-collapse-buttons a {
    margin-right: 15px;
}

/* Collapse-Buttons Zeile */
.section-collapse-actions {
    margin-top: 5px;
}

/* Textzeilen - nur am Handle ziehbar */
tr.textline-row {
    cursor: default;
}

tr.textline-row .linecolmove {
    cursor: move;
    min-width: 20px;
}

/* Drag-Handle wird über JavaScript als background-image gesetzt (wie Dolibarr) */

tr.textline-row:hover {
    background-color: #f5f5f5 !important;
}

/* Section-Zugehörigkeit optisch hervorheben */
tr[data-parent-section] {
    border-left: 3px solid #4a90d9 !important;
}
/* ========== SECTION-ZUGEHÖRIGKEIT ========== */

/* Freie Produkte - kein Rand */
#tablelines tr[data-parent-section="null"] > td:first-child {
border-left: none !important;
}

/* Section-Header Basis-Style - erbt vom Theme */
#tablelines tr.section-header > td {
background-color: inherit;
}

/* ========== SYNC + COLLAPSE BUTTONS ZEILE ========== */
.sync-collapse-row {
    text-align: right;
    padding: 5px 0;
}

.sync-collapse-row a {
    margin-left: 5px;
}

/* Massenlösch-Button visuell abgetrennt */
#btnMassDelete {
    border-left: 2px solid #ccc;
    padding-left: 15px !important;
}