/* === BUS BAR MODULE — Integrated styles === */

/* Busbar virtual item button in dynamic request */
.busbar-virtual-item-btn {
    padding: 8px 16px;
    border: 2px solid #6f42c1 !important;
    border-radius: 6px;
    background: linear-gradient(135deg, #f8f5ff, #ede5ff);
    color: #6f42c1;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    transition: all 0.15s;
    position: relative;
}

.busbar-virtual-item-btn:hover {
    background: linear-gradient(135deg, #ede5ff, #ddd0ff);
    transform: translateY(-1px);
}

.busbar-virtual-item-btn.selected {
    background: #6f42c1 !important;
    color: #fff !important;
    border-color: #6f42c1 !important;
}

/* Busbar flow inside dynamic request */
#busbar-request-flow .dynamic-request-group {
    margin-top: 10px;
}

#busbar-request-flow label {
    font-size: 0.78em;
    color: #555;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    font-weight: 600;
}

#busbar-request-flow .dynamic-button-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

#busbar-request-flow .dynamic-button-grid button {
    padding: 8px 14px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: #fff;
    color: #333;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.15s;
}

#busbar-request-flow .dynamic-button-grid button:hover {
    border-color: #6f42c1;
    background: #f8f5ff;
}

#busbar-request-flow .dynamic-button-grid button.selected {
    background: #6f42c1;
    color: #fff;
    border-color: #6f42c1;
}

/* Busbar inventory card in inventory tab */
#busbar-inventory-container .busbar-inv-row {
    display: flex;
    gap: 12px;
    margin-bottom: 0;
}

#busbar-inventory-container .busbar-inv-card {
    flex: 1;
    background: #f8f5ff;
    border: 2px solid #6f42c1;
    border-radius: 8px;
    padding: 16px;
    text-align: center;
}

#busbar-inventory-container .busbar-inv-num {
    font-size: 2em;
    font-weight: 700;
    color: #6f42c1;
}

#busbar-inventory-container .busbar-inv-label {
    font-size: 0.8em;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-top: 4px;
}

/* BUSBAR type button in inventory forms */
button[data-value="BUSBAR"],
.color-btn-busbar-general,
.color-btn-busbar-mackback {
    border-left: 3px solid #6f42c1 !important;
}

.busbar-btn {
    padding: 8px 14px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: #fff;
    color: #333;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.15s;
}

.busbar-btn:hover {
    border-color: #6f42c1;
    background: #f8f5ff;
}

.busbar-btn.selected {
    background: #6f42c1;
    color: #fff;
    border-color: #6f42c1;
}

.busbar-btn.type-general {
    border-left: 3px solid #378ADD;
}

.busbar-btn.type-mackback {
    border-left: 3px solid #E24B4A;
}

/* Slot grid */
.busbar-slot-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 5px;
    margin-bottom: 12px;
}

.busbar-slot {
    padding: 8px;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    font-size: 12px;
    color: #333;
    transition: all 0.15s;
}

.busbar-slot:hover {
    border-color: #6f42c1;
    background: #f8f5ff;
}

.busbar-slot.selected {
    background: #6f42c1;
    color: #fff;
    border-color: #6f42c1;
}

.busbar-slot .slot-pair {
    font-size: 10px;
    color: #999;
    display: block;
    margin-top: 2px;
}

.busbar-slot.selected .slot-pair {
    color: rgba(255,255,255,0.7);
}

/* Hidden groups */
.busbar-group-hidden { display: none; }

/* === DARK MODE === */
body.dark-mode .busbar-virtual-item-btn { background: linear-gradient(135deg, #2a2040, #352855); color: #b090e0; border-color: #6f42c1 !important; }
body.dark-mode .busbar-virtual-item-btn:hover { background: linear-gradient(135deg, #352855, #402a6a); }
body.dark-mode .busbar-virtual-item-btn.selected { background: #6f42c1 !important; color: #fff !important; }

body.dark-mode #busbar-request-flow label { color: #a0a4ab; }
body.dark-mode #busbar-request-flow .dynamic-button-grid button { background: #252a33; color: #e2e4e8; border-color: #383d47; }
body.dark-mode #busbar-request-flow .dynamic-button-grid button:hover { border-color: #6f42c1; background: #2a2040; }
body.dark-mode #busbar-request-flow .dynamic-button-grid button.selected { background: #6f42c1; color: #fff; }

body.dark-mode .busbar-btn { background: #252a33; color: #e2e4e8; border-color: #383d47; }
body.dark-mode .busbar-btn:hover { border-color: #6f42c1; background: #2a2040; }
body.dark-mode .busbar-btn.selected { background: #6f42c1; color: #fff; }
body.dark-mode .busbar-slot { background: #252a33; color: #e2e4e8; border-color: #383d47; }
body.dark-mode .busbar-slot:hover { border-color: #6f42c1; background: #2a2040; }
body.dark-mode .busbar-slot.selected { background: #6f42c1; color: #fff; }
body.dark-mode .busbar-slot .slot-pair { color: #6b7280; }

body.dark-mode #busbar-inventory-container .busbar-inv-card { background: #1e222a; border-color: #6f42c1; }
body.dark-mode #busbar-inventory-container .busbar-inv-num { color: #b090e0; }
body.dark-mode #busbar-inventory-container .busbar-inv-label { color: #a0a4ab; }