/* ===================================================================
 * styles-boq-compact.css
 * Purpose: Compact / professional BOQ table density overrides + sticky toolbar
 * Extracted from styles.css during the Apr 2026 split (task #23).
 * =================================================================== */
/* ===============================================
   COMPACT PROFESSIONAL BOQ TABLE STYLES
   =============================================== */

/* Override BOQ table for compact professional look */
.boq-table {
    font-size: 0.85rem !important;
    line-height: 1.2 !important;
}

/* Compact table cell padding */
.boq-table th,
.boq-table td {
    padding: 3px 5px !important;
    vertical-align: middle !important;
    border: 1px solid #333 !important;
}

/* Compact phase rows */
#boqTable tr.phase-row,
#boq-table tr[data-level="phase"],
.table tr.phase-row {
    background-color: #2a2a2a !important;
    font-size: 0.9rem !important;
    font-weight: 700 !important;
    border-top: 2px solid var(--primary-color) !important;
    border-bottom: 1px solid var(--primary-color) !important;
    color: #ff8c00 !important;
    text-transform: uppercase;
    height: 28px !important;
}

#boqTable tr.phase-row td,
#boq-table tr[data-level="phase"] td,
.table tr.phase-row td {
    padding: 2px 5px !important;
    color: #ff8c00 !important;
}

/* Compact cost center rows */
#boqTable tr.cc-row,
#boq-table tr[data-level="cc"],
.table tr[data-type="cc"] {
    background-color: #222222 !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    border-left: 3px solid #ff8c00 !important;
    color: #ff8c00 !important;
    height: 26px !important;
}

#boqTable tr.cc-row td,
#boq-table tr[data-level="cc"] td,
.table tr[data-type="cc"] td {
    padding: 2px 5px !important;
    color: #ff8c00 !important;
}

/* Compact item rows */
#boqTable tr.item-row,
#boq-table tr[data-level="item"],
.table tr[data-type="item"] {
    background-color: #1a1a1a !important;
    border-left: 1px solid #444 !important;
    color: #d0d0d0 !important;
    font-size: 0.8rem !important;
    font-weight: normal !important;
    height: 24px !important;
}

#boqTable tr.item-row td,
#boq-table tr[data-level="item"] td,
.table tr[data-type="item"] td {
    padding: 2px 5px !important;
    color: #d0d0d0 !important;
}

/* Compact table header */
.boq-table thead th {
    padding: 4px 5px !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    height: 30px !important;
    background-color: #2d2d2d !important;
    color: #ff8c00 !important;
    border-bottom: 2px solid var(--primary-color) !important;
}

/* Compact input fields in table */
.boq-table input[type="text"],
.boq-table input[type="number"],
.boq-table select,
.boq-table .form-control,
.boq-table .form-select {
    padding: 1px 3px !important;
    font-size: 0.75rem !important;
    height: 18px !important;
    line-height: 1.2 !important;
    border: 1px solid #444 !important;
    background-color: rgba(0, 0, 0, 0.3) !important;
    color: #d0d0d0 !important;
}

/* Compact editable spans */
.boq-table .editable {
    padding: 1px 3px !important;
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
    min-height: auto !important;
    display: inline-block;
}

/* Compact checkboxes and toggle buttons */
.boq-table input[type="checkbox"] {
    transform: scale(0.8);
    margin: 0 !important;
}

.boq-table .toggle-btn {
    font-size: 0.7rem !important;
    padding: 1px 3px !important;
    line-height: 1 !important;
}

/* Compact drag handles */
.boq-table .item-drag-handle {
    font-size: 0.7rem !important;
    padding: 1px !important;
}

/* Remove extra spacing */
.boq-table tr {
    margin: 0 !important;
}

/* Ensure totals are properly formatted */
.boq-table .text-end,
.boq-table .phase-total,
.boq-table .cc-total {
    font-weight: 600 !important;
    text-align: right !important;
    font-size: 0.8rem !important;
}

/* Compact toolbar buttons to match table density */
.boq-toolbar .btn-sm {
    padding: 2px 8px !important;
    font-size: 0.75rem !important;
    height: 26px !important;
}

/* Compact dropdown menus */
.boq-table .dropdown-menu {
    font-size: 0.75rem !important;
    padding: 2px 0 !important;
}

.boq-table .dropdown-item {
    padding: 2px 8px !important;
    font-size: 0.75rem !important;
}

/* Compact BOQ container and toolbar */
.boq-content-wrapper {
    padding-top: 110px !important; /* Adjusted for main nav + toolbar height */
}

/* Fixed/Sticky BOQ Toolbar - Positioned below main navigation */
.boq-toolbar-fixed {
    position: fixed !important;
    top: 56px !important; /* Position below main navigation bar */
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 1040 !important; /* Lower than main nav but above content */
    background-color: #1a1a1a !important;
    border-bottom: 2px solid var(--primary-color) !important;
    padding: 4px 8px !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
}

.boq-toolbar {
    padding: 4px 8px !important;
    background-color: #1a1a1a !important;
    border-bottom: 1px solid #333 !important;
}

.boq-toolbar .btn {
    margin: 1px 2px !important;
    padding: 3px 6px !important;
    font-size: 0.75rem !important;
    height: 24px !important;
    line-height: 1.2 !important;
}

/* Compact project header in BOQ page */
.boq-page h4 {
    font-size: 1.1rem !important;
    margin-bottom: 0.5rem !important;
}

.boq-page small {
    font-size: 0.7rem !important;
}

/* Ensure table responsive container doesn't add extra spacing */
.table-responsive {
    padding: 0 !important;
    margin: 0 !important;
}

/* Compact BOQ container */
#boq-container {
    border: 1px solid #333 !important;
    border-radius: 4px !important;
    overflow: hidden !important;
}

/* Fix any bootstrap default spacing that interferes */
.boq-table.table-hover tbody tr:hover {
    background-color: rgba(245, 179, 1, 0.05) !important;
}

/* Professional grid-like appearance */
.boq-table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background-color: #1a1a1a !important;
}

