.bt-counted-summary {
    font-family: Arial, sans-serif;
}

/* Batch List */
.bt-batch-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bt-batch-card {
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.2s ease, border 0.2s ease;
}

.bt-batch-card:hover {
    background-color: #f9f9f9;
}

/* Selected Batch */
.bt-batch-selected {
    border: 2px solid #d71440; /* matching red */
    background-color: #fff0f3;
}

.bt-batch-locations {
    font-weight: bold;
    font-size: 1.1em;
}
.bt-batch-id,
.bt-batch-user,
.bt-batch-date {
    font-size: 0.85em;
    color: #777;
}

/* Aggregate Button */
.bt-aggregate-controls {
    margin-bottom: 12px;
}
#bt-view-selected {
    background-color: #d71440;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 8px 14px;
    cursor: pointer;
    font-weight: bold;
    transition: background 0.2s ease;
}
#bt-view-selected:disabled {
    background-color: #ccc;
    cursor: not-allowed;
}
#bt-view-selected:not(:disabled):hover {
    background-color: #c01035;
}



.bt-batch-metadata {
    position: relative; /* container for absolute positioning */
    padding-right: 150px; /* space for the message on the right */
}

.bt-no-reload {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-weight: bold;
    color: #888888;
    font-size: 0.9em;
}

/* Mobile breakpoint */
@media (max-width: 600px) {
    .bt-batch-metadata {
        padding-right: 0; /* remove right padding */
    }

    .bt-no-reload {
        position: static;      /* remove absolute positioning */
        transform: none;       /* reset vertical centering */
        margin-top: 4px;       /* small spacing above */
        display: block;        /* ensure it takes full width line */
        text-align: left;      /* align with text on small screens */
    }
}


.bt-batch-metadata .bt-batch-locations {
    font-weight: bold;
    font-size: 1em;
}
.bt-batch-metadata .bt-batch-user,
.bt-batch-metadata .bt-batch-date {
    font-size: 0.85em;
    color: #555;
}

/* Inventory Items */
.bt-category-header {
    font-weight: bold;
    background-color: #d71440;
    color: #fff;
    padding: 6px 8px;
    margin-top: 12px;
    border-radius: 4px;
    font-size: 1em;
}

.bt-items-completed .bt-completed-header {
    font-weight: bold;
    background-color: #f4f4f4;
    padding: 6px 12px;
    border-radius: 4px;
    cursor: pointer;
    user-select: none;
    margin-top: 12px;
}

/* Make inventory items look clickable */
.bt-inventory-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    border-bottom: 1px solid #ddd;
    cursor: pointer;
    transition: background 0.2s ease;
}

.bt-inventory-item:hover {
    background-color: #f0f8ff;
}

/* Optional: active/focused state for keyboard accessibility */
.bt-inventory-item:active {
    background-color: #e0f0ff;
    transform: translateY(0);
}


.bt-item-name {
    flex: 1; /* take all available space */
    display: flex;
    flex-direction: column;
}

.bt-item-qty {
    flex: 0 0 70px; /* fixed width for right alignment; adjust as needed */
    display: flex;
    justify-content: space-between; /* number left, UOM right */
    align-items: center;
    white-space: nowrap; /* prevent wrapping */
}

.bt-item-uom {
    font-size: 0.8em;
    color: #555;
    text-align: right;
}


.bt-item-number {
    font-size: 0.85em;
    color: #777;
    margin-top: 2px;
    margin-left: 10px;
}


.bt-back-link {
    display: inline-block;
    margin-bottom: 10px;
    text-decoration: none;
    color: #d71440;
    font-weight: bold;
}

.bt-back-link:hover {
    text-decoration: underline;
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .bt-batch-card {
        padding: 8px 10px;
    }
    .bt-batch-locations {
        font-size: 1em;
    }
    .bt-batch-id, .bt-batch-user, .bt-batch-date {
        font-size: 0.8em;
    }
    .bt-item-qty input {
        width: 50px;
    }
}

/* Toggle Container */
.bt-toggle-container {
    display: flex;
    width: 100%;
    background-color: #e0e0e0;
    border-radius: 8px; /* slightly rounded */
    overflow: hidden;
    margin-bottom: 12px;
    user-select: none;
}

/* Toggle Options */
.bt-toggle-option {
    flex: 1;
    text-align: center;
    padding: 8px 0;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
    font-weight: bold;
    color: #333;
}

.bt-toggle-option.active {
    background-color: #d71440;
    color: #fff;
}


.bt-qty-checked {
    font-size: 1.2em;
    color: #28a745;
}




.bt-priority-triangle {
  display:inline-block;
  width:0;
  height:0;
  margin-left:6px;
  border-left:6px solid transparent;
  border-right:6px solid transparent;
  border-bottom:10px solid;
}
/* Priority triangle (larger, red) */
.bt-priority-triangle.high {
  display: inline-block;
  width: 0;
  height: 0;
  margin: 0 12px; /* spacing between description & qty */
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 12px solid #dc3545; /* bigger + bold red */
  flex-shrink: 0; /* don’t let it shrink */
}
/* Priority triangle (larger, yellow) */
.bt-priority-triangle.medium {
  display: inline-block;
  width: 0;
  height: 0;
  margin: 0 12px; /* spacing between description & qty */
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 12px solid #ffc107; /* bright yellow */
  flex-shrink: 0;
}






/* High Priority Section */
.bt-items-high-priority {
  margin-top: 1.5em;
  padding: 1em;
  border: 2px solid #dc3545; /* red border for urgency */
  border-radius: 6px;
  background-color: #fff5f5; /* light red background */
}

.bt-high-priority-header {
  font-weight: bold;
  font-size: 1.2em;
  color: #dc3545; /* red text */
  margin-bottom: 0.75em;
  text-transform: uppercase;
}

/* Individual items inside */
.bt-items-high-priority .bt-inventory-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5em 0;
  border-bottom: 1px dashed #f5c2c7;
}

.bt-items-high-priority .bt-inventory-item:last-child {
  border-bottom: none;
}