@import '_content/Blazored.Modal/Blazored.Modal.bundle.scp.css';
@import '_content/Blazored.Toast/Blazored.Toast.bundle.scp.css';
@import '_content/NWCWebApp2022.Copilot/NWCWebApp2022.Copilot.ee09a6kolw.bundle.scp.css';

/* /Pages/Booking/AddBooking.razor.rz.scp.css */
select[b-h5zb79yypi] {
  padding: 5px;
  margin: 0;
  width: 100%;
}

.form-group[b-h5zb79yypi] {
}

.flex-row-end[b-h5zb79yypi] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  border-bottom: 1px solid grey;
  justify-content: end;
  gap: 5px;
}

.flexRow[b-h5zb79yypi] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  border-bottom: 1px solid grey;
}

.row[b-h5zb79yypi] {
  display: flex;
  flex-wrap: wrap;
}

.flexGrid-WithinFlexRow[b-h5zb79yypi] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: 5px;
  width: 100%;
}
/*.column {

  border: 1px solid #ccc;
}*/
.cell[b-h5zb79yypi] {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /*    gap: 5px;
    border: 1px solid black;
*/ flex: 1;
}

.flexRowEnd[b-h5zb79yypi] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: center; /* Vertical alignment */
  gap: 10px;
}


.flexRowStart[b-h5zb79yypi] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  /*    border-bottom: 1px solid grey;*/
}


.flexGrid[b-h5zb79yypi] {
  display: grid;
  grid-template-columns: 1fr 1fr 2fr 1fr 1fr; /* Defines the fractions for each column */
  align-items: center; /* Aligns items vertically in the center */
  border-bottom: 1px solid grey;
  gap: 5px;
}

textarea[b-h5zb79yypi], input[type="text"][b-h5zb79yypi] {
  text-transform: uppercase;
}

.flexGrid button select[b-h5zb79yypi] {
  align-self: flex-start; /* Method 1 */
  width: auto; /* Method 2 */
  min-width: 0; /* Method 3 */
}

.checkboxContainer[b-h5zb79yypi] {
  display: flex;
  justify-content: flex-end;
}

.round-button[b-h5zb79yypi] {
  background-color: #007bff;
  color: white;
  border: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.auto-height-row[b-h5zb79yypi] {
  height: 300px; /* Adjust as needed */
}

.auto-height-textarea[b-h5zb79yypi] {
  width: 100%;
  height: 240px;
  border: none; /* Remove border for better visual appearance */
}

textarea[b-h5zb79yypi] {
  font-size: 15px; /* Adjust as needed */
  line-height: 1.5; /* Adjust as needed */
  height: 150px;
}

.grid-container[b-h5zb79yypi] {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* Two equal-width columns */
  gap: 10px; /* Gap between cells */
}

.grid-item[b-h5zb79yypi] {
  padding: 10px;
  border: 1px solid #ccc;
}

.parent-container[b-h5zb79yypi] {
  display: flex;
  flex-direction: column;
  /*gap: 10px;*/ /* Gap between parent and child containers */
}

.child-container[b-h5zb79yypi] {
  display: flex;
  flex-direction: row;
  gap: 10px; /* Gap between nested rows */
}

.nested-row[b-h5zb79yypi] {
  padding: 10px;
  border: 1px solid #ccc;
  background-color: #f0f0f0;
}

.bodyHeight[b-h5zb79yypi] {
  max-height: 65vh;
  overflow-y: auto;
}

.bookingWineLotTankComponent[b-h5zb79yypi] {
  border: 1px solid #ccc;
  padding: 3px;
  margin: 3px;
  /*    height:415px;
*/ height: auto;
  overflow-y: hidden;
}

.mini-row[b-h5zb79yypi] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 3px;
}

.flexRowCenter[b-h5zb79yypi] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-evenly;
  align-items: center; /* Vertical alignment */
  gap: 10px;
}

.flexRowEnd[b-h5zb79yypi] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: center; /* Vertical alignment */
  gap: 10px;
}

.lotIdSelect[b-h5zb79yypi] {
  min-width: 200px;
}

input[type="text"][b-h5zb79yypi] {
  text-transform: uppercase;
}

td[b-h5zb79yypi] {
  padding: 0px;
}

th[b-h5zb79yypi] {
  text-align: center;
  vertical-align: middle;
  padding: 0px;
}

#autoExpandTextarea[b-h5zb79yypi] {
  overflow-y:hidden; 
/**/  /*resize: none;*/ /* Disable manual resizing */
  height:fit-content; /* Set initial height as desired */
  padding: 6px;
  width: 100%;
  box-shadow: 0px 0px 10px 2px #007bff;

}
.red[b-h5zb79yypi]{
/*  background-color: red;
*/}
/* /Pages/Booking/AddDrainAndPress.razor.rz.scp.css */
.invalid[b-jtmur55r0o] { border-color: #dc3545 !important; box-shadow: 0 0 0 0.1rem rgba(220,53,69,.15); }
.error-text[b-jtmur55r0o] { color: #dc3545; font-size: 0.8rem; margin-top: 2px; }

select[b-jtmur55r0o], .form-select[b-jtmur55r0o], .form-input[b-jtmur55r0o], .form-control[b-jtmur55r0o], textarea[b-jtmur55r0o], input[type="number"][b-jtmur55r0o], input[type="datetime-local"][b-jtmur55r0o] {
  padding: 6px 8px;
  width: 100%;
  box-sizing: border-box;
}

/* spacing utilities */
.flexRow[b-jtmur55r0o] { display: flex; flex-wrap: wrap; align-items: flex-end; }
.flexRow.gap[b-jtmur55r0o] { gap: 12px; }
.pad[b-jtmur55r0o] { padding-bottom: 8px; border-bottom: 0 solid transparent; }

/* structured layout */
.adp-container[b-jtmur55r0o] { padding: 8px 4px; }
.field[b-jtmur55r0o] { display: flex; flex-direction: column; min-width: 180px; }
.field.sm[b-jtmur55r0o] { min-width: 120px; max-width: 200px; }
.field.full[b-jtmur55r0o] { flex: 1 1 100%; }
.label[b-jtmur55r0o] { margin-bottom: 4px; font-size: 0.9rem; color: #333; }

/* checkboxes & footer */
.footer-row[b-jtmur55r0o] { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; }
.check-group[b-jtmur55r0o] { display: inline-flex; gap: 16px; align-items: center; }
.check[b-jtmur55r0o] { display: inline-flex; align-items: center; gap: 6px; }
.actions[b-jtmur55r0o] { display: inline-flex; gap: 8px; }
.actions.right[b-jtmur55r0o] { margin-left: auto; }
/* Textarea behavior: start small, allow vertical growth without affecting row layout */
textarea[b-jtmur55r0o] { min-height: 38px; resize: vertical; }
/* /Pages/Booking/bookingCalendar.razor.rz.scp.css */
.flex-row[b-e94ah9kf81] {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: center;
    gap: 5px;
}

.center[b-e94ah9kf81] {
    justify-content: center;
}


.calendar[b-e94ah9kf81] {
    display: grid;
    grid-template-columns: repeat(8, 1fr); /* 7 days + 1 summary */
    gap: 10px;
}

.top20[b-e94ah9kf81] {
    height: 15vh; /* Top 20% of the container */
    overflow: hidden; /* Prevent overflow */
}

.bottom80[b-e94ah9kf81] {
    height: 80vh; /* Bottom 80% of the container */
    overflow: auto; /* Prevent overflow */
}

.day-header[b-e94ah9kf81] {
    font-weight: bold;
    padding: 10px;
}

.weeks-container[b-e94ah9kf81] {
    display: grid;
    /*    grid-template-columns: repeat(8,1fr);*/
    grid-template-rows: repeat(1, 1fr);
    gap: 10px;
    overflow-y: auto;
    min-height: 600px;
}

.week[b-e94ah9kf81] {
    display: grid;
    grid-template-columns: repeat(8, 1fr); /* 7 days + 1 summary */
    gap: 10px;
}

.empty-day[b-e94ah9kf81] {
  display: flex;
  flex-direction: column;
  border: 1px solid #ccc;
  padding: 10px;
/*  min-height: 250px;
*/}
#ThisOneToTheBottomOfContainer[b-e94ah9kf81] {
  margin-top: auto;
}

.day-date[b-e94ah9kf81] {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  text-align: left;
  font-size: 12px;
  margin-bottom: 5px;
  /*
  font-size: 12px;
  margin-bottom: 5px;*/


  font-size: 1.1rem;
  margin-bottom: .3rem;
  font-weight: bold;
  gap: 5px;
  align-items: center;
}
.btnHidden button[b-e94ah9kf81] {
    display: none;
    cursor: pointer;
}

.day-date:hover .btnHidden button[b-e94ah9kf81] {
    display: block;
}

.summary-column[b-e94ah9kf81] {
    display: flex;
flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    font-weight: bold;
    height: 100%; /* Ensure that the day-column occupies the full height */
}

.day-wrapper[b-e94ah9kf81] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: minmax(10px, auto);
    gap: 5px;
}

.left-box[b-e94ah9kf81] {
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 1;
    grid-row-end: 2;
    text-align: left;
    font-size: 1.875em;
    padding-left: 5px;
}

.right-box[b-e94ah9kf81] {
    grid-column-start: 2;
    grid-column-end: 4;
    grid-row-start: 1;
    grid-row-end: 2;
}

    .right-box:hover #newAppointmentId[b-e94ah9kf81] {
        display: block;
    }

    .right-box #newAppointmentId[b-e94ah9kf81] {
        display: none;
    }


.calendar-day[b-e94ah9kf81] {
    border-radius: 5px;
    background-color: white;
    box-shadow: 0px 0px 3px #92a1d1;
    box-sizing: border-box;
    min-height: 250px;
}

    .empty-Day:hover[b-e94ah9kf81] {
        box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
    }
.bottlingDay[b-e94ah9kf81] {
  cursor: pointer;
  border-radius: 5px;
  position: relative; /* Adding relative positioning here */
  overflow: visible; /* Making sure the overflowing content is visible */
  line-height: 1;

  font-size: 1.1rem;
  margin-bottom: .3rem;
  font-weight: bold;
}

.currentDayShadow[b-e94ah9kf81] {
    box-shadow: 0px 0px 6px #a3bfe0, 
        0px 0px 6px #a3bfe0, 
        0px 0px 6px #a3bfe0,
        0px 0px 6px #a3bfe0, 
        0px 0px 6px #a3bfe0;
}

.switch[b-e94ah9kf81] {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

  .switch input[b-e94ah9kf81] {
    opacity: 0;
    width: 0;
    height: 0;
  }

.slider[b-e94ah9kf81] {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  transition: .4s;
}

  .slider[b-e94ah9kf81]:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    transition: .4s;
  }

input:checked + .slider[b-e94ah9kf81] {
  background-color: #2196F3;
}

  input:checked + .slider[b-e94ah9kf81]:before {
    transform: translateX(26px);
  }
/* /Pages/Booking/BookingMain.razor.rz.scp.css */
@media print {
  .cards[b-qe85ma4rbz] {
    display: flex;
    flex-wrap: nowrap;

  }

    .card[b-qe85ma4rbz] {
        flex: 0 1 calc(33% - .25em);
        border: 1px solid black;
    }

    .no-print[b-qe85ma4rbz], .no-print *[b-qe85ma4rbz] {
        display: none !important;
    }

    body[b-qe85ma4rbz] {
        margin: 5mm 5mm 5mm 5mm;
    }

    .noShow[b-qe85ma4rbz] {
        display: contents
    }
}

@media screen and (min-width: 1200px) {
  .cards[b-qe85ma4rbz] {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;

  }

    .card[b-qe85ma4rbz] {
        border: 1px solid black;
        flex: 0 1 calc(50% - .25em);
    }

    .noShow[b-qe85ma4rbz] {
        display: none;
    }
}

@media screen and (min-width: 1400px) {
  .cards[b-qe85ma4rbz] {
    display: flex;
    flex-wrap: nowrap;

  }

    .card[b-qe85ma4rbz] {
        flex: 0 1 calc(33% - .25em);
        border: 1px solid black;
    }

    .noShow[b-qe85ma4rbz] {
        display: none;
    }
}

.parentContainer[b-qe85ma4rbz] {
  height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 3px;
  margin: 3px;
  background: linear-gradient(135deg, rgba(245, 247, 250, 0.6), rgba(195, 207, 226, 0.8), rgba(128, 0, 128, 0.2));
}

.container-fluid[b-qe85ma4rbz] {
  margin: 5px;
    padding: 5px;
    align-items: center;
    overflow-y: auto;
    overflow-x: hidden;
}

.container[b-qe85ma4rbz] {
    width: 100%;
    padding: 0px 0px;
    margin: 0;
    align-items: center
}
.cards[b-qe85ma4rbz] {
  gap: 3px;
  margin-bottom: 5px;
  overflow-x: auto;
}

.noShow[b-qe85ma4rbz] {
    display: contents
}

.col[b-qe85ma4rbz] {
    padding: 3px;
}


img[b-qe85ma4rbz] {
    border-radius: 5px 5px 0 0;
}

.buttonHover:hover[b-qe85ma4rbz]{
color: blue;
text-decoration:underline;
    cursor: pointer;
}

table[b-qe85ma4rbz] {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    border: 1px solid #ddd;
    border-left: hidden;
    border-right: hidden;
}

th[b-qe85ma4rbz], td[b-qe85ma4rbz] {
    text-align: center;
    padding: 3px;
    line-height:1;
}

tr:nth-child(even)[b-qe85ma4rbz] {
    border: solid 1px;
}

.col[b-qe85ma4rbz] {
    width: 33%;
}

.grid-row-for-button[b-qe85ma4rbz] {
    padding: 5px;
    display: grid;
    grid-template-columns: 1fr 3fr 1fr;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.grid-row-for-text[b-qe85ma4rbz] {
    padding: 5px;
    display: grid;
    grid-template-columns: 1fr 3fr 1fr;
    align-items: center;
    justify-content: center;
    text-align: center;
    flex-wrap: nowrap;
}

.currentDay[b-qe85ma4rbz] {
  margin:5px;
  box-shadow: 0 0 20px rgba(0, 0, 255, 0.7), 0 0 40px rgba(0, 0, 255, 0.7);
}


.notCurrentDay[b-qe85ma4rbz] {
    box-shadow: 10px 5px 5px grey;
}
/*
.card:hover {
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
}*/
.enableScroll[b-qe85ma4rbz] {
  overflow-x: auto;
}
/* /Pages/Booking/BookingWineComponentMini.razor.rz.scp.css */
.round-button[b-pkxqkhi9g2] {
  background-color: #007bff;
  color: white;
  border: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.mini-row[b-pkxqkhi9g2] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap:3px;
}

.spaceBetween[b-pkxqkhi9g2] {
justify-content:space-between;
}
.row[b-pkxqkhi9g2]{
  display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    width:100%
  /*  width:150px;*/
}
.parent-container[b-pkxqkhi9g2] {
  display: flex;
  flex-direction: column;
}

.child-container[b-pkxqkhi9g2] {
  display: flex;
  flex-direction: row;
  gap: 10px; /* Gap between nested rows */
}

.column[b-pkxqkhi9g2] {
display:flex;
flex-direction:column;

}
.flexRowCenter[b-pkxqkhi9g2] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-evenly;
  align-items: center; /* Vertical alignment */
  gap: 10px;
}
.small-select[b-pkxqkhi9g2] {

  width:fit-content;
}
.red[b-pkxqkhi9g2]{
/*  background-color:red;*/}
.green[b-pkxqkhi9g2]{ 
 /* background-color:green;*/

}
.yellow[b-pkxqkhi9g2]{ 
/*  background-color:yellow;*/

}
.blue[b-pkxqkhi9g2]{ /*background-color:blue;*/}
input[b-pkxqkhi9g2]{
  text-transform:uppercase;
}
textarea[b-pkxqkhi9g2] {
  text-transform: uppercase;
}
/* /Pages/Booking/BookingWineLotTankComponent.razor.rz.scp.css */
input[type="number"][b-yvok47ahh7]::-webkit-inner-spin-button,
input[type="number"][b-yvok47ahh7]::-webkit-outer-spin-button,
input[type="number"][b-yvok47ahh7]::-webkit-clear-button {
  display: none;
}

/* For Firefox */
input[type="number"][b-yvok47ahh7] {
  -moz-appearance: textfield;
}
.grid[b-yvok47ahh7] {
  display: grid;

  grid-template-columns: 2fr 1fr 4fr 2fr 1fr 4fr;
  /*grid-template-rows: minmax(40px, auto) auto;*/
  gap: 3px;
}
.grid2[b-yvok47ahh7] {
  display: grid;
  grid-template-columns: 2fr 1fr 7fr;
/*  grid-template-rows: minmax(40px, auto) auto;*/
  gap: 3px;
}
.item-to-expand[b-yvok47ahh7] {
  grid-row: span 4; /* This will make it cover 4 rows */
}
.column[b-yvok47ahh7] {
  border: 1px solid #ccc;
}
.flexRowCenter[b-yvok47ahh7] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content:space-between;
  align-items: center; /* Vertical alignment */
  gap: 10px;
}

.round-button[b-yvok47ahh7] {
  background-color: #007bff;
  color: white;
  border: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.parent-container[b-yvok47ahh7] {
  display: flex;
  flex-direction: column;
}
.child-container[b-yvok47ahh7] {
  display: flex;
  flex-direction: row;
  gap: 10px; /* Gap between nested rows */
}
select[b-yvok47ahh7] {
  padding: 5px;
  margin: 0;
/*  width: 100%;*/
}
.green[b-yvok47ahh7]{
  background-color:green;
}
.row[b-yvok47ahh7] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}


.container[b-yvok47ahh7] {
  display: flex;
  flex-direction: column;
}

.row2[b-yvok47ahh7] {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
}

.column1[b-yvok47ahh7] {
  flex-grow: 1;
  padding: 10px;
  border: 1px solid grey;
}

  .column1 .first-column[b-yvok47ahh7] {
    flex-basis: 20%; /* Adjust the width of the first column as needed */
  }

.second-row[b-yvok47ahh7] {
  display: flex;
}

  .second-row .first-column[b-yvok47ahh7] {
    flex-basis: 20%; /* Share the width of the first column in the first row */
  }

  .second-row .second-column[b-yvok47ahh7] {
    flex-grow: 5; /* Combine the width of the other 5 columns */
    border: 1px solid grey;
    padding: 10px;
  }

.containerMain[b-yvok47ahh7] {
  display: flex;
}

.columnMain[b-yvok47ahh7] {
  border: 1px solid #ccc;
}

/* Adjust the flex-basis values to control column widths */
.column-1[b-yvok47ahh7] {
  flex: 1;
  flex-basis: 15%;
}

.column-2[b-yvok47ahh7] {
  flex: 1;
  flex-basis: 10%;
}

.column-3[b-yvok47ahh7] {
  flex: 1;
  flex-basis: 30%;
}

.column-4[b-yvok47ahh7] {
  flex: 1;
  flex-basis: 5%;
}

.column-5[b-yvok47ahh7] {
  flex: 1;
  flex-basis: 25%;
}
.column-6[b-yvok47ahh7] {
  flex: 1;
  flex-basis: 20%;
}


.column-7[b-yvok47ahh7]{
  flex: 1;
  flex-basis:10%;
}
.column-8[b-yvok47ahh7] {
  flex: 1;
  flex-basis: 10%;
}

.column-9[b-yvok47ahh7] {
  flex: 1;
  flex-basis: 80%;
  white-space: nowrap;
 overflow: auto;
/*  text-overflow: ellipsis;
*/}

table[b-yvok47ahh7] {
  width: 100%; /* Set the table width to 100% */
}

th[b-yvok47ahh7] {
  width: 20%; /* Set the width of th elements */
  text-align: left; /* Align th content to the left */
  background-color: #f2f2f2;
  border-bottom: 1px solid #ccc;
  padding: 8px;
}

td[b-yvok47ahh7] {
  padding: 8px;
  border-bottom: 1px solid #ccc;
}

.booking-component-container[b-yvok47ahh7] {
  max-width: 100%; /* Set the maximum width to 100% of the parent <td> */
  overflow: hidden; /* Prevent the component from overflowing the container */
  border-bottom: 1px solid grey;
  margin-top:5px;
}
/* /Pages/Booking/tankmini.razor.rz.scp.css */
body[b-fsej5bnbm7] {
}
/* /Pages/Bottling/AppointmentFormPanel.razor.rz.scp.css */

main-container[b-omlx4y9zgi]{
display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 5px;
}
select[b-omlx4y9zgi] {
  padding: 2px;
}

#ContactBusinesses[b-omlx4y9zgi] {
  padding: 5px;
}

input[b-omlx4y9zgi], label[b-omlx4y9zgi], select[b-omlx4y9zgi] {
  display: block;
}
.headerClass[b-omlx4y9zgi] {
  border-bottom: 1px solid gray;
}
.flex-containerModal[b-omlx4y9zgi] {
  display: flex;
  flex-wrap: wrap;
  background-color: white;
/*  width: 940px;
*/

flex-direction: row;
  align-content: flex-start;
  gap: 3px;
  justify-content:flex-end;
}

  .flex-containerModal > div[b-omlx4y9zgi] {
    background-color: white;
    width: 233px;
    margin: auto;
    text-align: left;
  }

.flex-tableCol[b-omlx4y9zgi] {
  display: flex;
  flex-direction: column;
}

.input-width[b-omlx4y9zgi] {
  width: 150px;
}

.input-width2[b-omlx4y9zgi] {
  width: 100%;
}

.bottlingTag[b-omlx4y9zgi] {
  display: flex;
  flex-direction: row;
  padding: 2px;
}

.bottlingTagInput[b-omlx4y9zgi] {
  flex: 2;
}

.event[b-omlx4y9zgi] {
  border-radius: 5px;
  color: white;
  font-size: 12px;
  max-height: 55px;
  overflow: hidden;
  padding: 3px;
  max-width: 140px;
}

.placeHolder[b-omlx4y9zgi] {
  border-radius: 5px;
  color: white;
  font-size: 12px;
  max-height: 55px;
  overflow: hidden;
  padding: 3px;
  max-width: 140px;
}

.end[b-omlx4y9zgi] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 5px;
  border-width: thick;
  border-color: none;
  text-align: center;
  line-height: 45px;
}

.checkbox-label[b-omlx4y9zgi] {
  display: flex;
  align-items: center;
}

  .checkbox-label input[b-omlx4y9zgi] {
    margin-right: 5px;
  }

  .checkbox-label label[b-omlx4y9zgi] {
    margin: 0;
  }


.buttonEnd[b-omlx4y9zgi] {
  display: flex;
  direction: row;
  justify-content: end;
}

.headerBegin[b-omlx4y9zgi] {
  display: flex;
  direction: row;
  justify-content: start;
  /*align-items: center;*/
  gap: 5px;
}
/* /Pages/Bottling/AppointmentModal.razor.rz.scp.css */

main-container[b-b8fywfrtcn]{
display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 5px;
}
select[b-b8fywfrtcn] {
  padding: 2px;
}

#ContactBusinesses[b-b8fywfrtcn] {
  padding: 5px;
}

input[b-b8fywfrtcn], label[b-b8fywfrtcn], select[b-b8fywfrtcn] {
  display: block;
}
.headerClass[b-b8fywfrtcn] {
  border-bottom: 1px solid gray;
}
.flex-containerModal[b-b8fywfrtcn] {
  display: flex;
  flex-wrap: wrap;
  background-color: white;
/*  width: 940px;
*/ 

flex-direction: row;
  align-content: flex-start;
  gap: 3px;
  justify-content:flex-end;
}

  .flex-containerModal > div[b-b8fywfrtcn] {
    background-color: white;
    width: 233px;
    margin: auto;
    text-align: left;
  }

.flex-tableCol[b-b8fywfrtcn] {
  display: flex;
  flex-direction: column;
}

.input-width[b-b8fywfrtcn] {
  width: 150px;
}

.input-width2[b-b8fywfrtcn] {
  width: 100%;
}

.bottlingTag[b-b8fywfrtcn] {
  display: flex;
  flex-direction: row;
  padding: 2px;
}

.bottlingTagInput[b-b8fywfrtcn] {
  flex: 2;
}

.event[b-b8fywfrtcn] {
  border-radius: 5px;
  color: white;
  font-size: 12px;
  max-height: 55px;
  overflow: hidden;
  padding: 3px;
  max-width: 140px;
}

.placeHolder[b-b8fywfrtcn] {
  border-radius: 5px;
  color: white;
  font-size: 12px;
  max-height: 55px;
  overflow: hidden;
  padding: 3px;
  max-width: 140px;
}

.end[b-b8fywfrtcn] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 5px;
  border-width: thick;
  border-color: none;
  text-align: center;
  line-height: 45px;
}

.checkbox-label[b-b8fywfrtcn] {
  display: flex;
  align-items: center;
}

  .checkbox-label input[b-b8fywfrtcn] {
    margin-right: 5px;
  }

  .checkbox-label label[b-b8fywfrtcn] {
    margin: 0;
  }


.buttonEnd[b-b8fywfrtcn] {
  display: flex;
  direction: row;
  justify-content: end;
}

.headerBegin[b-b8fywfrtcn] {
  display: flex;
  direction: row;
  justify-content: start;
  /*align-items: center;*/
  gap: 5px;
}
/* /Pages/Bottling/BottlingHistory.razor.rz.scp.css */
/* Container - full height, no scroll */
.history-container[b-5xldy2i94a] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

/* Sticky Toolbar - pinned via flex-shrink:0 (overflow:hidden on parent blocks position:sticky) */
.sticky-toolbar[b-5xldy2i94a] {
    flex-shrink: 0;
    background: #fff;
    border-bottom: 1px solid #dee2e6;
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    z-index: 20;
}

.toolbar-row[b-5xldy2i94a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.toolbar-header[b-5xldy2i94a] {
    padding-bottom: 0.25rem;
    border-bottom: 1px solid #e9ecef;
}

.toolbar-title[b-5xldy2i94a] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #333;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.record-count[b-5xldy2i94a] {
    background: #6c757d;
    color: white;
    padding: 0.1rem 0.5rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
}

/* Search Box */
.search-box[b-5xldy2i94a] {
    position: relative;
    flex: 1;
    min-width: 150px;
    max-width: 250px;
}

.search-box i[b-5xldy2i94a] {
    position: absolute;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    font-size: 0.8rem;
}

.search-box input[b-5xldy2i94a] {
    padding-left: 28px;
    padding-right: 28px;
    font-size: 0.8rem;
}

.clear-btn[b-5xldy2i94a] {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
    padding: 2px;
    font-size: 0.7rem;
}

.clear-btn:hover[b-5xldy2i94a] {
    color: #dc3545;
}

.toolbar-actions[b-5xldy2i94a] {
    display: flex;
    gap: 0.35rem;
    margin-left: auto;
}

/* Filter selects */
.toolbar-row .form-select[b-5xldy2i94a] {
    width: auto;
    min-width: 100px;
    font-size: 0.8rem;
    padding: 0.25rem 1.75rem 0.25rem 0.5rem;
}

.jump-select[b-5xldy2i94a] {
    min-width: 120px;
    max-width: 150px;
}

.filter-divider[b-5xldy2i94a] {
    width: 1px;
    height: 20px;
    background: #dee2e6;
    margin: 0 0.25rem;
}

/* Date Presets Row */
.toolbar-dates[b-5xldy2i94a] {
    background: #f8f9fa;
    padding: 0.35rem 0.5rem;
    margin: 0 -0.5rem;
    border-radius: 0;
}

.date-presets[b-5xldy2i94a] {
    display: flex;
    gap: 0.25rem;
}

.date-input[b-5xldy2i94a] {
    width: 120px;
    font-size: 0.75rem;
    padding: 0.2rem 0.35rem;
}

.date-separator[b-5xldy2i94a] {
    color: #6c757d;
    font-size: 0.8rem;
}

/* Extra small buttons */
.btn-xs[b-5xldy2i94a] {
    padding: 0.15rem 0.4rem;
    font-size: 0.7rem;
    line-height: 1.3;
    border-radius: 3px;
}

/* Recent clients */
.recent-label[b-5xldy2i94a] {
    font-size: 0.75rem;
    color: #0366d6;
    font-weight: 500;
}

/* Selection Bar */
.selection-bar[b-5xldy2i94a] {
    background: #e3f2fd;
    padding: 0.35rem 0.5rem;
    margin: 0 -0.5rem;
    border-radius: 0;
    font-size: 0.8rem;
    color: #1565c0;
}

.selected-cases[b-5xldy2i94a] {
    color: #2e7d32;
    font-weight: 500;
    margin-left: auto;
    margin-right: 0.5rem;
}

/* Grid Wrapper - scrollable */
.grid-wrapper[b-5xldy2i94a] {
    flex: 1;
    overflow: auto;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    margin: 0.5rem;
}

/* Loading & Empty States */
.loading-overlay[b-5xldy2i94a] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3rem;
    background: #f8f9fa;
    margin: 0.5rem;
    border-radius: 4px;
}

.empty-state[b-5xldy2i94a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    background: #f8f9fa;
    border-radius: 4px;
    color: #6c757d;
    margin: 0.5rem;
}

.empty-state i[b-5xldy2i94a] {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
}

/* Group styles */
.group-section[b-5xldy2i94a] {
    border-bottom: 1px solid #dee2e6;
}

.group-section:last-child[b-5xldy2i94a] {
    border-bottom: none;
}

.group-header[b-5xldy2i94a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
    cursor: pointer;
    user-select: none;
    font-size: 0.9rem;
}

.group-header:hover[b-5xldy2i94a] {
    background: linear-gradient(135deg, #dee2e6 0%, #ced4da 100%);
}

.group-header i[b-5xldy2i94a] {
    color: #495057;
    font-size: 0.8rem;
}

.group-name[b-5xldy2i94a] {
    font-weight: 600;
    color: #333;
}

.group-stats[b-5xldy2i94a] {
    margin-left: auto;
    color: #6c757d;
    font-size: 0.8rem;
}

.group-loading[b-5xldy2i94a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    color: #6c757d;
    font-style: italic;
    font-size: 0.85rem;
}

.group-empty[b-5xldy2i94a] {
    padding: 0.75rem;
    color: #6c757d;
    font-style: italic;
    text-align: center;
    font-size: 0.85rem;
}

/* Data Table */
.history-grid[b-5xldy2i94a] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.85rem;
}

.history-grid th[b-5xldy2i94a] {
    position: sticky;
    top: 0;
    background: linear-gradient(135deg, #0366d6 0%, #0056b3 100%);
    color: white;
    font-weight: 600;
    padding: 0.5rem 0.4rem;
    text-align: left;
    white-space: nowrap;
    z-index: 10;
    font-size: 0.8rem;
}

.history-grid th.sortable[b-5xldy2i94a] {
    cursor: pointer;
    user-select: none;
}

.history-grid th.sortable:hover[b-5xldy2i94a] {
    background: linear-gradient(135deg, #0056b3 0%, #004494 100%);
}

.history-grid th.sort-desc i[b-5xldy2i94a],
.history-grid th.sort-asc i[b-5xldy2i94a] {
    color: #ffc107;
}

.history-grid th.sort-desc i[b-5xldy2i94a]::before {
    content: "\F128";
}

.history-grid th.sort-asc i[b-5xldy2i94a]::before {
    content: "\F12B";
}

.history-grid td[b-5xldy2i94a] {
    padding: 0.35rem 0.4rem;
    border-bottom: 1px solid #dee2e6;
    vertical-align: top;
}

.history-grid tbody tr:hover[b-5xldy2i94a] {
    background: #f8f9fa;
}

.history-grid tbody tr.row-completed[b-5xldy2i94a] {
    background: #d4edda;
}

.history-grid tbody tr.row-canceled[b-5xldy2i94a] {
    background: #f8d7da;
    opacity: 0.7;
}

/* Clickable row */
.clickable-row[b-5xldy2i94a] {
    cursor: pointer;
}

.clickable-row:hover[b-5xldy2i94a] {
    background: #e9f3ff !important;
}

/* Column widths */
.col-check[b-5xldy2i94a] { width: 32px; text-align: center; }
.col-date[b-5xldy2i94a] { width: 110px; }
.col-lot[b-5xldy2i94a] { width: 110px; }
.col-wine[b-5xldy2i94a] { width: 90px; }
.col-client[b-5xldy2i94a] { width: 120px; }
.col-brand[b-5xldy2i94a] { width: 120px; }
.col-cases[b-5xldy2i94a] { width: 50px; text-align: right; }
.col-actual[b-5xldy2i94a] { width: 70px; }
.col-time[b-5xldy2i94a] { width: 70px; }
.col-signoff[b-5xldy2i94a] { width: 60px; text-align: center; }
.col-actions[b-5xldy2i94a] { width: 60px; text-align: center; }

/* Cell layouts */
.date-cell[b-5xldy2i94a],
.lot-cell[b-5xldy2i94a],
.wine-cell[b-5xldy2i94a],
.client-cell[b-5xldy2i94a],
.brand-cell[b-5xldy2i94a],
.actual-cell[b-5xldy2i94a],
.time-cell[b-5xldy2i94a] {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.date-value[b-5xldy2i94a],
.client-name[b-5xldy2i94a],
.brand-name[b-5xldy2i94a] {
    font-weight: 600;
    color: #333;
    font-size: 0.8rem;
}

.line-name[b-5xldy2i94a],
.tag-date[b-5xldy2i94a],
.subava[b-5xldy2i94a],
.client-code[b-5xldy2i94a],
.bottle-info[b-5xldy2i94a],
.order-num[b-5xldy2i94a],
.sequence[b-5xldy2i94a],
.actual-gallons[b-5xldy2i94a],
.cases-per-hour[b-5xldy2i94a] {
    font-size: 0.7rem;
    color: #6c757d;
}

.lot-link[b-5xldy2i94a] {
    padding: 0;
    font-size: 0.8rem;
    font-weight: 600;
    text-align: left;
}

/* Client link */
.client-link[b-5xldy2i94a] {
    padding: 0;
    font-size: inherit;
    font-weight: 600;
    color: #0366d6;
    text-align: left;
    text-decoration: none;
}

.client-link:hover[b-5xldy2i94a] {
    text-decoration: underline;
    color: #0056b3;
}

.vintage[b-5xldy2i94a] {
    font-weight: 600;
    font-size: 0.8rem;
}

.varietal[b-5xldy2i94a] {
    color: #0366d6;
    font-weight: 500;
    font-size: 0.75rem;
}

.estimated-cases[b-5xldy2i94a] {
    font-weight: 600;
    font-size: 0.85rem;
}

.actual-cases[b-5xldy2i94a] {
    font-weight: 600;
    color: #28a745;
    font-size: 0.8rem;
}

.bottling-time[b-5xldy2i94a] {
    font-weight: 600;
    color: #6f42c1;
    font-size: 0.8rem;
}

/* Status select */
.status-select[b-5xldy2i94a] {
    font-size: 0.65rem;
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
    border: 1px solid #dee2e6;
    background: #fff;
    margin-top: 2px;
}

.status-select.status-completed[b-5xldy2i94a] {
    background: #d4edda;
    border-color: #28a745;
    color: #155724;
}

.status-select.status-inprogress[b-5xldy2i94a] {
    background: #fff3cd;
    border-color: #ffc107;
    color: #856404;
}

.status-select.status-scheduled[b-5xldy2i94a] {
    background: #cce5ff;
    border-color: #0366d6;
    color: #004085;
}

.status-select.status-postponed[b-5xldy2i94a] {
    background: #e2e3e5;
    border-color: #6c757d;
    color: #383d41;
}

.status-select.status-canceled[b-5xldy2i94a] {
    background: #f8d7da;
    border-color: #dc3545;
    color: #721c24;
}

/* Signoff cell */
.signoff-cell[b-5xldy2i94a] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    font-size: 0.8rem;
}

.signoff-count[b-5xldy2i94a] {
    font-weight: 600;
    color: #6c757d;
}

.signoff-cell.complete .signoff-count[b-5xldy2i94a] {
    color: #28a745;
}

/* Action buttons */
.action-buttons[b-5xldy2i94a] {
    display: flex;
    gap: 0.15rem;
    justify-content: center;
}

.action-buttons .btn[b-5xldy2i94a] {
    padding: 0.15rem 0.35rem;
    font-size: 0.9rem;
    position: relative;
}

.doc-badge[b-5xldy2i94a] {
    position: absolute;
    top: -3px;
    right: -3px;
    background: #dc3545;
    color: white;
    font-size: 0.55rem;
    padding: 1px 4px;
    border-radius: 8px;
    font-weight: 600;
}

/* Truncation Warning */
.truncation-warning[b-5xldy2i94a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: #fff3cd;
    border-bottom: 1px solid #ffc107;
    color: #856404;
    font-size: 0.85rem;
}

.truncation-warning i[b-5xldy2i94a] {
    color: #ffc107;
}

/* Pagination Bar */
.pagination-bar[b-5xldy2i94a] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 0.75rem;
    background: #f8f9fa;
    border-top: 1px solid #dee2e6;
    position: sticky;
    bottom: 0;
}

.page-info[b-5xldy2i94a] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

/* Responsive */
@media (max-width: 1400px) {
    .col-wine[b-5xldy2i94a],
    .col-time[b-5xldy2i94a] {
        display: none;
    }
}

@media (max-width: 1200px) {
    .col-signoff[b-5xldy2i94a] {
        display: none;
    }
}

@media (max-width: 992px) {
    .toolbar-row[b-5xldy2i94a] {
        flex-wrap: wrap;
    }

    .search-box[b-5xldy2i94a] {
        max-width: none;
        flex: 1 1 100%;
        order: -1;
    }

    .toolbar-dates[b-5xldy2i94a] {
        flex-wrap: wrap;
    }

    .date-input[b-5xldy2i94a] {
        width: 100px;
    }
}
/* /Pages/Bottling/BottlingPdfUploadModal.razor.rz.scp.css */
/* /Pages/Bottling/BottlingSendEmailBasic.razor.rz.scp.css */
/* Flex container for the items */
.flex-container[b-j0mr4fk7yn] {
    display: flex;
    flex-wrap: wrap;
    max-height:60vh;
    overflow-y:auto;
}

/* Style for each row */
.flex-row[b-j0mr4fk7yn] {
    width: 100%; /* Each row takes the full width of the container */
}

/* Style for each item */
.flex-item[b-j0mr4fk7yn] {
    display: flex;
    align-items: center;
    padding: 5px; /* Add some padding for spacing */
}
.leftAlign[b-j0mr4fk7yn] {
    align-items: flex-start;
}

.allowScroll[b-j0mr4fk7yn] {
    max-height: 200px;
    overflow-y: auto;
    width: 100%;
}
    /* Style for the labels */
    .flex-item label[b-j0mr4fk7yn] {
        flex-basis: 20%; /* The label takes 30% of the width */
        padding-right: 10px; /* Add some space between label and input */
        text-align: right; /* Align the labels to the right */
    }
.flex-item .placeHolder[b-j0mr4fk7yn] {
    flex-basis: 20%; /* The label takes 30% of the width */
    padding-right: 10px; /* Add some space between label and input */
    text-align: right; /* Align the labels to the right */
}

    /* Style for the inputs */
    .flex-item input[b-j0mr4fk7yn] {
        flex: 1; /* The input takes the remaining space */
        padding: 5px; /* Add some padding for styling */
        border: 1px solid #ccc; /* Add a border for visual appeal */
    }
    textarea[b-j0mr4fk7yn]{
        min-height:120px;
    }
.bottomButtons[b-j0mr4fk7yn] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 5px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 10px;
}

.icon-button[b-j0mr4fk7yn] {
    border: none;
    background-color: transparent;
    cursor: pointer; /* Change cursor to a pointer on hover */
}

    .icon-button:focus[b-j0mr4fk7yn] {
        outline: none; /* Remove focus outline on click (optional) */
    }
/* /Pages/Bottling/BottlingWineComposition.razor.rz.scp.css */
.wineLotButton[b-kqujmdu176] {
    position: relative;
    background-color: white;
    border: none;
    margin: 0px;
    padding: 0px;
}

.row[b-kqujmdu176] {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 3px;
  
}

.row-flex[b-kqujmdu176] {
    display: flex;
    justify-content: space-between;
}
.column-flex[b-kqujmdu176] {
    flex-grow: 1;
    flex-basis: 0;
    padding: 10px;
    border: 1px solid #000;
}
    .column-flex select[b-kqujmdu176] {
        width: 100%;
        max-width: none;
    }

.button-container[b-kqujmdu176] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.add-button[b-kqujmdu176] {
    background-color: blue;
    color: white;
    border: none;
    padding: 5px;
    width: 30px;
    height: 30px;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    margin-left: 5px; /* Add spacing between the select element and the button */
}

.header-row[b-kqujmdu176] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;

}

.col[b-kqujmdu176] {
    display: flex;
    justify-content: space-between;
    align-items: center;

}
.colEnd[b-kqujmdu176] {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

select[b-kqujmdu176] {
    width: 100%;
    max-width: 60%;
    margin-right: 10px;
}

input[type=number][b-kqujmdu176] {
    width: 100%;
    max-width: 20%;
    margin-right: 10px;
}
label[b-kqujmdu176]{
    font-weight:bold;
}
.saveButtonRow[b-kqujmdu176] {
    margin: 4px;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    gap:5px;
}


.container-BottlingWineComposition[b-kqujmdu176]{
    min-width:700px;
    max-height:700px;
    overflow-y:auto;
    overflow-x:hidden;
}
.containerBox[b-kqujmdu176] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
}

.containerBoxSummary[b-kqujmdu176] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 5px;
}
button[b-kqujmdu176]{
    white-space:nowrap;
}

.subAVA[b-kqujmdu176]{
    margin-left:30px;
}
.underline-col[b-kqujmdu176]
{
    border-bottom:solid 3px grey;
}

.underline-soft[b-kqujmdu176] {
    border-bottom: solid 1px grey;
    max-height: 250px;
    overflow:auto;
    overflow-x:hidden;
}
.add-margin[b-kqujmdu176]
{
    margin-top:5px;
    margin-bottom:5px;
}
.no-format[b-kqujmdu176]{
    text-decoration:none;
}
.empty-button[b-kqujmdu176] {
    display: inline-block;
    width: 125px; /* Adjust this value based on the width of your button */
    height: 24px; /* Adjust this value based on the height of your button */
}
.summary-box[b-kqujmdu176]{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;

    min-height:100px;
    max-height:500px;
    overflow-y:auto;
   
}
    .summary-box > div[b-kqujmdu176] {
        flex: 1;
    }

/*    .summary-box > div:nth-child(1) {
        flex: 2;
    }

    .summary-box > div:nth-child(2) {
        flex: 1;
    }*/
input[type="number"][b-kqujmdu176] {
    min-width: 150px;  
}
/* /Pages/Bottling/BottlingWineCompositionModal.razor.rz.scp.css */
/* /Pages/Bottling/BottlingWineLotComponent.razor.rz.scp.css */
.bottlingWineComponentWrapper[b-d5kinld2ea]{
    border: 1px solid lightgrey;
    padding: 0px;
    max-width: 400px;
    /*box-shadow: 0 0 10px 5px rgba(255, 149, 0, 0.7);*/ /* Even more intense amber shadow */
    z-index: 1;
}

.colaOrLabelItem[b-d5kinld2ea] {
    border: 1px solid lightgrey;
    padding: 0px;
}

.colaOrLabelItem-alarm[b-d5kinld2ea] {
    border: 1px solid lightgrey;
    padding: 0px;
    box-shadow: 0 0 10px rgba(255, 0, 0, 0.7); /* Red shadow with increased intensity */
}

.colaOrLabelItem-accepted[b-d5kinld2ea] {
    border: 1px solid lightgrey;
    padding: 0px;
    box-shadow: 0 0 10px rgba(0, 255, 0, 0.7); /* Increased intensity with higher RGB values */
}

.wineLotButton[b-d5kinld2ea] {
    position: relative;
    background-color: white;
    border: none;
    margin: 0px;
    padding: 0px;
}
    .wineLotButton:hover[b-d5kinld2ea] {
        color: blue; /* Change the color to blue */
        text-decoration: underline; /* Add underline */
    }
.containerBox[b-d5kinld2ea] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items:flex-end;
    justify-content: space-between;
    gap: 5px;
}

.cardHeading[b-d5kinld2ea] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}

button[b-d5kinld2ea] {
    white-space: nowrap;
}
.containerBoxSummary[b-d5kinld2ea] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 5px;
}
.row-flex[b-d5kinld2ea] {
    display: flex;
    justify-content: space-between;
    border-bottom: solid 3px grey;
}

.container-BottlingWineComposition[b-d5kinld2ea] {
    min-width: 700px;
    max-height: 700px;
    overflow-y: auto;
    overflow-x: hidden;
  
}
.column-flex[b-d5kinld2ea] {
    flex-grow: 1;
    flex-basis: 0;
    padding: 10px;
    border: 1px solid #000;
}

    .column-flex select[b-d5kinld2ea] {
        width: 100%;
        max-width: none;
    }
/* /Pages/Bottling/DailyFlow/Components/BolScanPanel.razor.rz.scp.css */
.bol-scan-panel[b-g2y448fnlh] {
    padding: 1rem;
}

/* Upload area */
.upload-section[b-g2y448fnlh] {
    display: flex;
    flex-direction: column;
}

.upload-area[b-g2y448fnlh] {
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    padding: 1.5rem;
    text-align: center;
    transition: border-color 0.2s, background-color 0.2s;
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.upload-area:hover[b-g2y448fnlh] {
    border-color: #0d6efd;
    background-color: #f8f9fa;
}

.upload-area.has-file[b-g2y448fnlh] {
    border-color: #198754;
    background-color: #d1e7dd;
    text-align: left;
    display: block;
    padding: 0.75rem 1rem;
}

.upload-prompt[b-g2y448fnlh] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* File list */
.file-list[b-g2y448fnlh] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.file-item[b-g2y448fnlh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0;
}

.file-name[b-g2y448fnlh] {
    font-weight: 500;
    font-size: 0.875rem;
}

.file-size[b-g2y448fnlh] {
    color: #6c757d;
    font-size: 0.8rem;
}

/* Scan actions */
.scan-actions[b-g2y448fnlh] {
    display: flex;
    gap: 0.5rem;
}

/* Processing spinner */
.scan-processing[b-g2y448fnlh] {
    padding: 3rem 1rem;
}

/* Results */
.scan-results[b-g2y448fnlh] {
    display: flex;
    flex-direction: column;
}

.header-fields[b-g2y448fnlh] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
    padding: 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.field-row[b-g2y448fnlh] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.field-row label[b-g2y448fnlh] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
}

/* Line items table */
.line-items-table[b-g2y448fnlh] {
    max-height: 45vh;
    overflow-y: auto;
}

.line-items-table table[b-g2y448fnlh] {
    font-size: 0.85rem;
    margin-bottom: 0;
}

.line-items-table th[b-g2y448fnlh] {
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
    font-size: 0.75rem;
    text-transform: uppercase;
    color: #6c757d;
}

.line-items-table td[b-g2y448fnlh] {
    vertical-align: middle;
}

.line-items-table .form-control-sm[b-g2y448fnlh],
.line-items-table .form-select-sm[b-g2y448fnlh] {
    font-size: 0.8rem;
    padding: 0.15rem 0.35rem;
}

[b-g2y448fnlh] tr.low-confidence {
    background-color: #fff3cd;
}

.label-detail-row td[b-g2y448fnlh] {
    padding-top: 0;
    border-top: none;
}

.label-quantities[b-g2y448fnlh] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    padding-left: 0.5rem;
}

/* Review actions */
.review-actions[b-g2y448fnlh] {
    padding-top: 0.75rem;
    border-top: 1px solid #dee2e6;
}

/* Raw JSON */
.raw-json-content[b-g2y448fnlh] {
    max-height: 200px;
    overflow: auto;
    font-size: 0.7rem;
    background: #f8f9fa;
    padding: 0.5rem;
    border-radius: 4px;
}

/* Supplier match */
.supplier-match-row[b-g2y448fnlh] {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-wrap: wrap;
    padding: 0.25rem 0;
    font-size: 0.8rem;
}

/* Responsive */
@media (max-width: 576px) {
    .header-fields[b-g2y448fnlh] {
        grid-template-columns: 1fr;
    }

    .line-items-table[b-g2y448fnlh] {
        max-height: 35vh;
    }
}
/* /Pages/Bottling/DailyFlow/Components/BottlingCompositionSnipComponent.razor.rz.scp.css */
/* Composition Component Styles - Matching DailyFlow components */

.composition-wrapper[b-fyt54fdi0e] {
    background: #fff;
    border-radius: 4px;
    padding: 0.5rem;
}

/* Header */
.composition-header[b-fyt54fdi0e] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}

.header-title[b-fyt54fdi0e] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.header-title i[b-fyt54fdi0e] {
    font-size: 1rem;
    color: #20c997;
}

.lot-badge[b-fyt54fdi0e] {
    font-size: 0.7rem;
    font-weight: 500;
    background: #d4edda;
    color: #155724;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    margin-left: 0.25rem;
}

.header-actions[b-fyt54fdi0e] {
    display: flex;
    gap: 0.35rem;
}

.header-actions button[b-fyt54fdi0e] {
    font-size: 0.75rem !important;
    padding: 0.25rem 0.5rem !important;
}

.header-actions .btn-text[b-fyt54fdi0e] {
    margin-left: 0.25rem;
}

/* Content */
.composition-content[b-fyt54fdi0e] {
    padding: 0.25rem 0;
}

/* Lot Section */
.lot-section[b-fyt54fdi0e] {
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}

.lot-row[b-fyt54fdi0e] {
    display: flex;
    align-items: flex-end;
    gap: 0.5rem;
}

.lot-select-group[b-fyt54fdi0e] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.lot-select-group label[b-fyt54fdi0e] {
    font-size: 0.7rem;
    font-weight: 500;
    color: #6c757d;
}

.lot-controls[b-fyt54fdi0e] {
    display: flex;
    gap: 0.35rem;
    align-items: center;
}

.lot-controls select[b-fyt54fdi0e] {
    flex: 1;
    max-width: 300px;
    font-size: 0.8rem !important;
}

.lot-controls button[b-fyt54fdi0e] {
    font-size: 0.75rem !important;
    padding: 0.25rem 0.5rem !important;
}

/* Image Section */
.image-section[b-fyt54fdi0e] {
    margin-bottom: 0.5rem;
}

.upload-row[b-fyt54fdi0e] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    margin-bottom: 0.5rem;
}

.upload-row label[b-fyt54fdi0e] {
    font-size: 0.7rem;
    font-weight: 500;
    color: #6c757d;
}

.upload-controls[b-fyt54fdi0e] {
    display: flex;
    gap: 0.35rem;
    align-items: center;
}

.upload-controls input[type="file"][b-fyt54fdi0e] {
    flex: 1;
    max-width: 300px;
    font-size: 0.75rem !important;
}

.upload-status[b-fyt54fdi0e] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
}

.upload-status.success[b-fyt54fdi0e] {
    background: #d4edda;
    color: #155724;
}

.upload-status i[b-fyt54fdi0e] {
    font-size: 0.85rem;
}

/* Image Preview */
.image-preview[b-fyt54fdi0e] {
    position: relative;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    overflow: hidden;
    cursor: pointer;
    max-width: 450px;
    display: inline-block;
}

.image-preview img[b-fyt54fdi0e] {
    max-width: 100%;
    height: auto;
    display: block;
    transition: opacity 0.2s ease;
}

.image-preview:hover img[b-fyt54fdi0e] {
    opacity: 0.85;
}

.image-overlay[b-fyt54fdi0e] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    color: white;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.image-preview:hover .image-overlay[b-fyt54fdi0e] {
    opacity: 1;
}

.image-overlay i[b-fyt54fdi0e] {
    font-size: 1.5rem;
    margin-bottom: 0.25rem;
}

.image-overlay span[b-fyt54fdi0e] {
    font-size: 0.75rem;
}

/* Responsive */
@media (max-width: 576px) {
    .header-actions .btn-text[b-fyt54fdi0e] {
        display: none;
    }

    .lot-controls[b-fyt54fdi0e] {
        flex-wrap: wrap;
    }

    .lot-controls select[b-fyt54fdi0e] {
        width: 100%;
        max-width: none;
    }

    .upload-controls[b-fyt54fdi0e] {
        flex-wrap: wrap;
    }

    .upload-controls input[type="file"][b-fyt54fdi0e] {
        width: 100%;
        max-width: none;
    }
}
/* /Pages/Bottling/DailyFlow/Components/BottlingDatesComponent.razor.rz.scp.css */
/* Bottling Dates Component Styles */

.dates-wrapper[b-few2cvr38r] {
    background: #fff;
    border-radius: 4px;
    padding: 0.5rem;
    border-top: 2px solid #dee2e6;
}

/* Header */
.dates-header[b-few2cvr38r] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}

.header-title[b-few2cvr38r] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.header-title i[b-few2cvr38r] {
    font-size: 1rem;
    color: #6f42c1;
}

.header-actions[b-few2cvr38r] {
    display: flex;
    gap: 0.35rem;
}

.header-actions button[b-few2cvr38r] {
    font-size: 0.75rem !important;
    padding: 0.25rem 0.5rem !important;
}

.header-actions .btn-text[b-few2cvr38r] {
    margin-left: 0.25rem;
}

/* Date Tabs */
.date-tabs[b-few2cvr38r] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.5rem;
}

.date-tab[b-few2cvr38r] {
    position: relative;
    padding: 0.35rem 0.6rem;
    padding-right: 1.5rem;
    border-radius: 4px;
    border: 1px solid #dee2e6;
    background: #f8f9fa;
    color: #495057;
    font-size: 0.75rem;
    cursor: pointer;
    transition: all 0.15s ease;
}

.date-tab:hover[b-few2cvr38r] {
    background: #e9ecef;
    border-color: #adb5bd;
}

.date-tab.active[b-few2cvr38r] {
    background: #0d6efd;
    color: white;
    border-color: #0d6efd;
}

.date-text[b-few2cvr38r] {
    white-space: nowrap;
}

.sequence-badge[b-few2cvr38r] {
    position: absolute;
    top: -6px;
    right: -6px;
    background: #0d6efd;
    color: white;
    border: 1px solid white;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

.date-tab.active .sequence-badge[b-few2cvr38r] {
    background: white;
    color: #0d6efd;
    border-color: #0d6efd;
}

/* Product Code Badge */
.product-code-badge[b-few2cvr38r] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: #e7f3ff;
    color: #0d6efd;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.product-code-badge i[b-few2cvr38r] {
    font-size: 0.85rem;
}

/* Form Grid */
.date-form[b-few2cvr38r] {
    margin-top: 0.5rem;
}

.form-grid[b-few2cvr38r] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 0.5rem 0.75rem;
    margin-bottom: 0.75rem;
}

.form-field[b-few2cvr38r] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.form-field.wide[b-few2cvr38r] {
    grid-column: span 2;
}

.form-field label[b-few2cvr38r] {
    font-size: 0.7rem;
    font-weight: 500;
    color: #6c757d;
}

.form-field input[b-few2cvr38r],
.form-field select[b-few2cvr38r],
.form-field textarea[b-few2cvr38r] {
    font-size: 0.8rem !important;
}

.form-field textarea[b-few2cvr38r] {
    min-height: 50px;
    resize: vertical;
}

/* Closure with Snow Dropper Indicator */
.closure-with-snow[b-few2cvr38r] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.snow-indicator[b-few2cvr38r] {
    font-size: 1.1rem;
    color: #00bcd4;
    text-shadow: 0 0 8px rgba(0, 188, 212, 0.6);
}

/* Bottling Tag Input */
.bottling-tag-input[b-few2cvr38r] {
    width: 160px;
}

/* Action Toolbar */
.action-toolbar[b-few2cvr38r] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px solid #eee;
    align-items: flex-start;
}

.action-group[b-few2cvr38r] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    border: 1px solid #eee;
}

.action-group.save[b-few2cvr38r] {
    margin-left: auto;
    background: #e7f3ff;
    border-color: #cce5ff;
}

.group-label[b-few2cvr38r] {
    font-size: 0.65rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    margin-right: 0.25rem;
}

.action-group button[b-few2cvr38r] {
    font-size: 0.75rem !important;
    padding: 0.2rem 0.4rem !important;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.action-group .btn-text[b-few2cvr38r] {
    white-space: nowrap;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .form-grid[b-few2cvr38r] {
        grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    }

    /* Keep toolbar horizontal, just wrap and compact */
    .action-toolbar[b-few2cvr38r] {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0.35rem;
    }

    /* Remove group styling - just show buttons inline */
    .action-group[b-few2cvr38r] {
        background: none;
        border: none;
        padding: 0;
        gap: 0.25rem;
    }

    .action-group.save[b-few2cvr38r] {
        margin-left: auto;
    }

    /* Hide group labels on mobile */
    .group-label[b-few2cvr38r] {
        display: none;
    }

    /* Hide button text, show only icons */
    .btn-text[b-few2cvr38r] {
        display: none;
    }

    /* Hide production summary - case count is in Cases button */
    .action-group.production-summary[b-few2cvr38r] {
        display: none;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .form-grid[b-few2cvr38r] {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* Production Summary Styles */
.action-group.production-summary[b-few2cvr38r] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 0.15rem 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.7rem;
    min-width: fit-content;
}

.production-summary .group-label[b-few2cvr38r] {
    margin-right: 0.35rem;
    border-right: 1px solid #ced4da;
    padding-right: 0.35rem;
}

.summary-stat[b-few2cvr38r] {
    display: flex;
    align-items: center;
    gap: 0.15rem;
}

.stat-label[b-few2cvr38r] {
    color: #6c757d;
    font-weight: 500;
}

.stat-value[b-few2cvr38r] {
    color: #212529;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.stat-sep[b-few2cvr38r] {
    color: #adb5bd;
    font-weight: 400;
}

.summary-divider[b-few2cvr38r] {
    color: #ced4da;
    font-size: 0.5rem;
    margin: 0 0.1rem;
}

/* Responsive: compact on smaller screens */
@media (max-width: 1200px) {
    .action-group.production-summary .stat-label[b-few2cvr38r] {
        display: none;
    }
}

@media (max-width: 992px) {
    .action-group.production-summary[b-few2cvr38r] {
        display: none;
    }
}

/* Phone - even more compact */
@media (max-width: 480px) {
    .form-grid[b-few2cvr38r] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.35rem 0.5rem;
    }

    .action-toolbar[b-few2cvr38r] {
        justify-content: center;
    }

    .action-group.save[b-few2cvr38r] {
        margin-left: 0;
    }
}

/* ============================================
   Case Count Panel Header
   ============================================ */
.case-count-header-content[b-few2cvr38r] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.case-count-header-content .header-brand[b-few2cvr38r] {
    font-weight: 600;
    font-size: 1rem;
    color: inherit;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.case-count-header-content .header-tag[b-few2cvr38r] {
    background: rgba(255, 255, 255, 0.2);
    padding: 0.125rem 0.5rem;
    border-radius: 9999px;
    font-size: 0.7rem;
    font-weight: 500;
    white-space: nowrap;
}

.case-count-header-content .header-meta[b-few2cvr38r] {
    font-size: 0.8rem;
    opacity: 0.9;
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.case-count-header-content .separator[b-few2cvr38r] {
    opacity: 0.5;
}

@media (max-width: 480px) {
    .case-count-header-content[b-few2cvr38r] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }

    .case-count-header-content .header-brand[b-few2cvr38r] {
        font-size: 0.95rem;
    }

    .case-count-header-content .header-meta[b-few2cvr38r] {
        font-size: 0.75rem;
    }
}
/* /Pages/Bottling/DailyFlow/Components/BottlingDateTabsRow.razor.rz.scp.css */
.date-tabs-row[b-iv6kp6wim0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.4rem 0.5rem;
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
    border-top: 1px solid #dee2e6;
}

.date-tabs-container[b-iv6kp6wim0] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.3rem;
}

.header-date-tab[b-iv6kp6wim0] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.3rem 0.5rem;
    padding-right: 1.4rem;
    border-radius: 4px;
    border: 1px solid #dee2e6;
    background: #fff;
    color: #495057;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.header-date-tab:hover[b-iv6kp6wim0] {
    background: #e9ecef;
    border-color: #adb5bd;
}

.header-date-tab.active[b-iv6kp6wim0] {
    background: #0d6efd;
    color: white;
    border-color: #0d6efd;
}

.tab-date[b-iv6kp6wim0] {
    font-weight: 500;
}

.tab-badge[b-iv6kp6wim0] {
    position: absolute;
    top: -5px;
    right: -5px;
    background: #0d6efd;
    color: white;
    border: 1px solid white;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6rem;
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(0,0,0,0.15);
}

.header-date-tab.active .tab-badge[b-iv6kp6wim0] {
    background: white;
    color: #0d6efd;
    border-color: #0d6efd;
}

.header-add-date-btn[b-iv6kp6wim0] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.3rem 0.5rem;
    border-radius: 4px;
    border: 1px dashed #28a745;
    background: transparent;
    color: #28a745;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

.header-add-date-btn:hover[b-iv6kp6wim0] {
    background: #28a745;
    color: white;
    border-style: solid;
}

.header-add-date-btn i[b-iv6kp6wim0] {
    font-size: 0.8rem;
}

.product-code-info[b-iv6kp6wim0] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.5rem;
    background: #e7f1ff;
    border: 1px solid #b6d4fe;
    border-radius: 4px;
    font-size: 0.7rem;
    color: #0d6efd;
    white-space: nowrap;
}

.product-code-info i[b-iv6kp6wim0] {
    font-size: 0.75rem;
}

/* Responsive - hide text on smaller screens */
@media (max-width: 768px) {
    .add-text[b-iv6kp6wim0] {
        display: none;
    }

    .product-code-info span[b-iv6kp6wim0] {
        max-width: 120px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .header-date-tab[b-iv6kp6wim0] {
        padding: 0.25rem 0.4rem;
        padding-right: 1.2rem;
        font-size: 0.7rem;
    }

    .tab-badge[b-iv6kp6wim0] {
        width: 14px;
        height: 14px;
        font-size: 0.55rem;
    }
}

@media (max-width: 480px) {
    .date-tabs-row[b-iv6kp6wim0] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .date-tabs-container[b-iv6kp6wim0] {
        width: 100%;
    }

    .header-date-tab[b-iv6kp6wim0] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .product-code-info[b-iv6kp6wim0] {
        width: 100%;
        justify-content: center;
    }
}
/* /Pages/Bottling/DailyFlow/Components/BottlingLabComponent.razor.rz.scp.css */
/* Lab Component Styles - Matching other DailyFlow components */

.lab-wrapper[b-0qf1dm8llt] {
    background: #fff;
    border-radius: 4px;
    padding: 0.5rem;
}

.lab-header[b-0qf1dm8llt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}

.header-title[b-0qf1dm8llt] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.header-title i[b-0qf1dm8llt] {
    font-size: 1rem;
    color: #0d6efd;
}

.header-actions[b-0qf1dm8llt] {
    display: flex;
    gap: 0.25rem;
}

.header-actions button[b-0qf1dm8llt] {
    font-size: 0.75rem !important;
    padding: 0.2rem 0.4rem !important;
}

/* Form Content */
.lab-content[b-0qf1dm8llt] {
    padding: 0.25rem 0;
}

.lab-form[b-0qf1dm8llt] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-row[b-0qf1dm8llt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.form-row label[b-0qf1dm8llt] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6c757d;
    min-width: 80px;
    text-align: right;
}

.form-row select[b-0qf1dm8llt],
.form-row input[b-0qf1dm8llt] {
    font-size: 0.8rem !important;
    padding: 0.2rem 0.4rem !important;
    max-width: 180px;
}

.form-row select[b-0qf1dm8llt] {
    max-width: 200px;
}

/* Input with unit suffix */
.input-with-unit[b-0qf1dm8llt] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.input-with-unit input[b-0qf1dm8llt] {
    width: 80px;
    text-align: right;
}

.input-with-unit .unit[b-0qf1dm8llt] {
    font-size: 0.7rem;
    color: #6c757d;
    font-weight: 500;
    min-width: 30px;
}

/* Notes row */
.notes-row[b-0qf1dm8llt] {
    align-items: flex-start;
}

.notes-row textarea[b-0qf1dm8llt] {
    flex: 1;
    max-width: 200px;
    min-height: 50px;
    font-size: 0.75rem !important;
    resize: vertical;
}

/* Checkbox row */
.checkbox-row[b-0qf1dm8llt] {
    margin-top: 0.25rem;
}

.checkbox-label[b-0qf1dm8llt] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
    font-size: 0.75rem;
    color: #495057;
    min-width: auto !important;
}

.checkbox-label input[type="checkbox"][b-0qf1dm8llt] {
    width: auto;
    margin: 0;
}

.checkbox-label span[b-0qf1dm8llt] {
    font-weight: normal;
}

/* ========== Mobile Responsive Breakpoints ========== */

/* Tablet and below */
@media (max-width: 768px) {
    .form-row select[b-0qf1dm8llt],
    .form-row input[b-0qf1dm8llt] {
        max-width: 150px;
    }

    .form-row select[b-0qf1dm8llt] {
        max-width: 170px;
    }

    .notes-row textarea[b-0qf1dm8llt] {
        max-width: 150px;
    }
}

/* Phone */
@media (max-width: 480px) {
    .lab-header[b-0qf1dm8llt] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .header-actions[b-0qf1dm8llt] {
        width: 100%;
        justify-content: flex-end;
    }

    .form-row[b-0qf1dm8llt] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }

    .form-row label[b-0qf1dm8llt] {
        min-width: auto;
        text-align: left;
    }

    .form-row select[b-0qf1dm8llt],
    .form-row input[b-0qf1dm8llt] {
        max-width: 100%;
        width: 100%;
    }

    .form-row select[b-0qf1dm8llt] {
        max-width: 100%;
    }

    .input-with-unit[b-0qf1dm8llt] {
        width: 100%;
    }

    .input-with-unit input[b-0qf1dm8llt] {
        flex: 1;
        width: auto;
    }

    .notes-row textarea[b-0qf1dm8llt] {
        max-width: 100%;
        width: 100%;
    }

    .checkbox-row[b-0qf1dm8llt] {
        width: 100%;
    }
}
/* /Pages/Bottling/DailyFlow/Components/BottlingRunHeaderComponent.razor.rz.scp.css */
/* Run Header Component Styles - Matching DailyFlow components */

.run-wrapper[b-5nd70u1pa8] {
    background: #fff;
    border-radius: 4px;
}

.organic-stamp[b-5nd70u1pa8] {
    border: 2px solid #f44336;
    border-radius: 3px;
    color: #f44336;
    font-weight: 600;
    font-size: 0.7rem;
    padding: 0.1rem 0.4rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: rgba(244, 67, 54, 0.1);
    margin-left: 0.5rem;
}

/* Header */
.run-header[b-5nd70u1pa8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
    border-bottom: 1px solid #dee2e6;
    cursor: pointer;
    user-select: none;
    transition: background 0.15s ease;
}

.run-header:hover[b-5nd70u1pa8] {
    background: linear-gradient(to bottom, #e9ecef, #dee2e6);
}

.header-title[b-5nd70u1pa8] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.header-title i[b-5nd70u1pa8] {
    font-size: 1rem;
    color: #6f42c1;
}

.client-badge[b-5nd70u1pa8] {
    font-size: 0.75rem;
    font-weight: 500;
    background: #e7f3ff;
    color: #0d6efd;
    padding: 0.15rem 0.5rem;
    border-radius: 3px;
    margin-left: 0.5rem;
}

.header-actions[b-5nd70u1pa8] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.header-actions button[b-5nd70u1pa8] {
    font-size: 0.75rem !important;
    padding: 0.25rem 0.5rem !important;
}

.header-actions .btn-text[b-5nd70u1pa8] {
    margin-left: 0.25rem;
}

.collapse-icon[b-5nd70u1pa8] {
    color: #6c757d;
    font-size: 0.85rem;
    margin-left: 0.5rem;
    transition: transform 0.2s ease;
}

/* Content */
.run-content[b-5nd70u1pa8] {
    padding: 0.35rem;
}

/* Form Grid */
.form-grid[b-5nd70u1pa8] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.3rem 0.5rem;
    margin-bottom: 0.35rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid #eee;
}

.form-field[b-5nd70u1pa8] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.form-field label[b-5nd70u1pa8] {
    font-size: 0.7rem;
    font-weight: 500;
    color: #6c757d;
}

.form-field input[b-5nd70u1pa8],
.form-field select[b-5nd70u1pa8],
.form-field textarea[b-5nd70u1pa8] {
    font-size: 0.8rem !important;
}

/* Summary Row - Compact */
.summary-row[b-5nd70u1pa8] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.35rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid #eee;
}

.stat-badge[b-5nd70u1pa8] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    font-size: 0.7rem;
    font-weight: 500;
    white-space: nowrap;
}

.stat-badge i[b-5nd70u1pa8] {
    font-size: 0.75rem;
}

.stat-main[b-5nd70u1pa8] {
    font-weight: 600;
}

.stat-sep[b-5nd70u1pa8] {
    color: #6c757d;
    opacity: 0.6;
}

.stat-sub[b-5nd70u1pa8] {
    opacity: 0.85;
}

.stat-badge.client[b-5nd70u1pa8] {
    background: #fff3cd;
    color: #856404;
}

.stat-badge.expected[b-5nd70u1pa8] {
    background: #e7f3ff;
    color: #004085;
}

.stat-badge.bottled[b-5nd70u1pa8] {
    background: #d4edda;
    color: #155724;
}

.stat-badge.progress-badge[b-5nd70u1pa8] {
    font-weight: 600;
}

.stat-badge.progress-badge.not-started[b-5nd70u1pa8] {
    background: #f8f9fa;
    color: #6c757d;
}

.stat-badge.progress-badge.started[b-5nd70u1pa8] {
    background: #fff3cd;
    color: #856404;
}

.stat-badge.progress-badge.halfway[b-5nd70u1pa8] {
    background: #cce5ff;
    color: #004085;
}

.stat-badge.progress-badge.complete[b-5nd70u1pa8] {
    background: #d4edda;
    color: #155724;
}

/* Notes - Compact */
.notes-compact[b-5nd70u1pa8] {
    flex: 1;
    min-width: 150px;
}

.notes-compact input[b-5nd70u1pa8] {
    font-size: 0.75rem !important;
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .form-grid[b-5nd70u1pa8] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .form-grid[b-5nd70u1pa8] {
        grid-template-columns: 1fr;
    }

    .header-actions .btn-text[b-5nd70u1pa8] {
        display: none;
    }

    .notes-compact[b-5nd70u1pa8] {
        width: 100%;
    }

    .client-badge[b-5nd70u1pa8] {
        display: none;
    }
}
/* /Pages/Bottling/DailyFlow/Components/BottlingWinemakingComponent.razor.rz.scp.css */
/* Winemaking Component Styles - Matching other DailyFlow components */

.winemaking-wrapper[b-xrdc2wwhf1] {
    background: #fff;
    border-radius: 4px;
    padding: 0.5rem;
}

.winemaking-header[b-xrdc2wwhf1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}

.header-title[b-xrdc2wwhf1] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.header-title i[b-xrdc2wwhf1] {
    font-size: 1rem;
    color: #6f42c1;
}

.wine-lot-badge[b-xrdc2wwhf1] {
    font-size: 0.7rem;
    font-weight: 500;
    background: #e7f3ff;
    color: #0d6efd;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    margin-left: 0.25rem;
}

.header-actions[b-xrdc2wwhf1] {
    display: flex;
    gap: 0.25rem;
}

.header-actions button[b-xrdc2wwhf1] {
    font-size: 0.75rem !important;
    padding: 0.2rem 0.4rem !important;
}

/* Content */
.winemaking-content[b-xrdc2wwhf1] {
    padding: 0.25rem 0;
}

/* Specs Grid */
.specs-grid[b-xrdc2wwhf1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    gap: 0.35rem 0.75rem;
    margin-bottom: 0.5rem;
}

.spec-item[b-xrdc2wwhf1] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.spec-label[b-xrdc2wwhf1] {
    font-size: 0.65rem;
    font-weight: 500;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.spec-value[b-xrdc2wwhf1] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #212529;
}

/* Notes Section */
.notes-section[b-xrdc2wwhf1] {
    background: #f8f9fa;
    border-radius: 4px;
    padding: 0.35rem 0.5rem;
    margin-bottom: 0.5rem;
    font-size: 0.75rem;
}

.notes-label[b-xrdc2wwhf1] {
    font-weight: 600;
    color: #6c757d;
    margin-right: 0.25rem;
}

.notes-text[b-xrdc2wwhf1] {
    color: #495057;
}

/* Actions Section */
.actions-section[b-xrdc2wwhf1] {
    margin-bottom: 0.5rem;
}

.actions-label[b-xrdc2wwhf1] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #6c757d;
    display: block;
    margin-bottom: 0.25rem;
}

.actions-list[b-xrdc2wwhf1] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.action-item[b-xrdc2wwhf1] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    padding: 0.2rem 0;
}

.action-item.completed[b-xrdc2wwhf1] {
    color: #198754;
}

.action-item.completed i[b-xrdc2wwhf1] {
    color: #198754;
}

.action-item.pending[b-xrdc2wwhf1] {
    color: #dc3545;
}

.action-item.pending i[b-xrdc2wwhf1] {
    color: #dc3545;
}

.action-item i[b-xrdc2wwhf1] {
    font-size: 0.8rem;
}

/* Contacts Section */
.contacts-section[b-xrdc2wwhf1] {
    border-top: 1px solid #eee;
    padding-top: 0.5rem;
    margin-top: 0.25rem;
}

.contacts-label[b-xrdc2wwhf1] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #6c757d;
    display: block;
    margin-bottom: 0.25rem;
}

.contacts-list[b-xrdc2wwhf1] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.contact-item[b-xrdc2wwhf1] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    color: #495057;
}

.contact-item i[b-xrdc2wwhf1] {
    color: #6c757d;
    font-size: 0.7rem;
}

.contact-phone[b-xrdc2wwhf1] {
    color: #6c757d;
    font-size: 0.7rem;
    margin-left: auto;
}

/* ========== Mobile Responsive Breakpoints ========== */

/* Tablet and below */
@media (max-width: 768px) {
    .specs-grid[b-xrdc2wwhf1] {
        grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
        gap: 0.3rem 0.5rem;
    }

    .spec-label[b-xrdc2wwhf1] {
        font-size: 0.6rem;
    }

    .spec-value[b-xrdc2wwhf1] {
        font-size: 0.75rem;
    }
}

/* Phone */
@media (max-width: 480px) {
    .winemaking-header[b-xrdc2wwhf1] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .header-title[b-xrdc2wwhf1] {
        flex-wrap: wrap;
    }

    .wine-lot-badge[b-xrdc2wwhf1] {
        margin-left: 0;
    }

    .header-actions[b-xrdc2wwhf1] {
        width: 100%;
        justify-content: flex-end;
    }

    .specs-grid[b-xrdc2wwhf1] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.4rem 0.75rem;
    }

    .notes-section[b-xrdc2wwhf1] {
        font-size: 0.8rem;
    }

    .action-item[b-xrdc2wwhf1] {
        font-size: 0.8rem;
    }

    .contact-item[b-xrdc2wwhf1] {
        flex-wrap: wrap;
    }

    .contact-phone[b-xrdc2wwhf1] {
        width: 100%;
        margin-left: 1.05rem;
        font-size: 0.75rem;
    }
}
/* /Pages/Bottling/DailyFlow/Components/ColaComponent.razor.rz.scp.css */
/* COLA Component Styles - Matching Packaging Component */

.cola-wrapper[b-ude9shnkee] {
    background: #fff;
    border-radius: 4px;
    padding: 0.5rem;
}

.cola-header[b-ude9shnkee] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}

.header-title-btn[b-ude9shnkee] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    background: none;
    border: none;
    padding: 0.25rem 0.5rem;
    margin: -0.25rem -0.5rem;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    transition: all 0.15s ease;
}

.header-title-btn:hover[b-ude9shnkee] {
    background: #e7f3ff;
    color: #0d6efd;
}

.header-title-btn i[b-ude9shnkee] {
    font-size: 1rem;
}

.header-actions[b-ude9shnkee] {
    display: flex;
    gap: 0.25rem;
}

.header-actions button[b-ude9shnkee] {
    font-size: 0.75rem !important;
    padding: 0.2rem 0.4rem !important;
}

/* Content Layout */
.flex-row[b-ude9shnkee] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 0.75rem;
}

.column[b-ude9shnkee] {
    display: flex;
    flex-direction: column;
}

.left-section[b-ude9shnkee] {
    flex: 1;
    min-width: 0;
}

.right-section[b-ude9shnkee] {
    flex: 0 0 auto;
    max-width: 160px;
}

/* Label Info (details) */
.label-info[b-ude9shnkee] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    font-size: 0.75rem;
}

.label-item[b-ude9shnkee] {
    display: flex;
    gap: 0.25rem;
    line-height: 1.3;
}

.label-item b[b-ude9shnkee] {
    color: #6c757d;
    font-weight: 500;
    flex-shrink: 0;
}

/* Image container */
.image-container[b-ude9shnkee] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 300px;
    overflow-y: auto;
}

/* COLA images */
.image-container img.cola-img[b-ude9shnkee] {
    width: 100%;
    max-width: 130px;
    height: auto;
    border-radius: 4px;
    border: 1px solid #dee2e6;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.image-container img.cola-img:hover[b-ude9shnkee] {
    transform: scale(1.02);
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

/* Image with dimensions wrapper */
.image-with-dimensions[b-ude9shnkee] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
}

.image-dimensions[b-ude9shnkee] {
    font-size: 0.7rem;
    color: #6c757d;
    font-weight: 500;
    background: #f8f9fa;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    white-space: nowrap;
}

.image-type[b-ude9shnkee] {
    font-size: 0.65rem;
    color: #868e96;
    text-align: center;
    max-width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Button no style for TTB link */
.buttonNoStyle[b-ude9shnkee] {
    border: none;
    background: none;
    color: #0d6efd;
    cursor: pointer;
    text-decoration: underline;
    padding: 0;
}

.buttonNoStyle:hover[b-ude9shnkee] {
    color: #0a58ca;
}

/* ========== Mobile Responsive Breakpoints ========== */

/* Tablet and below */
@media (max-width: 768px) {
    .flex-row[b-ude9shnkee] {
        flex-wrap: wrap;
    }

    .right-section[b-ude9shnkee] {
        max-width: 120px;
    }

    .image-container img.cola-img[b-ude9shnkee] {
        max-width: 100px;
    }
}

/* Phone */
@media (max-width: 480px) {
    .flex-row[b-ude9shnkee] {
        flex-direction: column;
    }

    .left-section[b-ude9shnkee] {
        width: 100%;
    }

    .right-section[b-ude9shnkee] {
        width: 100%;
        max-width: none;
        flex-direction: row;
        justify-content: center;
    }

    .image-container[b-ude9shnkee] {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        max-height: none;
        gap: 0.5rem;
    }

    .image-container img.cola-img[b-ude9shnkee] {
        max-width: 100px;
        max-height: 150px;
    }

    .cola-header[b-ude9shnkee] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .header-actions[b-ude9shnkee] {
        width: 100%;
        justify-content: flex-end;
    }

    .label-info[b-ude9shnkee] {
        font-size: 0.8rem;
    }
}
/* /Pages/Bottling/DailyFlow/Components/DailyFlowListHelperComponent.razor.rz.scp.css */
.search-container[b-zevmtpvnmy] {
  display: flex;
  flex-direction: column;
  height: 100%;
  gap: 8px;
}

.search-box[b-zevmtpvnmy] {
  position: sticky;
  top: 0;
  background-color: #f8f9fa;
  z-index: 1;
  padding: 8px 0;
  display: flex;
  gap: 6px;
}

.search-box input[b-zevmtpvnmy] {
  flex: 1;
  padding: 6px 10px;
  border: 1px solid #dee2e6;
  border-radius: 4px;
  font-size: 0.9em;
}

.today-btn[b-zevmtpvnmy] {
  padding: 6px 12px;
  background: #17a2b8;
  color: white;
  border: none;
  border-radius: 4px;
  font-size: 0.8em;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.today-btn:hover[b-zevmtpvnmy] {
  background: #138496;
}

#appointmentsList[b-zevmtpvnmy] {
  flex-grow: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

/* Empty state */
.empty-state[b-zevmtpvnmy] {
  text-align: center;
  padding: 24px 12px;
  color: #888;
  font-size: 0.9em;
  font-style: italic;
}

/* Date group container */
.date-group[b-zevmtpvnmy] {
  background: white;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  padding: 6px;
  margin-bottom: 4px;
}

/* Today highlight */
.date-group.today[b-zevmtpvnmy] {
  border: 2px solid #17a2b8;
  box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);
}

.date-header[b-zevmtpvnmy] {
  font-size: 0.75em;
  font-weight: 600;
  color: #666;
  padding: 2px 4px;
  margin-bottom: 4px;
  border-bottom: 1px solid #eee;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.date-group.today .date-header[b-zevmtpvnmy] {
  color: #17a2b8;
}

.count-badge[b-zevmtpvnmy] {
  background: #e9ecef;
  color: #495057;
  font-size: 0.85em;
  padding: 1px 6px;
  border-radius: 10px;
  font-weight: 500;
}

.date-group.today .count-badge[b-zevmtpvnmy] {
  background: #17a2b8;
  color: white;
}

.date-items[b-zevmtpvnmy] {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

/* Bottling day buttons */
.bottlingDay[b-zevmtpvnmy] {
  cursor: pointer;
  border-radius: 4px;
  border: 1px solid;
  padding: 4px 8px;
  font-size: 0.8em;
  font-weight: 500;
  transition: transform 0.1s, box-shadow 0.1s;
  text-align: left;
  width: calc(100% - 8px);
}

.bottlingDay:hover[b-zevmtpvnmy] {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0,0,0,0.15);
}

/* Line positioning - margins come from config via inline styles */
/* Line 1 & 2 keep their database colors (inline styles) */
.bottlingDay.line-1[b-zevmtpvnmy] {
  /* Margins set via inline styles from BottlingLineConfig */
}

.bottlingDay.line-2[b-zevmtpvnmy] {
  /* Margins set via inline styles from BottlingLineConfig */
}

/* "Other" lines (W&I, Mobile) - colors come from config via inline styles */
.bottlingDay.line-other[b-zevmtpvnmy] {
  /* Margins and colors set via inline styles from BottlingLineConfig */
}

/* Selected state */
.bottlingDay.selected[b-zevmtpvnmy] {
  box-shadow: 0 0 0 2px #dc3545, 0 2px 8px rgba(220, 53, 69, 0.4);
  transform: scale(1.02);
}

/* Other appointments (BottlingDateOther) */
.other-appointment[b-zevmtpvnmy] {
  border-radius: 4px;
  background: linear-gradient(to right, rgba(109, 213, 250, 0.85), rgba(41, 128, 185, 0.85));
  color: white;
  font-size: 0.75em;
  padding: 4px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
}

.other-appointment.multi-day[b-zevmtpvnmy] {
  background: linear-gradient(to right, rgba(255, 193, 7, 0.9), rgba(255, 152, 0, 0.9));
  border-left: 3px solid #e65100;
}

.other-title[b-zevmtpvnmy] {
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.date-badge[b-zevmtpvnmy] {
  font-size: 0.85em;
  background: rgba(0, 0, 0, 0.15);
  padding: 1px 5px;
  border-radius: 3px;
  white-space: nowrap;
}

/* Completed checkmark indicator */
.completed-check[b-zevmtpvnmy] {
  color: #28a745;
  font-size: 0.7em;
  margin-right: 4px;
  vertical-align: middle;
}
/* /Pages/Bottling/DailyFlow/Components/LabelComponent.razor.rz.scp.css */
/* Label Component Styles - Matching Packaging Component */

.label-wrapper[b-dtueebyaa0] {
    background: #fff;
    border-radius: 4px;
    padding: 0.5rem;
}

.label-header[b-dtueebyaa0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}

.header-title-btn[b-dtueebyaa0] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    background: none;
    border: none;
    padding: 0.25rem 0.5rem;
    margin: -0.25rem -0.5rem;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    transition: all 0.15s ease;
}

.header-title-btn:hover[b-dtueebyaa0] {
    background: #e7f3ff;
    color: #0d6efd;
}

.header-title-btn i[b-dtueebyaa0] {
    font-size: 1rem;
}

.header-actions[b-dtueebyaa0] {
    display: flex;
    gap: 0.25rem;
}

.header-actions button[b-dtueebyaa0] {
    font-size: 0.75rem !important;
    padding: 0.2rem 0.4rem !important;
}

/* Content Layout */
.flex-row[b-dtueebyaa0] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 0.75rem;
}

.column[b-dtueebyaa0] {
    display: flex;
    flex-direction: column;
}

.left-section[b-dtueebyaa0] {
    flex: 0 0 auto;
    max-width: 140px;
}

.right-section[b-dtueebyaa0] {
    flex: 1;
    min-width: 0;
}

/* Image container */
.image-container[b-dtueebyaa0] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 300px;
    overflow-y: auto;
}

.image-container img.card-img[b-dtueebyaa0] {
    width: 100%;
    max-width: 130px;
    height: auto;
    border-radius: 4px;
    border: 1px solid #dee2e6;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.image-container img.card-img:hover[b-dtueebyaa0] {
    transform: scale(1.02);
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

/* Label Info */
.label-info[b-dtueebyaa0] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    font-size: 0.75rem;
}

.label-item[b-dtueebyaa0] {
    display: flex;
    gap: 0.25rem;
    line-height: 1.3;
}

.label-item b[b-dtueebyaa0] {
    color: #6c757d;
    font-weight: 500;
    flex-shrink: 0;
}

/* ========== Mobile Responsive Breakpoints ========== */

/* Tablet and below */
@media (max-width: 768px) {
    .flex-row[b-dtueebyaa0] {
        flex-wrap: wrap;
    }

    .left-section[b-dtueebyaa0] {
        max-width: 120px;
    }

    .image-container img.card-img[b-dtueebyaa0] {
        max-width: 100px;
    }
}

/* Phone */
@media (max-width: 480px) {
    .flex-row[b-dtueebyaa0] {
        flex-direction: column;
    }

    .left-section[b-dtueebyaa0] {
        width: 100%;
        max-width: none;
        flex-direction: row;
        justify-content: center;
    }

    .right-section[b-dtueebyaa0] {
        width: 100%;
    }

    .image-container[b-dtueebyaa0] {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        max-height: none;
        gap: 0.5rem;
    }

    .image-container img.card-img[b-dtueebyaa0] {
        max-width: 100px;
        max-height: 150px;
    }

    .label-header[b-dtueebyaa0] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .header-actions[b-dtueebyaa0] {
        width: 100%;
        justify-content: flex-end;
    }

    .label-info[b-dtueebyaa0] {
        font-size: 0.8rem;
    }
}
/* /Pages/Bottling/DailyFlow/Components/PackagingComponent.razor.rz.scp.css */
.packaging-wrapper[b-jubp9vqua9] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 0.75rem;
    margin-bottom: 1rem;
}

.packaging-header[b-jubp9vqua9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}

.packaging-header h6[b-jubp9vqua9] {
    margin: 0;
    font-weight: 600;
    color: #495057;
}

.header-actions[b-jubp9vqua9] {
    display: flex;
    gap: 0.25rem;
}

.header-actions button[b-jubp9vqua9] {
    font-size: 0.75rem !important;
    padding: 0.2rem 0.4rem !important;
}

/* Add/Edit Form */
.packaging-form[b-jubp9vqua9] {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
}

.form-row[b-jubp9vqua9] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.form-row:last-child[b-jubp9vqua9] {
    margin-bottom: 0;
}

.form-group[b-jubp9vqua9] {
    display: flex;
    flex-direction: column;
    min-width: 100px;
}

.form-group.flex-grow[b-jubp9vqua9] {
    flex: 1;
}

.form-group label[b-jubp9vqua9] {
    font-size: 0.7rem;
    color: #6c757d;
    margin-bottom: 0.15rem;
    font-weight: 500;
}

.form-group input[b-jubp9vqua9],
.form-group select[b-jubp9vqua9] {
    font-size: 0.8rem !important;
    padding: 0.25rem 0.5rem !important;
}

.form-actions[b-jubp9vqua9] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #dee2e6;
}

.form-actions button[b-jubp9vqua9] {
    font-size: 0.75rem !important;
    padding: 0.25rem 0.75rem !important;
}

/* Content Area */
.packaging-content[b-jubp9vqua9] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.packaging-type-section[b-jubp9vqua9] {
    display: flex;
    flex-direction: column;
}

.type-header[b-jubp9vqua9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0;
}

.type-name[b-jubp9vqua9] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    min-width: 70px;
}

.type-name-btn[b-jubp9vqua9] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    min-width: 70px;
    background: none;
    border: none;
    padding: 0.1rem 0.25rem;
    margin: -0.1rem -0.25rem;
    border-radius: 3px;
    cursor: pointer;
    text-align: left;
    transition: all 0.15s ease;
}

.type-name-btn:hover[b-jubp9vqua9] {
    background: #e9ecef;
    color: #0d6efd;
}

.type-empty[b-jubp9vqua9] {
    color: #adb5bd;
    font-size: 0.75rem;
}

/* Individual Items */
.packaging-item[b-jubp9vqua9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.35rem 0.5rem;
    margin-left: 0.5rem;
    background: #f8f9fa;
    border-radius: 3px;
    margin-bottom: 0.2rem;
}

.packaging-item.date-specific[b-jubp9vqua9] {
    background: #e7f3ff;
    border-left: 2px solid #0d6efd;
}

.packaging-item.run-default[b-jubp9vqua9] {
    background: #f0f0f0;
    border-left: 2px solid #6c757d;
}

.item-content[b-jubp9vqua9] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    font-size: 0.8rem;
}

.item-name[b-jubp9vqua9] {
    font-weight: 500;
    color: #212529;
}

.item-closure-type[b-jubp9vqua9] {
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
    background: #6c757d;
    color: #fff;
    text-transform: uppercase;
}

.item-supplier[b-jubp9vqua9] {
    color: #6c757d;
}

.item-lot[b-jubp9vqua9] {
    color: #6c757d;
    font-size: 0.75rem;
}

.item-qty[b-jubp9vqua9] {
    color: #495057;
    font-weight: 500;
}

.item-scope[b-jubp9vqua9] {
    font-size: 0.65rem;
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
    background: #e9ecef;
    color: #6c757d;
}

.date-specific .item-scope[b-jubp9vqua9] {
    background: #cfe2ff;
    color: #0d6efd;
}

.item-actions[b-jubp9vqua9] {
    display: flex;
    gap: 0.25rem;
}

.item-actions button[b-jubp9vqua9] {
    padding: 0.1rem 0.25rem !important;
    font-size: 0.7rem !important;
    line-height: 1;
}

.item-actions .bi[b-jubp9vqua9] {
    font-size: 0.75rem;
}

/* Button overrides */
.btn-xs[b-jubp9vqua9] {
    padding: 0.1rem 0.25rem !important;
    font-size: 0.7rem !important;
}

/* Catalog Mode Toggle */
.mode-toggle[b-jubp9vqua9] {
    min-width: auto;
}

.mode-toggle button[b-jubp9vqua9] {
    font-size: 0.75rem !important;
    padding: 0.25rem 0.5rem !important;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

/* Catalog Selection Row */
.catalog-row[b-jubp9vqua9] {
    background: #e7f3ff;
    margin: -0.25rem -0.5rem 0.5rem -0.5rem;
    padding: 0.5rem;
    border-radius: 3px;
}

.catalog-empty[b-jubp9vqua9] {
    font-size: 0.75rem;
    color: #6c757d;
    padding: 0.5rem;
    background: #fff3cd;
    border-radius: 3px;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
}

.catalog-empty i[b-jubp9vqua9] {
    color: #856404;
}

/* From Catalog Indicator */
.from-catalog[b-jubp9vqua9] {
    border-left-color: #198754 !important;
}

.item-catalog[b-jubp9vqua9] {
    color: #198754;
    font-size: 0.7rem;
}

.item-catalog i[b-jubp9vqua9] {
    font-size: 0.75rem;
}


/* ========== Mobile Responsive Breakpoints ========== */

/* Tablet and below */
@media (max-width: 768px) {
    .form-row[b-jubp9vqua9] {
        flex-wrap: wrap;
    }

    .form-group[b-jubp9vqua9] {
        min-width: 80px;
        flex: 1 1 45%;
    }
}

/* Phone */
@media (max-width: 480px) {
    .packaging-wrapper[b-jubp9vqua9] {
        padding: 0.5rem;
    }

    .form-row[b-jubp9vqua9] {
        flex-direction: column;
    }

    .form-group[b-jubp9vqua9] {
        width: 100%;
        min-width: unset;
    }

    .packaging-item[b-jubp9vqua9] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.35rem;
    }

    .item-content[b-jubp9vqua9] {
        width: 100%;
    }

    .item-actions[b-jubp9vqua9] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* /Pages/Bottling/DailyFlow/Components/WeekNavigatorComponent.razor.rz.scp.css */
.week-navigator-header[b-7kdh4uixva] {
  position: sticky;
  top: 0;
  z-index: 10; /* Keep below BlazoredModal overlay (1050) */
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  margin-bottom: 0.75rem;
  box-shadow: 0 2px 4px rgba(0,0,0,0.08);
}

/* Toolbar - Back button, tabs, current info */
.week-nav-toolbar[b-7kdh4uixva] {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.5rem 0.75rem;
  background: linear-gradient(180deg, #f8f9fa 0%, #e9ecef 100%);
  border-bottom: 1px solid #dee2e6;
  border-radius: 5px 5px 0 0;
}

/* Tabs */
.week-nav-tabs[b-7kdh4uixva] {
  display: flex;
  gap: 0.25rem;
}

.week-nav-tab[b-7kdh4uixva] {
  padding: 0.35rem 0.75rem;
  border: 1px solid #dee2e6;
  border-radius: 4px;
  background: #fff;
  font-size: 0.85rem;
  font-weight: 500;
  color: #495057;
  cursor: pointer;
  transition: all 0.15s ease;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.week-nav-tab:hover[b-7kdh4uixva] {
  background: #e9ecef;
}

.week-nav-tab.active[b-7kdh4uixva] {
  background: #0d6efd;
  color: white;
  border-color: #0d6efd;
}

.tab-badge[b-7kdh4uixva] {
  font-size: 0.7rem;
  padding: 0.1rem 0.35rem;
  border-radius: 8px;
  background: rgba(0,0,0,0.15);
}

.week-nav-tab.active .tab-badge[b-7kdh4uixva] {
  background: rgba(255,255,255,0.3);
}

/* Current appointment info */
.week-nav-current[b-7kdh4uixva] {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.85rem;
}

.current-label[b-7kdh4uixva] {
  font-weight: 600;
  color: #212529;
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.current-date[b-7kdh4uixva] {
  color: #6c757d;
}

/* Content area */
.week-nav-content[b-7kdh4uixva] {
  padding: 0.5rem 0.75rem;
}

/* Week Grid */
.week-nav-grid[b-7kdh4uixva] {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.5rem;
}

.week-nav-day[b-7kdh4uixva] {
  border: 1px solid #e9ecef;
  border-radius: 4px;
  padding: 0.25rem;
  min-height: 50px;
  background: #fafafa;
}

.week-nav-day.today[b-7kdh4uixva] {
  border-color: #0d6efd;
  background: #f0f7ff;
}

.week-nav-day.current[b-7kdh4uixva] {
  border-color: #198754;
  border-width: 2px;
  background: #f0fff4;
}

.week-nav-day-header[b-7kdh4uixva] {
  display: flex;
  justify-content: space-between;
  font-size: 0.7rem;
  color: #6c757d;
  border-bottom: 1px solid #e9ecef;
  padding-bottom: 0.15rem;
  margin-bottom: 0.25rem;
}

.day-name[b-7kdh4uixva] {
  font-weight: 600;
}

/* Line-based structure */
.week-nav-lines[b-7kdh4uixva] {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.week-nav-line[b-7kdh4uixva] {
  display: flex;
  gap: 0.25rem;
  align-items: flex-start;
}

.week-nav-line .line-label[b-7kdh4uixva] {
  font-size: 0.6rem;
  font-weight: 600;
  color: #6c757d;
  background: #e9ecef;
  padding: 0.1rem 0.2rem;
  border-radius: 2px;
  min-width: 1.2rem;
  text-align: center;
  flex-shrink: 0;
}

.line-appointments[b-7kdh4uixva] {
  display: flex;
  flex-wrap: wrap;
  gap: 0.15rem;
  flex: 1;
}

button.week-nav-appt[b-7kdh4uixva] {
  font-size: 0.65rem !important;
  padding: 0.15rem 0.25rem !important;
  border: 1px solid;
  border-radius: 3px;
  cursor: pointer;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  transition: transform 0.1s ease;
  line-height: 1.2;
}

.week-nav-appt:hover[b-7kdh4uixva] {
  transform: scale(1.02);
  box-shadow: 0 2px 4px rgba(0,0,0,0.15);
}

.week-nav-appt.current[b-7kdh4uixva] {
  box-shadow: 0 0 0 2px #198754;
  font-weight: bold;
}

/* Other lines (W&I, etc.) */
.week-nav-other[b-7kdh4uixva] {
  display: flex;
  gap: 0.25rem;
  align-items: center;
}

.other-badge[b-7kdh4uixva] {
  font-size: 0.55rem;
  font-weight: 600;
  color: #fff;
  background: #6c757d;
  padding: 0.1rem 0.2rem;
  border-radius: 2px;
  min-width: 1.4rem;
  text-align: center;
  flex-shrink: 0;
}

.week-nav-appt.other[b-7kdh4uixva] {
  flex: 1;
}

/* Show more/less buttons */
button.btn-show-more[b-7kdh4uixva],
button.btn-show-less[b-7kdh4uixva] {
  font-size: 0.6rem !important;
  padding: 0.1rem 0.25rem !important;
  border: 1px solid #dee2e6;
  border-radius: 3px;
  background: #f8f9fa;
  color: #0d6efd;
  cursor: pointer;
  line-height: 1.2;
}

button.btn-show-more:hover[b-7kdh4uixva],
button.btn-show-less:hover[b-7kdh4uixva] {
  background: #e9ecef;
}

button.btn-show-less[b-7kdh4uixva] {
  width: 100%;
  text-align: center;
  margin-top: 0.15rem;
}

/* Recent List */
.recent-nav-list[b-7kdh4uixva] {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

button.recent-nav-item[b-7kdh4uixva] {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.5rem !important;
  background: #f8f9fa;
  border: 1px solid #dee2e6;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.8rem !important;
  text-align: left;
  transition: background 0.15s ease;
  line-height: 1.2;
}

.recent-nav-item:hover[b-7kdh4uixva] {
  background: #e9ecef;
}

.recent-nav-item.current[b-7kdh4uixva] {
  background: #d1e7dd;
  border-color: #198754;
}

.recent-date[b-7kdh4uixva] {
  font-weight: 600;
  color: #495057;
}

.recent-name[b-7kdh4uixva] {
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.week-nav-empty[b-7kdh4uixva] {
  color: #6c757d;
  font-size: 0.85rem;
  text-align: center;
  padding: 0.5rem;
}

/* Search */
.week-nav-search[b-7kdh4uixva] {
  padding: 0.5rem 0.75rem;
  border-top: 1px solid #dee2e6;
  background: #fafafa;
  border-radius: 0 0 5px 5px;
  position: relative;
}

.search-input-wrapper[b-7kdh4uixva] {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 4px;
  padding: 0.25rem 0.5rem;
}

.search-input-wrapper i[b-7kdh4uixva] {
  color: #6c757d;
}

.search-input-wrapper input[b-7kdh4uixva] {
  border: none;
  outline: none;
  flex: 1;
  font-size: 0.85rem;
}

.search-input-wrapper input:focus[b-7kdh4uixva] {
  box-shadow: none;
}

.search-clear[b-7kdh4uixva] {
  background: none;
  border: none;
  color: #6c757d;
  cursor: pointer;
  padding: 0.15rem;
  display: flex;
  align-items: center;
}

.search-clear:hover[b-7kdh4uixva] {
  color: #dc3545;
}

.search-results[b-7kdh4uixva] {
  position: absolute;
  top: 100%;
  left: 0.75rem;
  right: 0.75rem;
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  z-index: 1000;
  max-height: 300px;
  overflow-y: auto;
}

button.search-result-item[b-7kdh4uixva] {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.5rem 0.75rem !important;
  border: none;
  border-bottom: 1px solid #f0f0f0;
  background: none;
  text-align: left;
  cursor: pointer;
  font-size: 0.85rem !important;
  line-height: 1.2;
}

.search-result-item:hover[b-7kdh4uixva] {
  background: #f8f9fa;
}

.search-result-item:last-child[b-7kdh4uixva] {
  border-bottom: none;
}

.result-date[b-7kdh4uixva] {
  font-weight: 600;
  color: #0d6efd;
  min-width: 3rem;
}

.result-name[b-7kdh4uixva] {
  flex: 1;
  font-weight: 500;
}

.result-client[b-7kdh4uixva] {
  color: #6c757d;
  font-size: 0.8rem;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-more[b-7kdh4uixva] {
  padding: 0.5rem;
  text-align: center;
  color: #6c757d;
  font-size: 0.8rem;
  background: #f8f9fa;
}

/* Action buttons - Collapse/Sidebar toggles */
.week-nav-actions[b-7kdh4uixva] {
  display: flex;
  gap: 0.35rem;
  margin-left: 0.5rem;
}

.week-nav-actions .btn[b-7kdh4uixva] {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.25rem 0.5rem;
  font-size: 0.8rem;
}

.week-nav-actions .btn i[b-7kdh4uixva] {
  font-size: 0.9rem;
}

.week-nav-actions .action-label[b-7kdh4uixva] {
  display: none;
}

/* Show labels on wider screens */
@media (min-width: 1200px) {
  .week-nav-actions .action-label[b-7kdh4uixva] {
    display: inline;
  }
}

/* ========================================
   Collapsed Header State
   ======================================== */
.week-navigator-header.collapsed[b-7kdh4uixva] {
  margin-bottom: 0.5rem;
}

.week-navigator-header.collapsed .week-nav-toolbar[b-7kdh4uixva] {
  border-bottom: none;
  border-radius: 5px;
}

/* Smooth transition for collapse/expand */
.week-nav-content[b-7kdh4uixva],
.week-nav-search[b-7kdh4uixva] {
  transition: all 0.2s ease;
}

/* ========================================
   Mobile Responsive Styles
   ======================================== */

@media (max-width: 768px) {
  .week-nav-toolbar[b-7kdh4uixva] {
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.4rem 0.5rem;
  }

  .week-nav-tabs[b-7kdh4uixva] {
    order: 3;
    width: 100%;
  }

  .week-nav-tab[b-7kdh4uixva] {
    flex: 1;
    justify-content: center;
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
  }

  .week-nav-current[b-7kdh4uixva] {
    margin-left: 0;
    flex: 1;
  }

  .current-label[b-7kdh4uixva] {
    max-width: 120px;
    font-size: 0.8rem;
  }

  /* Week grid - horizontal scroll */
  .week-nav-content[b-7kdh4uixva] {
    padding: 0.35rem 0.5rem;
    overflow-x: auto;
  }

  .week-nav-grid[b-7kdh4uixva] {
    display: flex;
    gap: 0.35rem;
    min-width: max-content;
  }

  .week-nav-day[b-7kdh4uixva] {
    min-width: 100px;
    flex-shrink: 0;
  }

  /* Hide sidebar toggle on mobile (sidebar already hidden) */
  .week-nav-actions button:last-child[b-7kdh4uixva] {
    display: none;
  }
}

@media (max-width: 480px) {
  .week-nav-toolbar[b-7kdh4uixva] {
    padding: 0.35rem;
  }

  .week-nav-toolbar > .btn[b-7kdh4uixva] {
    padding: 0.2rem 0.4rem !important;
    font-size: 0.75rem !important;
  }

  .week-nav-current[b-7kdh4uixva] {
    font-size: 0.75rem;
  }

  .current-label[b-7kdh4uixva] {
    max-width: 100px;
  }

  .current-date[b-7kdh4uixva] {
    display: none;
  }

  .week-nav-day[b-7kdh4uixva] {
    min-width: 85px;
  }

  .week-nav-day-header[b-7kdh4uixva] {
    font-size: 0.65rem;
  }

  button.week-nav-appt[b-7kdh4uixva] {
    font-size: 0.6rem !important;
    padding: 0.1rem 0.2rem !important;
  }

  /* Search - more compact */
  .week-nav-search[b-7kdh4uixva] {
    padding: 0.35rem 0.5rem;
  }

  .search-input-wrapper[b-7kdh4uixva] {
    padding: 0.2rem 0.35rem;
  }
}
/* /Pages/Bottling/DailyFlow/DailyFlowPage.razor.rz.scp.css */
.main.cards[b-chnp5bxizv] {
    padding-top: -1.1rem;
}

.newCard[b-chnp5bxizv] {
    width: 100%;
    margin: 5px;
    border: 1px solid #d9d9d9;
    padding: 3px;
    border-radius: 5px;
}

/*.cards {
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 20px;
    margin-top: -1.1rem;
}*/
.cards[b-chnp5bxizv] {
  display: flex;
  flex-wrap: wrap;
  margin-top: 0.5rem;
  gap: 0.5rem;
}

.left-column[b-chnp5bxizv] {
  flex: 0 0 80%; /* Flex shorthand for grow, shrink, and basis (80%) */
  overflow-y: auto; /* Enable independent scrolling */
  padding: 5px; /* Optional: Add padding for content */
  background-color: #ffffff; /* Optional: Background color for clarity */
  display: flex; /* Make left-column a flex container */
  flex-wrap: wrap; /* Ensure cards inside left-column can wrap */
  box-sizing: border-box; /* Ensure padding and border are included in width */
}

.right-column[b-chnp5bxizv] {
  flex: 0 0 20%; /* Flex shorthand for grow, shrink, and basis (20%) */
  overflow-y: auto; /* Enable independent scrolling */
  padding: 20px; /* Optional: Add padding for content */
  background-color: #ffffff; /* Optional: Background color for clarity */
  border-left: 1px solid #dee2e6; /* Optional: Border for clarity */
  box-shadow: -4px 0 6px -1px rgba(0, 0, 0, .1); /* Optional: Shadow for clarity */
}
.card[b-chnp5bxizv] {
  display: flex;
  flex-direction: column;
  margin: 3px;
  border: 1px solid #ccc;
  box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.3);
  /*width: calc(33.333% - 6px);*/ /* Adjust width to fit within the container considering margin */
  box-sizing: border-box; /* Include padding and border in the element's total width and height */
}


/*.card {
  display: flex;
  flex-direction: column;
  margin: 3px;
  border: 1px solid #ccc;
  box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.3);
  align-items: start;
  align-self: flex-start;*/ /* Add this line */
  /*break-inside: auto;
}*/
.card-2[b-chnp5bxizv] {
    display: grid; /* Use grid layout for flexible card heights */
    grid-template-columns: 1fr 1fr;; /* Single column layout */
    margin: 3px;
    border: 1px solid #ccc;
    box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.3);
    gap:10px;
}

.cardTest[b-chnp5bxizv] {
    flex: auto;
    margin: 3px;
    border: 1px solid #ccc;
    box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.3);
}

.cardStyle[b-chnp5bxizv] {
    display: flex;
    margin: 3px;
    border: 1px solid #ccc;
    box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.3);
}

.cardStyleCola[b-chnp5bxizv] {
    flex: 1; /* This allows the card to grow and take available space within the container */
    margin: 3px;
    border: 1px solid #ccc;
    box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.3);
    max-width: 810px; /* Set a maximum width for the card */
}

.colaLabelContainer[b-chnp5bxizv] {
    display: flex; /* Use flex instead of grid for the container */
    flex-wrap: wrap; /* Allow flex items to wrap to new lines */
}

/* Adjust the flex container's behavior */
@media (min-width: 810px) {
    /* Two columns when window width is 800px or larger */
    .colaLabelContainer[b-chnp5bxizv] {
        justify-content: space-between;
    }

    /* Give each child item 50% width for two columns */
    .cardStyleCola[b-chnp5bxizv] {
        flex: 0 0 calc(50% - 10px); /* Subtract the grid gap from the 50% width */
    }
}

.cardProductionColumn[b-chnp5bxizv] {
    display: flex;
    flex-direction: column;
    margin: 3px;
    border: 1px solid #ccc;
    box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.3);
    padding: 3px;
}

.cardProductionGrid[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: azure;
}

.form-group[b-chnp5bxizv] {
    display: flex;
    align-items: flex-start;
}


.card img[b-chnp5bxizv] {
    max-width: 100%;
}



.card .text[b-chnp5bxizv] {
    padding: 0 10px 10px;
}

    .card .text > button[b-chnp5bxizv] {
        background: gray;
        border: 0;
        color: white;
        padding: 10px;
        width: 100%;
    }

textarea[b-chnp5bxizv] {
    display: block;
}


.flexTwoColumnContainer[b-chnp5bxizv] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-content: space-between;
}

textarea label[b-chnp5bxizv] > {
    display: block;
}


.paddingForText[b-chnp5bxizv] {
    padding-right: 8px;
}

.labTextFormat[b-chnp5bxizv] {
    padding-right: 50px;
    text-align: right;
}

.noSpin[b-chnp5bxizv]::-webkit-outer-spin-button,
input[type=number][b-chnp5bxizv]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
    pointer-events: none;
}

.inputStyle[b-chnp5bxizv] {
    width: 65%;
}

.formInputs[b-chnp5bxizv] {
    width: 300px;
}

.experimental[b-chnp5bxizv] {
    margin-left: -40px;
}

.formInputs[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
    justify-content: right;
    align-items: center
}

.formInputsMultiLine[b-chnp5bxizv] {
    display: flex;
    align-items: flex-start;
}

.lblWth[b-chnp5bxizv] {
    text-align: right;
    padding-right: .5em;
}

.lblWth-L[b-chnp5bxizv] {
    width: 120px;
    text-align: left;
    padding-right: .5em;
}

.container-flex[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
    margin: 3px;
    border: 1px solid #ccc;
}


.testingContainer[b-chnp5bxizv] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
    border-bottom: solid 1px grey;
    justify-content: space-between;
}

    .testingContainer > *[b-chnp5bxizv] {
        flex-basis: 19%;
        flex-grow: 1;
        flex-shrink: 3;
        min-width: 150px;
        max-width: 400px;
        padding: 5px;
    }


.subContainer-flex[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
}

.myLabel[b-chnp5bxizv] {
    position: relative;
    max-height: 200px;
    max-width: 200px;
    overflow: hidden;
}

img[b-chnp5bxizv] {
    width: 100%;
    height: auto;
    transition: transform .2s;
    overflow: hidden;
}

.myLabel:hover[b-chnp5bxizv] {
    transform: scale(2.5);
    z-index: 1; /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

.tableBottlingMain[b-chnp5bxizv] {
    width: 100%;
    min-height: 150px;
    max-height: 250px;
    overflow-y: scroll;
}

.Parent[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
    gap: 5px;
    align-items: center;
}

.child1[b-chnp5bxizv] {
    width: 33%;
}

.child2[b-chnp5bxizv] {
    width: 33%;
}

.child3[b-chnp5bxizv] {
    width: 33%
}

.itransformidth[b-chnp5bxizv] {
    width: 265px;
}

.upperCase[b-chnp5bxizv] {
    text-transform: uppercase;
}

.lowerCase[b-chnp5bxizv] {
    text-transform: lowercase;
}

.bottlingTag[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
    padding: 2px;
}

thead th[b-chnp5bxizv] {
    position: sticky;
    top: 0;
}

.wineLotButton[b-chnp5bxizv] {
    position: relative;
    background-color: white;
    border: none;
    margin: 0px;
    padding: 0px;
}

    .wineLotButton:hover[b-chnp5bxizv] {
        cursor: pointer;
    }

.notesSection[b-chnp5bxizv] {
    margin: 4px;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

.txtAreaWidth[b-chnp5bxizv] {
    display: block;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    resize: vertical;
}

.flexSaveButtonArea[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 5px;
}

.buttonForLabel[b-chnp5bxizv] {
    position: absolute;
    bottom: 5px;
    right: 5px;
}


.shipping-heading[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
    gap: 5px;
}

.cardHeading[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}


.cardHeadingforBottling[b-chnp5bxizv] {
    display: flex;
    flex-wrap: wrap;
}

    .cardHeadingforBottling > *[b-chnp5bxizv] {
        flex: 1 1 160px;
    }

.card-img[b-chnp5bxizv] {
    width: 100%;
    height: 7vw;
    object-fit: contain;
}

/*.colaColumn {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
    align-items: center;
}*/

.buttonGrid[b-chnp5bxizv] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: auto;
    grid-gap: 5px;
    align-items: baseline;
}

/*.colaColumn2 {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
}*/

.card-img[b-chnp5bxizv] {
    min-height: 50vh;
    object-fit: contain;
}

.row[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
}

.complianceList[b-chnp5bxizv] {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

    .complianceList > li[b-chnp5bxizv] {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

.buttonNoStyle[b-chnp5bxizv] {
    border: none;
    background: none;
}

    .buttonNoStyle:hover[b-chnp5bxizv] {
        color: blue;
        text-decoration: underline;
        cursor: pointer;
    }


.bottleMain[b-chnp5bxizv] {
    display: flex;
    flex-wrap: wrap;
    row-gap: 3px;
}

.bottleInstance[b-chnp5bxizv] {
    flex: 0 1 auto;
    margin: 3px;
}

.packagingMaterials-grid[b-chnp5bxizv] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 5px;
    padding: 5px;
    align-content: center;
    box-sizing: border-box;
}

.packagingMaterials-item[b-chnp5bxizv] {
    background-color: white;
    border: 1px solid black;
    padding: 2px;
    text-align: center;
    justify-content: center;
}

.twoColumn-grid[b-chnp5bxizv] {
    display: grid;
    grid-template-columns: 50px auto;
    gap: 5px;
    justify-content: flex-start;
    align-items: center;
}

.twoBythreeGrid[b-chnp5bxizv] {
    display: grid;
    flex-direction: column;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    gap: 5px;
    align-content: flex-end;
    align-items: center;
    border-bottom: solid 2px grey;
    padding-bottom: 5px;
    padding-top: 5px;
}

    .twoBythreeGrid > p[b-chnp5bxizv] {
        text-align: left;
        margin: 0px;
    }

    .twoBythreeGrid > label[b-chnp5bxizv] {
        text-align: right;
        font-weight: bold;
    }

    .twoBythreeGrid > span[b-chnp5bxizv] {
        font-weight: bold;
    }

.rowNoWrap[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 100%;
    gap: 5px;
}


#tabs[b-chnp5bxizv] {
    width: 500px;
    margin: 0 auto;
}

ul[b-chnp5bxizv] {
    list-style: none;
    border-bottom: 1px solid #ccc;
    margin: 0;
    padding: 0;
}

li.tab[b-chnp5bxizv] {
    display: inline-block;
    cursor: pointer;
}

    li.tab.active[b-chnp5bxizv] {
        border-bottom: 2px solid #000;
    }

    li.tab.inActive[b-chnp5bxizv] {
        border-bottom: none;
    }

.tab-content[b-chnp5bxizv] {
    display: none;
}

    .tab-content.active[b-chnp5bxizv] {
        display: block;
    }

.bottlingDateRow[b-chnp5bxizv] {
    border-bottom: 1px solid lightgrey;
    padding-top: .75rem;
    padding-bottom: .75rem;
}

.testingContainerGrid[b-chnp5bxizv] {
    display: grid;
    gap: 0.25rem;
    padding-top: 1px;
    padding-bottom: 1px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.containerBox[b-chnp5bxizv] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
}

.bottlingDateMainContainer[b-chnp5bxizv] {
    max-height: 490px;
    overflow-y: auto;
}

/* Collapse Controls */
.collapse-controls[b-chnp5bxizv] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    padding: 0.25rem 0.5rem;
    margin-bottom: 0.25rem;
}

.collapse-controls button[b-chnp5bxizv] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
}

/* Collapsible Sections */
.collapsible-section[b-chnp5bxizv] {
    overflow: hidden;
}

.section-header[b-chnp5bxizv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
    border-bottom: 1px solid #dee2e6;
    cursor: pointer;
    user-select: none;
    transition: background 0.15s ease;
}

.section-header:hover[b-chnp5bxizv] {
    background: linear-gradient(to bottom, #e9ecef, #dee2e6);
}

.section-title[b-chnp5bxizv] {
    font-weight: 600;
    font-size: 0.9rem;
    color: #495057;
}

.section-header i[b-chnp5bxizv] {
    color: #6c757d;
    font-size: 0.85rem;
    transition: transform 0.2s ease;
}

/* For card-2 which has two columns */
.section-content-row[b-chnp5bxizv] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

/* ============================================
   Smart Reordering Layout - Collapsed Toolbar
   ============================================ */

.dailyflow-sections[b-chnp5bxizv] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Collapsed Sections Toolbar */
.collapsed-toolbar[b-chnp5bxizv] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.5rem;
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
    border: 1px solid #dee2e6;
    border-radius: 6px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
}

/* Collapsed Tab Button */
.collapsed-tab[b-chnp5bxizv] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 0.75rem;
    background: #fff;
    border: 2px solid #dee2e6;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    color: #495057;
    cursor: pointer;
    transition: all 0.15s ease;
    min-height: 44px; /* iPad touch target */
}

.collapsed-tab:hover[b-chnp5bxizv] {
    background: #f0f0f0;
    border-color: #adb5bd;
}

.collapsed-tab:active[b-chnp5bxizv] {
    transform: scale(0.98);
}

/* Run Details Tab - special styling */
.collapsed-tab.rundetails-tab[b-chnp5bxizv] {
    background: linear-gradient(to bottom, #e3f2fd, #bbdefb);
    border-color: #64b5f6;
    color: #1565c0;
    flex-grow: 1;
    max-width: 400px;
}

.collapsed-tab.rundetails-tab:hover[b-chnp5bxizv] {
    background: linear-gradient(to bottom, #bbdefb, #90caf9);
}

.collapsed-tab .tab-label[b-chnp5bxizv] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

.collapsed-tab i.bi-chevron-down[b-chnp5bxizv] {
    font-size: 0.75rem;
    color: #6c757d;
}

/* Status Indicator Dot */
.status-dot[b-chnp5bxizv] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Status Colors */
.collapsed-tab.status-alarm[b-chnp5bxizv] {
    border-color: rgba(255, 0, 0, 0.5);
}

.collapsed-tab.status-alarm .status-dot[b-chnp5bxizv] {
    background: #dc3545;
    box-shadow: 0 0 6px rgba(255, 0, 0, 0.6);
}

.collapsed-tab.status-accepted[b-chnp5bxizv] {
    border-color: rgba(0, 255, 0, 0.5);
}

.collapsed-tab.status-accepted .status-dot[b-chnp5bxizv] {
    background: #28a745;
    box-shadow: 0 0 6px rgba(0, 255, 0, 0.6);
}

.collapsed-tab.status-waiver[b-chnp5bxizv] {
    border-color: rgba(255, 149, 0, 0.5);
}

.collapsed-tab.status-waiver .status-dot[b-chnp5bxizv] {
    background: #fd7e14;
    box-shadow: 0 0 6px rgba(255, 149, 0, 0.6);
}

/* Expanded Sections Container - Grid allows side-by-side cards */
.expanded-sections[b-chnp5bxizv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 0.5rem;
    align-items: start; /* Cards take natural height, not stretch */
}

/* Section Card */
.section-card[b-chnp5bxizv] {
    display: flex;
    flex-direction: column;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.15);
    background: #fff;
    overflow: hidden;
    min-width: 0; /* Prevent grid blowout */
}

/* Large sections that should span full width */
.section-card.full-width[b-chnp5bxizv] {
    grid-column: 1 / -1;
}

/* Wide sections - span 2 columns when space allows */
.section-card.wide[b-chnp5bxizv] {
    grid-column: span 2;
    min-width: 500px;
}

@media (max-width: 1024px) {
    .section-card.wide[b-chnp5bxizv] {
        grid-column: 1 / -1; /* Full width on smaller screens */
        min-width: 0;
    }
}

.section-card .section-content[b-chnp5bxizv] {
    padding: 0.5rem;
}

/* ============================================
   Responsive - iPad and Mobile Support
   ============================================ */

/* iPad Portrait and smaller */
@media (max-width: 1024px) {
    .collapsed-toolbar[b-chnp5bxizv] {
        padding: 0.4rem;
        gap: 0.4rem;
    }

    .collapsed-tab[b-chnp5bxizv] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }

    .collapsed-tab .tab-label[b-chnp5bxizv] {
        max-width: 150px;
    }

    .collapsed-tab.rundetails-tab[b-chnp5bxizv] {
        max-width: 100%;
        flex-basis: 100%;
    }
}

/* iPad Landscape */
@media (max-width: 1366px) and (min-width: 1025px) {
    .collapsed-tab .tab-label[b-chnp5bxizv] {
        max-width: 180px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .collapsed-toolbar[b-chnp5bxizv] {
        flex-direction: column;
    }

    .collapsed-tab[b-chnp5bxizv] {
        width: 100%;
        justify-content: space-between;
    }

    .collapsed-tab.rundetails-tab[b-chnp5bxizv] {
        max-width: none;
    }

    .collapsed-tab .tab-label[b-chnp5bxizv] {
        max-width: none;
        flex-grow: 1;
    }

    /* Single column on mobile */
    .expanded-sections[b-chnp5bxizv] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Bottling/DailyFlow/Modals/BottlingCOLAControlModal.razor.rz.scp.css */
/* Modal container with constrained height and scrolling */
.cola-modal-container[b-hnyks07wgs] {
  max-height: calc(90vh - 100px);
  display: flex;
  flex-direction: column;
  background: white;
  overflow-x: hidden;
}

.cola-modal-content[b-hnyks07wgs] {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 0 1rem;
}

.cola-modal-footer[b-hnyks07wgs] {
  display: flex;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 1rem;
  border-top: 1px solid #dee2e6;
  background: #f8f9fa;
  flex-shrink: 0;
}

/* Styles for the container */
.mainForm[b-hnyks07wgs] {
  /*  display: flex;
*/ flex-direction: column;
  background-color: white;
  max-height: 90vh;
  overflow-y: auto;
  /*    width:60vw;
*/
}

.container_1[b-hnyks07wgs] {
  background: white;
  margin: 10px 10px;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  text-align: center;
}

/* Styles for the tabs */
.nav-tabs[b-hnyks07wgs] {
  margin: 0 auto;
}

.nav-link[b-hnyks07wgs] {
  display: inline-block;
  border: 1px solid #C5CBD0;
  border-bottom: 0;
  border-radius: 5px 5px 0 0;
  background: #E6EAED;
  padding: .25rem;
  position: relative;
  max-width: 170px;
  transition: background-color 0.3s ease; /* Smooth transition for background color */
}

  .nav-link:hover[b-hnyks07wgs] {
    cursor: pointer;
  }

  .nav-link.selected[b-hnyks07wgs] {
    background: #fff;
    font-weight: bold;
  }

    .nav-link.selected[b-hnyks07wgs]:before {
      content: "";
      position: absolute;
      height: calc(100% + 1px);
      right: -23px;
      top: -1px;
      background: #fff;
      z-index: 7;
    }

    .nav-link.selected[b-hnyks07wgs]:after {
      content: "";
      position: absolute;
      height: calc(100% + 1px);
      right: -24px;
      top: 0;
      border-left: 1px solid #C5CBD0;
      z-index: 6;
    }



.buttonRow[b-hnyks07wgs] {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: 10px;
}

flex-row-select[b-hnyks07wgs] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 10px;
}


.label-info[b-hnyks07wgs] {
  display: flex; /* Add display:flex to create columns within .label-info */
  flex-direction: column; /* Set the flex direction to column for the inner columns */
  justify-content: flex-start; /* Align the content to the right within .label-info */
  margin-right: 0; /* Remove any margin on the right side */
  padding-right: 0; /* Remove any padding on the right side */
}

.label-item[b-hnyks07wgs] {
  text-align: left; /* Align the text to the right within the columns */
}

.left-section[b-hnyks07wgs] {
  flex-basis: 66%;
  align-content: flex-start;
  justify-content: flex-start;
}

.right-section[b-hnyks07wgs] {
  flex-basis: 33%;
  align-content: flex-start;
  justify-content: flex-start;
}

.image-container[b-hnyks07wgs] {
  max-height: 400px; /* Set maximum height for the container */
  display: flex;
  align-items: center; /* Center the image vertically */
  justify-content: center; /* Center the image horizontally */
}

.img-fluid[b-hnyks07wgs] {
  max-height: 100%; /* Ensure the image fits within the container's height */
  max-width: 100%; /* Ensure the image fits within the container's width */
  object-fit: contain; /* Maintain aspect ratio and fit the entire image within the container */
}

.flex-row[b-hnyks07wgs] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  /*max-width: 200px;*/
}


.flex-item[b-hnyks07wgs] {
  position: relative; /* Required for absolute positioning of the close button */
  /* Other styles for your flex items */
}

.close-button[b-hnyks07wgs] {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: red;
  color: white;
  border: none;
  font-size: 12px;
  font-weight: bold;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}

  .close-button:hover[b-hnyks07wgs] {
    background-color: darkred;
  }

/* COLA Card Picker Grid */
.cola-card-grid[b-hnyks07wgs] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 0.75rem;
  max-height: 320px;
  overflow-y: auto;
  padding: 0.5rem;
  background: #f8f9fa;
  border-radius: 8px;
  border: 1px solid #dee2e6;
  transition: max-height 0.2s ease;
}

/* Expanded card grid when preview is hidden */
.cola-card-grid.expanded[b-hnyks07wgs] {
  max-height: calc(90vh - 350px);
}

.cola-card[b-hnyks07wgs] {
  background: white;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  padding: 0.5rem;
  cursor: pointer;
  transition: all 0.15s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.cola-card:hover[b-hnyks07wgs] {
  border-color: #0d6efd;
  box-shadow: 0 2px 8px rgba(13, 110, 253, 0.2);
}

.cola-card.selected[b-hnyks07wgs] {
  border-color: #0d6efd;
  background: #e7f1ff;
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.25);
}

.cola-card.bond-mismatch[b-hnyks07wgs] {
  border-color: #ffc107;
  background: #fff8e6;
}

.cola-card.bond-mismatch:hover[b-hnyks07wgs] {
  border-color: #e0a800;
}

.cola-card-thumbnail[b-hnyks07wgs] {
  width: 100%;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f0f0f0;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 0.5rem;
}

.cola-card-thumbnail img[b-hnyks07wgs] {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.cola-card-thumbnail .no-image[b-hnyks07wgs] {
  color: #999;
  font-size: 0.75rem;
  text-align: center;
}

.cola-card-info[b-hnyks07wgs] {
  width: 100%;
  text-align: center;
  font-size: 0.75rem;
  line-height: 1.3;
}

.cola-card-info .ttb-id[b-hnyks07wgs] {
  font-family: monospace;
  font-size: 0.65rem;
  color: #666;
  margin-bottom: 2px;
}

.cola-card-info .brand[b-hnyks07wgs] {
  font-weight: 600;
  color: #333;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cola-card-info .details[b-hnyks07wgs] {
  color: #666;
  font-size: 0.7rem;
}

.cola-card-badge[b-hnyks07wgs] {
  position: absolute;
  top: 4px;
  right: 4px;
  background: #ffc107;
  color: #000;
  font-size: 0.6rem;
  padding: 2px 4px;
  border-radius: 3px;
  font-weight: bold;
}

.cola-card-wrapper[b-hnyks07wgs] {
  position: relative;
}

.cola-results-info[b-hnyks07wgs] {
  text-align: center;
  padding: 0.5rem;
  color: #666;
  font-size: 0.85rem;
}

.cola-no-results[b-hnyks07wgs] {
  text-align: center;
  padding: 2rem;
  color: #666;
  background: #f8f9fa;
  border-radius: 8px;
  border: 1px dashed #dee2e6;
}

/* ========================================
   COLA Preview Panel - Selected COLA Details
   ======================================== */
.cola-preview-panel[b-hnyks07wgs] {
  background: linear-gradient(135deg, #f8f9fa 0%, #fff 100%);
  border: 1px solid #dee2e6;
  border-radius: 12px;
  margin-top: 0.5rem;
  overflow: hidden;
  overflow-x: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.cola-preview-header[b-hnyks07wgs] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.75rem 1rem;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
}

.cola-preview-title[b-hnyks07wgs] {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.cola-preview-title .brand-name[b-hnyks07wgs] {
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.cola-preview-title .fanciful-name[b-hnyks07wgs] {
  font-size: 0.85rem;
  opacity: 0.9;
  font-style: italic;
}

.cola-preview-header .btn-outline-danger[b-hnyks07wgs] {
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.4);
  color: white;
}

.cola-preview-header .btn-outline-danger:hover[b-hnyks07wgs] {
  background: rgba(220,53,69,0.9);
  border-color: transparent;
}

.cola-preview-body[b-hnyks07wgs] {
  display: flex;
  gap: 1.5rem;
  padding: 1rem;
}

/* Images Section */
.cola-preview-images[b-hnyks07wgs] {
  display: flex;
  gap: 0.75rem;
  flex-shrink: 0;
  align-items: flex-start;
}

.cola-preview-images .preview-image[b-hnyks07wgs] {
  max-height: 180px;
  max-width: 140px;
  object-fit: contain;
  border-radius: 6px;
  border: 1px solid #e9ecef;
  background: white;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}

.cola-preview-images .preview-image:hover[b-hnyks07wgs] {
  transform: scale(1.03);
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.cola-preview-images .no-preview-image[b-hnyks07wgs] {
  width: 140px;
  height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f0f0f0;
  border-radius: 6px;
  color: #999;
  font-size: 0.85rem;
}

/* Details Section */
.cola-preview-details[b-hnyks07wgs] {
  flex: 1;
  display: flex;
  gap: 2rem;
  min-width: 0;
}

.detail-group[b-hnyks07wgs] {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
}

.detail-group.ttb-info[b-hnyks07wgs] {
  flex: 0 0 auto;
  min-width: 200px;
  padding-left: 1.5rem;
  border-left: 2px solid #e9ecef;
}

.detail-row[b-hnyks07wgs] {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  line-height: 1.4;
}

.detail-label[b-hnyks07wgs] {
  font-size: 0.75rem;
  font-weight: 600;
  color: #6c757d;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  flex-shrink: 0;
  min-width: 70px;
}

.detail-value[b-hnyks07wgs] {
  font-size: 0.9rem;
  color: #212529;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.detail-value.mono[b-hnyks07wgs] {
  font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Mono', monospace;
  font-size: 0.85rem;
  background: #f1f3f4;
  padding: 2px 6px;
  border-radius: 4px;
}

.detail-value.status-badge[b-hnyks07wgs] {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
}

.detail-value.status-badge.approved[b-hnyks07wgs] {
  background: #d4edda;
  color: #155724;
}

.detail-value.status-badge.pending[b-hnyks07wgs] {
  background: #fff3cd;
  color: #856404;
}

.detail-value.status-badge.rejected[b-hnyks07wgs] {
  background: #f8d7da;
  color: #721c24;
}

/* ========================================
   Full Spec Display - All COLA Details
   ======================================== */
.cola-preview-details-full[b-hnyks07wgs] {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-width: 0;
  overflow-x: hidden;
}

.spec-group[b-hnyks07wgs] {
  background: white;
  border: 1px solid #e9ecef;
  border-radius: 6px;
  padding: 0.4rem 0.5rem;
}

.spec-group-title[b-hnyks07wgs] {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #6c757d;
  margin-bottom: 0.25rem;
  padding-bottom: 0.2rem;
  border-bottom: 1px solid #e9ecef;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.spec-group-title i[b-hnyks07wgs] {
  color: #667eea;
}

.spec-grid[b-hnyks07wgs] {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.spec-item[b-hnyks07wgs] {
  display: flex;
  align-items: baseline;
  gap: 0.3rem;
  font-size: 0.75rem;
  line-height: 1.3;
}

.spec-item.full-width[b-hnyks07wgs] {
  grid-column: 1 / -1;
}

.spec-label[b-hnyks07wgs] {
  font-weight: 500;
  color: #6c757d;
  flex-shrink: 0;
  min-width: 80px;
}

.spec-value[b-hnyks07wgs] {
  color: #212529;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.spec-value.mono[b-hnyks07wgs] {
  font-family: 'SF Mono', 'Monaco', 'Inconsolata', monospace;
  font-size: 0.75rem;
  background: #f1f3f4;
  padding: 1px 4px;
  border-radius: 3px;
}

.spec-notes[b-hnyks07wgs] {
  font-size: 0.8rem;
  color: #495057;
  white-space: pre-wrap;
  background: #f8f9fa;
  padding: 0.5rem;
  border-radius: 4px;
}

/* Responsive adjustments */
@media (max-width: 992px) {
  .spec-grid[b-hnyks07wgs] {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .cola-preview-body[b-hnyks07wgs] {
    flex-direction: column;
  }

  .cola-preview-images[b-hnyks07wgs] {
    justify-content: center;
  }

  .cola-preview-details[b-hnyks07wgs] {
    flex-direction: column;
    gap: 1rem;
  }

  .cola-preview-details-full[b-hnyks07wgs] {
    max-height: none;
  }

  .detail-group.ttb-info[b-hnyks07wgs] {
    padding-left: 0;
    padding-top: 1rem;
    border-left: none;
    border-top: 2px solid #e9ecef;
  }
}

/* ========================================
   Hover Preview Overlay
   Completely separate from modal - fixed to viewport center
   ======================================== */
.hover-preview-overlay[b-hnyks07wgs] {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10000;
  background: white;
  border-radius: 12px;
  box-shadow: 0 12px 48px rgba(0,0,0,0.4);
  padding: 12px;
  pointer-events: none;
}

.hover-preview-overlay img[b-hnyks07wgs] {
  max-width: 400px;
  max-height: 500px;
  object-fit: contain;
  border-radius: 8px;
  display: block;
}
/* /Pages/Bottling/DailyFlow/Modals/BottlingLabelControlModal.razor.rz.scp.css */
/* Modal container with constrained height and scrolling */
.label-modal-container[b-ywj5uum8o7] {
  max-height: calc(90vh - 100px);
  display: flex;
  flex-direction: column;
  background: white;
  overflow-x: hidden;
}

.label-modal-content[b-ywj5uum8o7] {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 0 1rem;
}

.label-modal-footer[b-ywj5uum8o7] {
  display: flex;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 1rem;
  border-top: 1px solid #dee2e6;
  background: #f8f9fa;
  flex-shrink: 0;
}

/* Styles for the container */
.container_1[b-ywj5uum8o7] {
  background: white;
  margin: 10px 10px;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  text-align: center;
}

/* Styles for the tabs */
.nav-tabs[b-ywj5uum8o7] {
  margin: 0 auto;
}

.nav-link[b-ywj5uum8o7] {
  display: inline-block;
  border: 1px solid #C5CBD0;
  border-bottom: 0;
  border-radius: 5px 5px 0 0;
  background: #E6EAED;
  padding: .25rem;
  position: relative;
  max-width: 170px;
  transition: background-color 0.3s ease;
}

.nav-link:hover[b-ywj5uum8o7] {
  cursor: pointer;
}

.nav-link.active[b-ywj5uum8o7] {
  background: #fff;
  font-weight: bold;
}

/* Label Card Picker Grid */
.label-card-grid[b-ywj5uum8o7] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 0.75rem;
  max-height: 320px;
  overflow-y: auto;
  padding: 0.5rem;
  background: #f8f9fa;
  border-radius: 8px;
  border: 1px solid #dee2e6;
  transition: max-height 0.2s ease;
}

.label-card-grid.expanded[b-ywj5uum8o7] {
  max-height: calc(90vh - 350px);
}

.label-card[b-ywj5uum8o7] {
  background: white;
  border: 2px solid #dee2e6;
  border-radius: 8px;
  padding: 0.5rem;
  cursor: pointer;
  transition: all 0.15s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.label-card:hover[b-ywj5uum8o7] {
  border-color: #0d6efd;
  box-shadow: 0 2px 8px rgba(13, 110, 253, 0.2);
}

.label-card.selected[b-ywj5uum8o7] {
  border-color: #0d6efd;
  background: #e7f1ff;
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.25);
}

.label-card-thumbnail[b-ywj5uum8o7] {
  width: 100%;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f0f0f0;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 0.5rem;
  position: relative;
}

/* Zoom button on thumbnail */
.thumbnail-zoom-btn[b-ywj5uum8o7] {
  position: absolute;
  bottom: 4px;
  right: 4px;
  background: rgba(0, 0, 0, 0.6);
  color: white;
  border: none;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 0.7rem;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.label-card-thumbnail:hover .thumbnail-zoom-btn[b-ywj5uum8o7] {
  opacity: 1;
}

.thumbnail-zoom-btn:hover[b-ywj5uum8o7] {
  background: rgba(0, 0, 0, 0.8);
}

.label-card-thumbnail img[b-ywj5uum8o7] {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.label-card-thumbnail .no-image[b-ywj5uum8o7] {
  color: #999;
  font-size: 0.75rem;
  text-align: center;
}

.label-card-info[b-ywj5uum8o7] {
  width: 100%;
  text-align: center;
  font-size: 0.75rem;
  line-height: 1.3;
}

.label-card-info .brand[b-ywj5uum8o7] {
  font-weight: 600;
  color: #333;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.label-card-info .details[b-ywj5uum8o7] {
  color: #666;
  font-size: 0.7rem;
}

.label-card-wrapper[b-ywj5uum8o7] {
  position: relative;
}

.label-results-info[b-ywj5uum8o7] {
  text-align: center;
  padding: 0.5rem;
  color: #666;
  font-size: 0.85rem;
}

.label-no-results[b-ywj5uum8o7] {
  text-align: center;
  padding: 2rem;
  color: #666;
  background: #f8f9fa;
  border-radius: 8px;
  border: 1px dashed #dee2e6;
}

/* ========================================
   Label Preview Panel - Selected Label Details
   ======================================== */
.label-preview-panel[b-ywj5uum8o7] {
  background: linear-gradient(135deg, #f8f9fa 0%, #fff 100%);
  border: 1px solid #dee2e6;
  border-radius: 12px;
  margin-top: 0.5rem;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.label-preview-header[b-ywj5uum8o7] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem 0.75rem;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
}

.label-preview-title[b-ywj5uum8o7] {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.label-preview-title .brand-name[b-ywj5uum8o7] {
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.label-preview-title .fanciful-name[b-ywj5uum8o7] {
  font-size: 0.8rem;
  opacity: 0.8;
  font-style: italic;
}

.label-preview-header .btn-outline-danger[b-ywj5uum8o7] {
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.4);
  color: white;
}

.label-preview-header .btn-outline-danger:hover[b-ywj5uum8o7] {
  background: rgba(220,53,69,0.9);
  border-color: transparent;
}

.label-preview-body[b-ywj5uum8o7] {
  display: flex;
  gap: 1rem;
  padding: 0.75rem;
  max-height: 400px;
  overflow-y: auto;
  overflow-x: hidden;
}

/* Images Section - constrained height */
.label-preview-images[b-ywj5uum8o7] {
  flex: 0 0 200px;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-height: 280px;
  overflow-y: auto;
}

.preview-image-wrapper[b-ywj5uum8o7] {
  position: relative;
  cursor: zoom-in;
}

.preview-image-wrapper .preview-image[b-ywj5uum8o7] {
  width: 100%;
  max-height: 200px;
  object-fit: contain;
  border-radius: 4px;
  border: 1px solid #dee2e6;
  background: #f8f9fa;
}

.preview-image-wrapper .zoom-hint[b-ywj5uum8o7] {
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,0.7);
  color: white;
  padding: 3px 8px;
  border-radius: 4px;
  font-size: 0.7rem;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.preview-image-wrapper:hover .zoom-hint[b-ywj5uum8o7] {
  opacity: 1;
}

.no-preview-image[b-ywj5uum8o7] {
  color: #999;
  text-align: center;
  padding: 2rem 0;
}

/* Details Section */
.label-preview-details[b-ywj5uum8o7] {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-width: 0;
  font-size: 0.8rem;
}

.spec-group[b-ywj5uum8o7] {
  background: white;
  border: 1px solid #e9ecef;
  border-radius: 6px;
  padding: 0.4rem 0.5rem;
}

.spec-group-title[b-ywj5uum8o7] {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #6c757d;
  margin-bottom: 0.25rem;
  padding-bottom: 0.2rem;
  border-bottom: 1px solid #e9ecef;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.spec-group-title i[b-ywj5uum8o7] {
  color: #667eea;
}

.spec-grid[b-ywj5uum8o7] {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.spec-item[b-ywj5uum8o7] {
  display: flex;
  align-items: baseline;
  gap: 0.3rem;
  font-size: 0.75rem;
  line-height: 1.3;
}

.spec-label[b-ywj5uum8o7] {
  font-weight: 500;
  color: #6c757d;
  flex-shrink: 0;
  min-width: 80px;
}

.spec-value[b-ywj5uum8o7] {
  color: #212529;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.spec-value.mono[b-ywj5uum8o7] {
  font-family: 'SF Mono', 'Monaco', 'Inconsolata', monospace;
  font-size: 0.75rem;
  background: #f1f3f4;
  padding: 1px 4px;
  border-radius: 3px;
}

/* ========================================
   Lightbox Overlay - Click to zoom/close
   ======================================== */
.lightbox-overlay[b-ywj5uum8o7] {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.85);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10002;
  cursor: pointer;
}

.lightbox-content[b-ywj5uum8o7] {
  position: relative;
  max-width: 90vw;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.lightbox-content img[b-ywj5uum8o7] {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
}

.lightbox-close-btn[b-ywj5uum8o7] {
  position: absolute;
  top: -40px;
  right: -40px;
  background: rgba(255, 255, 255, 0.2);
  color: white;
  border: none;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  font-size: 1.2rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease;
}

.lightbox-close-btn:hover[b-ywj5uum8o7] {
  background: rgba(255, 255, 255, 0.4);
}

.lightbox-hint[b-ywj5uum8o7] {
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.8rem;
  margin-top: 1rem;
}

/* ========================================
   Tab Status Icons and Clear Button
   ======================================== */
.tab-status-icon[b-ywj5uum8o7] {
  margin-right: 6px;
  font-size: 0.85rem;
}

.tab-status-icon i.text-warning[b-ywj5uum8o7] {
  color: #ffc107 !important;
}

.tab-status-icon i.text-success[b-ywj5uum8o7] {
  color: #28a745 !important;
}

/* Tab clear button (x) */
.tab-clear-btn[b-ywj5uum8o7] {
  background: transparent;
  border: none;
  color: #6c757d;
  padding: 0 4px;
  margin-left: 6px;
  font-size: 0.9rem;
  cursor: pointer;
  border-radius: 3px;
  line-height: 1;
  transition: all 0.15s ease;
}

.tab-clear-btn:hover[b-ywj5uum8o7] {
  background: rgba(220, 53, 69, 0.15);
  color: #dc3545;
}

.nav-link.active .tab-clear-btn[b-ywj5uum8o7] {
  color: #495057;
}

.nav-link.active .tab-clear-btn:hover[b-ywj5uum8o7] {
  background: rgba(220, 53, 69, 0.2);
  color: #dc3545;
}

/* ========================================
   Unsaved Changes Confirmation Dialog
   ======================================== */
.unsaved-changes-overlay[b-ywj5uum8o7] {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10001;
}

.unsaved-changes-dialog[b-ywj5uum8o7] {
  background: white;
  border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  max-width: 400px;
  width: 90%;
}

.unsaved-changes-dialog .dialog-header[b-ywj5uum8o7] {
  padding: 1rem;
  border-bottom: 1px solid #dee2e6;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.unsaved-changes-dialog .dialog-header i[b-ywj5uum8o7] {
  font-size: 1.25rem;
}

.unsaved-changes-dialog .dialog-body[b-ywj5uum8o7] {
  padding: 1rem;
  color: #495057;
}

.unsaved-changes-dialog .dialog-footer[b-ywj5uum8o7] {
  padding: 1rem;
  border-top: 1px solid #dee2e6;
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .label-preview-body[b-ywj5uum8o7] {
    flex-direction: column;
  }

  .label-preview-images[b-ywj5uum8o7] {
    flex: none;
    flex-direction: row;
    justify-content: center;
    gap: 0.5rem;
  }

  .preview-image-wrapper .preview-image[b-ywj5uum8o7] {
    max-width: 150px;
  }
}
/* /Pages/Bottling/DailyFlow/Modals/BottlingSignOffModal.razor.rz.scp.css */
.buttonRow[b-g26l87i485] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
  gap: 5px;
  border-width: thick;
  border-color: none;
}
.bord[b-g26l87i485] {
  /* Set width and padding for the column */
  width: 25%; /* Adjust width as needed */
  padding: 10px; /* Adjust padding as needed */
  box-sizing: border-box; /* Include padding and border in the element's total width and height */
  /* Add border */
  border: 1px solid #007bff; /* Border color and style */
}

  /* Adjust borders for adjacent columns */
  .bord + .bord[b-g26l87i485] {
    margin-left: -1px; /* Create a small overlap to avoid double borders */
  }
/*
.days {
  flex: 0 1 auto;
  margin: 3px;
}

.tab-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 5px;
  white-space: nowrap;
}*/

/*.tab-link {
  padding: 5px;
  border-radius: 5px;
  border: 1px solid #d9d9d9;
  text-decoration: none;
  color: #000;
  background-color: #f5f5f5;
  margin-right: 5px;
}*/

/*
  .tab-link:hover {
    border: 1px solid black
  }*/

/*.tab-panel.active {
  display: block;
}*/

/*.tab-link:not(.active) {
  background-color: #f5f5f5;
  color: #000;
}*/

/*  .tab-link:not(.active):hover {
    background-color: #e6f7ff;
  }

.tab-link:last-of-type {
  margin-right: 0;
}
*/
.active[b-g26l87i485] {
  background-color: #007bff; /* pretty/popular blue color */
  color: #fff; /* white text to improve visibility */
  border-radius: 5px;
  border: 1px solid #007bff; /* matching border color */
  border-bottom: none;
  height: 100%;
}

.form-row[b-g26l87i485] {
  display: flex;
}

.form-column[b-g26l87i485] {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/*.form-label,
.form-input {
  display: flex;
  align-items: center;
  width: 100%;
}

  .form-label label {
    margin-bottom: 0;
  }

  .form-input input,
  .form-input select,
  .form-input textarea {
    width: 100%;
    margin-bottom: 0;
  }*/

/*textarea {
  width: 100%;
}

  textarea.show {
    display: block;
  }*/


/*.flex-container {
  display: flex;
  justify-content: space-between;
}

.mainContainer .flex-item {
  flex: 2;
  padding: 1px;
  margin: 1px;
  text-align: center;*/ /* Optional; aligns the text in the center */
/*}

.mainContainer .flex-item1 {
  flex: 1;
  padding: 1px;
  margin: 1px;
  text-align: right;*/ /* Optional; aligns the text in the center */
/*}

.mainContainer {
  max-height: 600px;
  overflow-y: auto;
}*/
/*input[type="text"] {
  width: 100px;
  box-sizing: border-box;
}*/
/* /Pages/Bottling/DailyFlow/Modals/BottlingWaiverModal.razor.rz.scp.css */
.bottling-waiver-list-container[b-wm7i32n8pt] {
    max-height: 300px;
    overflow-y: auto;
    border: 1px solid #ccc;
    margin-bottom:10px;
}

.bottling-waiver-item[b-wm7i32n8pt] {
    display: inline-block;
    width: calc(33.33% - 10px);
    margin: 5px;
}

.button-container[b-wm7i32n8pt]{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
justify-content:flex-end;
gap:5px;

}

.headerRow[b-wm7i32n8pt]{
display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    justify-content:space-between;
    align-items:center;
    gap:5px;
}
    .headerRow input.form-input[b-wm7i32n8pt] {
        max-width: 200px; /* For example, you can change this value to your desired width */
    }
/* /Pages/Bottling/DailyFlow/Modals/BottlingWinemaking.razor.rz.scp.css */
.colaOrLabelItem-waiver[b-ge08ka9umi] {
    border: 1px solid lightgrey;
    padding: 0px;
    max-width: 400px;
    box-shadow: 0 0 10px 5px rgba(255, 149, 0, 0.7); /* Even more intense amber shadow */
    z-index: 1;
}

.colaOrLabelItem[b-ge08ka9umi] {
    border: 1px solid lightgrey;
    padding: 0px;
    max-width: 400px;
}

.colaOrLabelItem-alarm[b-ge08ka9umi] {
    border: 1px solid lightgrey;
    padding: 0px;
    max-width: 400px;
    box-shadow: 0 0 10px rgba(255, 0, 0, 0.7); /* Red shadow with increased intensity */
}

.colaOrLabelItem-accepted[b-ge08ka9umi] {
    border: 1px solid lightgrey;
    padding: 0px;
    max-width: 400px;
    box-shadow: 0 0 10px rgba(0, 255, 0, 0.7); /* Increased intensity with higher RGB values */
}

.card[b-ge08ka9umi] {
    flex: 0 1 auto;
    margin: 3px;
    border: 1px solid #ccc;
    box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.3);
}



    .card .text[b-ge08ka9umi] {
        padding: 0 10px 10px;
    }

        .card .text > button[b-ge08ka9umi] {
            background: gray;
            border: 0;
            color: white;
            padding: 10px;
            width: 100%;
        }


.containerBox[b-ge08ka9umi] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
}/*

    .containerBox input[type="checkbox"] {
        margin: 0;
        padding: 0;
        width: 20px;
        height: 20px;
    }*/
.round-button[b-ge08ka9umi] {
    background-color: gray;
    color: white;
    border: none;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.arrow-up[b-ge08ka9umi]::before,
.arrow-down[b-ge08ka9umi]::before {
    content: attr(data-arrow); /* Use attribute to set the arrow */
}

.arrow-up[b-ge08ka9umi] {
    /* Additional styles specific to up arrow button, if needed */
}

.arrow-down[b-ge08ka9umi] {
    /* Additional styles specific to down arrow button, if needed */
}
.space[b-ge08ka9umi]{
    margin:5px 0px 5px 0px;
    height:auto;

}
.addContainer[b-ge08ka9umi] {
   max-height:300px;
    overflow-y:auto;
    margin-bottom:10px;
}

.lblWth[b-ge08ka9umi] {
    text-align: right;
    padding-right: .5em;
}

.lblWth-L[b-ge08ka9umi] {
    width: 120px;
    text-align: left;
    padding-right: .5em;
}

.formInputs[b-ge08ka9umi] {
    display: flex;
    flex-direction: row;
    justify-content: right;
    align-items: center;
    width: 300px;
}

.inputStyle[b-ge08ka9umi] {
    width: 65%;
}

.form-group[b-ge08ka9umi] {
    display: flex;
    align-items: flex-start;
}

textarea[b-ge08ka9umi] {
    display: block;
}

.txtAreaWidth[b-ge08ka9umi] {
    display: block;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    resize: vertical;
}

textarea label[b-ge08ka9umi] > {
    display: block;
}

.notesSection[b-ge08ka9umi] {
    margin: 4px;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

.buttonRow[b-ge08ka9umi] {
    margin: 4px;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    gap: 5px;
}

.tab-container[b-ge08ka9umi] {
    border: 1px solid #d9d9d9;
    padding: 3px;
}

.custom-btn[b-ge08ka9umi] {
    font-size: 14px; /* Adjust the font size as needed */
    white-space: normal; /* Allow text to wrap */
    max-width: 150px; /* Optional: Set a max width to control wrapping */
}



.tab-nav[b-ge08ka9umi] {
    display: flex;
    margin-bottom: 5px; /* add some space between the rows of tabs */
}

.tab-link[b-ge08ka9umi] {
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #d9d9d9;
    border-bottom: none;
    text-decoration: none;
    color: #000;
    background-color: #f5f5f5;
    margin-right: 5px;
}

    .tab-link:hover[b-ge08ka9umi] {
        border: 1px solid black
    }

.active[b-ge08ka9umi] {
    background-color: #007bff; /* pretty/popular blue color */
    color: #fff; /* white text to improve visibility */
    border-radius: 5px;
    border: 1px solid #007bff; /* matching border color */
    border-bottom: none;
    height: 100%;
}

#content[b-ge08ka9umi] {
    resize: none; /* Prevent manual resizing */
    overflow: hidden; /* Hide scrollbars */
    height: auto; /* Set initial height to auto */
}

.auto-resize-textarea[b-ge08ka9umi] {
    height: auto; /* Set initial height to auto */
    min-height: 2em; /* Set a minimum height */
    resize: none; /* Prevent manual resizing */
    overflow: hidden; /* Hide scrollbars */
}

    .auto-resize-textarea:invalid[b-ge08ka9umi] {
        height: 2em; /* Set height to minimum when empty */
    }

.tab-panel[b-ge08ka9umi] {
    display: none;
    padding: 10px;
    background-color: #fff;
    color: black;
    border: 1px solid #d9d9d9;
    height: 100%;
}

    .tab-panel.active[b-ge08ka9umi] {
        display: block;
    }

label[b-ge08ka9umi] {
    font-weight: bold;
}

.tab-link:not(.active)[b-ge08ka9umi] {
    background-color: #f5f5f5;
    color: #000;
}

    .tab-link:not(.active):hover[b-ge08ka9umi] {
        background-color: #e6f7ff;
    }

.tab-link:last-of-type[b-ge08ka9umi] {
    margin-right: 0;
}

.col-md-3[b-ge08ka9umi] {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto; /* Enable horizontal scrolling */
}

    .col-md-3 .item[b-ge08ka9umi] {
        flex-shrink: 0;
        margin-right: 10px; /* Add spacing between items */
    }

.container[b-ge08ka9umi] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.input-container[b-ge08ka9umi] {
    display: flex;
    align-items: center;
}

label[b-ge08ka9umi] {
    margin-bottom: 10px;
    font-weight: bold;
}

select[b-ge08ka9umi] {
    margin-right: 10px;
}

.btn-link[b-ge08ka9umi] {
    font-size: 1.5rem; /* Adjust the font size as needed */
    text-decoration: none; /* Remove the underline */
    padding: 0px;
    border: none;
    background-color: white;
}

.marginSet[b-ge08ka9umi] {
    margin-right: 10px;
}

.toDoBox[b-ge08ka9umi]{
    border-top:1px solid grey;
    
}
.specsBox[b-ge08ka9umi] {
    margin-top: 10px;
}
.item-list[b-ge08ka9umi] {
    display: flex;
    flex-direction: row-reverse; /* This will reverse the order of items */
    flex-wrap: wrap;
    gap: 10px;
}


[b-ge08ka9umi] .bottling-form-inputs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 5px;
}

[b-ge08ka9umi] .bottling-label {
    width: 50%;
    text-align: left;
    padding-right: 10px;
    margin-bottom: 0;
}

[b-ge08ka9umi] .bottling-input {
    width: 50%;
}
.row[b-ge08ka9umi]{
    width:100%;
}
select[b-ge08ka9umi]{
    margin-right:0px;
}
.input-row[b-ge08ka9umi] {
    display: flex;
  
    align-items: center;
    margin-bottom: 0px;
}

.inline-label[b-ge08ka9umi] {
    width: 120px; /* Adjust as needed */
    margin-right: 10px;
    margin-bottom: 0px;
}

.form-input[b-ge08ka9umi] {
    width: 100%;
    box-sizing: border-box;
}
/* /Pages/Bottling/DailyFlow/Modals/ProfileAssignmentModal.razor.rz.scp.css */
.assignment-modal[b-kypb0yv18w] {
    background: #fff;
    border-radius: 8px;
    max-width: 500px;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
}

.modal-header[b-kypb0yv18w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #dee2e6;
}

.modal-header h5[b-kypb0yv18w] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.modal-body[b-kypb0yv18w] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
}

.modal-footer[b-kypb0yv18w] {
    padding: 0.75rem 1rem;
    border-top: 1px solid #dee2e6;
    display: flex;
    justify-content: flex-end;
}

/* Sections */
.profiles-section[b-kypb0yv18w],
.dates-section[b-kypb0yv18w] {
    margin-bottom: 1rem;
}

.section-label[b-kypb0yv18w] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.section-label .hint[b-kypb0yv18w] {
    font-weight: 400;
    text-transform: none;
    font-style: italic;
    margin-left: 0.5rem;
}

/* Profile list */
.profile-list[b-kypb0yv18w] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.profile-item[b-kypb0yv18w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
}

.profile-item:hover[b-kypb0yv18w] {
    background: #e9ecef;
    border-color: #dee2e6;
}

.profile-item.selected[b-kypb0yv18w] {
    background: #e7f1ff;
    border-color: #0d6efd;
}

.profile-info[b-kypb0yv18w] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.profile-name[b-kypb0yv18w] {
    font-size: 0.85rem;
    font-weight: 500;
}

.profile-details[b-kypb0yv18w] {
    font-size: 0.7rem;
    color: #6c757d;
}

.assigned-badge[b-kypb0yv18w] {
    background: #6c757d;
    color: white;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.15rem 0.4rem;
    border-radius: 10px;
    min-width: 20px;
    text-align: center;
}

.profile-item.selected .assigned-badge[b-kypb0yv18w] {
    background: #0d6efd;
}

/* Dates list */
.dates-list[b-kypb0yv18w] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    max-height: 250px;
    overflow-y: auto;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    padding: 0.5rem;
}

.date-item[b-kypb0yv18w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.35rem 0.5rem;
    border-radius: 3px;
    transition: background 0.15s;
}

.date-item:hover[b-kypb0yv18w] {
    background: #f8f9fa;
}

.date-item.assigned-to-selected[b-kypb0yv18w] {
    background: #e7f1ff;
}

.date-checkbox[b-kypb0yv18w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    margin: 0;
}

.date-checkbox input[type="checkbox"][b-kypb0yv18w] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.date-checkbox input[type="checkbox"]:disabled[b-kypb0yv18w] {
    cursor: not-allowed;
    opacity: 0.5;
}

.date-info[b-kypb0yv18w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.date-seq[b-kypb0yv18w] {
    font-size: 0.7rem;
    color: #6c757d;
    font-weight: 500;
    min-width: 24px;
}

.date-value[b-kypb0yv18w] {
    font-size: 0.8rem;
    font-weight: 500;
}

.date-size[b-kypb0yv18w] {
    font-size: 0.7rem;
    color: #6c757d;
}

.current-profile[b-kypb0yv18w] {
    font-size: 0.7rem;
    color: #198754;
    display: flex;
    align-items: center;
    gap: 0.15rem;
}

.current-profile i[b-kypb0yv18w] {
    font-size: 0.8rem;
}

.no-profile[b-kypb0yv18w] {
    font-size: 0.7rem;
    color: #adb5bd;
    font-style: italic;
}

/* Action bar */
.action-bar[b-kypb0yv18w] {
    padding: 0.75rem;
    background: #f8f9fa;
    border-radius: 4px;
    margin-top: 0.5rem;
    text-align: center;
}

.action-bar.secondary[b-kypb0yv18w] {
    background: transparent;
    padding: 0.5rem;
}
/* /Pages/Bottling/DailyFlow/Modals/SuggestedCaseStickerModal.razor.rz.scp.css */
.redFont[b-syy251hvwl]{
  color: red;
}
#printableContent.bordersAround[b-syy251hvwl] {
  border: 1px solid black;
  border-radius: 5px;
}

.font-arial[b-syy251hvwl] {
  font-family: Arial, sans-serif;
}

.font-verdana[b-syy251hvwl] {
  font-family: Verdana, sans-serif;
}

.font-georgia[b-syy251hvwl] {
  font-family: Georgia, serif;
}

.font-times[b-syy251hvwl] {
  font-family: 'Times New Roman', Times, serif;
}

.font-comic[b-syy251hvwl] {
  font-family: 'Comic Sans MS', cursive, sans-serif;
}
.font-helvetica[b-syy251hvwl] {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.qr-code-img[b-syy251hvwl] {
  max-width: 100px; /* Set the maximum width as per your requirement */
  width: 100%; /* Ensure the image scales down if necessary */
  height: auto; /* Maintain the aspect ratio */
}
.scrollable-div[b-syy251hvwl] {
  max-height: 80vh;
  overflow-y: auto;
  overflow-x: hidden; /* Prevent horizontal scrolling */
  box-sizing: border-box; /* Ensure padding and border are included in the height and width */
  padding-right: 16px; /* Adjust this value based on the approximate width of the scrollbar */
}
/* /Pages/Bottling/DailyFlow/Panels/BottlingCOLAPanel.razor.rz.scp.css */
/* Content wrapper - enables sticky footer */
.panel-content-wrapper[b-gs2uwh0zb9] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Grid layout for sidebar + body */
.panel-main[b-gs2uwh0zb9] {
    display: grid;
    grid-template-columns: 260px 1fr;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* Date Tabs Sidebar */
.dates-sidebar[b-gs2uwh0zb9] {
    display: flex;
    flex-direction: column;
    background: var(--bs-light);
    border-right: 1px solid var(--bs-border-color);
    min-height: 0;
}

.sidebar-header[b-gs2uwh0zb9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--bs-border-color);
    background: var(--bs-white);
    flex-shrink: 0;
}

.sidebar-title[b-gs2uwh0zb9] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--bs-primary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.sidebar-title i[b-gs2uwh0zb9] {
    margin-right: 0.25rem;
}

.sidebar-count[b-gs2uwh0zb9] {
    font-size: 0.65rem;
    color: var(--bs-secondary);
}

.sidebar-content[b-gs2uwh0zb9] {
    flex: 1;
    overflow-y: auto;
    padding: 0.5rem;
}

/* Date Cards */
.date-card[b-gs2uwh0zb9] {
    position: relative;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.35rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 6px;
    cursor: pointer;
    background: white;
    transition: all 0.15s;
}

.date-card:last-child[b-gs2uwh0zb9] {
    margin-bottom: 0;
}

.date-card:hover[b-gs2uwh0zb9] {
    background: var(--bs-gray-100);
    border-color: var(--bs-primary);
}

.date-card.selected[b-gs2uwh0zb9] {
    border-color: var(--bs-primary);
    border-left: 4px solid var(--bs-primary);
    background: var(--bs-primary-bg-subtle);
    box-shadow: 0 0 0 2px rgba(var(--bs-primary-rgb), 0.15);
}

.date-card-header[b-gs2uwh0zb9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    font-size: 0.85rem;
}

.date-card-header i[b-gs2uwh0zb9] {
    font-size: 0.75rem;
}

.date-name[b-gs2uwh0zb9] {
    flex: 1;
}

.date-card-sub[b-gs2uwh0zb9] {
    font-size: 0.75rem;
    color: var(--bs-secondary);
    margin-top: 0.15rem;
    padding-left: 1.25rem;
}

/* Panel Body */
.panel-body[b-gs2uwh0zb9] {
    padding: 0.75rem;
    overflow-y: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Search & Filter Bar */
.search-filter-bar[b-gs2uwh0zb9] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 0.75rem;
}

.search-input-group[b-gs2uwh0zb9] {
    flex: 1;
    min-width: 200px;
    display: flex;
    align-items: center;
    background: white;
    border: 1px solid var(--bs-border-color);
    border-radius: 4px;
    padding: 0 0.5rem;
}

.search-input-group i[b-gs2uwh0zb9] {
    color: var(--bs-secondary);
    font-size: 0.85rem;
}

.search-input-group input[b-gs2uwh0zb9] {
    border: none;
    background: transparent;
    padding: 0.35rem 0.5rem;
    flex: 1;
}

.search-input-group input:focus[b-gs2uwh0zb9] {
    outline: none;
    box-shadow: none;
}

.btn-clear-search[b-gs2uwh0zb9] {
    background: transparent;
    border: none;
    color: var(--bs-secondary);
    padding: 0.25rem;
    cursor: pointer;
}

.btn-clear-search:hover[b-gs2uwh0zb9] {
    color: var(--bs-danger);
}

.filter-controls[b-gs2uwh0zb9] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.sort-select[b-gs2uwh0zb9] {
    width: auto;
    min-width: 130px;
}

.all-clients-toggle[b-gs2uwh0zb9] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
    font-size: 0.8rem;
    cursor: pointer;
}

.result-count[b-gs2uwh0zb9] {
    font-size: 0.75rem;
    color: var(--bs-secondary);
    white-space: nowrap;
}

/* View Toggle */
.view-toggle-bar[b-gs2uwh0zb9] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

/* COLA Card Grid */
.cola-card-grid[b-gs2uwh0zb9] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0.75rem;
    flex: 1;
    overflow-y: auto;
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #dee2e6;
}

.cola-card-wrapper[b-gs2uwh0zb9] {
    position: relative;
}

.cola-card[b-gs2uwh0zb9] {
    background: white;
    border: 2px solid #dee2e6;
    border-radius: 8px;
    padding: 0.5rem;
    cursor: pointer;
    transition: all 0.15s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cola-card:hover[b-gs2uwh0zb9] {
    border-color: #0d6efd;
    box-shadow: 0 2px 8px rgba(13, 110, 253, 0.2);
}

.cola-card.selected[b-gs2uwh0zb9] {
    border-color: #0d6efd;
    background: #e7f1ff;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.25);
}

.cola-card.bond-mismatch[b-gs2uwh0zb9] {
    border-color: #ffc107;
    background: #fff8e6;
}

.cola-card.bond-mismatch:hover[b-gs2uwh0zb9] {
    border-color: #e0a800;
}

.cola-card-thumbnail[b-gs2uwh0zb9] {
    width: 100%;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f0f0f0;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

.cola-card-thumbnail img[b-gs2uwh0zb9] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.cola-card-thumbnail .no-image[b-gs2uwh0zb9] {
    color: #999;
    font-size: 0.75rem;
    text-align: center;
}

.cola-card-info[b-gs2uwh0zb9] {
    width: 100%;
    text-align: center;
    font-size: 0.75rem;
    line-height: 1.3;
}

.cola-card-info .ttb-id[b-gs2uwh0zb9] {
    font-family: monospace;
    font-size: 0.65rem;
    color: #666;
    margin-bottom: 2px;
}

.cola-card-info .brand[b-gs2uwh0zb9] {
    font-weight: 600;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cola-card-info .details[b-gs2uwh0zb9] {
    color: #666;
    font-size: 0.7rem;
}

.cola-card-info .client-hint[b-gs2uwh0zb9] {
    color: #0d6efd;
    font-size: 0.65rem;
    margin-top: 0.15rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cola-card-badge[b-gs2uwh0zb9] {
    position: absolute;
    top: 4px;
    right: 4px;
    background: #ffc107;
    color: #000;
    font-size: 0.6rem;
    padding: 2px 4px;
    border-radius: 3px;
    font-weight: bold;
}

/* Load More */
.load-more-section[b-gs2uwh0zb9] {
    text-align: center;
    padding: 0.75rem;
    margin-top: 0.5rem;
}

/* Empty State */
.empty-state[b-gs2uwh0zb9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 3rem;
    color: var(--bs-secondary);
    font-size: 0.9rem;
    text-align: center;
}

.empty-state i[b-gs2uwh0zb9] {
    font-size: 2rem;
    opacity: 0.5;
}

.empty-state small[b-gs2uwh0zb9] {
    font-size: 0.8rem;
    color: var(--bs-secondary);
}

/* COLA Preview Panel */
.cola-preview-panel[b-gs2uwh0zb9] {
    background: linear-gradient(135deg, #f8f9fa 0%, #fff 100%);
    border: 1px solid #dee2e6;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    flex: 1;
    display: flex;
    flex-direction: column;
}

.cola-preview-header[b-gs2uwh0zb9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    flex-shrink: 0;
}

.cola-preview-title[b-gs2uwh0zb9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.cola-preview-title .brand-name[b-gs2uwh0zb9] {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.cola-preview-title .fanciful-name[b-gs2uwh0zb9] {
    font-size: 0.8rem;
    opacity: 0.8;
    font-style: italic;
}

.preview-actions[b-gs2uwh0zb9] {
    display: flex;
    gap: 0.35rem;
}

.cola-preview-header .btn-outline-light[b-gs2uwh0zb9] {
    border-color: rgba(255,255,255,0.5);
}

.cola-preview-header .btn-outline-light:hover[b-gs2uwh0zb9] {
    background: rgba(255,255,255,0.2);
}

.cola-preview-header .btn-outline-danger[b-gs2uwh0zb9] {
    background: rgba(255,255,255,0.15);
    border-color: rgba(255,255,255,0.4);
    color: white;
}

.cola-preview-header .btn-outline-danger:hover[b-gs2uwh0zb9] {
    background: rgba(220,53,69,0.9);
    border-color: transparent;
}

.cola-preview-body[b-gs2uwh0zb9] {
    display: flex;
    gap: 1rem;
    padding: 0.75rem;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
}

/* Images Section */
.cola-preview-images[b-gs2uwh0zb9] {
    flex: 0 0 200px;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 300px;
    overflow-y: auto;
}

.preview-image-wrapper[b-gs2uwh0zb9] {
    position: relative;
    cursor: zoom-in;
}

.preview-image-wrapper .preview-image[b-gs2uwh0zb9] {
    width: 100%;
    max-height: 180px;
    object-fit: contain;
    border-radius: 4px;
    border: 1px solid #dee2e6;
    background: #f8f9fa;
}

.preview-image-wrapper .zoom-hint[b-gs2uwh0zb9] {
    position: absolute;
    bottom: 4px;
    right: 4px;
    background: rgba(0,0,0,0.6);
    color: white;
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 0.65rem;
}

.no-preview-image[b-gs2uwh0zb9] {
    color: #999;
    text-align: center;
    padding: 2rem 0;
}

/* Details Section */
.cola-preview-details[b-gs2uwh0zb9] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    min-width: 0;
    font-size: 0.8rem;
}

.spec-group[b-gs2uwh0zb9] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 0.4rem 0.5rem;
}

.spec-group-title[b-gs2uwh0zb9] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #6c757d;
    margin-bottom: 0.25rem;
    padding-bottom: 0.2rem;
    border-bottom: 1px solid #e9ecef;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.spec-group-title i[b-gs2uwh0zb9] {
    color: #667eea;
}

.spec-grid[b-gs2uwh0zb9] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.spec-item[b-gs2uwh0zb9] {
    display: flex;
    align-items: baseline;
    gap: 0.3rem;
    font-size: 0.75rem;
    line-height: 1.3;
}

.spec-label[b-gs2uwh0zb9] {
    font-weight: 500;
    color: #6c757d;
    flex-shrink: 0;
    min-width: 95px;
}

.spec-value[b-gs2uwh0zb9] {
    color: #212529;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.spec-value.mono[b-gs2uwh0zb9] {
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', monospace;
    font-size: 0.75rem;
    background: #f1f3f4;
    padding: 1px 4px;
    border-radius: 3px;
}

.spec-value.status-badge[b-gs2uwh0zb9] {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
}

.spec-value.status-badge.approved[b-gs2uwh0zb9] {
    background: #d4edda;
    color: #155724;
}

.spec-value.status-badge.pending[b-gs2uwh0zb9] {
    background: #fff3cd;
    color: #856404;
}

/* Panel Footer */
.panel-footer[b-gs2uwh0zb9] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    border-top: 1px solid var(--bs-border-color);
    background: var(--bs-white);
    flex-shrink: 0;
}

/* Header context */
.header-context[b-gs2uwh0zb9] {
    font-size: 0.8rem;
    font-weight: normal;
    color: var(--bs-secondary);
    margin-left: 0.5rem;
}

/* Hover Preview Overlay - completely separate from panel */
.hover-preview-overlay[b-gs2uwh0zb9] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10000;
    background: white;
    border-radius: 12px;
    box-shadow: 0 12px 48px rgba(0,0,0,0.4);
    padding: 12px;
    pointer-events: none;
}

.hover-preview-overlay img[b-gs2uwh0zb9] {
    max-width: 400px;
    max-height: 500px;
    object-fit: contain;
    border-radius: 8px;
    display: block;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .panel-main[b-gs2uwh0zb9] {
        grid-template-columns: 1fr;
    }

    .dates-sidebar[b-gs2uwh0zb9] {
        max-height: 160px;
        border-right: none;
        border-bottom: 1px solid var(--bs-border-color);
    }

    .sidebar-content[b-gs2uwh0zb9] {
        display: flex;
        flex-direction: row;
        overflow-x: auto;
        overflow-y: hidden;
        gap: 0.5rem;
        padding: 0.5rem;
    }

    .date-card[b-gs2uwh0zb9] {
        flex: 0 0 auto;
        min-width: 120px;
        margin-bottom: 0;
    }

    .search-filter-bar[b-gs2uwh0zb9] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-input-group[b-gs2uwh0zb9] {
        min-width: 100%;
    }

    .filter-controls[b-gs2uwh0zb9] {
        flex-wrap: wrap;
    }

    .cola-card-grid[b-gs2uwh0zb9] {
        grid-template-columns: repeat(2, 1fr);
    }

    .cola-preview-body[b-gs2uwh0zb9] {
        flex-direction: column;
    }

    .cola-preview-images[b-gs2uwh0zb9] {
        flex: none;
        flex-direction: row;
        justify-content: center;
        gap: 0.5rem;
        max-height: none;
    }

    .preview-image-wrapper .preview-image[b-gs2uwh0zb9] {
        max-width: 150px;
    }
}
/* /Pages/Bottling/DailyFlow/Panels/BottlingLabelPanel.razor.rz.scp.css */
/* Content wrapper - enables sticky footer */
.panel-content-wrapper[b-v56vg67tsb] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Grid layout for sidebar + body */
.panel-main[b-v56vg67tsb] {
    display: grid;
    grid-template-columns: 260px 1fr;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* Date Tabs Sidebar */
.dates-sidebar[b-v56vg67tsb] {
    display: flex;
    flex-direction: column;
    background: var(--bs-light);
    border-right: 1px solid var(--bs-border-color);
    min-height: 0;
}

.sidebar-header[b-v56vg67tsb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--bs-border-color);
    background: var(--bs-white);
    flex-shrink: 0;
}

.sidebar-title[b-v56vg67tsb] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--bs-primary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.sidebar-title i[b-v56vg67tsb] {
    margin-right: 0.25rem;
}

.sidebar-count[b-v56vg67tsb] {
    font-size: 0.65rem;
    color: var(--bs-secondary);
}

.sidebar-content[b-v56vg67tsb] {
    flex: 1;
    overflow-y: auto;
    padding: 0.5rem;
}

/* Date Cards */
.date-card[b-v56vg67tsb] {
    position: relative;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.35rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 6px;
    cursor: pointer;
    background: white;
    transition: all 0.15s;
}

.date-card:last-child[b-v56vg67tsb] {
    margin-bottom: 0;
}

.date-card:hover[b-v56vg67tsb] {
    background: var(--bs-gray-100);
    border-color: var(--bs-primary);
}

.date-card.selected[b-v56vg67tsb] {
    border-color: var(--bs-primary);
    border-left: 4px solid var(--bs-primary);
    background: var(--bs-primary-bg-subtle);
    box-shadow: 0 0 0 2px rgba(var(--bs-primary-rgb), 0.15);
}

.date-card.dirty[b-v56vg67tsb] {
    border-left: 4px solid var(--bs-warning);
}

.date-card.selected.dirty[b-v56vg67tsb] {
    border-left: 4px solid var(--bs-warning);
}

.date-card-header[b-v56vg67tsb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    font-size: 0.85rem;
}

.date-card-header i[b-v56vg67tsb] {
    font-size: 0.75rem;
}

.date-name[b-v56vg67tsb] {
    flex: 1;
}

.date-card-sub[b-v56vg67tsb] {
    font-size: 0.75rem;
    color: var(--bs-secondary);
    margin-top: 0.15rem;
    padding-left: 1.25rem;
}

.date-clear-btn[b-v56vg67tsb] {
    position: absolute;
    top: 4px;
    right: 4px;
    background: transparent;
    border: none;
    color: var(--bs-secondary);
    padding: 2px 6px;
    font-size: 0.85rem;
    cursor: pointer;
    border-radius: 3px;
    line-height: 1;
    transition: all 0.15s ease;
}

.date-clear-btn:hover[b-v56vg67tsb] {
    background: rgba(220, 53, 69, 0.15);
    color: #dc3545;
}

/* Panel Body */
.panel-body[b-v56vg67tsb] {
    padding: 0.75rem;
    overflow-y: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Search & Filter Bar */
.search-filter-bar[b-v56vg67tsb] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 0.75rem;
}

.search-input-group[b-v56vg67tsb] {
    flex: 1;
    min-width: 200px;
    display: flex;
    align-items: center;
    background: white;
    border: 1px solid var(--bs-border-color);
    border-radius: 4px;
    padding: 0 0.5rem;
}

.search-input-group i[b-v56vg67tsb] {
    color: var(--bs-secondary);
    font-size: 0.85rem;
}

.search-input-group input[b-v56vg67tsb] {
    border: none;
    background: transparent;
    padding: 0.35rem 0.5rem;
    flex: 1;
}

.search-input-group input:focus[b-v56vg67tsb] {
    outline: none;
    box-shadow: none;
}

.btn-clear-search[b-v56vg67tsb] {
    background: transparent;
    border: none;
    color: var(--bs-secondary);
    padding: 0.25rem;
    cursor: pointer;
}

.btn-clear-search:hover[b-v56vg67tsb] {
    color: var(--bs-danger);
}

.filter-controls[b-v56vg67tsb] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.sort-select[b-v56vg67tsb] {
    width: auto;
    min-width: 130px;
}

.all-clients-toggle[b-v56vg67tsb] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
    font-size: 0.8rem;
    cursor: pointer;
}

.result-count[b-v56vg67tsb] {
    font-size: 0.75rem;
    color: var(--bs-secondary);
    white-space: nowrap;
}

/* View Toggle */
.view-toggle-bar[b-v56vg67tsb] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

/* Label Card Grid */
.label-card-grid[b-v56vg67tsb] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0.75rem;
    flex: 1;
    overflow-y: auto;
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #dee2e6;
}

.label-card-wrapper[b-v56vg67tsb] {
    position: relative;
}

.label-card[b-v56vg67tsb] {
    background: white;
    border: 2px solid #dee2e6;
    border-radius: 8px;
    padding: 0.5rem;
    cursor: pointer;
    transition: all 0.15s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.label-card:hover[b-v56vg67tsb] {
    border-color: #0d6efd;
    box-shadow: 0 2px 8px rgba(13, 110, 253, 0.2);
}

.label-card.selected[b-v56vg67tsb] {
    border-color: #0d6efd;
    background: #e7f1ff;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.25);
}

.label-card-thumbnail[b-v56vg67tsb] {
    width: 100%;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f0f0f0;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 0.5rem;
    position: relative;
}

.label-card-thumbnail img[b-v56vg67tsb] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.label-card-thumbnail .no-image[b-v56vg67tsb] {
    color: #999;
    font-size: 0.75rem;
    text-align: center;
}

.thumbnail-zoom-btn[b-v56vg67tsb] {
    position: absolute;
    bottom: 4px;
    right: 4px;
    background: rgba(0, 0, 0, 0.6);
    color: white;
    border: none;
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 0.7rem;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.label-card-thumbnail:hover .thumbnail-zoom-btn[b-v56vg67tsb] {
    opacity: 1;
}

.thumbnail-zoom-btn:hover[b-v56vg67tsb] {
    background: rgba(0, 0, 0, 0.8);
}

.label-card-info[b-v56vg67tsb] {
    width: 100%;
    text-align: center;
    font-size: 0.75rem;
    line-height: 1.3;
}

.label-card-info .brand[b-v56vg67tsb] {
    font-weight: 600;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.label-card-info .details[b-v56vg67tsb] {
    color: #666;
    font-size: 0.7rem;
}

.label-card-info .client-hint[b-v56vg67tsb] {
    color: #0d6efd;
    font-size: 0.65rem;
    margin-top: 0.15rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Load More */
.load-more-section[b-v56vg67tsb] {
    text-align: center;
    padding: 0.75rem;
    margin-top: 0.5rem;
}

/* Empty State */
.empty-state[b-v56vg67tsb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 3rem;
    color: var(--bs-secondary);
    font-size: 0.9rem;
    text-align: center;
}

.empty-state i[b-v56vg67tsb] {
    font-size: 2rem;
    opacity: 0.5;
}

.empty-state small[b-v56vg67tsb] {
    font-size: 0.8rem;
    color: var(--bs-secondary);
}

/* Label Preview Panel */
.label-preview-panel[b-v56vg67tsb] {
    background: linear-gradient(135deg, #f8f9fa 0%, #fff 100%);
    border: 1px solid #dee2e6;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    flex: 1;
    display: flex;
    flex-direction: column;
}

.label-preview-header[b-v56vg67tsb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    flex-shrink: 0;
}

.label-preview-title[b-v56vg67tsb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.label-preview-title .brand-name[b-v56vg67tsb] {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.label-preview-title .fanciful-name[b-v56vg67tsb] {
    font-size: 0.8rem;
    opacity: 0.8;
    font-style: italic;
}

.preview-actions[b-v56vg67tsb] {
    display: flex;
    gap: 0.35rem;
}

.label-preview-header .btn-outline-danger[b-v56vg67tsb] {
    background: rgba(255,255,255,0.15);
    border-color: rgba(255,255,255,0.4);
    color: white;
}

.label-preview-header .btn-outline-danger:hover[b-v56vg67tsb] {
    background: rgba(220,53,69,0.9);
    border-color: transparent;
}

.label-preview-body[b-v56vg67tsb] {
    display: flex;
    gap: 1rem;
    padding: 0.75rem;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
}

/* Images Section */
.label-preview-images[b-v56vg67tsb] {
    flex: 0 0 180px;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 280px;
    overflow-y: auto;
}

.preview-image-wrapper[b-v56vg67tsb] {
    position: relative;
    cursor: zoom-in;
}

.preview-image-wrapper .preview-image[b-v56vg67tsb] {
    width: 100%;
    max-height: 180px;
    object-fit: contain;
    border-radius: 4px;
    border: 1px solid #dee2e6;
    background: #f8f9fa;
}

.preview-image-wrapper .zoom-hint[b-v56vg67tsb] {
    position: absolute;
    bottom: 4px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0,0,0,0.7);
    color: white;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 0.7rem;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.preview-image-wrapper:hover .zoom-hint[b-v56vg67tsb] {
    opacity: 1;
}

.no-preview-image[b-v56vg67tsb] {
    color: #999;
    text-align: center;
    padding: 2rem 0;
}

/* Details Section */
.label-preview-details[b-v56vg67tsb] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    min-width: 0;
    font-size: 0.8rem;
}

.spec-group[b-v56vg67tsb] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 0.4rem 0.5rem;
}

.spec-group-title[b-v56vg67tsb] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #6c757d;
    margin-bottom: 0.25rem;
    padding-bottom: 0.2rem;
    border-bottom: 1px solid #e9ecef;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.spec-group-title i[b-v56vg67tsb] {
    color: #667eea;
}

.spec-grid[b-v56vg67tsb] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.spec-item[b-v56vg67tsb] {
    display: flex;
    align-items: baseline;
    gap: 0.3rem;
    font-size: 0.75rem;
    line-height: 1.3;
}

.spec-label[b-v56vg67tsb] {
    font-weight: 500;
    color: #6c757d;
    flex-shrink: 0;
    min-width: 90px;
}

.spec-value[b-v56vg67tsb] {
    color: #212529;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.spec-value.mono[b-v56vg67tsb] {
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', monospace;
    font-size: 0.75rem;
    background: #f1f3f4;
    padding: 1px 4px;
    border-radius: 3px;
}

/* Panel Footer */
.panel-footer[b-v56vg67tsb] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    border-top: 1px solid var(--bs-border-color);
    background: var(--bs-white);
    flex-shrink: 0;
}

.dirty-indicator[b-v56vg67tsb] {
    font-size: 0.75rem;
    color: var(--bs-warning);
    margin-right: auto;
    opacity: 0;
    transition: opacity 0.2s;
}

.dirty-indicator.visible[b-v56vg67tsb] {
    opacity: 1;
}

.dirty-indicator i[b-v56vg67tsb] {
    font-size: 0.5rem;
    margin-right: 0.25rem;
}

/* Header context */
.header-context[b-v56vg67tsb] {
    font-size: 0.8rem;
    font-weight: normal;
    color: var(--bs-secondary);
    margin-left: 0.5rem;
}

/* Lightbox Overlay */
.lightbox-overlay[b-v56vg67tsb] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10002;
    cursor: pointer;
}

.lightbox-content[b-v56vg67tsb] {
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.lightbox-content img[b-v56vg67tsb] {
    max-width: 90vw;
    max-height: 85vh;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
}

.lightbox-close-btn[b-v56vg67tsb] {
    position: absolute;
    top: -40px;
    right: -40px;
    background: rgba(255, 255, 255, 0.2);
    color: white;
    border: none;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    font-size: 1.2rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
}

.lightbox-close-btn:hover[b-v56vg67tsb] {
    background: rgba(255, 255, 255, 0.4);
}

.lightbox-hint[b-v56vg67tsb] {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.8rem;
    margin-top: 1rem;
}

/* Confirmation Dialog */
.confirm-dialog-overlay[b-v56vg67tsb] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10003;
    padding: 1rem;
}

.confirm-dialog[b-v56vg67tsb] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
    max-width: 400px;
    width: 100%;
}

.confirm-header[b-v56vg67tsb] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px;
    border-bottom: 1px solid #e9ecef;
    font-weight: 600;
    font-size: 1.1rem;
}

.confirm-header i[b-v56vg67tsb] {
    font-size: 1.3rem;
}

.confirm-body[b-v56vg67tsb] {
    padding: 16px;
    color: #495057;
}

.confirm-footer[b-v56vg67tsb] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 16px;
    border-top: 1px solid #e9ecef;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .panel-main[b-v56vg67tsb] {
        grid-template-columns: 1fr;
    }

    .dates-sidebar[b-v56vg67tsb] {
        max-height: 160px;
        border-right: none;
        border-bottom: 1px solid var(--bs-border-color);
    }

    .sidebar-content[b-v56vg67tsb] {
        display: flex;
        flex-direction: row;
        overflow-x: auto;
        overflow-y: hidden;
        gap: 0.5rem;
        padding: 0.5rem;
    }

    .date-card[b-v56vg67tsb] {
        flex: 0 0 auto;
        min-width: 120px;
        margin-bottom: 0;
    }

    .search-filter-bar[b-v56vg67tsb] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-input-group[b-v56vg67tsb] {
        min-width: 100%;
    }

    .filter-controls[b-v56vg67tsb] {
        flex-wrap: wrap;
    }

    .label-card-grid[b-v56vg67tsb] {
        grid-template-columns: repeat(2, 1fr);
    }

    .label-preview-body[b-v56vg67tsb] {
        flex-direction: column;
    }

    .label-preview-images[b-v56vg67tsb] {
        flex: none;
        flex-direction: row;
        justify-content: center;
        gap: 0.5rem;
        max-height: none;
    }

    .preview-image-wrapper .preview-image[b-v56vg67tsb] {
        max-width: 150px;
    }

    .lightbox-close-btn[b-v56vg67tsb] {
        top: 10px;
        right: 10px;
    }
}
/* /Pages/Bottling/DailyFlow/Panels/BottlingWinemakingPanel.razor.rz.scp.css */
/* Content wrapper - fills the sliding-panel-body and manages footer positioning */
.panel-content-wrapper[b-o812laxbnr] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0; /* Important for flex children to shrink properly */
}

/* Panel body - scrollable content area */
.panel-body[b-o812laxbnr] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem;
    min-height: 0; /* Allows flex item to shrink below content size */
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

/* Panel footer - stays fixed at bottom */
.panel-footer[b-o812laxbnr] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--bs-border-color, #dee2e6);
    background: var(--bs-gray-100, #f8f9fa);
    flex-shrink: 0; /* Never shrink - always visible */
}

.panel-footer .btn[b-o812laxbnr] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 44px; /* Touch-friendly minimum height */
    padding: 0.5rem 1rem;
}

.panel-footer .btn i[b-o812laxbnr] {
    font-size: 1rem;
}

/* ── Override form styles for panel context ── */
[b-o812laxbnr] .container {
    padding: 0;
    max-width: 100%;
}

[b-o812laxbnr] .containerBox {
    flex-wrap: wrap;
}

[b-o812laxbnr] .row {
    margin: 0;
    width: 100%;
}

[b-o812laxbnr] .col-md-6 {
    padding: 0.25rem 0.5rem;
}

/* Make form inputs touch-friendly and prevent iOS zoom */
[b-o812laxbnr] .bottling-form-inputs {
    margin-bottom: 0.75rem;
}

[b-o812laxbnr] .bottling-input,
[b-o812laxbnr] .form-input,
[b-o812laxbnr] .form-select,
[b-o812laxbnr] input[type="text"],
[b-o812laxbnr] input[type="date"],
[b-o812laxbnr] select,
[b-o812laxbnr] textarea {
    min-height: 44px; /* Touch-friendly */
    font-size: 16px !important; /* Prevents iOS zoom on focus - must be 16px+ */
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    -webkit-appearance: none; /* Better iOS styling */
}

/* Ensure inputs are visible when keyboard opens */
[b-o812laxbnr] input:focus,
[b-o812laxbnr] select:focus,
[b-o812laxbnr] textarea:focus {
    outline: 2px solid #0d6efd;
    outline-offset: 2px;
}

[b-o812laxbnr] textarea {
    min-height: 80px;
    resize: vertical;
}

/* Todo section styling */
[b-o812laxbnr] .toDoBox {
    margin-top: 1rem;
    padding-top: 1rem;
}

[b-o812laxbnr] .addContainer {
    max-height: none; /* Allow full scroll within panel */
    overflow-y: visible;
}

[b-o812laxbnr] .round-button {
    min-width: 44px;
    min-height: 44px;
    touch-action: manipulation;
}

/* Task item styling for mobile */
[b-o812laxbnr] .task-item .btn-toggle {
    min-height: 44px;
    padding: 0.5rem 1rem;
}

/* ── Mobile Responsive ── */
@media (max-width: 576px) {
    .panel-body[b-o812laxbnr] {
        padding: 0.5rem;
    }

    .panel-footer[b-o812laxbnr] {
        padding: 0.75rem;
        gap: 0.5rem;
    }

    .panel-footer .btn[b-o812laxbnr] {
        flex: 1;
        justify-content: center;
        min-height: 48px; /* Larger touch target on mobile */
    }

    /* Stack form fields vertically on mobile */
    [b-o812laxbnr] .bottling-form-inputs {
        flex-direction: column;
        align-items: stretch;
    }

    [b-o812laxbnr] .bottling-label {
        width: 100%;
        text-align: left;
        margin-bottom: 0.25rem;
    }

    [b-o812laxbnr] .bottling-input {
        width: 100%;
    }

    [b-o812laxbnr] .col-md-6 {
        width: 100%;
        padding: 0.25rem 0;
    }

    /* Full-width buttons for touch */
    [b-o812laxbnr] .btn {
        min-height: 48px;
    }

    /* Better spacing for todo items */
    [b-o812laxbnr] .toDoBox .containerBox {
        flex-direction: column;
        gap: 0.5rem;
    }

    [b-o812laxbnr] .input-row {
        flex-direction: column;
        align-items: stretch;
    }

    [b-o812laxbnr] .inline-label {
        width: 100%;
        margin-bottom: 0.25rem;
    }
}

/* Safe area padding for iOS notch/home indicator */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .panel-footer[b-o812laxbnr] {
        padding-bottom: calc(0.75rem + env(safe-area-inset-bottom));
    }
}

/* Ensure proper behavior when virtual keyboard is open */
@supports (height: 100dvh) {
    .panel-content-wrapper[b-o812laxbnr] {
        /* dvh accounts for mobile browser chrome and keyboard */
        max-height: 100%;
    }
}
/* /Pages/Bottling/DailyFlow/Panels/PackagingProfilePanel.razor.rz.scp.css */
/* Grid layout for sidebar + form body */
.panel-main[b-yzodvfqtjb] {
    display: grid;
    grid-template-columns: 240px 1fr;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* Groups Sidebar */
.groups-sidebar[b-yzodvfqtjb] {
    display: flex;
    flex-direction: column;
    background: var(--bs-light);
    border-right: 1px solid var(--bs-border-color);
    min-height: 0;
}

.sidebar-header[b-yzodvfqtjb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0.5rem;
    border-bottom: 1px solid var(--bs-border-color);
    background: var(--bs-white);
    flex-shrink: 0;
}

.sidebar-title[b-yzodvfqtjb] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--bs-primary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.sidebar-title i[b-yzodvfqtjb] {
    margin-right: 0.25rem;
}

.sidebar-count[b-yzodvfqtjb] {
    font-size: 0.6rem;
    color: var(--bs-secondary);
}

.sidebar-content[b-yzodvfqtjb] {
    flex: 1;
    overflow-y: auto;
    padding: 0.35rem;
}

/* Group Cards */
.group-card[b-yzodvfqtjb] {
    padding: 0.5rem;
    margin-bottom: 0.35rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 4px;
    cursor: pointer;
    background: white;
    transition: all 0.15s;
}

.group-card:last-child[b-yzodvfqtjb] {
    margin-bottom: 0;
}

.group-card:hover[b-yzodvfqtjb] {
    background: var(--bs-gray-100);
}

.group-card.selected[b-yzodvfqtjb] {
    border-color: var(--bs-primary);
    border-left: 4px solid var(--bs-primary);
    background: var(--bs-primary-bg-subtle);
    box-shadow: 0 0 0 2px rgba(var(--bs-primary-rgb), 0.15);
}

.group-card.unnamed[b-yzodvfqtjb] {
    border-left: 3px solid var(--bs-warning);
}

.group-header[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    font-size: 0.8rem;
}

.group-header i[b-yzodvfqtjb] {
    font-size: 0.75rem;
}

.group-name[b-yzodvfqtjb] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.group-dates[b-yzodvfqtjb] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: 0.35rem;
}

.date-badge[b-yzodvfqtjb] {
    font-size: 0.65rem;
    background: var(--bs-gray-200);
    padding: 0.1rem 0.3rem;
    border-radius: 3px;
}

.date-badge.more[b-yzodvfqtjb] {
    background: var(--bs-secondary-bg);
    color: var(--bs-secondary);
    font-style: italic;
}

.group-meta[b-yzodvfqtjb] {
    font-size: 0.7rem;
    color: var(--bs-secondary);
    margin-top: 0.35rem;
}

/* Fingerprint diff tags */
.group-diffs[b-yzodvfqtjb] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.2rem;
    margin-top: 0.3rem;
}

.diff-tag[b-yzodvfqtjb] {
    font-size: 0.55rem;
    font-weight: 500;
    padding: 0.05rem 0.3rem;
    border-radius: 3px;
    line-height: 1.3;
    white-space: nowrap;
}

.diff-tag.diff-missing[b-yzodvfqtjb] {
    background: #fff3cd;
    color: #856404;
    border: 1px solid #ffc107;
}

.diff-tag.diff-differs[b-yzodvfqtjb] {
    background: #cfe2ff;
    color: #084298;
    border: 1px solid #9ec5fe;
}

.diff-tag.diff-has[b-yzodvfqtjb] {
    background: #d1e7dd;
    color: #0f5132;
    border: 1px solid #a3cfbb;
}

/* Panel Body */
.panel-body[b-yzodvfqtjb] {
    padding: 0.5rem 0.75rem;
    overflow-y: auto;
    flex: 1;
}

/* Panel Footer (sticky) */
.panel-footer[b-yzodvfqtjb] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 0.75rem;
    border-top: 1px solid var(--bs-border-color);
    background: var(--bs-white);
    flex-shrink: 0;
}

.dirty-indicator[b-yzodvfqtjb] {
    font-size: 0.7rem;
    color: var(--bs-warning);
    margin-right: auto;
    opacity: 0;
    transition: opacity 0.2s;
}

.dirty-indicator.visible[b-yzodvfqtjb] {
    opacity: 1;
}

.dirty-indicator i[b-yzodvfqtjb] {
    font-size: 0.5rem;
    margin-right: 0.25rem;
}

/* Header context (shown in SlidingPanel header) */
.header-context[b-yzodvfqtjb] {
    font-size: 0.75rem;
    font-weight: normal;
    color: var(--bs-secondary);
}

/* Section styling */
.section[b-yzodvfqtjb] {
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--bs-border-color-translucent);
}

.section:last-child[b-yzodvfqtjb] {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.section-header[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--bs-primary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 0.4rem;
    padding-bottom: 0.15rem;
    border-bottom: 1px solid var(--bs-primary);
    opacity: 0.9;
}

.section-header i[b-yzodvfqtjb] {
    font-size: 0.7rem;
}

.readonly-hint[b-yzodvfqtjb] {
    font-size: 0.55rem;
    font-weight: normal;
    color: var(--bs-secondary);
    text-transform: none;
    letter-spacing: normal;
    margin-left: 0.35rem;
}

/* Name Section */
.name-section .form-group[b-yzodvfqtjb] {
    margin-bottom: 0;
}

.name-section .form-group label[b-yzodvfqtjb] {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--bs-secondary);
    margin-bottom: 0.2rem;
    text-transform: uppercase;
}

.name-section .form-control[b-yzodvfqtjb] {
    font-size: 0.85rem;
    font-weight: 500;
}

.hint-text[b-yzodvfqtjb] {
    display: block;
    font-size: 0.65rem;
    color: var(--bs-info);
    margin-top: 0.25rem;
}

.hint-text i[b-yzodvfqtjb] {
    margin-right: 0.2rem;
}

/* Identity Section */
.identity-section[b-yzodvfqtjb] {
    background: var(--bs-gray-100);
    padding: 0.5rem;
    border-radius: 4px;
    margin-bottom: 0.5rem;
}

.identity-grid[b-yzodvfqtjb] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.35rem;
}

.identity-item[b-yzodvfqtjb] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.identity-item.span-2[b-yzodvfqtjb] {
    grid-column: span 2;
}

.identity-label[b-yzodvfqtjb] {
    font-size: 0.55rem;
    font-weight: 500;
    color: var(--bs-secondary);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.identity-value[b-yzodvfqtjb] {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--bs-body-color);
}

.identity-value.highlight[b-yzodvfqtjb] {
    color: var(--bs-success);
    font-weight: 600;
}

/* Operational Section */
.operational-section[b-yzodvfqtjb] {
    padding-top: 0.25rem;
}

.subsection[b-yzodvfqtjb] {
    margin-bottom: 0.5rem;
}

.subsection:last-child[b-yzodvfqtjb] {
    margin-bottom: 0;
}

.subsection-header[b-yzodvfqtjb] {
    font-size: 0.6rem;
    font-weight: 600;
    color: var(--bs-secondary);
    margin-bottom: 0.25rem;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.subsection-header i[b-yzodvfqtjb] {
    font-size: 0.65rem;
}

/* 4-column grid layout */
.form-grid[b-yzodvfqtjb] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.3rem 0.4rem;
}

.form-group[b-yzodvfqtjb] {
    display: flex;
    flex-direction: column;
}

.form-group.span-2[b-yzodvfqtjb] {
    grid-column: span 2;
}

.form-group.span-3[b-yzodvfqtjb] {
    grid-column: span 3;
}

.form-group.span-4[b-yzodvfqtjb] {
    grid-column: span 4;
}

.form-group label[b-yzodvfqtjb] {
    font-size: 0.55rem;
    font-weight: 500;
    color: var(--bs-secondary);
    margin-bottom: 0.1rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.form-group.chk-group[b-yzodvfqtjb] {
    justify-content: flex-end;
    padding-bottom: 0.1rem;
}

.form-group .form-check[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin: 0;
}

.form-group .form-check-input[b-yzodvfqtjb] {
    width: 0.85rem;
    height: 0.85rem;
    margin: 0;
}

.form-group .form-check-label[b-yzodvfqtjb] {
    font-size: 0.7rem;
    color: var(--bs-body-color);
    font-weight: 500;
}

.form-control[b-yzodvfqtjb],
.form-select[b-yzodvfqtjb] {
    font-size: 0.75rem;
    padding: 0.2rem 0.35rem;
    height: auto;
}

textarea.form-control[b-yzodvfqtjb] {
    resize: none;
}

.form-control:focus[b-yzodvfqtjb],
.form-select:focus[b-yzodvfqtjb] {
    box-shadow: 0 0 0 1px var(--bs-primary);
}

/* Number inputs - hide spinners */
input[type="number"][b-yzodvfqtjb] {
    -moz-appearance: textfield;
}

input[type="number"][b-yzodvfqtjb]::-webkit-outer-spin-button,
input[type="number"][b-yzodvfqtjb]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Actions Section */
.actions-section[b-yzodvfqtjb] {
    display: flex;
    gap: 0.5rem;
    padding-top: 0.5rem;
}

/* Split Dialog */
.split-dialog[b-yzodvfqtjb] {
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: var(--bs-light);
    border: 1px solid var(--bs-border-color);
    border-radius: 6px;
}

.split-header[b-yzodvfqtjb] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--bs-primary);
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.split-body[b-yzodvfqtjb] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.split-body .form-group label[b-yzodvfqtjb] {
    font-size: 0.65rem;
    font-weight: 500;
    color: var(--bs-secondary);
    margin-bottom: 0.2rem;
}

.split-dates[b-yzodvfqtjb] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    max-height: 150px;
    overflow-y: auto;
    padding: 0.35rem;
    background: white;
    border: 1px solid var(--bs-border-color);
    border-radius: 4px;
}

.split-date-option[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 3px;
}

.split-date-option:hover[b-yzodvfqtjb] {
    background: var(--bs-gray-100);
}

.split-footer[b-yzodvfqtjb] {
    display: flex;
    justify-content: flex-end;
    gap: 0.35rem;
    margin-top: 0.5rem;
}

/* Empty State */
.empty-state[b-yzodvfqtjb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 2rem;
    color: var(--bs-secondary);
    font-size: 0.85rem;
}

.empty-state i[b-yzodvfqtjb] {
    font-size: 1.5rem;
    opacity: 0.5;
}

/* Completeness Indicator */
.completeness-section[b-yzodvfqtjb] {
    margin-bottom: 0.5rem;
    padding: 0.4rem 0.5rem;
    background: var(--bs-gray-100);
    border-radius: 4px;
}

.completeness-bar[b-yzodvfqtjb] {
    height: 4px;
    background: var(--bs-gray-300);
    border-radius: 2px;
    overflow: hidden;
    margin-bottom: 0.35rem;
}

.completeness-fill[b-yzodvfqtjb] {
    height: 100%;
    background: linear-gradient(90deg, var(--bs-success) 0%, var(--bs-primary) 100%);
    border-radius: 2px;
    transition: width 0.3s ease;
}

.completeness-items[b-yzodvfqtjb] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.completeness-item[b-yzodvfqtjb] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.6rem;
    padding: 0.15rem 0.35rem;
    border-radius: 3px;
    background: white;
    border: 1px solid var(--bs-border-color);
    transition: all 0.15s;
}

.completeness-item.complete[b-yzodvfqtjb] {
    color: var(--bs-success);
    border-color: var(--bs-success-border-subtle);
    background: var(--bs-success-bg-subtle);
}

.completeness-item.incomplete[b-yzodvfqtjb] {
    color: var(--bs-secondary);
}

.completeness-item i[b-yzodvfqtjb] {
    font-size: 0.55rem;
}

/* Focus states for keyboard nav */
.group-card:focus[b-yzodvfqtjb] {
    outline: 2px solid var(--bs-primary);
    outline-offset: 2px;
}

.group-card:focus-visible[b-yzodvfqtjb] {
    outline: 2px solid var(--bs-primary);
    outline-offset: 2px;
}

/* Images Section */
.images-section[b-yzodvfqtjb] {
    margin-top: 0.5rem;
}

.images-section .section-header[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.images-section .section-header .ms-auto[b-yzodvfqtjb] {
    margin-left: auto;
}

.empty-images[b-yzodvfqtjb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    color: var(--bs-secondary);
    gap: 0.5rem;
}

.empty-images i[b-yzodvfqtjb] {
    font-size: 1.5rem;
}

.image-gallery[b-yzodvfqtjb] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 0.5rem 0;
}

.image-item[b-yzodvfqtjb] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 90px;
    gap: 0.25rem;
}

.image-thumbnail[b-yzodvfqtjb] {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid var(--bs-border-color);
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.image-thumbnail:hover[b-yzodvfqtjb] {
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

.pdf-thumbnail[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    color: #dc3545;
}

.pdf-thumbnail i[b-yzodvfqtjb] {
    font-size: 2rem;
}

.image-info[b-yzodvfqtjb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 100%;
}

.image-type[b-yzodvfqtjb] {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--bs-primary);
}

.image-name[b-yzodvfqtjb] {
    font-size: 0.7rem;
    color: var(--bs-secondary);
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.btn-delete-image[b-yzodvfqtjb] {
    position: absolute;
    top: -4px;
    right: -4px;
    width: 18px;
    height: 18px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: var(--bs-danger);
    color: white;
    font-size: 0.65rem;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.image-item:hover .btn-delete-image[b-yzodvfqtjb] {
    opacity: 1;
}

.btn-delete-image:hover[b-yzodvfqtjb] {
    background: #a71d2a;
}

.upload-controls[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.upload-controls .form-select[b-yzodvfqtjb] {
    font-size: 0.75rem;
    padding: 0.25rem 1.75rem 0.25rem 0.5rem;
    min-width: 120px;
}

/* Linked Images Section (Labels & COLA) */
.linked-images-section[b-yzodvfqtjb] {
    margin-top: 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    padding: 0.5rem;
}

.linked-images-grid[b-yzodvfqtjb] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 0.5rem 0;
}

.linked-group[b-yzodvfqtjb] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.linked-group-label[b-yzodvfqtjb] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--bs-secondary);
}

.linked-thumbnails[b-yzodvfqtjb] {
    display: flex;
    gap: 0.35rem;
}

.linked-thumbnail[b-yzodvfqtjb] {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 3px;
    border: 1px solid var(--bs-border-color);
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.linked-thumbnail:hover[b-yzodvfqtjb] {
    transform: scale(1.08);
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

/* Run Context Grid (Labels & COLA section) */
.run-context-grid[b-yzodvfqtjb] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    padding: 0.5rem;
    background: white;
    border-radius: 4px;
    border: 1px solid var(--bs-border-color);
    margin-bottom: 0.5rem;
}

.run-context-item[b-yzodvfqtjb] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.run-context-label[b-yzodvfqtjb] {
    font-size: 0.55rem;
    font-weight: 500;
    color: var(--bs-secondary);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.run-context-value[b-yzodvfqtjb] {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--bs-body-color);
}

/* ── Material Status Section ── */
.material-status-section[b-yzodvfqtjb] {
    margin-top: 0.5rem;
}

.status-loading[b-yzodvfqtjb] {
    color: #6c757d;
    font-size: 0.8rem;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.status-rows[b-yzodvfqtjb] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.status-row[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    padding: 0.35rem 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    font-size: 0.8rem;
}

.status-row.insufficient[b-yzodvfqtjb] {
    background: #fff3cd;
}

.status-row.sufficient[b-yzodvfqtjb] {
    background: #d1e7dd;
}

.status-row .component-name[b-yzodvfqtjb] {
    font-weight: 500;
    min-width: 70px;
    color: #495057;
}

.status-row .calculation[b-yzodvfqtjb] {
    color: #6c757d;
    font-size: 0.75rem;
}

.status-row .quantities[b-yzodvfqtjb] {
    color: #495057;
}

.status-row .shortfall[b-yzodvfqtjb] {
    color: #dc3545;
    font-weight: 600;
}

.status-row.sufficient .shortfall[b-yzodvfqtjb] {
    display: none;
}

.status-row .status-icon[b-yzodvfqtjb] {
    font-size: 0.9rem;
}

.status-actions[b-yzodvfqtjb] {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e9ecef;
}

/* Logged Materials List */
.logged-materials[b-yzodvfqtjb] {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e9ecef;
}

.logged-header[b-yzodvfqtjb] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.35rem;
}

.logged-item[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    margin-bottom: 0.25rem;
    font-size: 0.75rem;
    flex-wrap: wrap;
}

.logged-type[b-yzodvfqtjb] {
    background: #6c757d;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
    text-transform: uppercase;
    min-width: 50px;
    text-align: center;
}

.logged-qty[b-yzodvfqtjb] {
    font-weight: 600;
    color: #198754;
    min-width: 50px;
}

.logged-desc[b-yzodvfqtjb] {
    color: #212529;
    flex: 1;
}

.logged-supplier[b-yzodvfqtjb] {
    color: #0d6efd;
    font-weight: 500;
}

.logged-lot[b-yzodvfqtjb] {
    color: #6c757d;
    font-size: 0.7rem;
}

.logged-date[b-yzodvfqtjb] {
    color: #adb5bd;
    font-size: 0.7rem;
}

.logged-actions[b-yzodvfqtjb] {
    display: flex;
    gap: 0.25rem;
    margin-left: auto;
}

.logged-actions button[b-yzodvfqtjb] {
    padding: 0.1rem 0.25rem !important;
    font-size: 0.7rem !important;
    line-height: 1;
}

.logged-actions .bi[b-yzodvfqtjb] {
    font-size: 0.75rem;
}

/* Button overrides */
.btn-xs[b-yzodvfqtjb] {
    padding: 0.1rem 0.25rem !important;
    font-size: 0.7rem !important;
}

/* ── Nested Receipt Panel (slides from right, over the profile panel) ── */
.receipt-panel-backdrop[b-yzodvfqtjb] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1050;
    opacity: 1;
    transition: opacity 0.3s ease;
    touch-action: none;
}

.receipt-panel-backdrop.fade-out[b-yzodvfqtjb] {
    opacity: 0;
}

.receipt-panel-slide[b-yzodvfqtjb] {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    height: 100dvh;
    width: 450px;
    background: white;
    z-index: 1051;
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
}

.receipt-panel-slide.slide-in[b-yzodvfqtjb] {
    animation: receiptSlideIn-b-yzodvfqtjb 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.receipt-panel-slide.slide-out[b-yzodvfqtjb] {
    animation: receiptSlideOut-b-yzodvfqtjb 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes receiptSlideIn-b-yzodvfqtjb {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}

@keyframes receiptSlideOut-b-yzodvfqtjb {
    from { transform: translateX(0); }
    to { transform: translateX(100%); }
}

.receipt-slide-header[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
    flex-shrink: 0;
}

.receipt-panel-slide:focus[b-yzodvfqtjb] {
    outline: none;
}

.receipt-slide-title[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 1.1rem;
}

.receipt-slide-body[b-yzodvfqtjb] {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

/* ── Delete Confirmation Dialog ── */
.confirm-dialog-overlay[b-yzodvfqtjb] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1060;
    padding: 1rem;
}

.confirm-dialog[b-yzodvfqtjb] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
    max-width: 400px;
    width: 100%;
}

.confirm-header[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px;
    border-bottom: 1px solid #e9ecef;
    font-weight: 600;
    font-size: 1.1rem;
}

.confirm-header i[b-yzodvfqtjb] {
    font-size: 1.3rem;
}

.confirm-body[b-yzodvfqtjb] {
    padding: 16px;
}

.confirm-body p[b-yzodvfqtjb] {
    margin: 0 0 12px 0;
    color: #495057;
}

.confirm-details[b-yzodvfqtjb] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
    background: #f8f9fa;
    border-radius: 4px;
    font-size: 0.9rem;
}

.confirm-details strong[b-yzodvfqtjb] {
    color: #212529;
}

.confirm-details span[b-yzodvfqtjb] {
    color: #6c757d;
}

.edit-instead[b-yzodvfqtjb] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px 0 0 0;
    font-size: 0.9rem;
    color: #0d6efd;
    text-decoration: none;
}

.edit-instead:hover[b-yzodvfqtjb] {
    color: #0a58ca;
}

.confirm-footer[b-yzodvfqtjb] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 16px;
    border-top: 1px solid #e9ecef;
}

/* ── Mobile responsive ── */
@media (max-width: 768px) {
    .panel-main[b-yzodvfqtjb] {
        grid-template-columns: 1fr;
    }

    .groups-sidebar[b-yzodvfqtjb] {
        max-height: 200px;
        border-right: none;
        border-bottom: 1px solid var(--bs-border-color);
    }

    .identity-grid[b-yzodvfqtjb] {
        grid-template-columns: repeat(2, 1fr);
    }

    .form-grid[b-yzodvfqtjb] {
        grid-template-columns: repeat(2, 1fr);
    }

    .form-group.span-2[b-yzodvfqtjb],
    .form-group.span-3[b-yzodvfqtjb],
    .form-group.span-4[b-yzodvfqtjb] {
        grid-column: span 2;
    }

    .status-row[b-yzodvfqtjb] {
        flex-wrap: wrap;
        gap: 0.25rem;
    }

    .status-row .component-name[b-yzodvfqtjb] {
        min-width: 60px;
    }

    .receipt-panel-slide[b-yzodvfqtjb] {
        width: 100%;
    }

    .logged-item[b-yzodvfqtjb] {
        flex-direction: column;
        align-items: flex-start;
    }

    .logged-actions[b-yzodvfqtjb] {
        width: 100%;
        justify-content: flex-end;
        margin-left: 0;
        margin-top: 0.25rem;
    }
}
/* /Pages/Bottling/DailyFlow/Reports/ProductionReport.razor.rz.scp.css */
@media print {
    @page {
        size: portrait
    }
}

@media screen and (max-width: 600px) {
    .item[b-ebhixt6r52] {
        flex-basis: 100%;
    }
}

body[b-ebhixt6r52] {
    background-color: #333 !important;
    color: #fff !important;
}

td[b-ebhixt6r52] {
    padding: 2px;
}

.listNoBorder[b-ebhixt6r52] {
    list-style-type: none;
    padding-left: 0px;
}

.listGreyBorder[b-ebhixt6r52] {
    list-style-type: none;
    border-bottom: 1px solid grey;
}

.flexRow[b-ebhixt6r52] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.headPicture[b-ebhixt6r52] {
    width: 200px;
}

.centerHeader[b-ebhixt6r52] {
    display: flex;
    justify-content: center;
}

.bottomUnderLine[b-ebhixt6r52] {
    border-bottom: 1px solid grey;
}

.parent[b-ebhixt6r52] {
    display: flex;
    flex-wrap: wrap;
}

.child[b-ebhixt6r52] {
    flex: 1 0 25%;
    /*    margin: 2px;
*/ margin: 2px 2px 0px 2px;
}

.child2[b-ebhixt6r52] {
    flex: 1 0 100%;
    margin: 0px 2px 10px 2px;
}

.red-Font[b-ebhixt6r52] {
    color: red;
}

.two-ColGrid[b-ebhixt6r52] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
}

.four-ColGrid[b-ebhixt6r52] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    background-color: lavender;
}

    .four-ColGrid > div[b-ebhixt6r52] {
        border: solid 1px grey;
    }

.center[b-ebhixt6r52] {
    text-align: center;
}

.wrap[b-ebhixt6r52] {
    overflow-wrap: break-word;
    padding: 2px;
}

.two-ColFlex[b-ebhixt6r52] {
    display: flex;
    flex-wrap: wrap;
}

.item[b-ebhixt6r52] {
    flex-basis: 50%;
}

p[b-ebhixt6r52] {
    margin: 0px;
}
/* /Pages/Bottling/DailyFlow/Sections/PackagingProfileSection.razor.rz.scp.css */
.profile-section[b-26y3vbuxy0] {
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--bs-border-color);
    padding-bottom: 1rem;
}

.profile-header[b-26y3vbuxy0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.header-buttons[b-26y3vbuxy0] {
    display: flex;
    gap: 0.25rem;
}

.header-buttons .btn-text[b-26y3vbuxy0] {
    margin-left: 0.25rem;
    font-size: 0.75rem;
}

.profile-title[b-26y3vbuxy0] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--bs-body-color);
}

/* Naked dates expandable section */
.naked-dates-section[b-26y3vbuxy0] {
    margin-bottom: 0.5rem;
    border: 1px solid #ffc107;
    border-radius: 4px;
    background: #fffef5;
    overflow: hidden;
}

.naked-dates-header[b-26y3vbuxy0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.6rem;
    background: linear-gradient(135deg, #fff3cd 0%, #ffeeba 100%);
    font-size: 0.75rem;
    font-weight: 500;
    color: #856404;
    cursor: pointer;
    transition: background 0.15s ease;
}

.naked-dates-header:hover[b-26y3vbuxy0] {
    background: #ffeeba;
}

.naked-dates-list[b-26y3vbuxy0] {
    max-height: 150px;
    overflow-y: auto;
    border-top: 1px solid #ffc107;
}

.naked-date-row[b-26y3vbuxy0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.6rem;
    font-size: 0.75rem;
    cursor: pointer;
    transition: background 0.15s ease;
    border-bottom: 1px solid #fff3cd;
}

.naked-date-row:last-child[b-26y3vbuxy0] {
    border-bottom: none;
}

.naked-date-row:hover[b-26y3vbuxy0] {
    background: #fff3cd;
}

.naked-date-row .naked-date-tag[b-26y3vbuxy0] {
    font-weight: 600;
    color: #856404;
    flex: 1;
}

.naked-date-row .naked-date-actual[b-26y3vbuxy0] {
    color: #997404;
    font-size: 0.7rem;
}

.naked-date-row i[b-26y3vbuxy0] {
    color: #997404;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.naked-date-row:hover i[b-26y3vbuxy0] {
    opacity: 1;
}

.profile-empty[b-26y3vbuxy0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--bs-secondary);
    font-size: 0.85rem;
    padding: 0.5rem;
    background: var(--bs-light);
    border-radius: 4px;
}

.profile-list[b-26y3vbuxy0] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.profile-card[b-26y3vbuxy0] {
    display: flex;
    align-items: stretch;
    gap: 0.75rem;
    padding: 0.5rem;
    background: var(--bs-light);
    border-radius: 6px;
    border: 1px solid var(--bs-border-color);
    cursor: pointer;
    transition: all 0.15s ease;
}

.profile-card:hover[b-26y3vbuxy0] {
    border-color: var(--bs-primary);
    background: var(--bs-white);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.profile-card.selected[b-26y3vbuxy0] {
    border-color: var(--bs-primary);
    background: var(--bs-primary-bg-subtle);
    box-shadow: 0 0 0 2px var(--bs-primary);
}

.profile-card.editing[b-26y3vbuxy0] {
    border-color: var(--bs-info);
    background: var(--bs-info-bg-subtle);
    box-shadow: 0 0 0 2px var(--bs-info);
    animation: pulse-editing-b-26y3vbuxy0 1.5s ease-in-out infinite;
}

@keyframes pulse-editing-b-26y3vbuxy0 {
    0%, 100% { box-shadow: 0 0 0 2px var(--bs-info); }
    50% { box-shadow: 0 0 0 4px rgba(var(--bs-info-rgb), 0.3); }
}

.profile-thumb[b-26y3vbuxy0] {
    width: 60px;
    height: 60px;
    flex-shrink: 0;
    border-radius: 4px;
    overflow: hidden;
    background: var(--bs-white);
    border: 1px solid var(--bs-border-color);
    display: flex;
    align-items: center;
    justify-content: center;
}

.profile-thumb img[b-26y3vbuxy0] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-thumb .no-image[b-26y3vbuxy0] {
    color: var(--bs-secondary);
    font-size: 1.5rem;
}

.profile-info[b-26y3vbuxy0] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.profile-compact[b-26y3vbuxy0] {
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--bs-body-color);
    line-height: 1.3;
}

.profile-meta[b-26y3vbuxy0] {
    display: flex;
    gap: 0.75rem;
    font-size: 0.75rem;
    color: var(--bs-secondary);
    margin-top: 0.25rem;
}

.meta-cases[b-26y3vbuxy0] {
    font-weight: 500;
    color: var(--bs-success);
}

.meta-closure[b-26y3vbuxy0] {
    padding: 0.1rem 0.4rem;
    background: var(--bs-light);
    border-radius: 3px;
    font-size: 0.7rem;
}

.profile-actions[b-26y3vbuxy0] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.25rem;
}

.profile-actions .btn[b-26y3vbuxy0] {
    padding: 0.15rem 0.35rem;
    font-size: 0.8rem;
}

.btn-xs[b-26y3vbuxy0] {
    padding: 0.15rem 0.35rem;
    font-size: 0.75rem;
    line-height: 1;
}

/* List View */
.profile-list-view[b-26y3vbuxy0] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.profile-list-item[b-26y3vbuxy0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.5rem;
    background: var(--bs-light);
    border-radius: 4px;
    border: 1px solid var(--bs-border-color);
    cursor: pointer;
    transition: all 0.15s ease;
}

.profile-list-item:hover[b-26y3vbuxy0] {
    border-color: var(--bs-primary);
    background: var(--bs-white);
}

.profile-list-item.selected[b-26y3vbuxy0] {
    border-color: var(--bs-primary);
    background: var(--bs-primary-bg-subtle);
}

.profile-list-item.editing[b-26y3vbuxy0] {
    border-color: var(--bs-info);
    background: var(--bs-info-bg-subtle);
    animation: pulse-editing-b-26y3vbuxy0 1.5s ease-in-out infinite;
}

.profile-list-item .profile-number[b-26y3vbuxy0] {
    font-weight: 600;
    font-size: 0.75rem;
    color: var(--bs-secondary);
    width: 2rem;
}

.profile-list-item .profile-name[b-26y3vbuxy0] {
    flex: 1;
    font-size: 0.8rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.profile-list-item .profile-cases[b-26y3vbuxy0] {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--bs-success);
}

.profile-list-item .profile-actions[b-26y3vbuxy0] {
    display: flex;
    flex-direction: row;
    gap: 0.15rem;
}
/* /Pages/Bottling/DailyFlow/Sections/PackagingTypeSection.razor.rz.scp.css */
.packaging-type-section[b-7pkd7uetdz] {
    display: flex;
    flex-direction: column;
}

.type-header[b-7pkd7uetdz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0;
}

.type-name-btn[b-7pkd7uetdz] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    min-width: 70px;
    background: none;
    border: none;
    padding: 0.1rem 0.25rem;
    margin: -0.1rem -0.25rem;
    border-radius: 3px;
    cursor: pointer;
    text-align: left;
    transition: all 0.15s ease;
}

.type-name-btn:hover[b-7pkd7uetdz] {
    background: #e9ecef;
    color: #0d6efd;
}

.type-empty[b-7pkd7uetdz] {
    color: #adb5bd;
    font-size: 0.75rem;
}

/* Individual Items */
.packaging-item[b-7pkd7uetdz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.35rem 0.5rem;
    margin-left: 0.5rem;
    background: #f8f9fa;
    border-radius: 3px;
    margin-bottom: 0.2rem;
}

.packaging-item.date-specific[b-7pkd7uetdz] {
    background: #e7f3ff;
    border-left: 2px solid #0d6efd;
}

.packaging-item.run-default[b-7pkd7uetdz] {
    background: #f0f0f0;
    border-left: 2px solid #6c757d;
}

.packaging-item.from-catalog[b-7pkd7uetdz] {
    border-left-color: #198754 !important;
}

.item-content[b-7pkd7uetdz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    font-size: 0.8rem;
}

.item-name[b-7pkd7uetdz] {
    font-weight: 500;
    color: #212529;
}

.item-supplier[b-7pkd7uetdz] {
    color: #6c757d;
}

.item-lot[b-7pkd7uetdz] {
    color: #6c757d;
    font-size: 0.75rem;
}

.item-qty[b-7pkd7uetdz] {
    color: #495057;
    font-weight: 500;
}

.item-catalog[b-7pkd7uetdz] {
    color: #198754;
    font-size: 0.7rem;
}

.item-catalog i[b-7pkd7uetdz] {
    font-size: 0.75rem;
}

.item-actions[b-7pkd7uetdz] {
    display: flex;
    gap: 0.25rem;
}

.item-actions button[b-7pkd7uetdz] {
    padding: 0.1rem 0.25rem !important;
    font-size: 0.7rem !important;
    line-height: 1;
}

.item-actions .bi[b-7pkd7uetdz] {
    font-size: 0.75rem;
}

/* Button overrides */
.btn-xs[b-7pkd7uetdz] {
    padding: 0.1rem 0.25rem !important;
    font-size: 0.7rem !important;
}
/* /Pages/Bottling/DailyFlow/SignOff/BottlingSignOffByDepartmentModal.razor.rz.scp.css */
.buttonRow[b-9wu3q4e77o] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    gap: 5px;
/*    border-width: thick;
    border-color: none;*/
}
.checkBoxRow[b-9wu3q4e77o] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    gap: 5px;
    /*    border-width: thick;
    border-color: none;*/
}
/* /Pages/Bottling/DailyFlow/SignOff/SignOffNotificationComponent.razor.rz.scp.css */
.colaOrLabelItem-alarm[b-encz2xbeny] {
  box-shadow: 0 0 10px rgba(255, 0, 0, 0.7); /* Red shadow with increased intensity */
}
.colaOrLabelItem-accepted[b-encz2xbeny] {
  box-shadow: 0 0 10px rgba(0, 255, 0, 0.7); /* Increased intensity with higher RGB values */
}
.colaOrLabelItem-waiver[b-encz2xbeny] {
  box-shadow: 0 0 10px 5px rgba(255, 149, 0, 0.7); /* Even more intense amber shadow */
}
/* /Pages/Bottling/LabQc/Components/AnalysisTabContent.razor.rz.scp.css */
/* ========== TAB CONTENT (fade animation) ========== */
.tab-pane-content[b-e4r4gqdaxi] {
    animation: fadeIn-b-e4r4gqdaxi 0.15s ease;
}

@keyframes fadeIn-b-e4r4gqdaxi {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ========== PATROL SECTION ========== */
.patrol-section[b-e4r4gqdaxi] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    margin-bottom: 0.75rem;
    overflow: hidden;
}

.section-header[b-e4r4gqdaxi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0.6rem;
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
    border-bottom: 1px solid #dee2e6;
}

.section-header h6[b-e4r4gqdaxi] {
    margin: 0;
    font-size: 0.85rem;
    font-weight: 600;
}

/* ========== ANALYSIS CHECKS GRID ========== */
.analysis-checks-section[b-e4r4gqdaxi] {
    max-width: 100%;
}

.analysis-grid-container[b-e4r4gqdaxi] {
    display: flex;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
}

/* Fixed left column - parameter names */
.analysis-fixed-col[b-e4r4gqdaxi] {
    flex-shrink: 0;
    background: #f0f0f0;
    border-right: 2px solid #a0a0a0;
    z-index: 1;
}

.analysis-fixed-col .analysis-cell[b-e4r4gqdaxi] {
    width: 100px;
    height: 32px;
    text-align: left;
    font-weight: 500;
    font-size: 0.75rem;
    color: #495057;
    padding-left: 0.5rem;
    padding-right: 0.25rem;
    background: #f0f0f0;
    border-bottom: 1px solid #c0c0c0;
    box-sizing: border-box;
    display: flex;
    align-items: center;
}

.analysis-fixed-col .analysis-cell.header-cell[b-e4r4gqdaxi] {
    height: 32px;
    border-bottom: 2px solid #a0a0a0;
}

/* Scrollable area for data columns */
.analysis-scroll-area[b-e4r4gqdaxi] {
    flex: 1;
    overflow-x: auto;
    overflow-y: hidden;
}

.analysis-columns[b-e4r4gqdaxi] {
    display: flex;
    min-width: max-content;
}

.analysis-col[b-e4r4gqdaxi] {
    flex-shrink: 0;
}

/* Grid cells */
.analysis-cell[b-e4r4gqdaxi] {
    height: 32px;
    width: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid #c0c0c0;
    border-bottom: 1px solid #c0c0c0;
    padding: 0 2px;
    font-size: 0.78rem;
    background: #fff;
    box-sizing: border-box;
}

/* Header cells */
.analysis-cell.header-cell[b-e4r4gqdaxi] {
    height: 32px;
    background: #f0f0f0;
    font-weight: 600;
    border-bottom: 2px solid #a0a0a0;
    position: relative;
}

.col-header-content[b-e4r4gqdaxi] {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.1;
}

.col-number[b-e4r4gqdaxi] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #495057;
}

.col-date[b-e4r4gqdaxi] {
    font-size: 0.6rem;
    font-weight: 400;
    color: #6c757d;
}

/* Read-only columns from other dates */
.analysis-col.from-other-date[b-e4r4gqdaxi] {
    opacity: 0.85;
}

.analysis-col.from-other-date .analysis-cell[b-e4r4gqdaxi] {
    background: #f5f8fa;
}

.analysis-col.from-other-date .analysis-cell.header-cell[b-e4r4gqdaxi] {
    background: #e8f0f5;
    border-left: 3px solid #6c9ec8;
}

.analysis-col.from-other-date .analysis-input[b-e4r4gqdaxi] {
    background: #f5f8fa !important;
    color: #6c757d;
}

/* Input styling */
.analysis-input[b-e4r4gqdaxi] {
    width: 100%;
    height: 26px;
    padding: 0.15rem 0.2rem;
    font-size: 0.72rem;
    text-align: center;
    border: none !important;
    background: #fff !important;
    border-radius: 0;
}

.analysis-input:focus[b-e4r4gqdaxi] {
    background: #fff !important;
    box-shadow: inset 0 0 0 2px #0078d4;
    outline: none;
}

.analysis-input:hover:not(:focus):not(:disabled)[b-e4r4gqdaxi] {
    background: #f5f5f5 !important;
}

/* Remove spin buttons from number inputs */
.analysis-input[type="number"][b-e4r4gqdaxi]::-webkit-outer-spin-button,
.analysis-input[type="number"][b-e4r4gqdaxi]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.analysis-input[type="number"][b-e4r4gqdaxi] {
    -moz-appearance: textfield;
}

/* Remove column button */
.btn-remove-col[b-e4r4gqdaxi] {
    position: absolute;
    right: 2px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #dc3545;
    padding: 0;
    width: 16px;
    height: 16px;
    font-size: 0.7rem;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.15s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.analysis-col:hover .btn-remove-col[b-e4r4gqdaxi] {
    opacity: 0.6;
}

.btn-remove-col:hover[b-e4r4gqdaxi] {
    opacity: 1 !important;
}

/* ========== INLINE SAMPLE/RECHECK INPUTS ========== */
.inline-inputs[b-e4r4gqdaxi] {
    display: flex;
    gap: 1px;
    width: 100%;
    height: 100%;
    align-items: center;
}

.inline-inputs .analysis-input[b-e4r4gqdaxi] {
    flex: 1;
    min-width: 0;
    height: 26px;
    font-size: 0.72rem;
    padding: 0 0.15rem;
}

.inline-inputs .sample-input[b-e4r4gqdaxi] {
    border-right: 1px solid #d0d0d0 !important;
}

.inline-inputs .recheck-input[b-e4r4gqdaxi] {
    background: #fafafa !important;
}

.inline-inputs .recheck-input:focus[b-e4r4gqdaxi] {
    background: #fff !important;
}

/* ========== IPAD / TABLET OPTIMIZATION ========== */
@media (min-width: 768px) and (max-width: 1199px) {
    /* Larger cells for touch */
    .analysis-cell[b-e4r4gqdaxi] {
        height: 44px;
        width: 110px;
    }

    .analysis-fixed-col .analysis-cell[b-e4r4gqdaxi] {
        height: 44px;
        width: 110px;
    }

    .analysis-cell.header-cell[b-e4r4gqdaxi],
    .analysis-fixed-col .analysis-cell.header-cell[b-e4r4gqdaxi] {
        height: 44px;
    }

    /* Larger inputs */
    .analysis-input[b-e4r4gqdaxi] {
        height: 40px;
        font-size: 16px !important;
        padding: 0.4rem;
    }

    .inline-inputs .analysis-input[b-e4r4gqdaxi] {
        height: 40px;
        font-size: 16px !important;
    }

    /* Larger remove button for touch */
    .btn-remove-col[b-e4r4gqdaxi] {
        width: 32px;
        height: 32px;
        font-size: 1rem;
        opacity: 0.6;
    }

    /* Smooth scrolling */
    .analysis-scroll-area[b-e4r4gqdaxi] {
        -webkit-overflow-scrolling: touch;
    }
}

@media (pointer: coarse) {
    /* Always show remove button on touch devices */
    .btn-remove-col[b-e4r4gqdaxi] {
        opacity: 0.5;
    }
}
/* /Pages/Bottling/LabQc/Components/CapacityTabContent.razor.rz.scp.css */
/* Capacity Tab Content Styles */

.capacity-section[b-ur4o3xvv0f] {
    background: white;
    border-radius: 8px;
    padding: 0.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.section-header[b-ur4o3xvv0f] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #e9ecef;
}

.section-header h6[b-ur4o3xvv0f] {
    margin: 0;
    font-weight: 600;
    color: #333;
}

/* Capacity Table */
.capacity-table[b-ur4o3xvv0f] {
    font-size: 0.8rem;
}

.capacity-table th[b-ur4o3xvv0f],
.capacity-table td[b-ur4o3xvv0f] {
    padding: 0.2rem 0.35rem;
    vertical-align: middle;
}

.capacity-table input[b-ur4o3xvv0f] {
    width: 80px;
}

.sample-num[b-ur4o3xvv0f] {
    font-weight: 600;
    text-align: center;
    width: 30px;
}

.calculated[b-ur4o3xvv0f] {
    font-weight: 500;
    background: #f8f9fa;
    text-align: center;
}

.average-row[b-ur4o3xvv0f] {
    background: #e8f5e9;
    font-weight: 600;
}

/* Specs Panel - Collapsible Reference */
.specs-panel[b-ur4o3xvv0f] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    margin-bottom: 1rem;
    overflow: hidden;
}

.specs-panel.collapsed[b-ur4o3xvv0f] {
    border-color: #dee2e6;
}

.specs-header[b-ur4o3xvv0f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    user-select: none;
    background: #f8f9fa;
    border-bottom: 1px solid transparent;
}

.specs-panel:not(.collapsed) .specs-header[b-ur4o3xvv0f] {
    border-bottom-color: #e9ecef;
}

.specs-header:hover[b-ur4o3xvv0f] {
    background: #f0f0f0;
}

.specs-toggle[b-ur4o3xvv0f] {
    color: #6c757d;
    font-size: 0.85rem;
}

.specs-title[b-ur4o3xvv0f] {
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #495057;
}

.specs-divider[b-ur4o3xvv0f] {
    color: #adb5bd;
    font-size: 0.75rem;
}

.specs-collapsed-hint[b-ur4o3xvv0f] {
    margin-left: auto;
    display: flex;
    gap: 0.75rem;
    font-size: 0.75rem;
    color: #6c757d;
}

.specs-content[b-ur4o3xvv0f] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    padding: 0.75rem;
}

.specs-column[b-ur4o3xvv0f] {
    min-width: 0;
}

.specs-section-title[b-ur4o3xvv0f] {
    font-weight: 600;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: #6c757d;
    margin-bottom: 0.35rem;
    padding-bottom: 0.25rem;
    border-bottom: 1px solid #dee2e6;
}

.spec-row[b-ur4o3xvv0f] {
    display: flex;
    justify-content: space-between;
    padding: 0.15rem 0;
    font-size: 0.8rem;
}

.spec-label[b-ur4o3xvv0f] {
    color: #6c757d;
}

.spec-value[b-ur4o3xvv0f] {
    font-weight: 500;
    color: #212529;
}

/* ========== IPAD / TABLET OPTIMIZATION ========== */
@media (min-width: 768px) and (max-width: 1199px) {
    .capacity-table[b-ur4o3xvv0f] {
        font-size: 0.85rem;
    }

    .capacity-table th[b-ur4o3xvv0f],
    .capacity-table td[b-ur4o3xvv0f] {
        padding: 0.4rem 0.5rem;
    }

    /* Larger inputs for touch */
    .capacity-table input[b-ur4o3xvv0f] {
        min-height: 44px;
        font-size: 16px !important;
        width: 90px;
        padding: 0.4rem;
    }

    /* Larger sample number cell */
    .sample-num[b-ur4o3xvv0f] {
        width: 40px;
        font-size: 0.9rem;
    }

    /* Section header buttons */
    .section-header .btn[b-ur4o3xvv0f] {
        min-height: 44px;
        min-width: 44px;
    }

    /* Specs panel - touch-friendly header */
    .specs-header[b-ur4o3xvv0f] {
        padding: 0.65rem 0.75rem;
        min-height: 44px;
    }
}
/* /Pages/Bottling/LabQc/Components/MaterialChangeLogView.razor.rz.scp.css */
/* MaterialChangeLogView - Timeline of material changes */

.change-log-section[b-lefqun57ao] {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e9ecef;
}

.section-header[b-lefqun57ao] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.section-title[b-lefqun57ao] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #6c757d;
    letter-spacing: 0.3px;
}

.section-title i[b-lefqun57ao] {
    margin-right: 0.25rem;
    color: #0d6efd;
}

.add-btn[b-lefqun57ao] {
    padding: 0 !important;
    font-size: 0.85rem;
    color: #198754 !important;
}

.add-btn:hover[b-lefqun57ao] {
    color: #146c43 !important;
}

/* Empty State */
.empty-state[b-lefqun57ao] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    font-size: 0.75rem;
    color: #6c757d;
}

.empty-state i[b-lefqun57ao] {
    font-size: 0.9rem;
}

/* Add Form */
.add-change-form[b-lefqun57ao] {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.6rem;
    margin-bottom: 0.75rem;
}

.form-row[b-lefqun57ao] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.form-group[b-lefqun57ao] {
    flex: 1;
}

.form-group.flex-grow[b-lefqun57ao] {
    flex: 2;
}

.form-label[b-lefqun57ao] {
    font-size: 0.65rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    margin-bottom: 0.15rem;
    display: block;
}

.form-control-sm[b-lefqun57ao],
.form-select-sm[b-lefqun57ao] {
    font-size: 0.78rem !important;
    padding: 0.25rem 0.4rem !important;
}

.form-actions[b-lefqun57ao] {
    display: flex;
    justify-content: flex-end;
    gap: 0.35rem;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e9ecef;
}

.form-actions .btn[b-lefqun57ao] {
    font-size: 0.72rem !important;
    padding: 0.25rem 0.6rem !important;
}

/* Timeline */
.timeline[b-lefqun57ao] {
    position: relative;
    padding-left: 1.25rem;
}

.timeline[b-lefqun57ao]::before {
    content: '';
    position: absolute;
    left: 0.35rem;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #e9ecef;
}

.timeline-item[b-lefqun57ao] {
    position: relative;
    padding-bottom: 0.75rem;
}

.timeline-item:last-child[b-lefqun57ao] {
    padding-bottom: 0;
}

.timeline-marker[b-lefqun57ao] {
    position: absolute;
    left: -1.25rem;
    top: 0;
    width: 0.9rem;
    height: 0.9rem;
    background: #fff;
    border: 2px solid #0d6efd;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.timeline-marker i[b-lefqun57ao] {
    font-size: 0.5rem;
    color: #0d6efd;
}

.timeline-content[b-lefqun57ao] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.5rem 0.6rem;
}

.change-header[b-lefqun57ao] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.35rem;
}

.component-badge[b-lefqun57ao] {
    font-size: 0.62rem;
    font-weight: 700;
    padding: 0.1rem 0.35rem;
    background: #6c757d;
    color: white;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.change-time[b-lefqun57ao] {
    font-size: 0.68rem;
    color: #6c757d;
}

.change-time span + span[b-lefqun57ao]::before {
    content: ' ';
}

.change-details[b-lefqun57ao] {
    margin-bottom: 0.25rem;
}

.lot-change[b-lefqun57ao] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    font-weight: 500;
}

.old-lot[b-lefqun57ao] {
    color: #dc3545;
    text-decoration: line-through;
}

.lot-change i[b-lefqun57ao] {
    font-size: 0.65rem;
    color: #6c757d;
}

.new-lot[b-lefqun57ao] {
    color: #198754;
    font-weight: 600;
}

.supplier-change[b-lefqun57ao] {
    font-size: 0.7rem;
    color: #6c757d;
}

.supplier-change i[b-lefqun57ao] {
    font-size: 0.6rem;
    margin: 0 0.25rem;
}

.change-notes[b-lefqun57ao] {
    font-size: 0.7rem;
    color: #495057;
    font-style: italic;
    padding: 0.25rem 0;
    border-top: 1px dashed #e9ecef;
    margin-top: 0.25rem;
}

.change-meta[b-lefqun57ao] {
    display: flex;
    justify-content: space-between;
    font-size: 0.62rem;
    color: #adb5bd;
    margin-top: 0.25rem;
    padding-top: 0.25rem;
    border-top: 1px solid #f0f0f0;
}
/* /Pages/Bottling/LabQc/Components/MaterialSelector.razor.rz.scp.css */
/* MaterialSelector - Modal for selecting from logged receipts */

.modal-backdrop[b-saxe9o47o5] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1040;
}

.modal[b-saxe9o47o5] {
    z-index: 1050;
}

.modal-title[b-saxe9o47o5] {
    font-size: 0.9rem;
    font-weight: 600;
}

.modal-title i[b-saxe9o47o5] {
    color: #0d6efd;
}

.material-list[b-saxe9o47o5] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.material-option[b-saxe9o47o5] {
    position: relative;
    padding: 0.6rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    transition: all 0.15s ease;
}

.material-option:hover[b-saxe9o47o5] {
    border-color: #0d6efd;
    background: #f8f9fa;
}

.material-option.selected[b-saxe9o47o5] {
    border-color: #0d6efd;
    background: #e7f1ff;
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.15);
}

.option-header[b-saxe9o47o5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
}

.lot-number[b-saxe9o47o5] {
    font-weight: 600;
    font-size: 0.85rem;
    color: #212529;
}

.current-badge[b-saxe9o47o5] {
    font-size: 0.55rem;
    font-weight: 700;
    padding: 0.1rem 0.3rem;
    background: #198754;
    color: white;
    border-radius: 3px;
    letter-spacing: 0.5px;
}

.option-details[b-saxe9o47o5] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.detail[b-saxe9o47o5] {
    font-size: 0.72rem;
    color: #6c757d;
}

.detail i[b-saxe9o47o5] {
    margin-right: 0.2rem;
    font-size: 0.68rem;
}

.option-desc[b-saxe9o47o5] {
    font-size: 0.7rem;
    color: #495057;
    margin-top: 0.35rem;
    padding-top: 0.35rem;
    border-top: 1px dashed #e9ecef;
}

.selected-indicator[b-saxe9o47o5] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    color: #0d6efd;
    font-size: 1.1rem;
}
/* /Pages/Bottling/LabQc/Components/O2Co2FilterTabContent.razor.rz.scp.css */
/* ========== TAB CONTENT (fade animation) ========== */
.tab-pane-content[b-jr1ci10pam] {
    animation: fadeIn-b-jr1ci10pam 0.15s ease;
}

@keyframes fadeIn-b-jr1ci10pam {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ========== PATROL SECTION ========== */
.patrol-section[b-jr1ci10pam] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    margin-bottom: 0.75rem;
    overflow: hidden;
}

.section-header[b-jr1ci10pam] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0.6rem;
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
    border-bottom: 1px solid #dee2e6;
}

.section-header h6[b-jr1ci10pam] {
    margin: 0;
    font-size: 0.85rem;
    font-weight: 600;
}

/* ========== O2/CO2 GRID ========== */
.o2co2-grid-container[b-jr1ci10pam] {
    display: flex;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
}

/* Fixed left column - parameter names */
.o2co2-fixed-col[b-jr1ci10pam] {
    flex-shrink: 0;
    background: #f0f0f0;
    border-right: 2px solid #a0a0a0;
    z-index: 1;
}

.o2co2-fixed-col .o2co2-cell[b-jr1ci10pam] {
    width: 130px;
    height: 32px;
    text-align: left;
    font-weight: 500;
    font-size: 0.75rem;
    color: #495057;
    padding-left: 0.5rem;
    padding-right: 0.25rem;
    background: #f0f0f0;
    border-bottom: 1px solid #c0c0c0;
    box-sizing: border-box;
    display: flex;
    align-items: center;
}

.o2co2-fixed-col .o2co2-cell.header-cell[b-jr1ci10pam] {
    height: 32px;
    border-bottom: 2px solid #a0a0a0;
}

/* Scrollable area for data columns */
.o2co2-scroll-area[b-jr1ci10pam] {
    flex: 1;
    overflow-x: auto;
    overflow-y: hidden;
}

.o2co2-columns[b-jr1ci10pam] {
    display: flex;
    min-width: max-content;
}

.o2co2-col[b-jr1ci10pam] {
    flex-shrink: 0;
}

/* Grid cells */
.o2co2-cell[b-jr1ci10pam] {
    height: 32px;
    width: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid #c0c0c0;
    border-bottom: 1px solid #c0c0c0;
    padding: 0 2px;
    font-size: 0.78rem;
    background: #fff;
    box-sizing: border-box;
}

/* Header cells */
.o2co2-cell.header-cell[b-jr1ci10pam] {
    height: 32px;
    background: #f0f0f0;
    font-weight: 600;
    border-bottom: 2px solid #a0a0a0;
    position: relative;
}

.col-number[b-jr1ci10pam] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #495057;
}

/* Metadata rows (Pallet, Time, Note) */
.o2co2-cell.metadata-cell[b-jr1ci10pam] {
    background: #fafafa;
}

.o2co2-fixed-col .o2co2-cell.metadata-row[b-jr1ci10pam] {
    background: #fafafa;
}

/* Time display in Filtration section */
.time-display[b-jr1ci10pam] {
    font-size: 0.72rem;
    color: #495057;
    font-weight: 500;
}

/* Input styling */
.o2co2-input[b-jr1ci10pam] {
    width: 100%;
    height: 26px;
    padding: 0.15rem 0.2rem;
    font-size: 0.72rem;
    text-align: center;
    border: none !important;
    background: #fff !important;
    border-radius: 0;
}

.o2co2-input:focus[b-jr1ci10pam] {
    background: #fff !important;
    box-shadow: inset 0 0 0 2px #0078d4;
    outline: none;
}

.o2co2-input:hover:not(:focus):not(:disabled)[b-jr1ci10pam] {
    background: #f5f5f5 !important;
}

/* Metadata cell inputs need transparent background */
.metadata-cell .o2co2-input[b-jr1ci10pam] {
    background: transparent !important;
}

.metadata-cell .o2co2-input:focus[b-jr1ci10pam] {
    background: #fff !important;
}

/* Remove spin buttons from number inputs */
.o2co2-input[type="number"][b-jr1ci10pam]::-webkit-outer-spin-button,
.o2co2-input[type="number"][b-jr1ci10pam]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.o2co2-input[type="number"][b-jr1ci10pam] {
    -moz-appearance: textfield;
}

/* Select styling */
.o2co2-select[b-jr1ci10pam] {
    width: 100%;
    height: 26px;
    padding: 0 0.2rem;
    font-size: 0.72rem;
    text-align: center;
    border: none !important;
    background: #fff !important;
    border-radius: 0;
    cursor: pointer;
}

.o2co2-select:focus[b-jr1ci10pam] {
    background: #fff !important;
    box-shadow: inset 0 0 0 2px #0078d4;
    outline: none;
}

.o2co2-select:hover:not(:focus):not(:disabled)[b-jr1ci10pam] {
    background: #f5f5f5 !important;
}

/* Remove column button */
.btn-remove-col[b-jr1ci10pam] {
    position: absolute;
    right: 2px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #dc3545;
    padding: 0;
    width: 16px;
    height: 16px;
    font-size: 0.7rem;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.15s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.o2co2-col:hover .btn-remove-col[b-jr1ci10pam] {
    opacity: 0.6;
}

.btn-remove-col:hover[b-jr1ci10pam] {
    opacity: 1 !important;
}

/* ========== IPAD / TABLET OPTIMIZATION ========== */
@media (min-width: 768px) and (max-width: 1199px) {
    /* Larger cells for touch */
    .o2co2-cell[b-jr1ci10pam] {
        height: 44px;
        width: 110px;
    }

    .o2co2-fixed-col .o2co2-cell[b-jr1ci10pam] {
        height: 44px;
        width: 140px;
    }

    .o2co2-cell.header-cell[b-jr1ci10pam],
    .o2co2-fixed-col .o2co2-cell.header-cell[b-jr1ci10pam] {
        height: 44px;
    }

    /* Larger inputs */
    .o2co2-input[b-jr1ci10pam],
    .o2co2-select[b-jr1ci10pam] {
        height: 40px;
        font-size: 16px !important;
        padding: 0.4rem;
    }

    /* Larger remove button for touch */
    .btn-remove-col[b-jr1ci10pam] {
        width: 32px;
        height: 32px;
        font-size: 1rem;
        opacity: 0.6;
    }

    /* Smooth scrolling */
    .o2co2-scroll-area[b-jr1ci10pam] {
        -webkit-overflow-scrolling: touch;
    }
}

@media (pointer: coarse) {
    /* Always show remove button on touch devices */
    .btn-remove-col[b-jr1ci10pam] {
        opacity: 0.5;
    }
}
/* /Pages/Bottling/LabQc/Components/PackagingProfileSidebar.razor.rz.scp.css */
/* PackagingProfileSidebar - Main sidebar component */

.profile-sidebar[b-xaaslwlk9r] {
    position: relative;
    background: #fff;
    border-right: 1px solid #dee2e6;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: width 0.2s ease;
    overflow: hidden;
}

.profile-sidebar.expanded[b-xaaslwlk9r] {
    width: 320px;
    min-width: 320px;
}

.profile-sidebar.collapsed[b-xaaslwlk9r] {
    width: 36px;
    min-width: 36px;
}

/* Toggle Button */
.sidebar-toggle[b-xaaslwlk9r] {
    position: absolute;
    top: 0.5rem;
    right: -1px;
    z-index: 10;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.35rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-right: none;
    border-radius: 4px 0 0 4px;
    cursor: pointer;
    font-size: 0.75rem;
    color: #6c757d;
    transition: all 0.15s ease;
}

.profile-sidebar.collapsed .sidebar-toggle[b-xaaslwlk9r] {
    position: static;
    width: 100%;
    border: none;
    border-bottom: 1px solid #dee2e6;
    border-radius: 0;
    padding: 0.5rem 0.25rem;
    flex-direction: column;
    gap: 0.35rem;
}

.sidebar-toggle:hover[b-xaaslwlk9r] {
    background: #f8f9fa;
    color: #0d6efd;
}

.toggle-label[b-xaaslwlk9r] {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Sidebar Content */
.sidebar-content[b-xaaslwlk9r] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem;
    padding-top: 2.5rem; /* Space for toggle button */
    padding-bottom: 0.5rem; /* Reduce bottom padding, footer handles it */
}

/* Sticky Footer */
.sidebar-footer[b-xaaslwlk9r] {
    flex-shrink: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    border-top: 1px solid #dee2e6;
    background: #f8f9fa;
}

.sidebar-footer .footer-left[b-xaaslwlk9r],
.sidebar-footer .footer-right[b-xaaslwlk9r] {
    display: flex;
    gap: 0.35rem;
}

.sidebar-footer .btn[b-xaaslwlk9r] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.sidebar-footer .btn-outline-success[b-xaaslwlk9r] {
    border-color: #198754;
    color: #198754;
}

.sidebar-footer .btn-outline-success:hover[b-xaaslwlk9r] {
    background-color: #198754;
    color: white;
}

/* Profile Header */
.profile-header[b-xaaslwlk9r] {
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e9ecef;
}

/* Loading State */
.sidebar-loading[b-xaaslwlk9r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2rem 1rem;
    color: #6c757d;
    font-size: 0.82rem;
}

/* No Profile - Prominent Create UI */
.no-profile-container[b-xaaslwlk9r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    text-align: center;
}

.no-profile-icon[b-xaaslwlk9r] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.no-profile-icon i[b-xaaslwlk9r] {
    font-size: 1.5rem;
    color: #6c757d;
}

.no-profile-message[b-xaaslwlk9r] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.no-profile-message strong[b-xaaslwlk9r] {
    font-size: 0.9rem;
    color: #495057;
}

.no-profile-message span[b-xaaslwlk9r] {
    font-size: 0.75rem;
    color: #6c757d;
    line-height: 1.4;
}

.btn-create-profile[b-xaaslwlk9r] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    width: 100%;
    padding: 0.6rem 1rem;
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 6px;
    transition: all 0.15s ease;
}

.btn-create-profile:hover:not(:disabled)[b-xaaslwlk9r] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(13, 110, 253, 0.3);
}

.btn-create-profile:disabled[b-xaaslwlk9r] {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Legacy no-profile class (kept for compatibility) */
.no-profile[b-xaaslwlk9r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    padding: 1rem;
    background: #fff3cd;
    border-radius: 6px;
    text-align: center;
    font-size: 0.82rem;
    color: #856404;
}

.no-profile i[b-xaaslwlk9r] {
    font-size: 1.25rem;
}

.profile-identity[b-xaaslwlk9r] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.profile-name[b-xaaslwlk9r] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #212529;
}

.profile-meta[b-xaaslwlk9r] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    font-size: 0.75rem;
}

.bottle-size[b-xaaslwlk9r] {
    font-weight: 600;
    color: #495057;
}

.closure-type[b-xaaslwlk9r] {
    color: #6c757d;
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
}

.snow-indicator[b-xaaslwlk9r] {
    color: #00bcd4;
    font-size: 1rem;
    text-shadow: 0 0 6px rgba(0, 188, 212, 0.5);
}

.shiner-badge[b-xaaslwlk9r] {
    font-size: 0.6rem;
    font-weight: 700;
    padding: 0.1rem 0.3rem;
    background: #ffc107;
    color: #212529;
    border-radius: 3px;
    letter-spacing: 0.5px;
}

.linked-dates[b-xaaslwlk9r] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.35rem;
}

.dates-label[b-xaaslwlk9r] {
    font-size: 0.68rem;
    color: #6c757d;
    font-weight: 500;
}

.date-chip[b-xaaslwlk9r] {
    font-size: 0.68rem;
    padding: 0.15rem 0.4rem;
    background: #e9ecef;
    border: 1px solid #dee2e6;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.date-chip:hover[b-xaaslwlk9r] {
    background: #dee2e6;
}

.date-chip.current[b-xaaslwlk9r] {
    background: #0d6efd;
    border-color: #0d6efd;
    color: white;
}

/* Profile Sections */
.profile-sections[b-xaaslwlk9r] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.profile-section[b-xaaslwlk9r] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    overflow: hidden;
}

.section-header[b-xaaslwlk9r] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.6rem;
    background: #f8f9fa;
    border: none;
    cursor: pointer;
    transition: background 0.15s ease;
    text-align: left;
}

.section-header:hover[b-xaaslwlk9r] {
    background: #e9ecef;
}

.section-icon[b-xaaslwlk9r] {
    font-size: 0.85rem;
    color: #6c757d;
    width: 1.25rem;
    text-align: center;
}

.section-icon[b-xaaslwlk9r]  i {
    font-size: 0.85rem;
}

.section-name[b-xaaslwlk9r] {
    flex: 1;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #495057;
    letter-spacing: 0.3px;
}

.field-count[b-xaaslwlk9r] {
    font-size: 0.65rem;
    color: #adb5bd;
    font-weight: 500;
}

.expand-icon[b-xaaslwlk9r] {
    font-size: 0.72rem;
    color: #6c757d;
}

.section-body[b-xaaslwlk9r] {
    padding: 0.5rem 0.6rem;
    border-top: 1px solid #e9ecef;
}

/* Materials Section */
.materials-section[b-xaaslwlk9r] {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e9ecef;
}

.materials-header[b-xaaslwlk9r] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.materials-header .section-title[b-xaaslwlk9r] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #6c757d;
    letter-spacing: 0.3px;
}

.materials-header .section-title i[b-xaaslwlk9r] {
    margin-right: 0.25rem;
    color: #0d6efd;
}

.materials-header .btn-link[b-xaaslwlk9r] {
    padding: 0 !important;
    font-size: 0.85rem;
    color: #198754 !important;
}

.materials-header .btn-link:hover[b-xaaslwlk9r] {
    color: #146c43 !important;
}

.materials-list[b-xaaslwlk9r] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Materials Section Body */
.materials-body[b-xaaslwlk9r] {
    padding: 0.5rem !important;
}

.no-materials[b-xaaslwlk9r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    color: #6c757d;
    font-size: 0.8rem;
    text-align: center;
}

/* Material Item - Editable Card */
.material-item[b-xaaslwlk9r] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 0.5rem;
    margin-bottom: 0.5rem;
}

.material-item:last-of-type[b-xaaslwlk9r] {
    margin-bottom: 0;
}

.material-item-header[b-xaaslwlk9r] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid #f1f3f4;
}

.material-type[b-xaaslwlk9r] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
}

.material-type i[b-xaaslwlk9r] {
    color: #6c757d;
}

.primary-badge[b-xaaslwlk9r] {
    font-size: 0.55rem;
    font-weight: 700;
    padding: 0.1rem 0.25rem;
    background: #198754;
    color: white;
    border-radius: 3px;
    letter-spacing: 0.3px;
}

/* Material Fields - Editable */
.material-fields[b-xaaslwlk9r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.35rem;
}

.material-field[b-xaaslwlk9r] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.material-field.full-width[b-xaaslwlk9r] {
    grid-column: 1 / -1;
}

.material-field label[b-xaaslwlk9r] {
    font-size: 0.65rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin: 0;
}

.material-field input[b-xaaslwlk9r] {
    font-size: 0.78rem;
    padding: 0.25rem 0.4rem;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.material-field input:focus[b-xaaslwlk9r] {
    border-color: #86b7fe;
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.15);
    outline: none;
}

.material-field input:hover:not(:focus)[b-xaaslwlk9r] {
    border-color: #adb5bd;
}

/* Material Actions */
.material-actions[b-xaaslwlk9r] {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.5rem;
    padding-top: 0.35rem;
    border-top: 1px solid #f1f3f4;
}

.material-actions .btn[b-xaaslwlk9r] {
    font-size: 0.7rem;
    padding: 0.2rem 0.5rem;
}

.add-material-btn[b-xaaslwlk9r] {
    font-size: 0.75rem;
    padding: 0.25rem 0;
    color: #198754;
}

.add-material-btn:hover[b-xaaslwlk9r] {
    color: #146c43;
}

/* Documents Section */
.documents-body[b-xaaslwlk9r] {
    padding: 0.5rem !important;
}

.upload-area[b-xaaslwlk9r] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 0.75rem;
}

.upload-area input[type="file"][b-xaaslwlk9r] {
    flex: 1;
    font-size: 0.75rem;
    padding: 0.25rem 0.35rem;
}

.upload-area .btn[b-xaaslwlk9r] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.72rem;
    white-space: nowrap;
}

.document-list[b-xaaslwlk9r] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.document-item[b-xaaslwlk9r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.35rem 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    font-size: 0.75rem;
}

.document-link[b-xaaslwlk9r] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    color: #0d6efd;
    text-decoration: none;
    overflow: hidden;
}

.document-link:hover[b-xaaslwlk9r] {
    text-decoration: underline;
}

.document-link i[b-xaaslwlk9r] {
    flex-shrink: 0;
    color: #6c757d;
}

.document-name[b-xaaslwlk9r] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-item .btn-link[b-xaaslwlk9r] {
    font-size: 0.85rem;
    line-height: 1;
}

.no-documents[b-xaaslwlk9r] {
    text-align: center;
    padding: 0.75rem;
    color: #6c757d;
    font-size: 0.8rem;
}

/* Mobile Responsiveness */
@media (max-width: 992px) {
    .profile-sidebar.expanded[b-xaaslwlk9r] {
        width: 280px;
        min-width: 280px;
    }
}

@media (max-width: 768px) {
    .profile-sidebar[b-xaaslwlk9r] {
        position: fixed;
        left: 0;
        top: 0;
        bottom: 0;
        z-index: 1000;
        box-shadow: 2px 0 8px rgba(0,0,0,0.15);
    }

    .profile-sidebar.collapsed[b-xaaslwlk9r] {
        transform: translateX(-100%);
        width: 0;
        min-width: 0;
    }

    .profile-sidebar.collapsed .sidebar-toggle[b-xaaslwlk9r] {
        position: fixed;
        left: 0;
        top: 50%;
        transform: translateY(-50%) translateX(0);
        width: auto;
        padding: 0.5rem;
        border-radius: 0 4px 4px 0;
        box-shadow: 2px 0 4px rgba(0,0,0,0.1);
    }

    .profile-sidebar.expanded[b-xaaslwlk9r] {
        width: 100%;
        max-width: 320px;
    }
}

/* Print - hide sidebar */
@media print {
    .profile-sidebar[b-xaaslwlk9r] {
        display: none !important;
    }
}
/* /Pages/Bottling/LabQc/Components/PackagingQcSection.razor.rz.scp.css */
.packaging-qc-section[b-63byngywon] {
    margin-top: 1rem;
    background: white;
    border-radius: 8px;
    padding: 0.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.section-header[b-63byngywon] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #e9ecef;
}

.section-header h6[b-63byngywon] {
    margin: 0;
    font-weight: 600;
    color: #333;
}

.header-actions[b-63byngywon] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Snow Dropper Indicator */
.snow-indicator[b-63byngywon] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    background: #e3f2fd;
    color: #1976d2;
    border: 1px solid #90caf9;
}

.snow-indicator.active[b-63byngywon] {
    background: #1976d2;
    color: white;
    border-color: #1565c0;
    animation: snow-pulse-b-63byngywon 2s ease-in-out infinite;
}

.snow-indicator i[b-63byngywon] {
    font-size: 0.9rem;
}

@keyframes snow-pulse-b-63byngywon {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* Context Indicator */
.context-indicator[b-63byngywon] {
    padding: 0.25rem 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    border-left: 3px solid #6c757d;
}

/* Table Styles */
.packaging-table[b-63byngywon] {
    font-size: 0.8rem;
    width: auto;
    table-layout: fixed;
}

.packaging-table th[b-63byngywon],
.packaging-table td[b-63byngywon] {
    vertical-align: middle;
    padding: 0.2rem 0.35rem;
}

.item-header[b-63byngywon] {
    width: 120px;
    background: #f8f9fa;
    font-weight: 600;
}

.expected-header[b-63byngywon] {
    width: 120px;
    background: #f8f9fa;
    font-weight: 600;
}

.patrol-header[b-63byngywon] {
    width: 75px;
    background: #f8f9fa;
    text-align: center;
}

/* Patrol delete button */
.patrol-actions[b-63byngywon] {
    display: flex;
    justify-content: flex-end;
    min-height: 18px;
}

.patrol-actions .btn-link[b-63byngywon] {
    opacity: 0.4;
    transition: opacity 0.2s;
    font-size: 0.75rem;
}

.patrol-header:hover .patrol-actions .btn-link[b-63byngywon] {
    opacity: 1;
}

.patrol-time input[b-63byngywon] {
    width: 70px;
    font-size: 0.7rem;
    text-align: center;
    padding: 2px;
}

.patrol-pallet input[b-63byngywon] {
    width: 70px;
    font-size: 0.65rem;
    text-align: center;
    margin-top: 2px;
    padding: 2px;
}

/* Section Row */
.section-row[b-63byngywon] {
    background: #e9ecef !important;
}

.section-label[b-63byngywon] {
    font-weight: 700;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #495057;
    padding: 0.5rem !important;
}

/* Item Row */
.item-row .item-name[b-63byngywon] {
    font-weight: 500;
    padding-left: 0.5rem;
    white-space: normal;
    word-wrap: break-word;
}

.item-row .expected-value[b-63byngywon] {
    color: #495057;
    font-size: 0.75rem;
    white-space: normal;
    word-wrap: break-word;
}

/* Snow Dropper Row - highlight for billable equipment */
.snow-dropper-row[b-63byngywon] {
    background: rgba(25, 118, 210, 0.05);
}

.snow-dropper-row .item-name[b-63byngywon] {
    color: #1976d2;
}

/* Verification Cell */
.verification-cell[b-63byngywon] {
    text-align: center;
    padding: 0.25rem !important;
}

.verification-btn[b-63byngywon] {
    width: 26px;
    height: 26px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.verification-btn i[b-63byngywon] {
    font-size: 0.85rem;
}

.verification-cell.verified[b-63byngywon] {
    background: rgba(25, 135, 84, 0.1);
}

.verification-cell.mismatch[b-63byngywon] {
    background: rgba(220, 53, 69, 0.1);
}

/* Inline verification cell with horizontal layout */
.verification-cell-inline[b-63byngywon] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.actual-input-inline[b-63byngywon] {
    font-size: 0.65rem;
    width: 50px;
    padding: 2px 3px;
    height: 24px;
}

/* Empty patrol column (inactive) */
.empty-patrol[b-63byngywon] {
    background: #f8f9fa;
    cursor: pointer;
}

.empty-patrol:hover[b-63byngywon] {
    background: #e9ecef;
}

.empty-patrol .verification-btn[b-63byngywon] {
    opacity: 0.3;
}

/* Alert styling */
.alert[b-63byngywon] {
    margin: 1rem 0;
}

/* Value-only Row - display only, no verification */
.value-only-row[b-63byngywon] {
    background: #fafafa;
}

.value-only-row .item-name[b-63byngywon] {
    font-weight: 400;
    font-style: italic;
    color: #6c757d;
}

.value-only-cell[b-63byngywon] {
    background: #f8f9fa;
}

/* Notes Section */
.notes-section[b-63byngywon] {
    border-top: 1px solid #e9ecef;
    padding-top: 0.75rem;
}

/* ========== IPAD / TABLET OPTIMIZATION ========== */
@media (min-width: 768px) and (max-width: 1199px) {
    /* Larger table cells */
    .packaging-table th[b-63byngywon],
    .packaging-table td[b-63byngywon] {
        padding: 0.4rem 0.5rem;
    }

    /* Larger patrol columns for touch */
    .patrol-header[b-63byngywon] {
        width: 90px;
    }

    /* Patrol time/pallet inputs */
    .patrol-time input[b-63byngywon],
    .patrol-pallet input[b-63byngywon] {
        min-height: 40px;
        font-size: 16px !important;
        padding: 0.3rem 0.4rem;
    }

    /* Actual value inline inputs */
    .actual-input-inline[b-63byngywon] {
        min-height: 40px;
        font-size: 16px !important;
        padding: 0.3rem 0.4rem;
    }

    /* Verification buttons - larger touch target */
    .verification-btn[b-63byngywon] {
        width: 40px;
        height: 40px;
        font-size: 1.1rem;
    }

    .verification-btn i[b-63byngywon] {
        font-size: 1rem;
    }

    /* Delete patrol button */
    .patrol-actions .btn-link[b-63byngywon] {
        min-width: 44px;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Notes textarea */
    .notes-section textarea[b-63byngywon] {
        font-size: 16px !important;
        min-height: 80px;
    }
}

@media (pointer: coarse) {
    /* Always show patrol delete on touch */
    .patrol-actions .btn-link[b-63byngywon] {
        opacity: 0.6;
    }
}
/* /Pages/Bottling/LabQc/Components/ProfileFieldEditor.razor.rz.scp.css */
/* ProfileFieldEditor - Inline field editing */

.profile-field[b-t5702y5rex] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.35rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.profile-field:last-child[b-t5702y5rex] {
    border-bottom: none;
}

.profile-field.empty .field-label .label-text[b-t5702y5rex] {
    color: #adb5bd;
}

.profile-field.lot-field[b-t5702y5rex] {
    background: #fffbeb;
    margin: 0 -0.5rem;
    padding: 0.35rem 0.5rem;
    border-radius: 4px;
}

.field-label[b-t5702y5rex] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.label-text[b-t5702y5rex] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.lot-badge[b-t5702y5rex] {
    font-size: 0.55rem;
    font-weight: 700;
    padding: 0.1rem 0.25rem;
    background: #ffc107;
    color: #212529;
    border-radius: 3px;
    letter-spacing: 0.5px;
}

.field-value-container[b-t5702y5rex] {
    min-height: 24px;
}

/* Read Mode */
.read-mode[b-t5702y5rex] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.35rem;
    padding: 0.2rem 0;
    border-radius: 3px;
    transition: background 0.15s ease;
}

.read-mode.editable[b-t5702y5rex] {
    cursor: pointer;
}

.read-mode.editable:hover[b-t5702y5rex] {
    background: #f8f9fa;
}

.value-text[b-t5702y5rex] {
    font-size: 0.82rem;
    color: #212529;
    font-weight: 500;
    word-break: break-word;
}

.empty-placeholder[b-t5702y5rex] {
    font-size: 0.78rem;
    color: #adb5bd;
    font-style: italic;
}

.empty-value[b-t5702y5rex] {
    font-size: 0.78rem;
    color: #dee2e6;
}

.edit-icon[b-t5702y5rex],
.add-icon[b-t5702y5rex] {
    font-size: 0.72rem;
    color: #0d6efd;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.read-mode.editable:hover .edit-icon[b-t5702y5rex],
.read-mode.editable:hover .add-icon[b-t5702y5rex] {
    opacity: 1;
}

.lock-icon[b-t5702y5rex] {
    font-size: 0.65rem;
    color: #adb5bd;
}

/* Edit Mode */
.edit-mode[b-t5702y5rex] {
    display: flex;
    gap: 0.35rem;
    align-items: center;
}

.edit-input[b-t5702y5rex] {
    flex: 1;
    font-size: 0.82rem !important;
    padding: 0.25rem 0.4rem !important;
    height: auto !important;
}

.edit-actions[b-t5702y5rex] {
    display: flex;
    gap: 0.2rem;
}

.save-btn[b-t5702y5rex],
.cancel-btn[b-t5702y5rex] {
    padding: 0.15rem 0.35rem !important;
    font-size: 0.72rem !important;
    line-height: 1 !important;
}

.save-btn i[b-t5702y5rex],
.cancel-btn i[b-t5702y5rex] {
    font-size: 0.8rem;
}
/* /Pages/Bottling/LabQc/Components/ProfileMaterialCard.razor.rz.scp.css */
/* ProfileMaterialCard - Material display card */

.material-card[b-8le69htpez] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 0.5rem;
    transition: all 0.15s ease;
}

.material-card:hover[b-8le69htpez] {
    border-color: #adb5bd;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.material-card.primary[b-8le69htpez] {
    border-left: 3px solid #198754;
}

.material-card.selected[b-8le69htpez] {
    border-color: #0d6efd;
    background: #f0f7ff;
}

.card-header[b-8le69htpez] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.5rem;
    background: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
}

.component-type[b-8le69htpez] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    flex: 1;
}

.component-type i[b-8le69htpez] {
    margin-right: 0.25rem;
    color: #6c757d;
}

.primary-badge[b-8le69htpez] {
    font-size: 0.55rem;
    font-weight: 700;
    padding: 0.1rem 0.3rem;
    background: #198754;
    color: white;
    border-radius: 3px;
    letter-spacing: 0.5px;
}

.select-btn[b-8le69htpez] {
    padding: 0 !important;
    font-size: 0.85rem;
    color: #0d6efd !important;
}

.select-btn:hover[b-8le69htpez] {
    color: #0a58ca !important;
}

.card-body[b-8le69htpez] {
    padding: 0.4rem 0.5rem;
}

.material-row[b-8le69htpez] {
    display: flex;
    gap: 0.35rem;
    padding: 0.15rem 0;
    font-size: 0.75rem;
}

.material-row:first-child[b-8le69htpez] {
    padding-top: 0;
}

.row-label[b-8le69htpez] {
    color: #6c757d;
    font-weight: 500;
    min-width: 50px;
    flex-shrink: 0;
}

.row-value[b-8le69htpez] {
    color: #212529;
    word-break: break-word;
}

.lot-row[b-8le69htpez] {
    background: #fffbeb;
    margin: 0 -0.5rem;
    padding: 0.25rem 0.5rem !important;
    border-radius: 3px;
}

.lot-value[b-8le69htpez] {
    font-weight: 600;
    color: #856404;
}

.qty-value[b-8le69htpez] {
    font-weight: 600;
}

.date-value[b-8le69htpez] {
    color: #6c757d;
}

.desc-value[b-8le69htpez] {
    color: #495057;
    font-size: 0.7rem;
}

.started-row[b-8le69htpez] {
    color: #0d6efd;
    font-weight: 500;
}

.card-actions[b-8le69htpez] {
    padding: 0.35rem 0.5rem;
    border-top: 1px solid #e9ecef;
    background: #fafafa;
}

.action-btn[b-8le69htpez] {
    font-size: 0.7rem !important;
    padding: 0.2rem 0.5rem !important;
}

.action-btn i[b-8le69htpez] {
    font-size: 0.75rem;
}
/* /Pages/Bottling/LabQc/Components/TankGallonsSection.razor.rz.scp.css */
/* ========== TANK GALLONS SECTION ========== */
.tank-gallons-section[b-4ex72jmypr] {
    margin-bottom: 1rem;
    max-width: 600px;
}

.tank-gallons-section table[b-4ex72jmypr] {
    font-size: 0.78rem;
}

.tank-gallons-section th[b-4ex72jmypr] {
    background: #f8f9fa;
    font-weight: 600;
    text-align: center;
    padding: 0.25rem 0.2rem;
    white-space: nowrap;
}

.tank-gallons-section td[b-4ex72jmypr] {
    padding: 0.15rem 0.2rem;
    vertical-align: middle;
}

/* Column widths */
.col-order[b-4ex72jmypr] { width: 45px; text-align: center; }
.col-tank[b-4ex72jmypr] { width: 80px; }
.col-measurement[b-4ex72jmypr] { width: 85px; }
.col-gallons[b-4ex72jmypr] { width: 65px; }
.col-difference[b-4ex72jmypr] { width: 65px; text-align: center; }
.col-actions[b-4ex72jmypr] { width: 30px; text-align: center; }

/* Order controls */
.order-controls[b-4ex72jmypr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    line-height: 1;
}

.order-number[b-4ex72jmypr] {
    font-weight: 600;
    font-size: 0.75rem;
    color: #6c757d;
}

.order-btn[b-4ex72jmypr] {
    color: #adb5bd;
    font-size: 0.65rem;
    line-height: 1;
    padding: 0 !important;
}

.order-btn:hover:not(:disabled)[b-4ex72jmypr] {
    color: #0d6efd;
}

.order-btn:disabled[b-4ex72jmypr] {
    opacity: 0.3;
}

/* Input with verification icon */
.input-with-verify[b-4ex72jmypr] {
    position: relative;
    display: flex;
    align-items: center;
}

.input-with-verify .form-control[b-4ex72jmypr] {
    flex: 1;
}

.verify-icon[b-4ex72jmypr] {
    position: absolute;
    right: 4px;
    font-size: 0.65rem;
    pointer-events: none;
}

/* Saved row indicator */
.saved-row[b-4ex72jmypr] {
    background-color: #f8fff8;
}

/* Input styling */
.tank-gallons-section .form-control[b-4ex72jmypr] {
    font-size: 0.72rem;
    padding: 0.12rem 0.2rem;
    text-align: center;
}

.tank-gallons-section .form-control:disabled[b-4ex72jmypr] {
    background-color: #f8f9fa;
}

/* Difference values */
.difference-value[b-4ex72jmypr] {
    font-weight: 600;
    font-size: 0.8rem;
}

.difference-value.positive[b-4ex72jmypr] { color: #198754; }
.difference-value.negative[b-4ex72jmypr] { color: #dc3545; }

/* Total row */
.total-row[b-4ex72jmypr] {
    background: #f0f7ff;
}

.total-row td[b-4ex72jmypr] {
    padding: 0.4rem 0.2rem;
    border-top: 2px solid #dee2e6;
}

.total-value[b-4ex72jmypr] {
    font-weight: 700;
    font-size: 0.85rem;
    color: #0d6efd;
}

/* Add button in header */
.btn-add[b-4ex72jmypr] {
    padding: 0.1rem 0.3rem;
    font-size: 0.7rem;
}

/* Action buttons container */
.action-buttons[b-4ex72jmypr] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

/* Saved indicator */
.saved-indicator[b-4ex72jmypr] {
    font-size: 0.9rem;
}

/* Save button */
.save-btn[b-4ex72jmypr] {
    font-size: 0.85rem;
}

.save-btn:hover[b-4ex72jmypr] {
    opacity: 1 !important;
}

/* Remove button */
.tank-gallons-section .btn-link[b-4ex72jmypr] {
    opacity: 0.4;
}

.tank-gallons-section tr:hover .btn-link[b-4ex72jmypr] {
    opacity: 1;
}

/* ========== IPAD / TABLET OPTIMIZATION ========== */
@media (min-width: 768px) and (max-width: 1199px) {
    .tank-gallons-section[b-4ex72jmypr] {
        max-width: 700px;
    }

    .tank-gallons-section table[b-4ex72jmypr] {
        font-size: 0.85rem;
    }

    .tank-gallons-section th[b-4ex72jmypr] {
        padding: 0.4rem;
    }

    .tank-gallons-section td[b-4ex72jmypr] {
        padding: 0.35rem;
    }

    /* Larger inputs for touch */
    .tank-gallons-section .form-control[b-4ex72jmypr] {
        min-height: 44px;
        font-size: 16px !important;
        padding: 0.4rem;
    }

    /* Column widths - slightly larger */
    .col-tank[b-4ex72jmypr] { width: 100px; }
    .col-measurement[b-4ex72jmypr] { width: 100px; }
    .col-gallons[b-4ex72jmypr] { width: 80px; }
    .col-actions[b-4ex72jmypr] { width: 50px; }

    /* Order buttons - larger touch targets */
    .order-btn[b-4ex72jmypr] {
        min-width: 32px;
        min-height: 32px;
        font-size: 0.85rem;
    }

    /* Action buttons - larger touch targets */
    .save-btn[b-4ex72jmypr],
    .tank-gallons-section .btn-link[b-4ex72jmypr] {
        min-width: 44px;
        min-height: 44px;
        font-size: 1.1rem;
    }

    .saved-indicator[b-4ex72jmypr] {
        font-size: 1.1rem;
    }
}

@media (pointer: coarse) {
    /* Always show remove button on touch */
    .tank-gallons-section .btn-link[b-4ex72jmypr] {
        opacity: 0.6;
    }
}
/* /Pages/Bottling/LabQc/LabQcRoundEntry.razor.rz.scp.css */
/* Lab QC Entry Page - Excel-like with Sticky Header */

.lab-qc-page[b-s0c4u2ztrw] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    overflow: hidden;
}

/* ========== STICKY HEADER ========== */
.qc-sticky-header[b-s0c4u2ztrw] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #fff;
    border-bottom: 2px solid #dee2e6;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
    transition: all 0.2s ease;
}

/* ========== COMPACT HEADER ========== */
.qc-compact-header[b-s0c4u2ztrw] {
    display: grid;
    grid-template-columns: 180px auto auto auto 1fr;
    gap: 1rem;
    padding: 0.5rem 0.75rem;
    background: #fafafa;
    border-bottom: 1px solid #dee2e6;
}

/* Context Panel (Left) */
.header-context-panel[b-s0c4u2ztrw] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.context-primary[b-s0c4u2ztrw] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #212529;
    line-height: 1.2;
}

.context-secondary[b-s0c4u2ztrw] {
    font-size: 0.72rem;
    color: #6c757d;
    line-height: 1.2;
}

.context-row[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    color: #6c757d;
}

.context-divider[b-s0c4u2ztrw] {
    color: #dee2e6;
}

.context-input[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.25rem;
}

.context-input .input-label[b-s0c4u2ztrw] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #6c757d;
}

/* Specs Panel (Center-Right) */
.header-specs-panel[b-s0c4u2ztrw] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 0.35rem 0.5rem;
    border-left: 3px solid #0d6efd;
    max-width: 260px;
}

.specs-title[b-s0c4u2ztrw] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #6c757d;
    margin-bottom: 0.25rem;
}

.specs-grid[b-s0c4u2ztrw] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.25rem 1.5rem;
}

.spec-item[b-s0c4u2ztrw] {
    display: flex;
    gap: 0.25rem;
    font-size: 0.72rem;
}

.spec-label[b-s0c4u2ztrw] {
    color: #6c757d;
    font-weight: 500;
}

.spec-value[b-s0c4u2ztrw] {
    color: #212529;
    font-weight: 600;
}

/* Package Panel (Center) */
.header-package-panel[b-s0c4u2ztrw] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
}

.package-badge[b-s0c4u2ztrw] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 4px;
    background: #198754;
    color: white;
}

.package-badge.shiner[b-s0c4u2ztrw] {
    background: #ffc107;
    color: #212529;
}

.package-details[b-s0c4u2ztrw] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.1rem;
    font-size: 0.72rem;
    color: #495057;
}

.package-row[b-s0c4u2ztrw] {
    display: flex;
    gap: 0.35rem;
}

.label-thumb[b-s0c4u2ztrw] {
    width: 40px;
    height: auto;
    border-radius: 3px;
    border: 1px solid #dee2e6;
    margin-top: 0.25rem;
    cursor: pointer;
}

.label-thumb:hover[b-s0c4u2ztrw] {
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

/* ========== HEADER SWAB PANEL (Right) ========== */
.header-swab-panel[b-s0c4u2ztrw] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 0.35rem 0.5rem;
    border-left: 3px solid #dc3545;
    min-width: 200px;
    max-width: 280px;
}

.swab-panel-header[b-s0c4u2ztrw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.25rem;
    padding-bottom: 0.2rem;
    border-bottom: 1px solid #e9ecef;
}

.swab-title[b-s0c4u2ztrw] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #6c757d;
}

.swab-title i[b-s0c4u2ztrw] {
    color: #dc3545;
    margin-right: 0.25rem;
}

.swab-add-btn[b-s0c4u2ztrw] {
    padding: 0 !important;
    font-size: 0.85rem;
    line-height: 1;
    color: #198754 !important;
}

.swab-add-btn:hover[b-s0c4u2ztrw] {
    color: #146c43 !important;
}

.swab-entries-vertical[b-s0c4u2ztrw] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.swab-empty-hint[b-s0c4u2ztrw] {
    font-size: 0.7rem;
    color: #adb5bd;
    font-style: italic;
}

.swab-entry-row[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.swab-location-input[b-s0c4u2ztrw] {
    width: 80px;
    font-size: 0.72rem !important;
    padding: 0.15rem 0.3rem !important;
    height: auto !important;
}

.swab-rlu-input[b-s0c4u2ztrw] {
    width: 50px;
    font-size: 0.72rem !important;
    padding: 0.15rem 0.3rem !important;
    height: auto !important;
    text-align: right;
}

.swab-status[b-s0c4u2ztrw] {
    font-size: 0.6rem;
    font-weight: 600;
    padding: 0.08rem 0.25rem;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
}

.swab-status.pass[b-s0c4u2ztrw] {
    background: #d1e7dd;
    color: #0f5132;
}

.swab-status.caution[b-s0c4u2ztrw] {
    background: #fff3cd;
    color: #664d03;
}

.swab-status.fail[b-s0c4u2ztrw] {
    background: #f8d7da;
    color: #842029;
}

.swab-remove-btn[b-s0c4u2ztrw] {
    padding: 0 !important;
    font-size: 0.75rem;
    line-height: 1;
    color: #6c757d !important;
}

.swab-remove-btn:hover[b-s0c4u2ztrw] {
    color: #dc3545 !important;
}

/* ========== HEADER PALLET PANEL ========== */
.header-pallet-panel[b-s0c4u2ztrw] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 0.35rem 0.5rem;
    border-left: 3px solid #0d6efd;
    min-width: 160px;
    max-width: 200px;
}

.pallet-panel-header[b-s0c4u2ztrw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.25rem;
    padding-bottom: 0.2rem;
    border-bottom: 1px solid #e9ecef;
}

.pallet-title[b-s0c4u2ztrw] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #6c757d;
}

.pallet-title i[b-s0c4u2ztrw] {
    color: #0d6efd;
    margin-right: 0.25rem;
}

.pallet-entries[b-s0c4u2ztrw] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.pallet-empty[b-s0c4u2ztrw] {
    font-size: 0.7rem;
    color: #adb5bd;
    font-style: italic;
}

.pallet-row[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.72rem;
    padding: 0.15rem 0;
}

.pallet-row.partial[b-s0c4u2ztrw] {
    color: #856404;
    background: #fff3cd;
    border-radius: 3px;
    padding: 0.15rem 0.25rem;
    margin: 0 -0.25rem;
}

.pallet-num[b-s0c4u2ztrw] {
    font-weight: 700;
    color: #0d6efd;
    min-width: 30px;
}

.pallet-time[b-s0c4u2ztrw] {
    color: #6c757d;
    min-width: 60px;
}

.pallet-cases[b-s0c4u2ztrw] {
    font-weight: 600;
    color: #198754;
}

/* ========== CURRENT TANK INDICATOR ========== */
.header-tank-indicator[b-s0c4u2ztrw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 8px 16px;
    background: linear-gradient(135deg, #e3f2fd, #bbdefb);
    border-radius: 8px;
    border: 1px solid #90caf9;
}

.header-tank-indicator .tank-label[b-s0c4u2ztrw] {
    font-size: 0.75rem;
    color: #1565c0;
    font-weight: 500;
}

.header-tank-indicator .tank-number[b-s0c4u2ztrw] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0d47a1;
}

/* ========== WARNING BANNER ========== */
.profile-warning-banner[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    background: #fff3cd;
    border-bottom: 1px solid #ffecb5;
    color: #856404;
    font-size: 0.75rem;
}

.profile-warning-banner i[b-s0c4u2ztrw] {
    color: #e0a800;
}

/* ========== TAB BAR ========== */
.qc-tab-bar[b-s0c4u2ztrw] {
    display: flex;
    gap: 0;
    background: #fff;
    border-bottom: 2px solid #dee2e6;
    padding: 0 0.5rem;
}

.qc-tab[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 1rem;
    font-size: 0.82rem;
    font-weight: 500;
    color: #6c757d;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.qc-tab:hover[b-s0c4u2ztrw] {
    color: #495057;
    background: #f8f9fa;
}

.qc-tab.active[b-s0c4u2ztrw] {
    color: #0d6efd;
    border-bottom-color: #0d6efd;
    background: none;
}

.qc-tab i[b-s0c4u2ztrw] {
    font-size: 0.9rem;
}

/* ========== TAB CONTENT ========== */
.qc-tab-content[b-s0c4u2ztrw] {
    min-height: 300px;
}

.tab-pane-content[b-s0c4u2ztrw] {
    animation: fadeIn-b-s0c4u2ztrw 0.15s ease;
}

@keyframes fadeIn-b-s0c4u2ztrw {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Toolbar Row */
.toolbar-row[b-s0c4u2ztrw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.35rem 0.75rem;
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
    border-bottom: 1px solid #dee2e6;
}

.toolbar-left[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.toolbar-left .page-title[b-s0c4u2ztrw] {
    margin: 0;
    font-weight: 600;
    font-size: 0.9rem;
    color: #212529;
}

.header-context[b-s0c4u2ztrw] {
    font-size: 0.75rem;
    color: #6c757d;
    padding-left: 0.5rem;
    border-left: 1px solid #dee2e6;
}

.toolbar-right[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.toolbar-right .btn[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
}

.toolbar-right .btn:disabled[b-s0c4u2ztrw] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Session Controls */
.session-controls[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.session-badge[b-s0c4u2ztrw] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 4px;
    white-space: nowrap;
}

.session-badge.session-open[b-s0c4u2ztrw] {
    background: #d1e7dd;
    color: #0f5132;
    border: 1px solid #badbcc;
}

.session-badge.session-closed[b-s0c4u2ztrw] {
    background: #e2e3e5;
    color: #41464b;
    border: 1px solid #d3d6d8;
}

.session-badge i[b-s0c4u2ztrw] {
    font-size: 0.6rem;
}

.session-badge.session-open i[b-s0c4u2ztrw] {
    color: #198754;
}

.session-badge.session-closed i[b-s0c4u2ztrw] {
    color: #198754;
}

/* Blinking animation for in-progress indicator */
.blink[b-s0c4u2ztrw] {
    animation: blink-animation-b-s0c4u2ztrw 1.5s ease-in-out infinite;
}

@keyframes blink-animation-b-s0c4u2ztrw {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

/* Toolbar divider */
.toolbar-divider[b-s0c4u2ztrw] {
    width: 1px;
    height: 20px;
    background: #dee2e6;
    margin: 0 0.25rem;
}

/* ========== SAVE STATUS INDICATOR ========== */
.save-status[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
}

.save-badge[b-s0c4u2ztrw] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 4px;
    white-space: nowrap;
}

.save-badge .status-dot[b-s0c4u2ztrw] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.save-badge .spinner-border-sm[b-s0c4u2ztrw] {
    width: 12px;
    height: 12px;
    border-width: 2px;
}

/* Saved state - green */
.save-badge.saved[b-s0c4u2ztrw] {
    background: #d1e7dd;
    color: #0f5132;
    border: 1px solid #badbcc;
}

.save-badge.saved .status-dot[b-s0c4u2ztrw] {
    background: #198754;
}

/* Unsaved state - yellow with pulsing dot */
.save-badge.unsaved[b-s0c4u2ztrw] {
    background: #fff3cd;
    color: #664d03;
    border: 1px solid #ffecb5;
}

.save-badge.unsaved .status-dot[b-s0c4u2ztrw] {
    background: #ffc107;
    animation: pulse-dot-b-s0c4u2ztrw 1.5s ease-in-out infinite;
}

@keyframes pulse-dot-b-s0c4u2ztrw {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.3);
        opacity: 0.7;
    }
}

/* Saving state - blue with spinner */
.save-badge.saving[b-s0c4u2ztrw] {
    background: #cfe2ff;
    color: #084298;
    border: 1px solid #b6d4fe;
}

/* Mobile: show just the dot */
@media (max-width: 575.98px) {
    .save-badge[b-s0c4u2ztrw] {
        padding: 0.25rem;
        min-width: 24px;
        justify-content: center;
    }

    .save-badge .status-dot[b-s0c4u2ztrw] {
        width: 10px;
        height: 10px;
    }
}

/* Collapsed Summary (shown when header is collapsed) */
.collapsed-summary[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-left: 0.75rem;
    border-left: 1px solid #dee2e6;
    font-size: 0.8rem;
}

.summary-tag[b-s0c4u2ztrw] {
    font-weight: 700;
    color: #212529;
}

.summary-owner[b-s0c4u2ztrw] {
    color: #495057;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.summary-detail[b-s0c4u2ztrw] {
    color: #6c757d;
}

.summary-divider[b-s0c4u2ztrw] {
    color: #dee2e6;
}

/* ========== HEADER METADATA ROW ========== */
.header-metadata-row[b-s0c4u2ztrw] {
    display: flex;
    gap: 0.75rem;
    padding: 0.75rem;
    background: #fafafa;
    border-bottom: 1px solid #dee2e6;
    font-size: 0.78rem;
}

.header-section[b-s0c4u2ztrw] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 0.5rem 0.6rem;
}

/* Metadata Section */
.metadata-section[b-s0c4u2ztrw] {
    flex: 1;
    border-left: 3px solid #6c757d;
}

.metadata-grid[b-s0c4u2ztrw] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 0.25rem 1rem;
}

.section-title[b-s0c4u2ztrw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 0.72rem;
    text-transform: uppercase;
    color: #495057;
    margin-bottom: 0.35rem;
    padding-bottom: 0.25rem;
    border-bottom: 1px solid #e9ecef;
}

.field-row[b-s0c4u2ztrw] {
    display: flex;
    gap: 0.5rem;
    padding: 0.12rem 0;
    line-height: 1.35;
}

.field-label[b-s0c4u2ztrw] {
    font-weight: 600;
    color: #6c757d;
    min-width: 95px;
    white-space: nowrap;
}

.field-value[b-s0c4u2ztrw] {
    color: #212529;
}

.field-value.wine-label[b-s0c4u2ztrw] {
    font-size: 0.72rem;
    line-height: 1.25;
}

.tech-input[b-s0c4u2ztrw] {
    width: 70px;
    font-size: 0.78rem !important;
    padding: 0.15rem 0.35rem !important;
    height: auto !important;
}

/* Run Info Section (in header) */
.run-info-section[b-s0c4u2ztrw] {
    border-left: 3px solid #198754;
    min-width: 180px;
}

.run-info-grid[b-s0c4u2ztrw] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* Closure Section (legacy) */
.closure-section[b-s0c4u2ztrw] {
    padding: 0.4rem 0.6rem;
}

.closure-options[b-s0c4u2ztrw] {
    display: flex;
    gap: 1.25rem;
}

.closure-option[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.75rem;
    color: #6c757d;
    cursor: default;
}

.closure-option.selected[b-s0c4u2ztrw] {
    color: #198754;
    font-weight: 600;
}

.closure-check[b-s0c4u2ztrw] {
    font-size: 1rem;
}

/* Swab Section */
.swab-section[b-s0c4u2ztrw] {
    border-left: 3px solid #dc3545;
}

.swab-add-btn[b-s0c4u2ztrw] {
    padding: 0;
    font-size: 0.85rem;
    line-height: 1;
    color: #198754;
}

.swab-empty[b-s0c4u2ztrw] {
    font-size: 0.72rem;
    color: #6c757d;
    font-style: italic;
}

.swab-row[b-s0c4u2ztrw] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.15rem 0;
}

.swab-label[b-s0c4u2ztrw] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.72rem;
    min-width: 50px;
}

.swab-input[b-s0c4u2ztrw] {
    width: 80px;
    font-size: 0.72rem !important;
    padding: 0.15rem 0.3rem !important;
    height: auto !important;
}

.swab-select[b-s0c4u2ztrw] {
    width: 65px;
    font-size: 0.72rem !important;
    padding: 0.15rem 0.25rem !important;
    height: auto !important;
}

.swab-remove-btn[b-s0c4u2ztrw] {
    padding: 0;
    font-size: 0.8rem;
    line-height: 1;
}

/* ========== INFO CARDS ROW (Content Area) ========== */
.info-cards-row[b-s0c4u2ztrw] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.info-card[b-s0c4u2ztrw] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    overflow: hidden;
}

.info-card .section-header[b-s0c4u2ztrw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0.6rem;
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
    border-bottom: 1px solid #dee2e6;
}

.info-card .section-header h6[b-s0c4u2ztrw] {
    margin: 0;
    font-size: 0.8rem;
    font-weight: 600;
}

.info-card-body[b-s0c4u2ztrw] {
    padding: 0.5rem 0.6rem;
    font-size: 0.78rem;
}

/* Closure Card */
.closure-card[b-s0c4u2ztrw] {
    border-left: 3px solid #6c757d;
}

/* Specs Card */
.specs-card[b-s0c4u2ztrw] {
    border-left: 3px solid #0d6efd;
}

.specs-card .section-header[b-s0c4u2ztrw] {
    background: linear-gradient(to bottom, #e7f3ff, #cfe2ff);
}

/* Swab Card */
.swab-card[b-s0c4u2ztrw] {
    border-left: 3px solid #dc3545;
}

/* ========== RESPONSIVE HEADER ========== */
@media (max-width: 992px) {
    .header-metadata-row[b-s0c4u2ztrw] {
        flex-direction: column;
    }

    .info-cards-row[b-s0c4u2ztrw] {
        grid-template-columns: 1fr 1fr;
    }

    .swab-card[b-s0c4u2ztrw] {
        grid-column: span 2;
    }
}

@media (max-width: 768px) {
    .header-metadata-row[b-s0c4u2ztrw] {
        gap: 0.5rem;
        padding: 0.5rem;
    }

    .metadata-grid[b-s0c4u2ztrw] {
        grid-template-columns: 1fr;
    }

    .info-cards-row[b-s0c4u2ztrw] {
        grid-template-columns: 1fr;
    }

    .swab-card[b-s0c4u2ztrw] {
        grid-column: span 1;
    }

    .field-label[b-s0c4u2ztrw] {
        min-width: 85px;
    }

    .analysis-checks-section[b-s0c4u2ztrw] {
        max-width: 100%;
    }
}

/* ========== MAIN AREA WITH SIDEBAR ========== */
.qc-main-area[b-s0c4u2ztrw] {
    flex: 1;
    display: flex;
    overflow: hidden;
}

.qc-main-area.with-sidebar[b-s0c4u2ztrw] {
    /* Two-column layout when sidebar is visible */
}

/* ========== MAIN CONTENT ========== */
.qc-content[b-s0c4u2ztrw] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem;
    background: #f5f5f5;
}

.loading-spinner[b-s0c4u2ztrw] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px;
}

/* Patrol Section */
.patrol-section[b-s0c4u2ztrw] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    margin-bottom: 0.75rem;
    overflow: hidden;
}

.patrol-section .section-header[b-s0c4u2ztrw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0.6rem;
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
    border-bottom: 1px solid #dee2e6;
}

.patrol-section .section-header h6[b-s0c4u2ztrw] {
    margin: 0;
    font-size: 0.85rem;
    font-weight: 600;
}

/* Patrol Table */
.patrol-table[b-s0c4u2ztrw] {
    margin: 0;
    font-size: 0.78rem;
}

.patrol-table th[b-s0c4u2ztrw],
.patrol-table td[b-s0c4u2ztrw] {
    padding: 0.25rem 0.4rem;
    vertical-align: middle;
    white-space: nowrap;
}

.patrol-table thead th[b-s0c4u2ztrw] {
    background: #f8f9fa;
    font-weight: 600;
    border-bottom: 2px solid #dee2e6;
}

.patrol-table .row-header[b-s0c4u2ztrw] {
    width: 120px;
    text-align: left;
    background: #f8f9fa;
}

.patrol-table .entry-col[b-s0c4u2ztrw] {
    min-width: 80px;
    text-align: center;
}

.patrol-table .entry-col-header[b-s0c4u2ztrw] {
    min-width: 80px;
    text-align: center;
    font-weight: 500;
    color: #495057;
}

.patrol-table .info-row-header th[b-s0c4u2ztrw],
.patrol-table .info-row-header td[b-s0c4u2ztrw] {
    background: #fff3cd;
}

.patrol-table .remove-entry[b-s0c4u2ztrw] {
    padding: 0;
    line-height: 1;
}

.patrol-table .form-control[b-s0c4u2ztrw],
.patrol-table .form-select[b-s0c4u2ztrw] {
    font-size: 0.78rem;
    padding: 0.2rem 0.35rem;
    min-height: 28px;
}

.patrol-table input[type="number"][b-s0c4u2ztrw] {
    text-align: right;
    width: 70px;
}

.patrol-table input[type="time"][b-s0c4u2ztrw] {
    width: 85px;
}

.patrol-table input[type="text"][b-s0c4u2ztrw] {
    width: 70px;
}

/* Entry Table */
.entry-table-wrapper[b-s0c4u2ztrw] {
    max-width: 500px;
    margin-bottom: 1.5rem;
}

.entry-table[b-s0c4u2ztrw] {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #000;
    background: #fff;
}

.entry-table th[b-s0c4u2ztrw],
.entry-table td[b-s0c4u2ztrw] {
    border: 1px solid #ccc;
    padding: 0.35rem 0.5rem;
    vertical-align: middle;
}

.entry-table th[b-s0c4u2ztrw] {
    background-color: #f5f5f5;
    font-weight: 500;
    text-align: left;
    width: 180px;
    font-size: 0.85rem;
}

.entry-table .form-control[b-s0c4u2ztrw],
.entry-table .form-select[b-s0c4u2ztrw] {
    border: 1px solid #ccc;
    border-radius: 2px;
    padding: 0.25rem 0.5rem;
    font-size: 0.9rem;
    min-height: 32px;
}

/* Section headers */
.section-header th[b-s0c4u2ztrw] {
    background-color: #e8e8e8;
    font-weight: 700;
    font-size: 0.9rem;
    border-top: 2px solid #000;
}

.section-header.patrol-header th[b-s0c4u2ztrw] {
    background-color: #cce5ff;
    border-left: 3px solid #0d6efd;
}

.round-info-row th[b-s0c4u2ztrw] {
    background-color: #fff3cd;
}

/* Capacity Section */
.capacity-section[b-s0c4u2ztrw] {
    max-width: 900px;
    margin-bottom: 1.5rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 1rem;
}

.capacity-section .section-title[b-s0c4u2ztrw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #000;
}

.capacity-section .section-title h5[b-s0c4u2ztrw] {
    margin: 0;
    font-weight: 700;
}

.capacity-table[b-s0c4u2ztrw] {
    font-size: 0.8rem;
}

.capacity-table th[b-s0c4u2ztrw] {
    background-color: #f5f5f5;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    padding: 0.4rem;
}

.capacity-table td[b-s0c4u2ztrw] {
    padding: 0.25rem;
    vertical-align: middle;
}

.capacity-table .sample-num[b-s0c4u2ztrw] {
    text-align: center;
    font-weight: 600;
    background-color: #f8f9fa;
    width: 30px;
}

.capacity-table .calculated[b-s0c4u2ztrw] {
    text-align: center;
    background-color: #e9ecef;
    font-weight: 500;
}

.capacity-table .form-control[b-s0c4u2ztrw] {
    font-size: 0.8rem;
    padding: 0.2rem 0.4rem;
    min-height: 30px;
    text-align: right;
}

.capacity-table .average-row[b-s0c4u2ztrw] {
    background-color: #f8f9fa;
    border-top: 2px solid #000;
}

/* Form Actions */
.form-actions[b-s0c4u2ztrw] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 0;
    max-width: 900px;
}

.form-actions .btn[b-s0c4u2ztrw] {
    min-width: 100px;
}

/* Modal */
.modal-backdrop[b-s0c4u2ztrw] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1040;
}

.modal[b-s0c4u2ztrw] {
    z-index: 1050;
}

/* ========== RESPONSIVE ========== */
@media (max-width: 992px) {
    .context-header[b-s0c4u2ztrw] {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }

    .toolbar-right .btn-text[b-s0c4u2ztrw] {
        display: none;
    }
}

@media (max-width: 768px) {
    .qc-content[b-s0c4u2ztrw] {
        padding: 0.5rem;
    }

    .context-header[b-s0c4u2ztrw] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
        font-size: 0.75rem;
    }

    .run-data[b-s0c4u2ztrw] {
        grid-template-columns: 1fr 1fr;
    }

    .entry-table th[b-s0c4u2ztrw] {
        width: 120px;
        font-size: 0.8rem;
    }

    .entry-table .form-control[b-s0c4u2ztrw],
    .entry-table .form-select[b-s0c4u2ztrw] {
        font-size: 16px; /* Prevent iOS zoom */
        min-height: 40px;
    }

    .capacity-table[b-s0c4u2ztrw] {
        font-size: 0.75rem;
    }

    .capacity-table .form-control[b-s0c4u2ztrw] {
        font-size: 16px;
        min-height: 36px;
    }

    .toolbar-left .page-title[b-s0c4u2ztrw] {
        font-size: 1rem;
    }

    .form-actions[b-s0c4u2ztrw] {
        flex-direction: column;
    }

    .form-actions .btn[b-s0c4u2ztrw] {
        width: 100%;
    }
}

/* ========== IPAD / TABLET OPTIMIZATION ========== */
/* Target tablets in landscape (768px - 1199px) with touch capability */
@media (min-width: 768px) and (max-width: 1199px) {
    /* Smooth touch scrolling */
    .qc-content[b-s0c4u2ztrw] {
        -webkit-overflow-scrolling: touch;
    }

    .analysis-scroll-area[b-s0c4u2ztrw] {
        -webkit-overflow-scrolling: touch;
    }

    /* Prevent iOS zoom on input focus - all inputs must be 16px+ */
    input[type="text"][b-s0c4u2ztrw],
    input[type="number"][b-s0c4u2ztrw],
    input[type="time"][b-s0c4u2ztrw],
    input[type="date"][b-s0c4u2ztrw],
    select[b-s0c4u2ztrw],
    textarea[b-s0c4u2ztrw],
    .form-control[b-s0c4u2ztrw],
    .form-select[b-s0c4u2ztrw] {
        font-size: 16px !important;
    }

    /* Increase touch targets to 44px minimum (Apple HIG) */
    .btn[b-s0c4u2ztrw] {
        min-height: 44px;
        min-width: 44px;
        padding: 0.5rem 0.75rem;
    }

    .btn-sm[b-s0c4u2ztrw] {
        min-height: 44px;
        padding: 0.5rem 0.75rem;
    }

    /* Toolbar buttons - larger touch targets */
    .toolbar-right .btn[b-s0c4u2ztrw] {
        min-height: 44px;
        min-width: 44px;
        padding: 0.5rem 0.75rem;
    }

    /* Session badge - more visible */
    .session-badge[b-s0c4u2ztrw] {
        padding: 0.4rem 0.75rem;
        font-size: 0.8rem;
    }

    /* Save badge - more visible */
    .save-badge[b-s0c4u2ztrw] {
        padding: 0.4rem 0.75rem;
        font-size: 0.8rem;
    }

    /* Tab bar - larger touch targets */
    .qc-tab[b-s0c4u2ztrw] {
        padding: 0.75rem 1.25rem;
        font-size: 0.9rem;
        min-height: 44px;
    }

    /* Compact header - slightly more compact for tablets */
    .qc-compact-header[b-s0c4u2ztrw] {
        grid-template-columns: 160px auto auto auto 1fr;
        gap: 0.75rem;
        padding: 0.4rem 0.75rem;
    }

    /* Swab panel inputs - larger touch targets */
    .swab-location-input[b-s0c4u2ztrw],
    .swab-rlu-input[b-s0c4u2ztrw] {
        min-height: 44px !important;
        font-size: 16px !important;
        padding: 0.4rem 0.5rem !important;
    }

    .swab-location-input[b-s0c4u2ztrw] {
        width: 100px;
    }

    .swab-rlu-input[b-s0c4u2ztrw] {
        width: 65px;
    }

    /* Swab add/remove buttons - larger touch targets */
    .swab-add-btn[b-s0c4u2ztrw] {
        min-width: 44px;
        min-height: 44px;
        font-size: 1.25rem !important;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .swab-remove-btn[b-s0c4u2ztrw] {
        min-width: 44px;
        min-height: 44px;
        font-size: 1.1rem !important;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Swab entry rows - more spacing for touch */
    .swab-entry-row[b-s0c4u2ztrw] {
        gap: 0.5rem;
        padding: 0.25rem 0;
    }

    /* Tech input in header */
    .tech-input[b-s0c4u2ztrw] {
        min-height: 44px !important;
        font-size: 16px !important;
        width: 90px;
    }

    /* Patrol table - larger cells and inputs */
    .patrol-table th[b-s0c4u2ztrw],
    .patrol-table td[b-s0c4u2ztrw] {
        padding: 0.4rem 0.5rem;
    }

    .patrol-table .form-control[b-s0c4u2ztrw],
    .patrol-table .form-select[b-s0c4u2ztrw] {
        min-height: 44px;
        font-size: 16px !important;
        padding: 0.4rem 0.5rem;
    }

    .patrol-table input[type="number"][b-s0c4u2ztrw] {
        width: 80px;
    }

    .patrol-table input[type="time"][b-s0c4u2ztrw] {
        width: 100px;
    }

    .patrol-table input[type="text"][b-s0c4u2ztrw] {
        width: 80px;
    }

    .patrol-table .remove-entry[b-s0c4u2ztrw] {
        min-width: 44px;
        min-height: 44px;
        font-size: 1.1rem;
    }

    /* Entry table - larger inputs */
    .entry-table .form-control[b-s0c4u2ztrw],
    .entry-table .form-select[b-s0c4u2ztrw] {
        min-height: 44px;
        font-size: 16px !important;
    }

    /* Capacity table - larger inputs */
    .capacity-table .form-control[b-s0c4u2ztrw] {
        min-height: 44px;
        font-size: 16px !important;
        padding: 0.4rem 0.5rem;
    }

    /* Add buttons throughout - larger touch targets */
    .btn-link[b-s0c4u2ztrw] {
        min-width: 44px;
        min-height: 44px;
    }

    /* Section headers - larger touch targets for action buttons */
    .section-header .btn[b-s0c4u2ztrw] {
        min-height: 44px;
        min-width: 44px;
    }
}

/* Touch-specific improvements (any touch device) */
@media (pointer: coarse) {
    /* Prevent text selection on buttons during tap */
    .btn[b-s0c4u2ztrw], .qc-tab[b-s0c4u2ztrw], .session-badge[b-s0c4u2ztrw], .save-badge[b-s0c4u2ztrw] {
        -webkit-user-select: none;
        user-select: none;
        -webkit-touch-callout: none;
    }

    /* Faster tap response - remove 300ms delay */
    .btn[b-s0c4u2ztrw], .qc-tab[b-s0c4u2ztrw] {
        touch-action: manipulation;
    }

    /* Hover states shouldn't persist on touch */
    .label-thumb:hover[b-s0c4u2ztrw] {
        box-shadow: none;
    }

    /* Larger tap areas for small interactive elements */
    .swab-status[b-s0c4u2ztrw] {
        padding: 0.3rem 0.5rem;
        font-size: 0.7rem;
    }
}

/* ========== PRINT ========== */
@media print {
    .qc-sticky-header[b-s0c4u2ztrw] {
        position: relative;
        box-shadow: none;
    }

    .toolbar-row[b-s0c4u2ztrw],
    .form-actions[b-s0c4u2ztrw] {
        display: none;
    }

    .qc-content[b-s0c4u2ztrw] {
        overflow: visible;
    }

    .entry-table .form-control[b-s0c4u2ztrw],
    .entry-table .form-select[b-s0c4u2ztrw] {
        border: none;
        background: transparent;
    }
}
/* /Pages/Bottling/QuickActionsPanel.razor.rz.scp.css */
/* Panel layout */
.panel-content-wrapper[b-s6zde4mer8] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.panel-body[b-s6zde4mer8] {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 1rem;
}

.panel-footer[b-s6zde4mer8] {
    flex-shrink: 0;
    border-top: 1px solid #dee2e6;
    padding: 0.75rem 1rem;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    background: #f8f9fa;
    padding-bottom: calc(0.75rem + env(safe-area-inset-bottom));
}

/* Action section */
.action-section h6[b-s6zde4mer8] {
    font-weight: 600;
    color: #333;
    margin-bottom: 0.5rem;
}

.action-description[b-s6zde4mer8] {
    font-size: 0.85rem;
    color: #6c757d;
    margin-bottom: 1rem;
}

/* Cleanup summary badges */
.cleanup-summary[b-s6zde4mer8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}

/* Cleanup table */
.cleanup-table-wrapper[b-s6zde4mer8] {
    overflow-x: auto;
    border: 1px solid #dee2e6;
    border-radius: 4px;
}

.cleanup-table[b-s6zde4mer8] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.cleanup-table th[b-s6zde4mer8] {
    background: #f8f9fa;
    font-weight: 600;
    padding: 0.4rem 0.5rem;
    border-bottom: 2px solid #dee2e6;
    white-space: nowrap;
    text-align: left;
}

.cleanup-table td[b-s6zde4mer8] {
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid #e9ecef;
    vertical-align: middle;
}

.cleanup-table .row-deselected[b-s6zde4mer8] {
    opacity: 0.5;
}

/* Status badges */
.badge-status[b-s6zde4mer8] {
    display: inline-block;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    font-size: 0.7rem;
    font-weight: 600;
}

.badge-scheduled[b-s6zde4mer8] {
    background: #cce5ff;
    color: #004085;
}

.badge-inprogress[b-s6zde4mer8] {
    background: #fff3cd;
    color: #856404;
}

.badge-completed[b-s6zde4mer8] {
    background: #d4edda;
    color: #155724;
}

.badge-canceled[b-s6zde4mer8] {
    background: #f8d7da;
    color: #721c24;
}
/* /Pages/Bottling/Schedule/AppointmentListComponent.razor.rz.scp.css */
/* ==========================================================================
   AppointmentListComponent Styles

   This component renders appointment cards within a calendar day cell.
   All styles are scoped to this component.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Appointment Card (.bottlingDay button)
   -------------------------------------------------------------------------- */
.bottlingDay[b-lewae1ybqn] {
    cursor: pointer;
    border-radius: 5px;
    margin-bottom: 5px;
    position: relative;
    overflow: visible;
    width: 100%;
    border: 1px solid;
    padding: 2px 4px;
    font-size: inherit;
}

/* --------------------------------------------------------------------------
   Search Match Highlight
   -------------------------------------------------------------------------- */
.search-match[b-lewae1ybqn] {
    box-shadow: 0 0 0 3px #ffd700, 0 0 10px #ffd700 !important;
    animation: pulse-highlight-b-lewae1ybqn 1s ease-in-out infinite;
}

@keyframes pulse-highlight-b-lewae1ybqn {
    0%, 100% { box-shadow: 0 0 0 3px #ffd700, 0 0 10px #ffd700; }
    50% { box-shadow: 0 0 0 5px #ffd700, 0 0 15px #ffd700; }
}

/* --------------------------------------------------------------------------
   Snow Dropper Indicator
   Shows snowflake icon when ClosureType is "Screw Cap +Snow"
   Positioned in upper-left corner of the appointment card
   -------------------------------------------------------------------------- */
.snow-dropper-indicator[b-lewae1ybqn] {
    position: absolute;
    top: -18px;
    left: -14px;
    font-size: 1.85rem;
    z-index: 10;
    pointer-events: none;
    color: #1565c0;
    text-shadow: 0 0 6px rgba(21, 101, 192, 0.7), 0 1px 2px rgba(0, 0, 0, 0.4);
    animation: snow-pulse-b-lewae1ybqn 2s ease-in-out infinite;
}

@keyframes snow-pulse-b-lewae1ybqn {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* --------------------------------------------------------------------------
   Expand/Collapse Button
   -------------------------------------------------------------------------- */
.btn-expand-more[b-lewae1ybqn] {
    background: transparent;
    border: 1px dashed #6c757d;
    border-radius: 4px;
    color: #6c757d;
    font-size: 0.6vw;
    padding: 2px 8px;
    margin: 2px 0;
    cursor: pointer;
    width: 100%;
    transition: all 0.2s ease;
}

.btn-expand-more:hover[b-lewae1ybqn] {
    background: #f0f0f0;
    border-color: #0366d6;
    color: #0366d6;
}
/* /Pages/Bottling/Schedule/BottlingSchedule.razor.rz.scp.css */
/* ==========================================================================
   BottlingSchedule Calendar Styles

   Main calendar grid layout for the bottling schedule page.
   Uses CSS Grid for the weekly view with Mon-Fri visible, weekends hidden,
   and a dedicated summary column.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Print Styles
   -------------------------------------------------------------------------- */
@media print {
    .no-print[b-e40aiq6xfr], .no-print *[b-e40aiq6xfr] {
        display: none !important;
    }

    @page {
        size: landscape;
    }
}

/* --------------------------------------------------------------------------
   Header Row (Fixed at top)
   -------------------------------------------------------------------------- */
#headerRow[b-e40aiq6xfr] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-image: linear-gradient(180deg, rgb(5, 46, 118) 0%, #0366d6 70%);
}

.flex-row[b-e40aiq6xfr] {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    justify-content: space-between;
}

.child-div[b-e40aiq6xfr] {
    flex: 0 0 auto;
}

/* --------------------------------------------------------------------------
   Calendar Grid Layout

   7 day columns (with weekends hidden) + 1 summary column
   Column structure: Mon | Tue | Wed | Thu | Fri | (Sat hidden) | (Sun hidden) | Summary
   -------------------------------------------------------------------------- */
.flex-grid[b-e40aiq6xfr] {
    display: grid;
    grid-template-columns: repeat(5, 2fr) min-content;
    gap: 0.5rem;
    padding: 2px;
    text-align: center;
    align-items: stretch;
    min-height: 600px;
    width: 100%;
}

.flex-grid-days[b-e40aiq6xfr] {
    display: grid;
    grid-template-columns: repeat(5, 2fr) min-content;
    gap: 0.5rem;
    padding: 2px;
    text-align: center;
    align-items: stretch;
    font-size: 1.5em;
}

/* Weekend columns - hidden but still in DOM for proper data structure */
.calendar-day.weekend[b-e40aiq6xfr],
.day-header.weekend[b-e40aiq6xfr] {
    display: none;
}

/* --------------------------------------------------------------------------
   Calendar Day Cell
   -------------------------------------------------------------------------- */
.calendar-day[b-e40aiq6xfr] {
    border-radius: 5px;
    background-color: white;
    box-shadow: 0px 0px 4px #92a1d1;
    box-sizing: border-box;
    font-size: 1em;
    position: relative;
}

.calendar-day:hover[b-e40aiq6xfr] {
    box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
}

.currentDay[b-e40aiq6xfr] {
    box-shadow: #a3bfe0 0px 54px 6px, #a3bfe0 0px -12px 6px, #a3bfe0 0px 4px 6px, #a3bfe0 0px 12px 6px, #a3bfe0 0px -3px 6px;
}

/* --------------------------------------------------------------------------
   Day Cell Inner Grid (wrapper)

   Two-column layout for Line 1 and Line 2 appointments
   -------------------------------------------------------------------------- */
.wrapper[b-e40aiq6xfr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 2em minmax(120px, auto);
    gap: 0.25rem;
    height: 100%;
}

.left-box[b-e40aiq6xfr] {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    text-align: left;
    font-size: 1.875em;
    padding-left: 5px;
}

.right-box[b-e40aiq6xfr] {
    display: flex;
    flex-wrap: nowrap;
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    justify-content: space-between;
}

/* --------------------------------------------------------------------------
   Appointment Columns (box2 = Line 1, box3 = Line 2)

   Using ::deep to apply grid positioning to child component elements
   -------------------------------------------------------------------------- */
[b-e40aiq6xfr] .box2 {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    font-size: 0.75vw;
}

[b-e40aiq6xfr] .box3 {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    font-size: 0.75vw;
}

.box3-container[b-e40aiq6xfr] {
    display: flex;
    flex-direction: column;
    grid-column: 2 / 3;
    grid-row: 2 / 3;
}

/* Loading placeholder shimmer effect */
.loading-placeholder[b-e40aiq6xfr] {
    background: linear-gradient(90deg, #e0e0e0 25%, #f0f0f0 50%, #e0e0e0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-e40aiq6xfr 1.5s infinite;
    min-height: 120px;
    border-radius: 5px;
}

@keyframes shimmer-b-e40aiq6xfr {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* --------------------------------------------------------------------------
   Summary Panel (Weekly case counts)
   -------------------------------------------------------------------------- */
.summary-panel[b-e40aiq6xfr] {
    padding: 0.5rem;
    font-size: 0.85em;
}

.summary-panel table[b-e40aiq6xfr] {
    font-size: 0.85em;
    border-collapse: collapse;
}

.summary-panel th[b-e40aiq6xfr],
.summary-panel td[b-e40aiq6xfr] {
    padding: 1px 4px;
    font-weight: bold;
}

.line-label[b-e40aiq6xfr] {
    white-space: nowrap;
    text-align: left;
    padding-right: 8px;
}

.summary-value[b-e40aiq6xfr] {
    min-width: 2.5rem;
    text-align: right;
    display: inline-block;
}

.summary-value.loaded[b-e40aiq6xfr] {
    animation: fadeIn-b-e40aiq6xfr 0.3s ease-in;
}

@keyframes fadeIn-b-e40aiq6xfr {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* --------------------------------------------------------------------------
   Hidden Buttons (shown on hover)
   -------------------------------------------------------------------------- */
.btnHidden[b-e40aiq6xfr] {
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 3px;
    padding-left: 3px;
    display: none;
}

.right-box:hover button[b-e40aiq6xfr] {
    display: block;
}

.navButton[b-e40aiq6xfr] {
    text-decoration: none;
    display: inline-block;
}

/* --------------------------------------------------------------------------
   Main Content Area
   -------------------------------------------------------------------------- */
.mainContent[b-e40aiq6xfr] {
    margin-right: -14px;
    margin-left: -24px;
    transition: margin-right 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.mainContent.calendar-shrunk[b-e40aiq6xfr] {
    margin-right: 420px;
}

@media (max-width: 768px) {
    .mainContent.calendar-shrunk[b-e40aiq6xfr] {
        margin-right: 0;
    }
}

.scrollFormBody[b-e40aiq6xfr] {
    overflow-y: auto;
    max-height: 90vh;
}

.scrollFormHead[b-e40aiq6xfr] {
    max-height: 20vh;
}

/* --------------------------------------------------------------------------
   Extra Row (Other appointments - spans both columns)
   -------------------------------------------------------------------------- */
.extraRow[b-e40aiq6xfr] {
    grid-column: 1 / 3;
    border-radius: 5px;
    background: linear-gradient(to right, rgba(109, 213, 250, 0.8), rgba(41, 128, 185, 0.8));
    font-size: 0.75vw;
}

.extraRow:hover[b-e40aiq6xfr] {
    cursor: pointer;
}

.extraRow.loaded[b-e40aiq6xfr] {
    animation: fadeIn-b-e40aiq6xfr 0.3s ease-in;
}

.extraRow.multi-day[b-e40aiq6xfr] {
    background: linear-gradient(to right, rgba(255, 193, 7, 0.85), rgba(255, 152, 0, 0.85));
    border-left: 3px solid #e65100;
}

.date-range-badge[b-e40aiq6xfr] {
    font-size: 0.7em;
    font-weight: normal;
    background: rgba(0, 0, 0, 0.15);
    padding: 1px 5px;
    border-radius: 3px;
    margin-left: 5px;
    white-space: nowrap;
}

/* --------------------------------------------------------------------------
   Other Line Row (W&I, etc. - spans both columns)
   -------------------------------------------------------------------------- */
.otherLineRow[b-e40aiq6xfr] {
    grid-column: 1 / 3;
    border-radius: 5px;
    background: linear-gradient(to right, rgba(147, 112, 219, 0.8), rgba(106, 90, 205, 0.8));
    font-size: 0.75vw;
    padding: 4px 8px 4px 30px;
    margin-bottom: 2px;
    display: flex;
    align-items: center;
    gap: 8px;
    position: relative;
    overflow: visible;
}

.otherLineRow:hover[b-e40aiq6xfr] {
    cursor: pointer;
    filter: brightness(1.1);
}

.otherLineRow.loaded[b-e40aiq6xfr] {
    animation: fadeIn-b-e40aiq6xfr 0.3s ease-in;
}

.other-line-badge[b-e40aiq6xfr] {
    background: rgba(255, 255, 255, 0.3);
    border-radius: 3px;
    padding: 2px 6px;
    font-weight: bold;
    font-size: 0.85em;
    color: white;
}

/* --------------------------------------------------------------------------
   Date Selection (for Other Appointment panel)
   -------------------------------------------------------------------------- */
.calendar-day.selecting-dates .wrapper[b-e40aiq6xfr] {
    pointer-events: none;
}

.date-select-checkbox[b-e40aiq6xfr] {
    position: absolute;
    top: 4px;
    right: 4px;
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 4px;
}

.date-select-checkbox input[type="checkbox"][b-e40aiq6xfr] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #0d6efd;
}

.date-select-checkbox.checked[b-e40aiq6xfr] {
    background: rgba(13, 110, 253, 0.1);
    border-radius: 4px;
}

.date-select-checkbox.glow[b-e40aiq6xfr] {
    animation: checkbox-glow-b-e40aiq6xfr 2s ease-in-out infinite;
}

@keyframes checkbox-glow-b-e40aiq6xfr {
    0%, 100% {
        box-shadow: 0 0 4px rgba(13, 110, 253, 0.3);
    }
    50% {
        box-shadow: 0 0 12px rgba(13, 110, 253, 0.7), 0 0 20px rgba(13, 110, 253, 0.3);
    }
}

/* --------------------------------------------------------------------------
   Utility Classes
   -------------------------------------------------------------------------- */
.center[b-e40aiq6xfr] {
    justify-content: center;
}

.flex[b-e40aiq6xfr] {
    display: flex;
    align-items: stretch;
}

.bold-cell[b-e40aiq6xfr] {
    font-weight: bold;
}
/* /Pages/Bottling/Schedule/OtherAppointmentPanel.razor.rz.scp.css */
.panel-form[b-5swcbk7o0y] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 8px 4px;
}

.form-group[b-5swcbk7o0y] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.form-group label[b-5swcbk7o0y] {
    font-weight: 600;
    font-size: 0.85em;
    color: #555;
}

.date-chips[b-5swcbk7o0y] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.date-chip[b-5swcbk7o0y] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #e3f2fd;
    border: 1px solid #90caf9;
    border-radius: 16px;
    padding: 3px 10px;
    font-size: 0.85em;
    font-weight: 500;
    color: #1565c0;
}

.chip-remove[b-5swcbk7o0y] {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.1em;
    color: #1565c0;
    padding: 0 2px;
    line-height: 1;
    border-radius: 50%;
}

.chip-remove:hover[b-5swcbk7o0y] {
    background: #bbdefb;
    color: #0d47a1;
}

.date-range-row[b-5swcbk7o0y] {
    gap: 8px;
}

.checkbox-label[b-5swcbk7o0y] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: normal !important;
    cursor: pointer;
}

.end-date-group[b-5swcbk7o0y] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.validation-error[b-5swcbk7o0y] {
    color: red;
    font-size: 0.85em;
}

.day-count[b-5swcbk7o0y] {
    color: #666;
    font-size: 0.85em;
}

.panel-actions[b-5swcbk7o0y] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid #eee;
}

.action-right[b-5swcbk7o0y] {
    display: flex;
    gap: 6px;
    margin-left: auto;
}

.text-muted[b-5swcbk7o0y] {
    color: #999;
    font-size: 0.85em;
    margin: 4px 0;
}

.helper-text[b-5swcbk7o0y] {
    color: #6c757d;
    font-size: 0.82em;
    margin: 0;
    padding: 6px 8px;
    background: #f8f9fa;
    border-radius: 4px;
    border-left: 3px solid #0d6efd;
}

.confirm-delete[b-5swcbk7o0y] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 6px 8px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 4px;
    font-size: 0.85em;
    font-weight: 500;
}

.mode-toggle[b-5swcbk7o0y] {
    display: flex;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    overflow: hidden;
}

.toggle-btn[b-5swcbk7o0y] {
    flex: 1;
    padding: 6px 12px;
    border: none;
    background: #f8f9fa;
    color: #495057;
    font-size: 0.85em;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.toggle-btn:not(:last-child)[b-5swcbk7o0y] {
    border-right: 1px solid #dee2e6;
}

.toggle-btn.active[b-5swcbk7o0y] {
    background: #0d6efd;
    color: white;
}

.toggle-btn:hover:not(.active)[b-5swcbk7o0y] {
    background: #e9ecef;
}
/* /Pages/Bottling/Schedule/SignOffIconComponent.razor.rz.scp.css */
.circle-icon[b-kz1ont7s53] {
  font-size: 24px;
  position: absolute;
  top: -15px;
  right: -10px;
  z-index: 1;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: inline-block;
  z-index: 1;
  border: 2px solid white;
}

.blue-circle[b-kz1ont7s53] {
  background: linear-gradient(45deg, #42a5f5, #1565c0); /* Brighter blue gradient */
}

.green-circle[b-kz1ont7s53] {
  background: linear-gradient(45deg, #81c784, #388e3c); /* Brighter green gradient */
}

.yellow-circle[b-kz1ont7s53] {
  background: linear-gradient(45deg, #ffb74d, #ff9800); /* Brighter yellow gradient */
}

.red-circle[b-kz1ont7s53] {
  background: linear-gradient(45deg, #ef5350, #b71c1c); /* Brighter red gradient */
}
/* /Pages/Bottling/Shared/BottlingDateTabs.razor.rz.scp.css */
.date-tabs-row[b-gfcfw45pgi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.4rem 0.5rem;
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
    border-top: 1px solid #dee2e6;
}

.date-tabs-container[b-gfcfw45pgi] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.3rem;
}

.date-tab[b-gfcfw45pgi] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.3rem 0.5rem;
    padding-right: 1.4rem;
    border-radius: 4px;
    border: 1px solid #dee2e6;
    background: #fff;
    color: #495057;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.date-tab:hover[b-gfcfw45pgi] {
    background: #e9ecef;
    border-color: #adb5bd;
}

.date-tab.active[b-gfcfw45pgi] {
    background: #0d6efd;
    color: white;
    border-color: #0d6efd;
}

.tab-date[b-gfcfw45pgi] {
    font-weight: 500;
}

.tab-badge[b-gfcfw45pgi] {
    position: absolute;
    top: -5px;
    right: -5px;
    background: #0d6efd;
    color: white;
    border: 1px solid white;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6rem;
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(0,0,0,0.15);
}

.date-tab.active .tab-badge[b-gfcfw45pgi] {
    background: white;
    color: #0d6efd;
    border-color: #0d6efd;
}

.add-date-btn[b-gfcfw45pgi] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.3rem 0.5rem;
    border-radius: 4px;
    border: 1px dashed #28a745;
    background: transparent;
    color: #28a745;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

.add-date-btn:hover[b-gfcfw45pgi] {
    background: #28a745;
    color: white;
    border-style: solid;
}

.add-date-btn i[b-gfcfw45pgi] {
    font-size: 0.8rem;
}

.product-code-info[b-gfcfw45pgi] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.5rem;
    background: #e7f1ff;
    border: 1px solid #b6d4fe;
    border-radius: 4px;
    font-size: 0.7rem;
    color: #0d6efd;
    white-space: nowrap;
}

.product-code-info i[b-gfcfw45pgi] {
    font-size: 0.75rem;
}

/* Responsive - hide text on smaller screens */
@media (max-width: 768px) {
    .add-text[b-gfcfw45pgi] {
        display: none;
    }

    .product-code-info span[b-gfcfw45pgi] {
        max-width: 120px;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}
/* /Pages/Bottling/UpdateCaseCount.razor.rz.scp.css */
/* ============================================
   Case Count Panel - Modern Responsive Design
   ============================================ */

.case-count-panel[b-8dpxiya2wg] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0; /* Critical for iOS flex scrolling */
    background: #f8fafc;
    overflow: hidden;
}

/* ============================================
   Case Code Warning Bar
   ============================================ */
.case-code-warning[b-8dpxiya2wg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border-bottom: 1px solid #fcd34d;
    color: #92400e;
    font-size: 0.85rem;
    flex-shrink: 0;
}

.case-code-warning i[b-8dpxiya2wg] {
    color: #d97706;
}

.case-code-input[b-8dpxiya2wg] {
    flex: 1;
    max-width: 150px;
    padding: 0.25rem 0.5rem;
    border: 1px solid #fcd34d;
    border-radius: 4px;
    font-size: 0.85rem;
    background: white;
}

.save-code-btn[b-8dpxiya2wg] {
    background: #059669;
    color: white;
    border: none;
    border-radius: 4px;
    padding: 0.25rem 0.5rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.save-code-btn:hover[b-8dpxiya2wg] {
    background: #047857;
}

.separator[b-8dpxiya2wg] {
    opacity: 0.5;
}


/* ============================================
   Stats Grid
   ============================================ */
.stats-grid[b-8dpxiya2wg] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: white;
    border-bottom: 1px solid #e2e8f0;
    flex-shrink: 0;
}

.stat-card[b-8dpxiya2wg] {
    background: #f1f5f9;
    border-radius: 8px;
    padding: 0.375rem 0.5rem;
    text-align: center;
    transition: transform 0.2s, box-shadow 0.2s;
}

.stat-card.primary[b-8dpxiya2wg] {
    background: linear-gradient(135deg, #059669 0%, #10b981 100%);
    color: white;
}

.stat-value[b-8dpxiya2wg] {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.1;
}

.stat-label[b-8dpxiya2wg] {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    opacity: 0.8;
    margin-top: 0.125rem;
}

/* ============================================
   Add Pallet Section
   ============================================ */
.add-pallet-section[b-8dpxiya2wg] {
    padding: 0.5rem 0.75rem;
    background: white;
    border-bottom: 1px solid #e2e8f0;
    flex-shrink: 0;
}

/* Compact info card for Next Pallet + config */
.pallet-info-card[b-8dpxiya2wg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.5rem;
}

/* Print toggle checkbox in pallet card */
.print-toggle[b-8dpxiya2wg] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    cursor: pointer;
    font-size: 0.875rem;
    color: #475569;
    padding: 0.25rem 0.5rem;
    background: white;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    flex-shrink: 0;
}

.print-toggle input[type="checkbox"][b-8dpxiya2wg] {
    width: 18px;
    height: 18px;
    accent-color: #2563eb;
    cursor: pointer;
}

.pallet-info-left[b-8dpxiya2wg] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    flex: 1;
}

.next-pallet-label[b-8dpxiya2wg] {
    font-size: 0.75rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.next-pallet-number[b-8dpxiya2wg] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1e3a5f;
}

.pallet-info-right[b-8dpxiya2wg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.pallet-config-item[b-8dpxiya2wg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.25rem 0.5rem;
    background: white;
    border-radius: 6px;
    min-width: 50px;
}

.pallet-config-item.editable[b-8dpxiya2wg] {
    border: 1px solid #cbd5e1;
}

.config-value[b-8dpxiya2wg] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e3a5f;
    line-height: 1.2;
}

.config-label[b-8dpxiya2wg] {
    font-size: 0.65rem;
    color: #64748b;
    text-transform: uppercase;
}

.cases-input[b-8dpxiya2wg] {
    width: 48px;
    padding: 0;
    border: none;
    background: transparent;
    font-size: 1rem;
    text-align: center;
    font-weight: 600;
    color: #1e3a5f;
}

.cases-input:focus[b-8dpxiya2wg] {
    outline: none;
}

.add-pallet-btn[b-8dpxiya2wg] {
    width: 100%;
    padding: 0.625rem 1rem;
    font-size: 1rem;
    font-weight: 600;
    color: white;
    background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%);
    border: none;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    transition: transform 0.15s, box-shadow 0.15s;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.3);
}

.add-pallet-btn:hover:not(:disabled)[b-8dpxiya2wg] {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(37, 99, 235, 0.4);
}

.add-pallet-btn:active:not(:disabled)[b-8dpxiya2wg] {
    transform: translateY(0);
}

.add-pallet-btn:disabled[b-8dpxiya2wg] {
    opacity: 0.7;
    cursor: not-allowed;
}

.add-pallet-btn.printing[b-8dpxiya2wg] {
    background: linear-gradient(135deg, #059669 0%, #10b981 100%);
}

.add-pallet-btn i[b-8dpxiya2wg] {
    font-size: 1.25rem;
}

.spinning[b-8dpxiya2wg] {
    animation: spin-b-8dpxiya2wg 1s linear infinite;
}

@keyframes spin-b-8dpxiya2wg {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.add-pallet-options[b-8dpxiya2wg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.375rem;
    padding-top: 0.375rem;
    border-top: 1px solid #e2e8f0;
}

.time-display[b-8dpxiya2wg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #475569;
}

.edit-time-btn[b-8dpxiya2wg] {
    background: none;
    border: none;
    color: #64748b;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 4px;
    transition: color 0.2s, background 0.2s;
}

.edit-time-btn:hover[b-8dpxiya2wg] {
    color: #2563eb;
    background: #e2e8f0;
}

.time-edit-row[b-8dpxiya2wg] {
    margin-top: 0.75rem;
}

.time-input[b-8dpxiya2wg] {
    width: 100%;
    padding: 0.625rem;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    font-size: 0.9rem;
}

/* Printer select (in add-pallet-options) */
.printer-select-inline[b-8dpxiya2wg] {
    padding: 0.25rem 0.375rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.75rem;
    min-width: 180px;
    max-width: 220px;
    background: white;
    color: #475569;
}

.printer-select[b-8dpxiya2wg] {
    flex: 1;
    padding: 0.375rem 0.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    font-size: 0.8rem;
    min-width: 0;
    background: white;
    color: #1e293b;
    cursor: pointer;
}

/* ============================================
   Pallet List Section
   ============================================ */
.pallet-list-section[b-8dpxiya2wg] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: #f8fafc;
}

.list-header[b-8dpxiya2wg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.375rem 0.75rem;
    background: white;
    border-bottom: 1px solid #e2e8f0;
    flex-shrink: 0;
}

.list-header h3[b-8dpxiya2wg] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
}

.pallet-count[b-8dpxiya2wg] {
    font-size: 0.8rem;
    color: #64748b;
    background: #f1f5f9;
    padding: 0.25rem 0.625rem;
    border-radius: 9999px;
}

.pallet-list[b-8dpxiya2wg] {
    flex: 1;
    overflow-y: auto;
    padding: 0.375rem 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain; /* Prevents iOS page bounce */
}

.pallet-card[b-8dpxiya2wg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: white;
    padding: 0.5rem 0.625rem;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
    transition: box-shadow 0.2s;
}

.pallet-card:hover[b-8dpxiya2wg] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.pallet-card.editing[b-8dpxiya2wg] {
    background: #eff6ff;
    border: 1px solid #3b82f6;
}

.pallet-edit-row[b-8dpxiya2wg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.time-edit-input[b-8dpxiya2wg] {
    padding: 0.25rem 0.375rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.8rem;
    width: 90px;
}

.cases-edit-input[b-8dpxiya2wg] {
    padding: 0.25rem 0.375rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.8rem;
    width: 50px;
    text-align: center;
}

.cases-label[b-8dpxiya2wg] {
    font-size: 0.75rem;
    color: #64748b;
}

.pallet-number[b-8dpxiya2wg] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e3a5f;
    min-width: 36px;
}

.pallet-details[b-8dpxiya2wg] {
    flex: 1;
    min-width: 0;
}

.pallet-time[b-8dpxiya2wg] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.8rem;
    color: #1e293b;
    margin-bottom: 0;
}

.pallet-time i[b-8dpxiya2wg] {
    font-size: 0.7rem;
    color: #64748b;
}

.pallet-stats[b-8dpxiya2wg] {
    font-size: 0.7rem;
    color: #64748b;
    display: flex;
    gap: 0.375rem;
}

.pallet-actions[b-8dpxiya2wg] {
    display: flex;
    gap: 0.5rem;
}

.action-btn[b-8dpxiya2wg] {
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    transition: background 0.2s, transform 0.15s;
}

.action-btn.reprint[b-8dpxiya2wg] {
    background: #dbeafe;
    color: #2563eb;
}

.action-btn.reprint:hover:not(:disabled)[b-8dpxiya2wg] {
    background: #bfdbfe;
    transform: scale(1.05);
}

.action-btn.delete[b-8dpxiya2wg] {
    background: #fee2e2;
    color: #dc2626;
}

.action-btn.delete:hover[b-8dpxiya2wg] {
    background: #fecaca;
    transform: scale(1.05);
}

.action-btn.edit[b-8dpxiya2wg] {
    background: #f1f5f9;
    color: #475569;
}

.action-btn.edit:hover[b-8dpxiya2wg] {
    background: #e2e8f0;
    transform: scale(1.05);
}

.action-btn.save[b-8dpxiya2wg] {
    background: #d1fae5;
    color: #059669;
}

.action-btn.save:hover[b-8dpxiya2wg] {
    background: #a7f3d0;
    transform: scale(1.05);
}

.action-btn.cancel[b-8dpxiya2wg] {
    background: #f1f5f9;
    color: #64748b;
}

.action-btn.cancel:hover[b-8dpxiya2wg] {
    background: #e2e8f0;
    transform: scale(1.05);
}

.action-btn:disabled[b-8dpxiya2wg] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Empty State */
.empty-state[b-8dpxiya2wg] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    color: #94a3b8;
}

.empty-state i[b-8dpxiya2wg] {
    font-size: 3rem;
    margin-bottom: 1rem;
}

.empty-state p[b-8dpxiya2wg] {
    margin: 0;
    font-size: 1rem;
}

.empty-hint[b-8dpxiya2wg] {
    font-size: 0.875rem !important;
    margin-top: 0.5rem !important;
}

/* ============================================
   Footer
   ============================================ */
.panel-footer[b-8dpxiya2wg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    padding-bottom: calc(0.5rem + env(safe-area-inset-bottom, 0px)); /* iPhone home indicator */
    background: white;
    border-top: 1px solid #e2e8f0;
    flex-shrink: 0;
}

.footer-group[b-8dpxiya2wg] {
    display: flex;
    gap: 0.25rem;
}

.footer-group.prints .footer-btn[b-8dpxiya2wg] {
    background: #e0e7ff;
    border-color: #c7d2fe;
    color: #4338ca;
}

.footer-group.prints .footer-btn:hover[b-8dpxiya2wg] {
    background: #c7d2fe;
}

.footer-btn[b-8dpxiya2wg] {
    padding: 0.5rem 0.625rem;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    font-size: 0.75rem;
    color: #475569;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    transition: background 0.2s;
}

.footer-btn:hover[b-8dpxiya2wg] {
    background: #e2e8f0;
}

.complete-btn[b-8dpxiya2wg] {
    flex: 1;
    background: linear-gradient(135deg, #059669 0%, #10b981 100%) !important;
    color: white !important;
    border-color: #047857 !important;
    font-weight: 600;
    font-size: 0.85rem;
    padding: 0.625rem 0.75rem;
}

.complete-btn:hover[b-8dpxiya2wg] {
    background: linear-gradient(135deg, #047857 0%, #059669 100%) !important;
}

.completed-btn[b-8dpxiya2wg] {
    flex: 1;
    background: #d1fae5 !important;
    border: 1px solid #6ee7b7 !important;
    color: #065f46 !important;
    font-weight: 500;
}

.completed-btn:hover[b-8dpxiya2wg] {
    background: #a7f3d0 !important;
}

/* ============================================
   Mobile Optimizations (< 640px)
   ============================================ */
@media (max-width: 640px) {
    .pallet-list[b-8dpxiya2wg] {
        /* Ensure iOS momentum scrolling works */
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-y: contain;
        /* Add bottom padding for iOS home indicator */
        padding-bottom: calc(0.5rem + env(safe-area-inset-bottom, 20px));
    }

    .case-code-warning[b-8dpxiya2wg] {
        font-size: 0.8rem;
        padding: 0.375rem 0.5rem;
    }

    .case-code-input[b-8dpxiya2wg] {
        max-width: 120px;
    }

    .stats-grid[b-8dpxiya2wg] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.5rem;
        padding: 0.75rem;
    }

    .stat-value[b-8dpxiya2wg] {
        font-size: 1.25rem;
    }

    .stat-label[b-8dpxiya2wg] {
        font-size: 0.7rem;
    }

    .add-pallet-btn[b-8dpxiya2wg] {
        padding: 1.25rem;
        font-size: 1.25rem;
    }

    .pallet-config[b-8dpxiya2wg] {
        display: none;
    }

    .header-meta[b-8dpxiya2wg] {
        font-size: 0.75rem;
    }

    .brand-name[b-8dpxiya2wg] {
        font-size: 1.1rem;
    }

    .pallet-number[b-8dpxiya2wg] {
        min-width: 40px;
        font-size: 1rem;
    }

    .action-btn[b-8dpxiya2wg] {
        width: 44px;
        height: 44px;
    }
}

/* ============================================
   Tablet (481px - 768px)
   ============================================ */
@media (min-width: 481px) and (max-width: 768px) {
    .stats-grid[b-8dpxiya2wg] {
        grid-template-columns: repeat(4, 1fr);
    }

    .add-pallet-btn[b-8dpxiya2wg] {
        padding: 1.125rem;
    }
}

/* ============================================
   Desktop (> 768px)
   ============================================ */
@media (min-width: 769px) {
    .case-count-panel[b-8dpxiya2wg] {
        max-width: 600px;
        margin: 0 auto;
    }

    .stats-grid[b-8dpxiya2wg] {
        padding: 1.25rem;
        gap: 1rem;
    }

    .stat-card[b-8dpxiya2wg] {
        padding: 1rem;
    }

    .stat-value[b-8dpxiya2wg] {
        font-size: 1.75rem;
    }

    .pallet-list[b-8dpxiya2wg] {
        padding: 1rem;
    }

    .pallet-card[b-8dpxiya2wg] {
        padding: 1rem 1.25rem;
    }
}

/* ============================================
   Accessibility & Touch
   ============================================ */
@media (hover: none) and (pointer: coarse) {
    /* Touch device optimizations */
    .action-btn[b-8dpxiya2wg] {
        width: 48px;
        height: 48px;
    }

    .add-pallet-btn[b-8dpxiya2wg] {
        min-height: 56px;
    }

    .partial-btn[b-8dpxiya2wg] {
        min-height: 48px;
    }

    .footer-btn[b-8dpxiya2wg] {
        min-height: 48px;
    }

    .print-toggle[b-8dpxiya2wg] {
        padding: 0.5rem 0.625rem;
    }

    .print-toggle input[type="checkbox"][b-8dpxiya2wg] {
        width: 22px;
        height: 22px;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .stat-card[b-8dpxiya2wg] {
        border: 2px solid currentColor;
    }

    .pallet-card[b-8dpxiya2wg] {
        border: 1px solid #1e293b;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .add-pallet-btn[b-8dpxiya2wg],
    .action-btn[b-8dpxiya2wg],
    .pallet-card[b-8dpxiya2wg] {
        transition: none;
    }

    .spinning[b-8dpxiya2wg] {
        animation: none;
    }
}

/* ============================================
   iOS Input Zoom Prevention
   ============================================ */
@media (max-width: 768px) {
    .case-count-panel input[b-8dpxiya2wg],
    .case-count-panel select[b-8dpxiya2wg],
    .case-count-panel textarea[b-8dpxiya2wg] {
        font-size: 16px !important; /* Prevents iOS auto-zoom on focus */
    }
}
/* /Pages/Bottling/UpdateCaseCountPrint.razor.rz.scp.css */

@media print {
  @page {
    size: portrait
  }
}

img[b-wv4vy9ixc4] {
  width: 100%;
  height: 15vw;
  object-fit: contain;
}

.centerHeader[b-wv4vy9ixc4] {
  display: flex;
  justify-content: center;
  padding: 0px;
  margin: 0px;
}

.headPicture[b-wv4vy9ixc4] {
  width: 200px;
}


/* /Pages/Bulk/BulkMain.razor.rz.scp.css */

.headingRow[b-27ggfu3tzt] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.button[b-27ggfu3tzt]{
    display:block;
    margin:0px;
    padding:0px;
}

.tableContainer[b-27ggfu3tzt] {
  flex-grow: 1; /* Allows it to take up full available space */
  width: 100%; /* Ensures full width */
  height: 100vh;
  overflow-y: scroll; /* Add vertical scrolling */
  position: relative;
  z-index: 2;
}
.containSplit[b-27ggfu3tzt] {
  display: flex;
  flex-direction: row; /* Ensure layout flows in a row */
  /*width: 100%;*/ /* Ensure it takes full viewport width */
  /*height: 100%;*/ /* Ensure full height */

  gap: 0.25rem;
  max-height: 70vh; /* Parent container limit */
}
.contain[b-27ggfu3tzt]{
  height:95vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.tools[b-27ggfu3tzt] {
  min-height: 15vh;
  max-height: 20vh;
  overflow-y: scroll;
  display: flex;
  flex-wrap: wrap; /* Allow items to wrap into rows */
  z-index: 1;
  background-color: white;
}

.item[b-27ggfu3tzt] {
  width: calc(33.33% - 10px); /* 33.33% width for each item with some spacing */
  margin: 5px; /* Add some spacing between columns */
  box-sizing: border-box; /* Include padding and border in item's width */
  position: relative; /* Required for absolute positioning of the close button */
  display: inline-flex; /* Make divs as wide as their content */
}


.purple-pill[b-27ggfu3tzt] {
  background-color: rgba(192, 128, 192, 0.5); /* Use rgba to set a transparent light purple color */
  border-radius: 20px; /* Adjust border-radius to create a pill shape */
  padding: 5px 10px; /* Adjust padding to control the size and spacing */
  color: white; /* Text color */
  font-weight: bold; /* Optional: make the text bold */
  align-items: center; /* Vertically center the text within the pill */
  z-index: 1;
}
.purple-pill:hover[b-27ggfu3tzt] {
  background-color: rgba(192, 128, 192, 0.7); /* Darken the color a bit on mouse-over */
cursor:pointer;
}

.blue-pill[b-27ggfu3tzt] {
  background: linear-gradient(135deg, #4e73df, #8f7dff); /* Blueish linear gradient */
  border-radius: 20px; /* Adjust border-radius to create a pill shape */
  padding: 5px 10px; /* Adjust padding to control the size and spacing */
  color: white; /* Text color */
  font-weight: bold; /* Optional: make the text bold */
  align-items: center; /* Vertically center the text within the pill */
  z-index: 1;
}

  .blue-pill:hover[b-27ggfu3tzt] {
    background: linear-gradient(135deg, #3953a3, #7461e0); /* Darker gradient on mouse-over */
    cursor: pointer;
  }


  .pill-container[b-27ggfu3tzt]{
    display:flex;
    flex-direction:column;

  }

.center-header[b-27ggfu3tzt] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
}

@media screen and (max-width: 700px) {
  .item[b-27ggfu3tzt] {
    flex-basis: 100%; /* Switch to a single column layout */
  }
}
.close-button[b-27ggfu3tzt] {
  position: absolute;
  top: 5px; /* Adjust the top position for your desired spacing */
  right: 5px; /* Adjust the right position for your desired spacing */
  width: 20px; /* Adjust the button size as needed */
  height: 20px; /* Adjust the button size as needed */
  background-color: grey; /* Grey circle background color */
  border-radius: 50%; /* Make it a circle */
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  font-size: 14px;
  color: white; /* Text color of the 'x' */
  z-index:5;
}
.close-button:hover[b-27ggfu3tzt] {
  background-color: black; /* Black circle background color */
}

thead[b-27ggfu3tzt] {
  background-color: #f2f2f2; /* Header background color */
  position: sticky;
  top: 0; /* Stick the header to the top */
  z-index: 2;

}
table[b-27ggfu3tzt] {
  overflow-y: auto;
  border-collapse: collapse;
  width: 100%;
  z-index: 1;
}

td[b-27ggfu3tzt] {
  vertical-align: top;
  text-align: center;
  vertical-align: middle;
  padding:2px;
}

/* Style all <th> elements */
th[b-27ggfu3tzt] {
  vertical-align: top;
  text-align: center;
  vertical-align: middle;
}
.tight-spacing[b-27ggfu3tzt] {
  white-space: pre-wrap;
  line-height: 1;
  margin: 2px;
  padding: 2px;

  vertical-align: top;
  text-align: center;
  vertical-align:text-top;

}
.btn-custom-link[b-27ggfu3tzt] {
  margin: 0px !important;
  padding: 0px !important;
  color: white !important; /* Ensure text color is white */
}
.row[b-27ggfu3tzt] {
  display: flex;
  justify-content: space-between; /* Adjust spacing between columns */
  align-items: center; /* Align items vertically */
}

.column[b-27ggfu3tzt] {
  flex: 1; /* Set both columns to take up equal width */
  text-align: center; /* Center align content */
  white-space: nowrap; /* Prevent content from wrapping */
  display: flex; /* Set display to flex */
  flex-direction: column; /* Stack items vertically */
}

.hidden[b-27ggfu3tzt] {
  display: none;
}

.visible[b-27ggfu3tzt] {
  display: block;
}

/* Split View Styling */
.split-table[b-27ggfu3tzt] {
  width: 77%;
  overflow: auto; /* Enables scrolling */
  max-height: 70vh; /* Prevents overflow issues */
}

.split-dashboard[b-27ggfu3tzt] {
  width: 23%;
  overflow: auto; /* Enables scrolling */
  max-height: 70vh; /* Prevents overflow issues */
}
.containSplit[b-27ggfu3tzt] {
  display: flex;
  flex-direction: row; /* Ensure row layout for split view */
  gap: .25rem;
  max-height: 70vh;
}

/* /Pages/Bulk/BulkQuoteModal.razor.rz.scp.css */
.containerMain[b-o2tx6xd9z2] {
    display: flex;
    flex-direction: row;
    padding: 5px;
    margin-bottom: 5px;
    border-bottom: solid 1px grey;
    flex-wrap: wrap;
}

.child1[b-o2tx6xd9z2] {
    width: auto;
}


.slider-container[b-o2tx6xd9z2] {
    display: flex;
    align-items: center;
}

input[type=range][b-o2tx6xd9z2] {
    width: 100%;
    height: 10px;
    margin: 0 10px;
    background: #ddd;
    border: none;
    border-radius: 5px;
}

    input[type=range][b-o2tx6xd9z2]::-webkit-slider-thumb {
        appearance: none;
        width: 20px;
        height: 20px;
        background: #007bff;
        border-radius: 50%;
        cursor: pointer;
    }

.slider-value[b-o2tx6xd9z2] {
    font-size: 16px;
    font-weight: bold;
}




.tableContainer[b-o2tx6xd9z2] {
    position: relative;
    height: 400px; /* Set the height of the container */
    overflow: auto; /* Enable vertical scrolling for the tbody */
}

    .tableContainer table[b-o2tx6xd9z2] {
        width: 100%;
        table-layout: fixed;
        border-collapse: collapse;
    }

    .tableContainer thead[b-o2tx6xd9z2] {
        position: sticky;
        top: 0; /* Stick the thead to the top of the container */
        background-color: white; /* Set a background color for the thead */
    }

ul[b-o2tx6xd9z2] {
    list-style-type: none;
}

li[b-o2tx6xd9z2] {
    height: 63px;
    list-style-type: none;
}
/*    ul li.form-input {
        height: auto;
    }*/
.gridContainer[b-o2tx6xd9z2] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.child2[b-o2tx6xd9z2] {
    width: 45%;
    margin: 5px;
}

    .child2 > label[b-o2tx6xd9z2] {
        font-weight: bold;
    }

.closeButton[b-o2tx6xd9z2] {
    display: flex;
    align-items: center;
    justify-content: right;
}

label[b-o2tx6xd9z2] {
    font-weight: bold;
}

.bottomButtons[b-o2tx6xd9z2] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 5px;
    align-items: center;
    justify-content: flex-end;
}
.email-sent-indicator[b-o2tx6xd9z2] {
  color: green;
  margin-left: 5px;
  font-weight: bold;
}
/* /Pages/Bulk/BulkRequestDashboard.razor.rz.scp.css */
/* Container ensures the dashboard layout remains intact */
.bulk-dashboard-container[b-0s2uhmgdg1] {
  width: 100%;
  padding: .1rem;
  /*max-height: 100%;*/ /* Ensures it doesn't exceed parent */
  max-height: 75vh;
}

/* Ensures flexbox layout and allows wrapping */
.bulk-dashboard-content[b-0s2uhmgdg1] {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .5rem;
  max-height: 75vh;
  padding-bottom:5px;
}



/* Card Styling */

/* Compact View - Smaller cards */
.bulk-dashboard-card.compact[b-0s2uhmgdg1] {
  background-color: pink;
  padding: 0.25rem;
  border: 1px solid #ddd;
  border-radius: 5px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  flex: 1 1 calc(33.33% - 1rem);
  max-width: 100%;
  min-width: 250px;
  height: 150px; /* Smaller height */
  display: flex;
  flex-direction: column;
}

  /* Ensure table inside Compact View does not expand */
  .bulk-dashboard-card.compact .bulk-dashboard-card-content[b-0s2uhmgdg1] {
    overflow-y: auto; /* Re-enables scrolling */
    padding-right: 5px; /* Prevents scrollbar overlap */


  }

  /* Remove padding from <td> inside Compact View */
  .bulk-dashboard-card.compact td[b-0s2uhmgdg1] {
    padding: 0px !important;
  }



.bulk-dashboard-content.detailed[b-0s2uhmgdg1] {
  max-height: 75vh; /* Ensures content doesn't overflow the viewport */
  overflow-y: auto; /* Enables vertical scrolling */
  display: flex;
  flex-wrap: wrap;
  gap: .1rem; /* Keeps spacing between cards */
  align-content: flex-start; /* Ensures proper alignment when scrolling */
  padding-bottom: 5px; /* Prevents clipping of scrollbars */
}

/* Default detailed card behavior */
.bulk-dashboard-card.detailed[b-0s2uhmgdg1] {
  background-color: aliceblue;
  padding: .25rem;
  border: 2px solid #aaa;
  border-radius: 5px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
  flex: 1 1 calc(50% - 1rem); /* 2 cards per row by default */
  max-width: 50%;
  min-width: 400px;
  height: 250px; /* Default height (slightly expanded) */
  display: flex;
  flex-direction: column;
  transition: all 0.3s ease-in-out;
  overflow: hidden;
}

  /* Expanded Card: Takes full width */
  .bulk-dashboard-card.detailed.expanded[b-0s2uhmgdg1] {
    flex: 1 1 100%; /* Full width */
    max-width: 100%;
    height: auto; /* Let it grow dynamically */
    max-height: 660px; /* Adjust based on content */
  }
  /* Shrunk cards (when another is expanded) - Still visible but smaller */
  .bulk-dashboard-card.detailed.collapsed[b-0s2uhmgdg1] {
    flex: 1 1 calc(50% - 1rem); /* Keep some width */
    max-width: 50%;
    max-height: 30%; /* Shorter, but still shows LabRequests */
    overflow: hidden;
  }

/* Ensure content scrolls inside the card but not the card itself */
.bulk-dashboard-card-content-detailed[b-0s2uhmgdg1] {
  flex-grow: 1;
  overflow-y: auto; /* Enables scrolling if content overflows */
  /*max-height: 250px;*/ /* Prevents content overflow */
  padding-right: 5px; /* Prevents scrollbar overlap */
}

/* Keep table content visible but reduce max height for collapsed state */
.bulk-dashboard-card.detailed.collapsed .bulk-dashboard-card-content-detailed[b-0s2uhmgdg1] {
  display: block; /* Keep visible */
  max-height: 100%; /* Limit height to show fewer rows */
  overflow-y: auto; /* Allow scrolling */
}
/* Ensure table is contained within the scrollable area */
.bulk-dashboard-card.detailed table[b-0s2uhmgdg1] {
  width: 100%; /* Prevents table from overflowing */
  max-height: 100%; /* Makes table fit inside parent */
  overflow-y: auto; /* Enables vertical scrolling */
}
/* Remove padding from <td> inside Compact View */
.bulk-dashboard-card.detailed td[b-0s2uhmgdg1] {
  padding: 1px !important;
}

/* Ensure content scrolls inside the card but not the card itself */
.bulk-dashboard-card-content[b-0s2uhmgdg1] {
  flex-grow: 1;
  overflow-y: auto; /* Enables scrolling if content overflows */
  max-height: 100%; /* Prevents content overflow */
  padding-right: 5px; /* Prevents scrollbar overlap */

}

/* Prevent table rows from breaking the layout */
.bulk-dashboard-card-content table[b-0s2uhmgdg1] {
  width: 100%;
  border-collapse: collapse;
}

/* Optional: Ensure table doesn't break layout */
.bulk-dashboard-card-compact td[b-0s2uhmgdg1] {
  white-space: nowrap; /* Prevents text wrapping */
  overflow: hidden;
  text-overflow: ellipsis; /* Adds "..." for overflowing text */
  padding: 0px;
}

/* Style for scrollbar */
.bulk-dashboard-card-content[b-0s2uhmgdg1]::-webkit-scrollbar {
  width: 6px;
}

.bulk-dashboard-card-content[b-0s2uhmgdg1]::-webkit-scrollbar-thumb {
  background-color: #aaa;
  border-radius: 4px;
}

/* Status Header Icon Styling */
.expand-icon[b-0s2uhmgdg1] {
  cursor: pointer;
  font-size: 1.2rem;
  margin-left: 0.5rem;
  transition: transform 0.2s ease-in-out;
}

  .expand-icon:hover[b-0s2uhmgdg1] {
    color: #007bff; /* Highlight on hover */
  }
/* Responsive: Adjust layout for smaller screens */
@media (max-width: 1024px) {
  .bulk-dashboard-card.detailed[b-0s2uhmgdg1] {
    flex: 1 1 calc(100% - 1rem);
    max-width: 100%;
  }
}

@media (max-width: 768px) {
  .bulk-dashboard-card[b-0s2uhmgdg1] {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .bulk-dashboard-card-content-detailed[b-0s2uhmgdg1] {
    max-height: 300px;
  }
}

@media (max-width: 480px) {
  .bulk-dashboard-card[b-0s2uhmgdg1] {
    flex: 1 1 100%;
  }
}

  .bulk-dashboard-search[b-0s2uhmgdg1] {
    margin-bottom: 1rem;
    display: flex;
    justify-content: flex-start;
  }

    .bulk-dashboard-search input[b-0s2uhmgdg1] {
      width: 75%;
      padding: 0.5rem;
      border: 1px solid #ccc;
      border-radius: 5px;
      font-size: 1rem;
    }

  p[b-0s2uhmgdg1] {
    padding: 0;
    border: 0;
    margin: 0;
  }

  /* Ensures text wraps and enables vertical scrolling */
  .notes-column[b-0s2uhmgdg1] {
    max-width: 200px; /* Limit width to prevent table stretching */
    word-wrap: break-word; /* Allows wrapping */
    white-space: normal; /* Prevents forcing single-line overflow */
    overflow-y: auto; /* Enables vertical scrolling */
    max-height: 60px; /* Prevents excessive row height */
    padding-right: 5px;
  }

    /* Optional: Make scrolling smoother */
    .notes-column[b-0s2uhmgdg1]::-webkit-scrollbar {
      width: 6px;
    }

    .notes-column[b-0s2uhmgdg1]::-webkit-scrollbar-thumb {
      background-color: #aaa;
      border-radius: 4px;
    }
  /* Status Header: Ensures h3 and input are in a row */
  .status-header[b-0s2uhmgdg1] {
    display: flex;
    align-items: center; /* Vertically center */
    justify-content: space-between; /* Push elements apart */
    gap: 0.25rem; /* Add spacing between them */
    padding: 0.25rem;
    width: 100%;
  }

    /* Ensure h3 doesn't take full width */
    .status-header h3[b-0s2uhmgdg1] {
      margin: 0;
      flex-grow: 1; /* Allows it to take available space */
      font-size: 1.2rem; /* Adjust font size if needed */
    }

    /* Ensure input doesn't shrink too much */
    .status-header .status-search[b-0s2uhmgdg1] {
      flex: 0 0 40%; /* Makes input take 40% of the row width */
      max-width: 300px; /* Ensures it doesn't get too wide */
      padding: 0.3rem;
      border: 1px solid #ccc;
      border-radius: 5px;
      font-size: 1rem;
    }
/* /Pages/Bulk/BulkWineProductsTable.razor.rz.scp.css */
.testing[b-0cfkotzhtq]{
  background-color:aliceblue;
}
td[b-0cfkotzhtq] {
  vertical-align: top;
  text-align: center;
  vertical-align: middle;
  padding: 2px;
}
/* /Pages/Bulk/BulkWineSpotQuote.razor.rz.scp.css */
.containerMain[b-samiav79pl] {
    display: flex;
    flex-direction: row;
    padding: 5px;
    margin-bottom: 5px;
    border-bottom: solid 1px grey;
    flex-wrap: wrap;
}

.child1[b-samiav79pl] {
    width: auto;
}

.child2[b-samiav79pl] {
    width: 45%;
    margin: 5px;
}

    .child2 > label[b-samiav79pl] {
        font-weight: bold;
    }

.closeButton[b-samiav79pl] {
    display: flex;
    align-items: center;
    justify-content: right;
}


.bottomButtons[b-samiav79pl] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 5px;
    align-items: center;
    justify-content: flex-end;
}
/* /Pages/BulletinBoard/BulletinBoardAnnouncements.razor.rz.scp.css */
.container[b-fd3mygasn8] {
  display: flex;
  flex-direction: column;
  height: 100%;
  gap: 5px;
}

.set-to-100[b-fd3mygasn8]{
  height: 100%;
  background-color: #f0f0f0;
  overflow-y:auto;
}
.row[b-fd3mygasn8]{
  flex-wrap:nowrap;
}

tr:hover td[b-fd3mygasn8] {
  cursor: pointer;
}
/* /Pages/BulletinBoard/BulletinBoardGuestCheckin.razor.rz.scp.css */
.checkbox-container[b-jzt0nrgafo] {
  display: flex;
  align-items: center; /* This ensures vertical alignment is centered */
}

input[type="checkbox"][b-jzt0nrgafo] {
  margin-right: 5px; /* Provides some space between the checkbox and the label */
}
/*.row {
  border: 1px solid #cfd8dc;*/ /* Adjust border color for a softer look */
  /*padding: 3px;*/ /* Increase padding for better spacing */
  /*margin: 4px 0;*/ /* Add vertical margin for separation */
  /*border-radius: 6px;*/ /* Increase border-radius for rounded corners */
  /*background-color: #ffffff;*/ /* White background for a clean look */
  /*box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);*/ /* Add a subtle shadow for depth */
  /*transition: box-shadow 0.3s ease;*/ /* Add a transition for hover effect */
/*}

  .row:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);*/ /* Increase shadow on hover for interaction */
  /*}*/


.row2[b-jzt0nrgafo] {
  display: flex; /* Use flexbox for alignment */
  flex-direction:row;
  border: 1px solid #cfd8dc; /* Adjust border color for a softer look */
  padding: 3px; /* Increase padding for better spacing */
  margin: 4px 0; /* Add vertical margin for separation */
  border-radius: 6px; /* Increase border-radius for rounded corners */
  background-color: #ffffff; /* White background for a clean look */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Add a subtle shadow for depth */
  transition: box-shadow 0.3s ease; /* Add a transition for hover effect */
gap:5px;
}

  .row2:hover[b-jzt0nrgafo] {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Increase shadow on hover for interaction */
  }

.switch[b-jzt0nrgafo] {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

  .switch input[b-jzt0nrgafo] {
    opacity: 0;
    width: 0;
    height: 0;
  }

.slider[b-jzt0nrgafo] {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

  .slider[b-jzt0nrgafo]:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }

input:checked + .slider[b-jzt0nrgafo] {
  background-color: #2196F3;
}

input:focus + .slider[b-jzt0nrgafo] {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider[b-jzt0nrgafo]:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round[b-jzt0nrgafo] {
  border-radius: 34px;
}

  .slider.round[b-jzt0nrgafo]:before {
    border-radius: 50%;
  }
.selected-row[b-jzt0nrgafo] {
  background-color: #f0f0f0; /* Light grey */
  /* Add more styles as needed */
}

.table-borderless td[b-jzt0nrgafo] {
  padding: 3px;

}
.table-borderless[b-jzt0nrgafo]{
  margin-bottom:0px;
}
.scrollable-table[b-jzt0nrgafo] {
  max-height: 105px; /* Adjust based on your requirement */
  overflow-y: auto;
  width: 100%; /* Optional: if you want the div to expand to the full width of its parent */
}
  .scrollable-table[b-jzt0nrgafo]::-webkit-scrollbar {
    display: none;
  }
  .container[b-jzt0nrgafo]{
    display: flex;
    flex-direction: column;
    max-height: 70vh;
  }
/* /Pages/BulletinBoard/BulletinBoardMain.razor.rz.scp.css */
.wrapper[b-8xqg1ru4gw] {
   display: flex;
   flex-flow: row wrap;
   font-weight: bold;
   text-align: center;
   height: 98vh;
}

.card[b-8xqg1ru4gw] {
  border-radius: 10px; /* Rounded corners */
  box-shadow: 0 4px 8px rgba(0,0,0,0.1); /* Shadow effect */
  transition: 0.3s; /* Smooth transition for hover effect */
}

.wrapper > *[b-8xqg1ru4gw] {
   padding: 10px;
   flex: 1 100%;
}

.headerRow[b-8xqg1ru4gw] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}

.header[b-8xqg1ru4gw], .footer[b-8xqg1ru4gw], .main[b-8xqg1ru4gw], .aside-1[b-8xqg1ru4gw], .aside-2[b-8xqg1ru4gw] {
  background-color: #f8f9fa; /* Bootstrap's light gray */
  color: #212529; /* Bootstrap's dark text */
  border: 1px solid #dee2e6; /* Optional: subtle separation */
}


.header[b-8xqg1ru4gw] {
  height: 9vh;
}

.footer[b-8xqg1ru4gw] {
  height: 9vh;
}

.main[b-8xqg1ru4gw] {
  text-align: left;
  height: 80vh;
}

.aside-1[b-8xqg1ru4gw] {
  text-align: left;
}

.aside-2[b-8xqg1ru4gw] {
  text-align: left;
}

@media all and (min-width: 600px) {
   .aside[b-8xqg1ru4gw] {
      flex: 1 0 0;
   }
}

@media all and (min-width: 800px) {
   .main[b-8xqg1ru4gw] {
      flex: 3 0px;
   }

   .aside-1[b-8xqg1ru4gw] {
      order: 1;
   }

   .main[b-8xqg1ru4gw] {
      order: 2;
   }

   .aside-2[b-8xqg1ru4gw] {
      order: 3;
   }

   .footer[b-8xqg1ru4gw] {
      order: 4;
   }
}


*[b-8xqg1ru4gw] {
   box-sizing: border-box;
}

@-webkit-keyframes ticker {
   0% {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      visibility: visible;
   }

   100% {
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
   }
}

@keyframes ticker-b-8xqg1ru4gw {
   0% {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      visibility: visible;
   }

   100% {
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
   }
}

.ticker-wrap[b-8xqg1ru4gw] {
/*  position:absolute;*/
   position: fixed;
   bottom: 0;
   width: 100%;
   overflow: hidden;
   height: 4rem;
   background-color: rgba(#000, 0.9);
   padding-left: 100%;
   box-sizing: content-box;
}
   .ticker[b-8xqg1ru4gw]{
   display: inline-block;
   height: 4rem;
   line-height: 4rem;
   white-space: nowrap;
   padding-right: 100%;
   box-sizing: content-box;
   -webkit-animation-iteration-count: infinite;
   animation-iteration-count: infinite;
   -webkit-animation-timing-function: linear;
   animation-timing-function: linear;
   -webkit-animation-name: ticker;
   animation-name: ticker-b-8xqg1ru4gw;
   -webkit-animation-duration: 30s;
   animation-duration: 30s;
}
li.high-priority[b-8xqg1ru4gw] {
  font-size: 1.2em; /* Larger text */
  font-weight: bold; /* Heavier font */
}

  li.high-priority[b-8xqg1ru4gw]::before {
    content: "\f00c"; /* FontAwesome check for example */
    font-family: FontAwesome;
    padding-right: 10px;
  }

li.medium-priority[b-8xqg1ru4gw] {
  font-size: 1.1em;
  font-weight: 500; /* Medium weight */
}

  li.medium-priority[b-8xqg1ru4gw]::before {
    content: "\f2db"; /* FontAwesome exclamation for example */
    font-family: FontAwesome;
    padding-right: 10px;
  }

li.low-priority[b-8xqg1ru4gw] {
  font-size: 1em; /* Standard text size */
  font-weight: normal; /* Standard weight */
}

  li.low-priority[b-8xqg1ru4gw]::before {
    content: "\f0ca"; /* FontAwesome list for example */
    font-family: FontAwesome;
    padding-right: 10px;
  }
.custom-heading[b-8xqg1ru4gw] {
  font-size: 1.5rem; /* Adjust font size as needed */
  font-weight: bold; /* Make the text bold */
  margin-bottom: 1rem; /* Add some space below the text */
  /* Add any other custom styles you need */
}

/* /Pages/BulletinBoard/BulletinBoardModal.razor.rz.scp.css */
.mainContainer[b-fjhouztfnf] {
  display: flex;
  flex-direction: column;
  height: 80vh;
}
.topContainer[b-fjhouztfnf] {
}

.top-button-row[b-fjhouztfnf] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 5px;
  align-items: center;
  justify-content: flex-start;
}
.formContainer[b-fjhouztfnf] {
/*  display: flex;*/
  flex-grow: 1;
  overflow-y: auto;
}
.featureContainer[b-fjhouztfnf] {
  height: 100%;
  overflow-y: auto;
}

.buttonRowContainer[b-fjhouztfnf] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 5px;
  align-items: center;
  justify-content: flex-end;
  margin-top: 15px;
}
/* /Pages/BulletinBoard/BulletinBoardNewEmployee.razor.rz.scp.css */
.container[b-wpgvqwa5c6] {
  display: flex;
  flex-direction: column;
/* max-height: 60vh;
*/  gap: 5px;

}

/*.main-childRow {
  flex: 1;
  max-height:80%;
}*/
.top-row[b-wpgvqwa5c6] {
  flex: 3; /* flex shorthand for flex-grow, flex-shrink and flex-basis */
  overflow-y: auto; /* Enables vertical scrolling if content overflows */
  max-height: 30%;
  border-radius: 5px;
  border: 1px solid grey;
}

.bottom-row[b-wpgvqwa5c6] {
  flex: 7;
  overflow-y: auto; /* Enables vertical scrolling if content overflows */
  max-height: 70%;
  border-radius: 5px;
  border: 1px solid grey;
}

.top-button-row[b-wpgvqwa5c6] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 5px;
  align-items: center;
  justify-content: space-between;
}

.buttonRowContainer[b-wpgvqwa5c6] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 5px;
  align-items: center;
  justify-content: flex-end;
  margin-top: 15px;
}

.row-modified[b-wpgvqwa5c6] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  padding: 5px;
  width: 100%;
}

.col[b-wpgvqwa5c6] 
{
  flex: 1;
  overflow-y:auto;
}
.col-NoScrollbar[b-wpgvqwa5c6] {
  flex: 1;
  overflow-y: auto
}

#noScroll[b-wpgvqwa5c6]::-webkit-scrollbar {
  display: none;
}

#employeeId[b-wpgvqwa5c6]::-webkit-inner-spin-button,
#employeeId[b-wpgvqwa5c6]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#employeeId[b-wpgvqwa5c6] {
  -moz-appearance: textfield;
}

.row-modified > .col:nth-child(1)[b-wpgvqwa5c6] {
  flex: 0 1 auto; /* Adjust this value for the second item */
  width: 20%; /* Example: Make the second element a different size, e.g., 20% */
}
/* Specifically target the first .col element */
.row-modified > .col:nth-child(2)[b-wpgvqwa5c6] {
  flex: 0 1 auto; /* Adjust this value to make it smaller */
  width: 10%; /* Example: Make the first element take only 80% of the width it would normally take */
  padding-left: 12px;
}


.topContainer[b-wpgvqwa5c6] {
}

.formContainer[b-wpgvqwa5c6] {
  flex-grow: 1; /* Allows this container to grow and fill available space */
  overflow-y: auto; /* Enables vertical scrolling */
}

.featureContainer[b-wpgvqwa5c6] {
  height: 100%;
  overflow-y: auto;
}

.setRowHeight .nicknameList .table-bordered[b-wpgvqwa5c6]  {
  overflow-y: auto;
}



.grid-container[b-wpgvqwa5c6] {
  display: grid;
  grid-template-columns: 1fr 1fr; /* Creates two columns of equal size */
  column-gap: 5px; /* Optional: if you want space between the columns */
  height:50vh;
 /* width:95%;*/
}

  .grid-container > div:not(:first-child)[b-wpgvqwa5c6] {
    border-left: 2px solid grey; /* Adds a grey border to the left of all columns except the first */
  }

.date-picker-container[b-wpgvqwa5c6] {
  display: flex; /* This line makes the container a flex container */
  align-items: center; /* Align items vertically in the center, if needed */
  justify-content: space-between; /* Space out the child elements */
  flex-wrap: nowrap; /* Prevents flex items from wrapping */
}

.date-picker:last-child[b-wpgvqwa5c6] {
  margin-right: 0; /* Removes margin from the last date picker */
}

/*#column2 {
  padding-left: 5px;
}
#column1 {
  padding-left: 5px;
}
*/
.image-container img.responsive-image[b-wpgvqwa5c6] {
  max-width: 300px;
  max-height: 300px;
  width: auto;
  height: auto;
  object-fit: cover;
  display: block;
  margin: 0 auto;
}
.contactEmployeeRow:hover[b-wpgvqwa5c6]{
  background-color: #f0f0f0;
  cursor: pointer;
}



.removeImage[b-wpgvqwa5c6] {
  display: flex;
  justify-content: space-between;
  position: relative;
  top: 0;
  right: 0;
  background-image: linear-gradient(180deg, rgb(5, 46, 118) 0%, #0366d6 70%);
  color: white;
  padding: 2px;
  border-radius: 5px;
  cursor: pointer;
}
.rowButton[b-wpgvqwa5c6] {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  text-align: left;
  width: 100%;
}

.enabled[b-wpgvqwa5c6] {
  color: black; /* Change color to match your design */
}

.disabled[b-wpgvqwa5c6] {
  color: gray; /* Change color to match your design */
  cursor: default;
}

.selected-row[b-wpgvqwa5c6] {
  background-color: #007bff; /* Bootstrap primary color for demonstration */
  color: white; /* Change text color to ensure readability */
}

/* /Pages/Compliance/BondHolderFormPanel.razor.rz.scp.css */
.bond-holder-form[b-tl3lfu0xwy] {
    padding: 1.25rem;
}

.form-section[b-tl3lfu0xwy] {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
}

.form-section:last-of-type[b-tl3lfu0xwy] {
    border-bottom: none;
}

.section-title[b-tl3lfu0xwy] {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6c757d;
    margin-bottom: 0.75rem;
}

.section-title.clickable[b-tl3lfu0xwy] {
    cursor: pointer;
    user-select: none;
}

.section-title.clickable:hover[b-tl3lfu0xwy] {
    color: #495057;
}

.form-label.required[b-tl3lfu0xwy]::after {
    content: " *";
    color: #dc3545;
}

/* Business type chip toggles */
.business-type-chips[b-tl3lfu0xwy] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.chip[b-tl3lfu0xwy] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.375rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 2rem;
    background: #fff;
    color: #495057;
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.15s;
}

.chip:hover[b-tl3lfu0xwy] {
    border-color: #0d6efd;
    color: #0d6efd;
}

.chip.selected[b-tl3lfu0xwy] {
    background: #0d6efd;
    border-color: #0d6efd;
    color: #fff;
}

/* Collection rows (phones, emails) */
.collection-row[b-tl3lfu0xwy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

/* Address blocks */
.address-block[b-tl3lfu0xwy] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.75rem;
    border: 1px solid #e9ecef;
    border-radius: 0.375rem;
    margin-bottom: 0.5rem;
    background: #fafafa;
}

/* Sticky form footer */
.form-actions[b-tl3lfu0xwy] {
    position: sticky;
    bottom: 0;
    background: #fff;
    padding: 1rem 0;
    border-top: 1px solid #dee2e6;
    margin-top: 1rem;
}
/* /Pages/Compliance/ColasMain.razor.rz.scp.css */
/* Page Header - override for flex-wrap (COLAs has view toggle + expand controls) */
.page-header[b-p9oxis5p3e] {
    flex-wrap: wrap;
}

/* View Mode Toggle */
.view-toggle[b-p9oxis5p3e] {
    display: flex;
    gap: 0.25rem;
    background: #f0f0f0;
    padding: 0.2rem;
    border-radius: 6px;
}

.view-toggle .btn[b-p9oxis5p3e] {
    font-size: 0.8rem;
    padding: 0.3rem 0.75rem;
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.view-toggle .btn i[b-p9oxis5p3e] {
    font-size: 0.9rem;
}

.expand-controls[b-p9oxis5p3e] {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
}

.expand-controls .btn[b-p9oxis5p3e] {
    font-size: 0.8rem;
    padding: 0.25rem 0.6rem;
}

.expand-controls .btn span[b-p9oxis5p3e] {
    font-size: 0.7rem;
    margin-right: 0.25rem;
}

/* Client Group */
.client-group[b-p9oxis5p3e] {
    margin-bottom: 2rem;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
    overflow: hidden;
}

.client-header[b-p9oxis5p3e] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
    color: white;
    cursor: pointer;
    user-select: none;
    transition: filter 0.2s;
}

.client-header:hover[b-p9oxis5p3e] {
    filter: brightness(1.1);
}

.client-header.expanded[b-p9oxis5p3e] {
    border-bottom: 1px solid rgba(255,255,255,0.2);
}

.expand-icon[b-p9oxis5p3e] {
    font-size: 0.75rem;
    width: 1rem;
    text-align: center;
    transition: transform 0.2s;
}

.client-header h4[b-p9oxis5p3e] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.client-code[b-p9oxis5p3e] {
    background: rgba(255,255,255,0.25);
    padding: 0.25rem 0.6rem;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.client-dba[b-p9oxis5p3e] {
    font-size: 0.8rem;
    opacity: 0.85;
    font-style: italic;
}

.client-count[b-p9oxis5p3e] {
    margin-left: auto;
    font-size: 0.85rem;
    opacity: 0.9;
}

/* Card Grid Layout */
.card-grid[b-p9oxis5p3e] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
    padding: 1rem;
}

/* Recent view - flat grid outside of client groups */
.card-grid.recent-view[b-p9oxis5p3e] {
    padding: 0;
}

/* Card Styles */
.card[b-p9oxis5p3e] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    overflow: hidden;
    transition: box-shadow 0.2s, transform 0.2s;
    display: flex;
    flex-direction: column;
    border: 1px solid #eee;
}

.card:hover[b-p9oxis5p3e] {
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    transform: translateY(-2px);
}

/* Card Images */
.card-images[b-p9oxis5p3e] {
    background: #f8f9fa;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 120px;
    gap: 2px;
}

.card-image[b-p9oxis5p3e] {
    flex: 1;
    width: 50%;
    height: 120px;
    object-fit: contain;
    transition: transform 0.2s;
    background: #f8f9fa;
}

.card-image.clickable[b-p9oxis5p3e] {
    cursor: pointer;
}

.card-image.clickable:hover[b-p9oxis5p3e] {
    transform: scale(1.05);
    opacity: 0.9;
}

.card-image:only-child[b-p9oxis5p3e] {
    width: 100%;
}

.no-image[b-p9oxis5p3e] {
    color: #999;
    font-size: 0.875rem;
    padding: 2rem;
    text-align: center;
}

/* Card Body */
.card-body[b-p9oxis5p3e] {
    padding: 0.75rem;
    flex: 1;
}

.card-title[b-p9oxis5p3e] {
    font-weight: 600;
    font-size: 1rem;
    color: #333;
    margin-bottom: 0.25rem;
    line-height: 1.3;
}

.card-client[b-p9oxis5p3e] {
    font-size: 0.85rem;
    color: #11998e;
    font-weight: 500;
    margin-bottom: 0.25rem;
}

.card-meta[b-p9oxis5p3e] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.25rem;
}

.meta-tag[b-p9oxis5p3e] {
    background: #e9ecef;
    color: #495057;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    font-size: 0.75rem;
}

.card-fanciful[b-p9oxis5p3e] {
    font-style: italic;
    color: #666;
    font-size: 0.8rem;
    margin-bottom: 0.25rem;
}

.card-details[b-p9oxis5p3e] {
    font-size: 0.8rem;
    color: #666;
}

.detail-row[b-p9oxis5p3e] {
    display: flex;
    gap: 0.4rem;
    margin-bottom: 0.15rem;
}

.detail-label[b-p9oxis5p3e] {
    color: #888;
    min-width: 45px;
}

.detail-value[b-p9oxis5p3e] {
    color: #333;
    font-weight: 500;
}

/* Card Actions */
.card-actions[b-p9oxis5p3e] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 0.75rem;
    border-top: 1px solid #eee;
    background: #fafafa;
}

.card-actions .btn[b-p9oxis5p3e] {
    font-size: 0.75rem;
    padding: 0.2rem 0.5rem;
}

.references-badge[b-p9oxis5p3e] {
    margin-left: auto;
    background: #6c757d;
    color: white;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    font-size: 0.7rem;
}

/* No Results */
.no-results[b-p9oxis5p3e] {
    text-align: center;
    padding: 3rem 1rem;
    color: #666;
}

.no-results p[b-p9oxis5p3e] {
    margin-bottom: 1rem;
}

/* Responsive */
@media (max-width: 768px) {
    .card-grid[b-p9oxis5p3e] {
        grid-template-columns: 1fr;
    }

    .client-header[b-p9oxis5p3e] {
        flex-wrap: wrap;
    }

    .client-code[b-p9oxis5p3e] {
        order: 1;
    }

    .client-dba[b-p9oxis5p3e] {
        order: 2;
        width: 100%;
        margin-top: 0.25rem;
    }

    .client-count[b-p9oxis5p3e] {
        width: 100%;
        margin-left: 0;
        margin-top: 0.25rem;
        order: 3;
    }

    .card-actions[b-p9oxis5p3e] {
        flex-wrap: wrap;
    }

    .references-badge[b-p9oxis5p3e] {
        margin-left: 0;
        margin-top: 0.5rem;
        width: 100%;
        text-align: center;
    }
}
/* /Pages/Compliance/PermitFormPanel.razor.rz.scp.css */
.permit-form-panel[b-fzok5oq4h3] {
    padding: 1rem;
}

.form-header[b-fzok5oq4h3] {
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
}

.trade-names-list[b-fzok5oq4h3] {
    max-height: 300px;
    overflow-y: auto;
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 0.375rem;
    margin-bottom: 0.5rem;
}

.trade-name-row[b-fzok5oq4h3] {
    background: #fff;
    padding: 0.5rem;
    border-radius: 0.25rem;
    border: 1px solid #dee2e6;
}

.form-actions[b-fzok5oq4h3] {
    padding-top: 1rem;
    border-top: 1px solid #dee2e6;
    margin-top: 1rem;
}
/* /Pages/Compliance/PermitScanPanel.razor.rz.scp.css */
.permit-scan-panel[b-esoiin3lz3] {
    padding: 1rem;
}

.permit-upload-card[b-esoiin3lz3] {
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    overflow: hidden;
}

.permit-upload-header[b-esoiin3lz3] {
    background: #f8f9fa;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #dee2e6;
}

.upload-area[b-esoiin3lz3] {
    padding: 2rem;
    text-align: center;
    background: #fff;
    transition: background 0.2s;
}

.upload-area:hover:not(.has-file)[b-esoiin3lz3] {
    background: #f8f9fa;
}

.upload-area.has-file[b-esoiin3lz3] {
    padding: 1rem;
}

.upload-label[b-esoiin3lz3] {
    cursor: pointer;
    display: block;
}

.upload-icon[b-esoiin3lz3] {
    font-size: 3rem;
    margin-bottom: 0.5rem;
    display: block;
}

.upload-text[b-esoiin3lz3] {
    display: block;
    font-weight: 500;
    margin-bottom: 0.25rem;
}

.upload-hint[b-esoiin3lz3] {
    display: block;
    font-size: 0.875rem;
    color: #6c757d;
}

.file-selected[b-esoiin3lz3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.form-section-title[b-esoiin3lz3] {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e9ecef;
}

.trade-name-item[b-esoiin3lz3] {
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 0.25rem;
}

.scan-field-label[b-esoiin3lz3] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
    display: block;
    margin-bottom: 0.25rem;
}

.permit-type-checkboxes[b-esoiin3lz3] {
    background: #f8f9fa;
    padding: 0.75rem;
    border-radius: 0.375rem;
}

.permit-type-checkboxes .form-check-inline[b-esoiin3lz3] {
    margin-right: 1rem;
    margin-bottom: 0.5rem;
}

.matching-results[b-esoiin3lz3] {
    background: #f8f9fa;
    padding: 0.75rem;
    border-radius: 0.375rem;
}

.raw-json-content[b-esoiin3lz3] {
    background: #f8f9fa;
    padding: 0.75rem;
    border-radius: 0.25rem;
    white-space: pre-wrap;
    word-break: break-word;
}

.confidence-badge[b-esoiin3lz3] {
    font-size: 0.7rem;
    padding: 0.15rem 0.35rem;
    border-radius: 0.25rem;
}

.confidence-badge.low[b-esoiin3lz3] {
    background: #fff3cd;
    color: #856404;
}
/* /Pages/Compliance/PermitsMain.razor.rz.scp.css */
/* Permit-specific styles (shared layout in app.css via .compliance-page) */

.view-toggle[b-jtho1kdv5s] {
    display: flex;
    gap: 0.25rem;
    background: #f0f0f0;
    padding: 0.2rem;
    border-radius: 6px;
}

.view-toggle .btn[b-jtho1kdv5s] {
    border-radius: 4px;
    font-size: 0.8rem;
    padding: 0.3rem 0.75rem;
}

/* Permit Grid */
.permit-grid[b-jtho1kdv5s] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1rem;
}

.permit-card[b-jtho1kdv5s] {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    transition: box-shadow 0.2s, transform 0.2s;
}

.permit-card:hover[b-jtho1kdv5s] {
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    transform: translateY(-2px);
}

.permit-card-header[b-jtho1kdv5s] {
    padding: 0.6rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-bottom: 1px solid #e9ecef;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.permit-type-badge[b-jtho1kdv5s] {
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.2rem 0.5rem;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.badge-ttb[b-jtho1kdv5s] {
    background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
    color: #fff;
}

.badge-abc[b-jtho1kdv5s] {
    background: linear-gradient(135deg, #6f42c1 0%, #9b59b6 100%);
    color: #fff;
}

.badge-cdfa[b-jtho1kdv5s] {
    background: linear-gradient(135deg, #198754 0%, #2ecc71 100%);
    color: #fff;
}

.badge-fda[b-jtho1kdv5s] {
    background: linear-gradient(135deg, #dc3545 0%, #e74c3c 100%);
    color: #fff;
}

.badge-other[b-jtho1kdv5s] {
    background: #6c757d;
    color: #fff;
}

.permit-card-body[b-jtho1kdv5s] {
    padding: 1rem;
}

.permit-number[b-jtho1kdv5s] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #212529;
}

.registry-number[b-jtho1kdv5s] {
    font-family: 'Courier New', monospace;
    font-size: 0.8rem;
    color: #6c757d;
}

.permit-holder[b-jtho1kdv5s] {
    color: #495057;
    font-size: 0.85rem;
}

.trade-names[b-jtho1kdv5s] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.trade-name-tag[b-jtho1kdv5s] {
    background: #e8f5f3;
    color: #0d7a6e;
    padding: 0.15rem 0.5rem;
    border-radius: 3px;
    font-size: 0.72rem;
    font-weight: 500;
}

.trade-name-more[b-jtho1kdv5s] {
    font-size: 0.72rem;
    color: #6c757d;
    font-style: italic;
}

.permit-card-footer[b-jtho1kdv5s] {
    padding: 0.6rem 1rem;
    background: #fafafa;
    border-top: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    font-size: 0.78rem;
    color: #6c757d;
}

.date-info[b-jtho1kdv5s], .expiry-info[b-jtho1kdv5s] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}
/* /Pages/Compliance/RecordDiffPanel.razor.rz.scp.css */
.record-diff-panel[b-z1q1b0ybtl] {
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    background: var(--bs-body-bg);
    margin-top: 1rem;
}

.diff-header[b-z1q1b0ybtl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--bs-border-color);
    background: var(--bs-tertiary-bg);
    border-radius: 0.5rem 0.5rem 0 0;
}

.diff-body[b-z1q1b0ybtl] {
    padding: 0.5rem 0;
}

.diff-row[b-z1q1b0ybtl] {
    display: flex;
    align-items: center;
    padding: 0.5rem 1rem;
    border-bottom: 1px solid var(--bs-border-color-translucent);
    transition: background-color 0.15s ease;
}

.diff-row:last-child[b-z1q1b0ybtl] {
    border-bottom: none;
}

.diff-checkbox[b-z1q1b0ybtl] {
    width: 28px;
    flex-shrink: 0;
}

.diff-checkbox .form-check-input[b-z1q1b0ybtl] {
    cursor: pointer;
}

.diff-label[b-z1q1b0ybtl] {
    width: 120px;
    flex-shrink: 0;
    font-size: 0.85rem;
    color: var(--bs-secondary-color);
}

.diff-label label[b-z1q1b0ybtl] {
    cursor: pointer;
    margin: 0;
}

.diff-values[b-z1q1b0ybtl] {
    flex: 1;
    font-size: 0.9rem;
}

.diff-match[b-z1q1b0ybtl] {
    color: var(--bs-success);
}

.diff-missing .doc-value[b-z1q1b0ybtl],
.diff-differs .doc-value[b-z1q1b0ybtl] {
    color: var(--bs-primary);
}

.diff-differs .db-value[b-z1q1b0ybtl] {
    text-decoration: line-through;
    opacity: 0.7;
}

.arrow[b-z1q1b0ybtl] {
    margin: 0 0.5rem;
    color: var(--bs-secondary-color);
}

/* Row status backgrounds */
.status-match[b-z1q1b0ybtl] {
    background: rgba(var(--bs-success-rgb), 0.05);
}

.status-differs[b-z1q1b0ybtl] {
    background: rgba(var(--bs-warning-rgb), 0.08);
}

.status-missing[b-z1q1b0ybtl] {
    background: rgba(var(--bs-info-rgb), 0.08);
}

.status-selected[b-z1q1b0ybtl] {
    background: rgba(var(--bs-primary-rgb), 0.12);
    border-left: 3px solid var(--bs-primary);
}

.diff-footer[b-z1q1b0ybtl] {
    padding: 1rem;
    border-top: 1px solid var(--bs-border-color);
    background: var(--bs-tertiary-bg);
    border-radius: 0 0 0.5rem 0.5rem;
}
/* /Pages/Components/CollapsibleSection.razor.rz.scp.css */
.collapsible-section[b-103wvdpt92] {
  border: 1px solid #dee2e6;
  border-radius: 6px;
  margin-bottom: 0.5rem;
  background: #fff;
}

.collapsible-header[b-103wvdpt92] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem 0.75rem;
  cursor: pointer;
  background: #f8f9fa;
  border-radius: 5px 5px 0 0;
  user-select: none;
}

.collapsible-section.collapsed .collapsible-header[b-103wvdpt92] {
  border-radius: 5px;
}

.collapsible-header:hover[b-103wvdpt92] {
  background: #e9ecef;
}

.collapsible-title[b-103wvdpt92] {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 600;
  font-size: 0.9rem;
}

.collapsible-title i[b-103wvdpt92] {
  font-size: 0.75rem;
  color: #6c757d;
  transition: transform 0.2s ease;
}

.collapsible-badge[b-103wvdpt92] {
  background: #0d6efd;
  color: white;
  font-size: 0.7rem;
  padding: 0.15rem 0.4rem;
  border-radius: 10px;
  font-weight: normal;
}

.collapsible-header-content[b-103wvdpt92] {
  font-size: 0.85rem;
  color: #6c757d;
}

.collapsible-body[b-103wvdpt92] {
  padding: 0.75rem;
  border-top: 1px solid #dee2e6;
}
/* /Pages/Contacts/AddBusinessPanel.razor.rz.scp.css */
/* ── Panel layout ── */
.panel-content-wrapper[b-74q4etakxp] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.panel-body[b-74q4etakxp] {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 1rem;
}

.panel-footer[b-74q4etakxp] {
    flex-shrink: 0;
    border-top: 1px solid #dee2e6;
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    padding-bottom: calc(0.75rem + env(safe-area-inset-bottom));
}

/* ── Form sections ── */
.form-section[b-74q4etakxp] {
    margin-bottom: 0.5rem;
}

.section-divider[b-74q4etakxp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 0.85rem;
    color: #495057;
    padding: 0.5rem 0;
    border-bottom: 1px solid #e9ecef;
    margin-bottom: 0.5rem;
}

.section-divider.clickable[b-74q4etakxp] {
    cursor: pointer;
    user-select: none;
}

.section-divider.clickable:hover[b-74q4etakxp] {
    color: #0d6efd;
}

/* ── Touch targets (iOS) ── */
.form-control[b-74q4etakxp],
.form-select[b-74q4etakxp],
.btn[b-74q4etakxp] {
    min-height: 44px;
}

.form-control-sm[b-74q4etakxp] {
    min-height: 38px;
}

/* ── Mobile ── */
@media (max-width: 576px) {
    .panel-body[b-74q4etakxp] {
        padding: 0.75rem;
    }

    .row > .col-6[b-74q4etakxp] {
        flex: 0 0 100%;
        max-width: 100%;
    }
}
/* /Pages/Contacts/AddPersonPanel.razor.rz.scp.css */
.panel-content-wrapper[b-82g4fidc21] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.panel-body[b-82g4fidc21] {
    flex: 1;
    overflow-y: auto;
    padding: 0 1rem;
}

.panel-footer[b-82g4fidc21] {
    padding: 0.75rem 1rem;
    border-top: 1px solid #e9ecef;
    background: #fff;
}

.form-section[b-82g4fidc21] {
    padding: 0.75rem 0;
    border-bottom: 1px solid #f0f0f0;
}

    .form-section:last-child[b-82g4fidc21] {
        border-bottom: none;
    }

.list-item-row[b-82g4fidc21] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.type-select[b-82g4fidc21] {
    width: 100px;
    flex-shrink: 0;
}

.role-input[b-82g4fidc21] {
    width: 100px;
    flex-shrink: 0;
}

.note-input[b-82g4fidc21] {
    width: 120px;
    flex-shrink: 0;
}

.address-block-form[b-82g4fidc21] {
    padding: 0.5rem;
    margin-bottom: 0.5rem;
    background: #f8f9fa;
    border-radius: 6px;
}
/* /Pages/Contacts/BusinessCleanup.razor.rz.scp.css */
.cleanup-header[b-zrr8k445iw] {
    position: sticky;
    top: 0;
    background: white;
    z-index: 10;
    padding: 1rem 0;
    border-bottom: 1px solid #dee2e6;
    margin-bottom: 1rem;
}

.cleanup-controls[b-zrr8k445iw] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 0.75rem;
}

.search-input[b-zrr8k445iw] {
    max-width: 350px;
}

.inactive-toggle[b-zrr8k445iw] {
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.stats-badges[b-zrr8k445iw] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.bond-group[b-zrr8k445iw] {
    border: 1px solid #dee2e6;
    border-radius: 6px;
    margin-bottom: 0.5rem;
}

.bond-group-header[b-zrr8k445iw] {
    background: #f8f9fa;
    padding: 0.6rem 1rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    user-select: none;
}

.bond-group-header:hover[b-zrr8k445iw] {
    background: #e9ecef;
}

.expand-icon[b-zrr8k445iw] {
    font-family: monospace;
    font-weight: bold;
    width: 1.2rem;
    text-align: center;
}

.header-legal-entity[b-zrr8k445iw] {
    color: #4b5563;
    font-style: italic;
    font-size: 0.9rem;
    margin-left: 0.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 350px;
}

.bond-group-body[b-zrr8k445iw] {
    padding: 0;
}

.business-row[b-zrr8k445iw] {
    padding: 0.5rem 1rem;
    border-top: 1px solid #eee;
}

.bond-holder-row[b-zrr8k445iw] {
    background: #f0fdf4;
}

.child-row[b-zrr8k445iw] {
    background: #ffffff;
}

.unmatched-row[b-zrr8k445iw] {
    background: #fffbeb;
}

.inactive-row[b-zrr8k445iw] {
    opacity: 0.55;
}

.inactive-name[b-zrr8k445iw] {
    text-decoration: line-through;
}

.row-header[b-zrr8k445iw] {
    display: flex;
    align-items: center;
    margin-bottom: 0.3rem;
}

.row-fields[b-zrr8k445iw] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.3rem;
    font-size: 0.9rem;
}

.field-label[b-zrr8k445iw] {
    font-weight: 600;
    color: #6b7280;
}

.indent[b-zrr8k445iw] {
    width: 1.5rem;
    display: inline-block;
}

.business-link[b-zrr8k445iw] {
    color: #2563eb;
    text-decoration: none;
    font-weight: 500;
}

.business-link:hover[b-zrr8k445iw] {
    text-decoration: underline;
}

.inline-edit[b-zrr8k445iw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.inline-edit label[b-zrr8k445iw] {
    font-weight: 600;
    margin: 0;
    font-size: 0.85rem;
}

.inline-edit .form-control-sm[b-zrr8k445iw] {
    max-width: 250px;
}

.inline-edit .bond-number-input[b-zrr8k445iw] {
    max-width: 120px;
}

/* Add Child picker row */
.add-child-row[b-zrr8k445iw] {
    display: flex;
    align-items: center;
    padding: 0.5rem 0;
    margin-top: 0.4rem;
    border-top: 1px dashed #c6efce;
}

.add-child-picker[b-zrr8k445iw] {
    flex: 1;
    max-width: 400px;
}

/* Confirmation overlay */
.confirmation-overlay[b-zrr8k445iw] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 1050;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 2rem;
}

.confirmation-banner[b-zrr8k445iw] {
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    max-width: 600px;
    width: 100%;
}

.confirmation-text[b-zrr8k445iw] {
    flex: 1;
    font-size: 0.95rem;
}

.confirmation-desc[b-zrr8k445iw] {
    display: block;
    font-size: 0.85rem;
    color: #6b7280;
    margin-top: 0.2rem;
}

.confirmation-buttons[b-zrr8k445iw] {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
}
/* /Pages/Contacts/BusinessDetailPanel.razor.rz.scp.css */
.detail-panel[b-up7jahhu00] {
    padding: 0 1rem 1rem;
}

.detail-actions[b-up7jahhu00] {
    display: flex;
    justify-content: flex-end;
    padding: 0.5rem 0;
    margin-bottom: 0.25rem;
}

.detail-section[b-up7jahhu00] {
    padding: 0.75rem 0;
    border-bottom: 1px solid #e9ecef;
}

    .detail-section:last-child[b-up7jahhu00] {
        border-bottom: none;
    }

.section-title[b-up7jahhu00] {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6c757d;
    margin-bottom: 0.5rem;
}

.info-grid[b-up7jahhu00] {
    display: grid;
    gap: 0.35rem;
}

.info-row[b-up7jahhu00] {
    display: flex;
    gap: 0.75rem;
}

.info-label[b-up7jahhu00] {
    font-weight: 600;
    font-size: 0.85rem;
    min-width: 100px;
    color: #495057;
}

.info-value[b-up7jahhu00] {
    font-size: 0.85rem;
}

.badge-group[b-up7jahhu00] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.contact-list[b-up7jahhu00] {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .contact-list li[b-up7jahhu00] {
        padding: 0.2rem 0;
        font-size: 0.85rem;
    }

.address-block[b-up7jahhu00] {
    margin-bottom: 0.5rem;
    font-size: 0.85rem;
}

    .address-block:last-child[b-up7jahhu00] {
        margin-bottom: 0;
    }

.associate-row[b-up7jahhu00] {
    cursor: pointer;
}

    .associate-row:hover[b-up7jahhu00] {
        background-color: #f8f9fa;
    }

[b-up7jahhu00] .table th {
    font-size: 0.75rem;
    text-transform: uppercase;
    color: #6c757d;
    border-bottom-width: 1px;
}

[b-up7jahhu00] .table td {
    vertical-align: top;
    font-size: 0.85rem;
}
/* /Pages/Contacts/contactProfileModal.razor.rz.scp.css */

.cards[b-46gijjn2c5] {
  display: grid;
  justify-content: space-between;
  flex-wrap: wrap;
  grid-template-columns: 1fr 1fr 1fr;
}

.cards2[b-46gijjn2c5] {
  display: grid;
  justify-content: space-between;
  flex-wrap: wrap;
  grid-template-columns: 1fr 2fr;
}

.card[b-46gijjn2c5] {
  grid-template-columns: 1fr 1fr 1fr;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

  .card:hover[b-46gijjn2c5] {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
  }

.headingRow[b-46gijjn2c5] {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 5px;
  justify-content: center;
}


.img[b-46gijjn2c5] {
  width: 100%;
}


/* /Pages/Contacts/ContactsBusinessMain.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════════════
   ContactsBusinessMain.razor.css
   
   LAYOUT: Pattern A — 95vh viewport lock (see docs/LAYOUT-PATTERNS.md)
   ┌──────────────────────────────────────────┐
   │ .cb-page        95vh, flex-col, no scroll│
   │ ┌──────────────────────────────────────┐ │
   │ │ .cb-header    flex-shrink:0          │ │
   │ └──────────────────────────────────────┘ │
   │ ┌──────────────────────────────────────┐ │
   │ │ .cb-grid-area flex:1, overflow-y:auto│ │
   │ │  └ NwcDataGrid (scrolls here)       │ │
   │ └──────────────────────────────────────┘ │
   └──────────────────────────────────────────┘
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Page root ── */
.cb-page[b-85vda6f0xi] {
    display: flex;
    flex-direction: column;
    height: 95vh;
    overflow: hidden;
}

/* ── Header ── */
.cb-header[b-85vda6f0xi] {
    flex-shrink: 0;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-evenly;
    align-items: center;
    background-color: white;
    padding-bottom: 0.5rem;
}

/* ── Grid area ── */
.cb-grid-area[b-85vda6f0xi] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    border-radius: 6px;
}

/* ── NwcDataGrid height propagation (see LAYOUT-PATTERNS.md) ──
   Scroll stays on .cb-grid-area. The datagrid and table-desktop
   just fill 100% and let their parent handle the scroll.
   This keeps Virtualize happy — it finds .cb-grid-area as the
   scroll container and calculates viewport position correctly. */
[b-85vda6f0xi] .nwc-datagrid {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

[b-85vda6f0xi] .table-desktop {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: auto;
}
/* /Pages/Contacts/ContactsMain.razor.rz.scp.css */
/* ContactsMain scoped styles — most styling handled by NwcDataGrid */
/* /Pages/Contacts/CreateNewTeamModal.razor.rz.scp.css */

.buttonRow[b-n4ufxfzwea] {
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
   justify-content: flex-end;
   gap: 5px;
   margin: 5px;
   padding: .5rem;
}

.team-list[b-n4ufxfzwea] {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 10px; /* Adjust the gap between items as needed */
   max-height: 200px;
   overflow-y: auto;
   list-style-type: none; /* Remove bullets from the list */
   padding: 0; /* Remove the default padding from the list */
}
   .team-list li[b-n4ufxfzwea] {
      /* Add any desired styles for the list items here */
   }
   .team-list-main[b-n4ufxfzwea]{
      border-bottom:solid 1px black;
   }
/* /Pages/Contacts/PersonDetailPanel.razor.rz.scp.css */
.detail-panel[b-zi7t6kr4fk] {
    padding: 0 1rem 1rem;
}

.detail-actions[b-zi7t6kr4fk] {
    display: flex;
    justify-content: flex-end;
    padding: 0.5rem 0;
    margin-bottom: 0.25rem;
}

.detail-section[b-zi7t6kr4fk] {
    padding: 0.75rem 0;
    border-bottom: 1px solid #e9ecef;
}

    .detail-section:last-child[b-zi7t6kr4fk] {
        border-bottom: none;
    }

.section-title[b-zi7t6kr4fk] {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6c757d;
    margin-bottom: 0.5rem;
}

.contact-list[b-zi7t6kr4fk] {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .contact-list li[b-zi7t6kr4fk] {
        padding: 0.2rem 0;
        font-size: 0.85rem;
    }

.affiliation-list[b-zi7t6kr4fk] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.affiliation-row[b-zi7t6kr4fk] {
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.15s;
}

    .affiliation-row:hover[b-zi7t6kr4fk] {
        background-color: #f8f9fa;
    }

.address-block[b-zi7t6kr4fk] {
    margin-bottom: 0.5rem;
    font-size: 0.85rem;
}

    .address-block:last-child[b-zi7t6kr4fk] {
        margin-bottom: 0;
    }
/* /Pages/Contracts/ContractMain.razor.rz.scp.css */
.wrapper[b-clbp2w3p2c] {
    display: flex;
    flex-flow: row wrap;
    font-weight: bold;
    text-align: center;
    height: 98vh;
    margin-top: 5px;
    overflow: hidden;
    border-radius: 10px 10px 10px 10px;
}

    .wrapper > *[b-clbp2w3p2c] {
        padding: 10px;
        flex: 1 100%;
    }


.header[b-clbp2w3p2c] {
    background: linear-gradient(135deg, #E0F2FF 0%, #B0D1FF 60%, #B0C4DE 100%);
    color: black; 
    padding: 10px 20px;
    border-bottom: 1px solid #B0B0B0;
    border-radius: 10px 10px 10px 10px;
    height: 6vh;
}
.headerRow[b-clbp2w3p2c] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items:center;
}
    .headerRow > *[b-clbp2w3p2c] {
        display: flex;
        align-items: center;
        justify-content: center;
    }

.footer[b-clbp2w3p2c] {
    max-width: 100vw;
    height: 12vh;
    background: linear-gradient(135deg, #E0F2FF 0%, #B0D1FF 60%, #B0C4DE 100%);
    color: #333333; /* Dark text for readability */
    padding: 10px 10px;
    border: 1px solid #B0B0B0; /* Nickel grey border */
    border-radius: 10px 10px 10px 10px; /* Rounded corners at the bottom */
    overflow: hidden; /* Hide any content that overflows the container */
}

.card-containerFooter[b-clbp2w3p2c] {
    display: flex;
    overflow-x: auto; /* Allow horizontal scrolling */
    gap: 10px; /* Adjust the spacing between cards */
}

    /*.card-containerFooter::-webkit-scrollbar {
        display: block;*/ /* Display the scrollbar in WebKit browsers */
    /*}*/

    .card-containerFooter[b-clbp2w3p2c]::-webkit-scrollbar {
        height: 10px; /* Set the height of the scrollbar */
    }

    .card-containerFooter[b-clbp2w3p2c]::-webkit-scrollbar-track {
        box-shadow: inset 0 0 5px grey; /* Add some shadow for a 3D effect */
        border-radius: 10px; /* Rounded corners */
    }

    .card-containerFooter[b-clbp2w3p2c]::-webkit-scrollbar-thumb {
        background: #B0B0B0; /* Nickel grey color for the scrollbar thumb */
        border-radius: 10px; /* Rounded corners */
    }


.card-container[b-clbp2w3p2c] {
    display: flex;
    overflow-x: scroll; /* Allow horizontal scrolling */
}


.cards[b-clbp2w3p2c] {
    display: flex;
    gap: 10px; /* Adjust the spacing between cards */
}

.card[b-clbp2w3p2c] {
    flex: 0 0 auto;
    width: calc(10vw - 20px); /* Adjust the width proportionally */
    height: calc(10vh - 20px); /* Adjust the height proportionally */
    background-color: white;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden; /* Hide any content that overflows the card */
    scroll-snap-align: start;
}

    .card:hover[b-clbp2w3p2c] {
        transform: scale(1.1);
        cursor: pointer;
        z-index: 1; /* Ensure the card appears on top during hover */
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
        transition: transform 0.2s, box-shadow 0.2s; /* Smooth transition */
        border-radius: 10px;
        overflow: hidden; /* Hide any content that overflows the card */
    }

    .card p[b-clbp2w3p2c] {
        font-weight: bold;
        text-align: center; /* Center text horizontally within the card */
        margin: 0;
    }

.primary[b-clbp2w3p2c] {
    text-align: left;
    background: linear-gradient(135deg, #E0F2FF 0%, #B0D1FF 60%, #B0C4DE 100%);
    overflow-y: auto;
    flex-grow: 1;
    height: 80vh;
    border: 1px solid #B0B0B0; /* Nickel grey border */
    border-radius: 10px;
}

.aside-1[b-clbp2w3p2c] {
    background: linear-gradient(135deg, #E0F2FF 0%, #B0D1FF 60%, #B0C4DE 100%);
    /*background: #f4f4f4;*/ /* Light grey background */
    overflow-y: auto;
    height: 80vh;
    border: 1px solid #B0B0B0; /* Nickel grey border */
    border-radius: 10px;
}

.aside-2[b-clbp2w3p2c] {
    background: linear-gradient(135deg, #E0F2FF 0%, #B0D1FF 60%, #B0C4DE 100%);
    /*background: #f4f4f4;*/ /* Light grey background */
    overflow-y: auto;
    height: 80vh;
    border: 1px solid #B0B0B0; /* Nickel grey border */
    border-radius: 10px;
}

#myList[b-clbp2w3p2c] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.custom-link[b-clbp2w3p2c] {
    color: inherit; /* Use the same color as the parent's font color */
    text-decoration: underline; /* Add underline to simulate a link */
    cursor: pointer; /* Change cursor to pointer on hover */
    transition: color 0.2s; /* Smooth transition for color change */
    text-align: left; /* Align text to the left */
}

    .custom-link:hover[b-clbp2w3p2c] {
        color: blue; /* Change color on hover */
    }

.grid-card-container[b-clbp2w3p2c] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.grid-card[b-clbp2w3p2c] {
    padding:3px;
    width: 350px;
    background-color: white;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: transform 0.3s, box-shadow 0.3s;
}

.grid-row[b-clbp2w3p2c] {
    display: flex; /* Use flex layout for horizontal alignment */
    gap: 5px; /* Adjust gap between items in the row */
    padding: 1px;
}

.spaceBetween[b-clbp2w3p2c] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}
.grid-item[b-clbp2w3p2c] {
    width: 25%;
    text-align: center; /* Optional: to center the text within each div */
}

.grid-card p[b-clbp2w3p2c] {
    font-weight: bold;
    text-align: center;
    margin: 0;
}

.grid-card:hover[b-clbp2w3p2c] {
    /*transform: scale(1.1);*/
    cursor: pointer;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.columnQty[b-clbp2w3p2c] {
    display: flex;
    flex-direction: column; /* Organize the content vertically */
    gap: 2px; /* Adjust the gap between rows */
    align-items: flex-start; /* Align items to the start */
}



@media all and (min-width: 600px) {
    .aside[b-clbp2w3p2c] {
        flex: 1 0 0;
    }
}

@media all and (min-width: 800px) {
    .primary[b-clbp2w3p2c] {
        flex: 3 0px;
    }

    .aside-1[b-clbp2w3p2c] {
        order: 1;
    }

    .primary[b-clbp2w3p2c] {
        order: 2;
    }

    .aside-2[b-clbp2w3p2c] {
        order: 3;
    }

    .footer[b-clbp2w3p2c] {
        order: 4;
    }
}

*[b-clbp2w3p2c] {
    box-sizing: border-box;
}
.home-button[b-clbp2w3p2c] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px; /* Adjust as needed */
    border: none;
    background: none;
    cursor: pointer;
}

.home-icon[b-clbp2w3p2c] {
    color: blue; /* Set the icon color to blue */
    font-size: 24px; /* Adjust the size as needed */
    overflow: hidden; /* Prevent overflow */
}
/* /Pages/Contracts/ContractsModal.razor.rz.scp.css */
.buttonRow[b-m8ltfwepr4] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 10px;
}
.headerRow[b-m8ltfwepr4] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    margin-top: 10px;
    gap: 10px;
}
.headerRowSpaceBetween[b-m8ltfwepr4] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content:space-between;
    margin-top: 10px;
    gap: 10px;
}
.headerColumn[b-m8ltfwepr4] {
    flex-basis: 250px; /* Adjust the value as per your requirement */
}
.headerColumnAuto[b-m8ltfwepr4] {
  flex-basis:auto;
}
    .headerRow label[b-m8ltfwepr4] {
        font-weight: bold;
        white-space: nowrap;
    }

    .headerRow button[b-m8ltfwepr4] {
        white-space: nowrap;
    }
.upload-button[b-m8ltfwepr4] {
    position: relative;
    display: inline-block;
}
.btn-transparent[b-m8ltfwepr4] {
    background-color: transparent;
    border: none;
}
    /* Hide the default file input and show the styled button */
    .upload-button input[type="file"][b-m8ltfwepr4] {
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        width: 100%;
        height: 100%;
        cursor: pointer;
    }

    /* Add additional styling to the label to match the "btn btn-primary" style */
    .upload-button label[b-m8ltfwepr4] {
        font-weight: bold;
        padding: 0.5rem 1rem;
        border: 1px solid #007bff;
        color: #ffffff;
        background-color: #007bff;
        border-radius: 0.25rem;
        cursor: pointer;
    }

        /* Style the label when it's being clicked or focused */
        .upload-button label:focus[b-m8ltfwepr4],
        .upload-button label:hover[b-m8ltfwepr4] {
            outline: none;
            background-color: #0056b3;
        }
        .outlineBox[b-m8ltfwepr4]{
border: 1px solid #007bff;
            border-radius: 0.25rem;
            padding: 0.5rem 1rem;
            max-height: 300px;
            min-height:200px;
            overflow-y:auto;
        }
/* /Pages/Contracts/PermitsModal.razor.rz.scp.css */
.grid-columns[b-yi76s9a4gv] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.grid-rows[b-yi76s9a4gv] {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: flex-end;
}

.main-container[b-yi76s9a4gv] {
    display: grid;
    grid-template-rows: 12fr 1fr;
    grid-row-gap: 2rem; /* Will be used instead by browsers that do not support `row-gap` */
    row-gap: 2rem;
    overflow-y: auto;
}


/* /Pages/EmailFunctions/EmailLabelComponent.razor.rz.scp.css */
.underline-solid-grey[b-unkwyu2juv] {
   border-bottom: 1px solid grey;
}
h4[b-unkwyu2juv] {
   border-bottom: 1px solid grey;
}
/* /Pages/EmailFunctions/EmailShortForm.razor.rz.scp.css */
.main-container[b-5cqggde0xu]{
  max-height: 70vh;
  overflow-y: auto;
}
.button-row[b-5cqggde0xu]{
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: 10px;
}
.form-group[b-5cqggde0xu] {
  display: flex;
  align-items: center;
}

  .form-group label[b-5cqggde0xu] {
    margin-right: 10px; /* Adjust this value as needed for spacing */
  }
.circle-btn[b-5cqggde0xu] {
  width: 40px; /* Adjust the size as needed */
  height: 40px; /* Adjust the size as needed */
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.btn-primary[b-5cqggde0xu] {
  background-color: #007bff; /* Adjust the color as needed */
  color: white;
}

.btn-secondary[b-5cqggde0xu] {
  background-color: #dc3545; /* Adjust the color as needed */
  color: white;
}

.circle-btn span[b-5cqggde0xu] {
  font-size: 24px; /* Adjust the size of the sign as needed */
}
table[b-5cqggde0xu] {
  width: 100%; /* Ensure the table spans the entire width of the container */
  border-collapse: collapse; /* Optional: To remove any spacing between table cells */
}
/* /Pages/Equipment/EquipmentMain.razor.rz.scp.css */
.cards[b-u10lvqyb5u] {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.card[b-u10lvqyb5u] {
  flex: 0 1 24%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

  .card:hover[b-u10lvqyb5u] {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
  }

.headingRow[b-u10lvqyb5u] {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 5px;
  justify-content: center;
}

.container-fluid[b-u10lvqyb5u] {
  padding: 0;
  height: 95vh;
  overflow: hidden;
}

.img-fluid[b-u10lvqyb5u] {
  max-width: 100%;
  height: auto;
}
/* /Pages/Harvest/WeightTags.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════════════
   WeightTags.razor.css — Scoped styles for /harvest/weighttags
   
   LAYOUT PATTERN (matches Index 96vh, BulkMain 95vh, Equipment 95vh, etc.)
   ┌─────────────────────────────────────────────┐
   │ .wt-page          95vh, flex-col, no scroll │
   │ ┌─────────────────────────────────────────┐ │
   │ │ .wt-header      shrink-0, auto height   │ │
   │ │  ├ title + vintage selector              │ │
   │ │  ├ dashboard cards                       │ │
   │ │  ├ collapsible summaries                 │ │
   │ │  └ bulk actions bar (conditional)        │ │
   │ └─────────────────────────────────────────┘ │
   │ ┌─────────────────────────────────────────┐ │
   │ │ .wt-grid-area   flex:1, overflow-y:auto │ │
   │ │  └ NwcDataGrid (scrolls here)           │ │
   │ └─────────────────────────────────────────┘ │
   └─────────────────────────────────────────────┘
   
   WHY 95vh: MainLayout's <article class="content"> has padding-top: 1.1rem
   (site.css) and the .custom class overrides horizontal padding. The parent
   chain (main, article) has NO height constraints — height:100% won't work.
   Using 95vh directly bypasses the parent chain entirely. This is the proven
   pattern used across the codebase.
   
   AI NOTE: Do NOT use height:100% on .wt-page. The parent article/main have
   no explicit height so 100% resolves to auto. Always use vh units.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ── Page root ── */
.wt-page[b-drzvbkyyxm] {
    display: flex;
    flex-direction: column;
    height: 95vh;
    overflow: hidden;
}

/* ── Header: auto-height, never scrolls ── */
.wt-header[b-drzvbkyyxm] {
    flex-shrink: 0;
    padding-bottom: 0.25rem;
}

/* ── Grid area: fills remaining space, ONLY scrollbar on the page ── */
.wt-grid-area[b-drzvbkyyxm] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    border-radius: 6px;
}


/* ═══════════════════════════════════════════════════════════════════════════
   Header components
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Title row ── */
.wt-title-row[b-drzvbkyyxm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.wt-title[b-drzvbkyyxm] {
    margin: 0;
    font-weight: 700;
    font-size: 1.4rem;
    color: #1a1a2e;
}

.wt-vintage-select[b-drzvbkyyxm] {
    width: 120px;
    font-size: 0.875rem;
}

/* ── Dashboard cards ── */
.wt-cards[b-drzvbkyyxm] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.wt-card[b-drzvbkyyxm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.875rem;
    background: linear-gradient(135deg, #f8f9ff 0%, #f0f4ff 100%);
    border: 1px solid #e2e8f0;
    border-radius: 0.625rem;
    transition: box-shadow 0.15s;
}

.wt-card:hover[b-drzvbkyyxm] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.wt-card-icon[b-drzvbkyyxm] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 0.5rem;
    background: rgba(79, 70, 229, 0.1);
    color: #4f46e5;
    font-size: 1rem;
    flex-shrink: 0;
}

.wt-card-icon--organic[b-drzvbkyyxm] {
    background: rgba(22, 163, 74, 0.1);
    color: #16a34a;
}

.wt-card--warning[b-drzvbkyyxm] {
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    border-color: #fcd34d;
}

.wt-card-icon--warning[b-drzvbkyyxm] {
    background: rgba(217, 119, 6, 0.12);
    color: #d97706;
}

.wt-card--active[b-drzvbkyyxm] {
    outline: 2px solid #d97706;
    outline-offset: -2px;
}

.wt-card-body[b-drzvbkyyxm] {
    min-width: 0;
}

.wt-card-number[b-drzvbkyyxm] {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    color: #1e293b;
}

.wt-card-label[b-drzvbkyyxm] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
    white-space: nowrap;
}

.wt-pct-badge[b-drzvbkyyxm] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.1em 0.4em;
    border-radius: 0.25rem;
    background: rgba(22, 163, 74, 0.12);
    color: #16a34a;
    vertical-align: middle;
    text-transform: none;
    letter-spacing: 0;
}

/* ── Collapsible summaries ── */
.wt-summaries[b-drzvbkyyxm] {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 0.5rem;
}

.wt-summaries details[b-drzvbkyyxm] {
    flex: 1;
    min-width: 0;
}

.wt-summaries summary[b-drzvbkyyxm] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    cursor: pointer;
    padding: 0.25rem 0;
    user-select: none;
}

.wt-summaries summary:hover[b-drzvbkyyxm] {
    color: #1e293b;
}

.wt-summary-table[b-drzvbkyyxm] {
    font-size: 0.8rem;
    margin-top: 0.25rem;
}

.wt-summary-table thead th[b-drzvbkyyxm] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #94a3b8;
    border-bottom-width: 1px;
    font-weight: 600;
}

.wt-summary-table td[b-drzvbkyyxm] {
    padding: 0.2rem 0.5rem;
    border: none;
}

/* ── Bulk actions bar ── */
.wt-bulk-bar[b-drzvbkyyxm] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.375rem;
    padding: 0.375rem 0.625rem;
    background: #eef2ff;
    border: 1px solid #c7d2fe;
    border-radius: 0.5rem;
    margin-bottom: 0.5rem;
}


/* ═══════════════════════════════════════════════════════════════════════════
   Grid & detail panel overrides (::deep for child component styling)

   NwcDataGrid sets NO height on .nwc-datagrid or .table-desktop.
   We must propagate the height constraint from .wt-grid-area down
   through the component tree so the table scrolls inside the grid
   area instead of growing to full content height.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Force NwcDataGrid to fill its parent and scroll internally */
[b-drzvbkyyxm] .nwc-datagrid {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;  /* keep the border-radius clip, scroll happens in table-desktop */
}

[b-drzvbkyyxm] .table-desktop {
    flex: 1;
    min-height: 0;
    overflow-y: auto;   /* THIS is the actual scrollbar for the table rows */
    overflow-x: auto;
}

[b-drzvbkyyxm] tr.selected-row {
    background-color: rgba(79, 70, 229, 0.06) !important;
}

[b-drzvbkyyxm] .wt-detail {
    padding: 0.75rem;
}

[b-drzvbkyyxm] .wt-detail-section {
    margin-bottom: 1.5rem;
}

[b-drzvbkyyxm] .wt-section-title {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #4f46e5;
    border-bottom: 2px solid #e2e8f0;
    padding-bottom: 0.375rem;
    margin-bottom: 0.625rem;
}

[b-drzvbkyyxm] .wt-dl {
    display: grid;
    grid-template-columns: 7rem 1fr;
    gap: 0.3rem 0.75rem;
    margin: 0;
    font-size: 0.875rem;
}

[b-drzvbkyyxm] .wt-dl dt {
    font-weight: 600;
    color: #64748b;
    white-space: nowrap;
}

[b-drzvbkyyxm] .wt-dl dd {
    margin: 0;
    color: #1e293b;
}


/* ═══════════════════════════════════════════════════════════════════════════
   Responsive
   ═══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 900px) {
    .wt-cards[b-drzvbkyyxm] {
        grid-template-columns: repeat(2, 1fr);
    }

    .wt-summaries[b-drzvbkyyxm] {
        flex-direction: column;
        gap: 0.5rem;
    }
}

@media (max-width: 576px) {
    .wt-cards[b-drzvbkyyxm] {
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
    }

    .wt-card[b-drzvbkyyxm] {
        padding: 0.5rem 0.625rem;
    }

    .wt-card-icon[b-drzvbkyyxm] {
        width: 30px;
        height: 30px;
        font-size: 0.85rem;
    }

    .wt-card-number[b-drzvbkyyxm] {
        font-size: 1.1rem;
    }
}
/* /Pages/Home/HomeScreenSettingsModal.razor.rz.scp.css */
.home-settings-modal[b-buzs7uavv3] {
    padding: 1rem;
    max-width: 800px;
}

/* Layout Options */
.layout-options[b-buzs7uavv3] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.layout-option[b-buzs7uavv3] {
    cursor: pointer;
    padding: 0.75rem;
    border: 2px solid #dee2e6;
    border-radius: 8px;
    text-align: center;
    transition: all 0.2s ease;
    min-width: 100px;
}

.layout-option:hover[b-buzs7uavv3] {
    border-color: #0d6efd;
    background-color: #f8f9fa;
}

.layout-option.selected[b-buzs7uavv3] {
    border-color: #0d6efd;
    background-color: #e7f1ff;
}

.layout-preview[b-buzs7uavv3] {
    width: 80px;
    height: 50px;
    margin: 0 auto 0.5rem;
    display: grid;
    gap: 2px;
    background: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
}

.preview-block[b-buzs7uavv3] {
    background: #6c757d;
    border-radius: 2px;
}

/* Hero layout preview */
.hero-preview .full[b-buzs7uavv3] {
    grid-column: 1 / -1;
    grid-row: 1 / -1;
}

/* Two Image layout preview */
.two-preview[b-buzs7uavv3] {
    grid-template-columns: 3fr 1fr;
    padding: 4px;
}

.two-preview .main[b-buzs7uavv3] {
    border-radius: 2px;
}

.two-preview .circle[b-buzs7uavv3] {
    border-radius: 50%;
    align-self: center;
}

/* Three Image layout preview */
.three-preview[b-buzs7uavv3] {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 2fr 1fr;
}

.three-preview .top[b-buzs7uavv3] {
    grid-column: 1 / -1;
}

/* Four Grid layout preview */
.four-preview[b-buzs7uavv3] {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
}

.layout-name[b-buzs7uavv3] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #495057;
}

/* Image Slots */
.image-slots[b-buzs7uavv3] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.image-slot[b-buzs7uavv3] {
    position: relative;
    width: 150px;
    height: 100px;
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.image-slot:hover[b-buzs7uavv3] {
    border-color: #0d6efd;
}

.image-slot.active[b-buzs7uavv3] {
    border-color: #0d6efd;
    border-style: solid;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.25);
}

.image-slot img[b-buzs7uavv3] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.image-slot .empty-slot[b-buzs7uavv3] {
    text-align: center;
    color: #6c757d;
}

.image-slot .empty-slot i[b-buzs7uavv3] {
    font-size: 1.5rem;
    display: block;
    margin-bottom: 0.25rem;
}

.image-slot .empty-slot span[b-buzs7uavv3] {
    font-size: 0.85rem;
}

.image-slot .btn-remove[b-buzs7uavv3] {
    position: absolute;
    top: 4px;
    right: 4px;
    background: rgba(255, 255, 255, 0.9);
    border: none;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.image-slot:hover .btn-remove[b-buzs7uavv3] {
    opacity: 1;
}

.image-slot .btn-remove i[b-buzs7uavv3] {
    color: #dc3545;
    font-size: 1rem;
}

.slot-badge[b-buzs7uavv3] {
    position: absolute;
    bottom: 4px;
    left: 4px;
    background: #0d6efd;
    color: white;
    font-size: 0.7rem;
    padding: 2px 6px;
    border-radius: 4px;
}

/* Image Gallery */
.image-gallery[b-buzs7uavv3] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 1rem;
    max-height: 300px;
    overflow-y: auto;
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.gallery-item[b-buzs7uavv3] {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s ease;
    aspect-ratio: 3/2;
}

.gallery-item:hover[b-buzs7uavv3] {
    transform: scale(1.02);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.gallery-item.in-use[b-buzs7uavv3] {
    box-shadow: 0 0 0 3px #0d6efd;
}

.gallery-item img[b-buzs7uavv3] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gallery-item-overlay[b-buzs7uavv3] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0.5rem;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
    color: white;
}

.gallery-item-name[b-buzs7uavv3] {
    font-size: 0.75rem;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gallery-item .btn-delete[b-buzs7uavv3] {
    position: absolute;
    top: 4px;
    right: 4px;
    background: rgba(220, 53, 69, 0.9);
    border: none;
    border-radius: 4px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.2s ease;
    color: white;
}

.gallery-item:hover .btn-delete[b-buzs7uavv3] {
    opacity: 1;
}

/* Modal Actions */
.modal-actions[b-buzs7uavv3] {
    margin-top: 1rem;
}
/* /Pages/Index.razor.rz.scp.css */
/* Home page styles - scoped via CSS isolation */

.home-page[b-tz883k0njs] {
    padding: 0;
    height: 96vh;
    display: flex;
    flex-direction: column;
}

.home-page .row[b-tz883k0njs] {
    margin: 0;
}

.home-page .btn-row[b-tz883k0njs] {
    flex: 0 1 auto;
    margin: 10px 0;
    z-index: 1;
}

.home-page .image-row[b-tz883k0njs] {
    flex: 2;
    overflow: hidden;
    position: relative;
    min-height: 200px;
}

.home-page .img-fluid[b-tz883k0njs] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-page .forecast-row[b-tz883k0njs] {
    flex: 0 0 auto;
    overflow-y: hidden;
    background: linear-gradient(180deg, #f8f9fa 0%, #e9ecef 100%);
    border-top: 1px solid #dee2e6;
    box-shadow: 0 -2px 8px rgba(0,0,0,0.08);
}

.home-page .button-row[b-tz883k0njs] {
    text-align: center;
}

/* Settings gear button */
.home-page .settings-gear[b-tz883k0njs] {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10;
    background: rgba(255, 255, 255, 0.95);
    border: none;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 2px 12px rgba(0,0,0,0.15);
    transition: all 0.2s ease;
}

.home-page .settings-gear:hover[b-tz883k0njs] {
    background: white;
    transform: scale(1.1);
    box-shadow: 0 4px 16px rgba(0,0,0,0.2);
}

.home-page .settings-gear i[b-tz883k0njs] {
    font-size: 1.25rem;
    color: #495057;
}

/* Layout styles */
.home-layout[b-tz883k0njs] {
    width: 100%;
    height: 100%;
}

.home-layout-hero[b-tz883k0njs] {
    display: flex;
}

.home-layout-hero img[b-tz883k0njs] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0.5rem;
}

.home-layout-two[b-tz883k0njs] {
    display: grid;
    grid-template-columns: 3fr 1fr;
    gap: 1rem;
    padding: 0.5rem;
    height: 100%;
}

.home-layout-two .main-image[b-tz883k0njs] {
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

.home-layout-two .main-image img[b-tz883k0njs] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-layout-two .circle-image[b-tz883k0njs] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-layout-two .circle-image img[b-tz883k0njs] {
    width: 100%;
    max-width: 250px;
    aspect-ratio: 1;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}

.home-layout-three[b-tz883k0njs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 2fr 1fr;
    gap: 0.75rem;
    padding: 0.5rem;
    height: 100%;
}

.home-layout-three .top-image[b-tz883k0njs] {
    grid-column: 1 / -1;
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

.home-layout-three .top-image img[b-tz883k0njs],
.home-layout-three .bottom-image img[b-tz883k0njs] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-layout-three .bottom-image[b-tz883k0njs] {
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.home-layout-four[b-tz883k0njs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 0.75rem;
    padding: 0.5rem;
    height: 100%;
}

.home-layout-four .grid-image[b-tz883k0njs] {
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.home-layout-four .grid-image img[b-tz883k0njs] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.empty-placeholder[b-tz883k0njs] {
    background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6c757d;
    border-radius: 0.75rem;
    font-size: 0.9rem;
}

/* ========== MOBILE / SMALL SCREEN OPTIMIZATION ========== */
@media (max-width: 767px) {
    .home-page[b-tz883k0njs] {
        height: auto;
        min-height: 100vh;
    }

    /* Stack layout vertically on mobile */
    .home-page .image-row[b-tz883k0njs] {
        flex: none;
        height: 50vh;
        min-height: 250px;
        max-height: 400px;
    }

    .home-page .forecast-row[b-tz883k0njs] {
        flex: none;
        min-height: auto;
        padding: 0;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Settings gear - larger touch target on mobile */
    .home-page .settings-gear[b-tz883k0njs] {
        width: 48px;
        height: 48px;
        top: 12px;
        right: 12px;
    }

    .home-page .settings-gear i[b-tz883k0njs] {
        font-size: 1.4rem;
    }

    /* Two-image layout: stack on mobile */
    .home-layout-two[b-tz883k0njs] {
        grid-template-columns: 1fr;
        grid-template-rows: 1fr auto;
        gap: 0.5rem;
    }

    .home-layout-two .circle-image img[b-tz883k0njs] {
        max-width: 120px;
    }

    /* Three-image layout: single column on mobile */
    .home-layout-three[b-tz883k0njs] {
        grid-template-columns: 1fr;
        grid-template-rows: 2fr 1fr 1fr;
    }

    .home-layout-three .top-image[b-tz883k0njs] {
        grid-column: 1;
    }

    /* Four-grid layout: stays 2x2 but smaller gaps */
    .home-layout-four[b-tz883k0njs] {
        gap: 0.25rem;
        padding: 0.25rem;
    }

    .home-layout-hero img[b-tz883k0njs],
    .home-layout-two .main-image[b-tz883k0njs],
    .home-layout-three .top-image[b-tz883k0njs],
    .home-layout-three .bottom-image[b-tz883k0njs],
    .home-layout-four .grid-image[b-tz883k0njs] {
        border-radius: 0.5rem;
    }
}

/* Tablet adjustments */
@media (min-width: 768px) and (max-width: 1024px) {
    .home-page .image-row[b-tz883k0njs] {
        flex: 1.5;
    }

    .home-page .forecast-row[b-tz883k0njs] {
        flex: 0 0 auto;
    }

    .home-layout-two[b-tz883k0njs] {
        grid-template-columns: 2fr 1fr;
    }
}
/* /Pages/LabelCola/ColaLabelUploadPanel.razor.rz.scp.css */
.label-upload-panel[b-sp0hk6k5h2] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 1.5rem;
}

.panel-header[b-sp0hk6k5h2] {
    margin-bottom: 1.5rem;
}

.panel-header h5[b-sp0hk6k5h2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    color: #333;
}

.panel-header p[b-sp0hk6k5h2] {
    margin: 0;
    font-size: 0.9rem;
}

.upload-slots[b-sp0hk6k5h2] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    flex: 1;
    margin-bottom: 1rem;
}

.upload-slot[b-sp0hk6k5h2] {
    display: flex;
    flex-direction: column;
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    padding: 1rem;
    background: #f8f9fa;
    min-height: 200px;
}

.slot-header[b-sp0hk6k5h2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    font-weight: 500;
    color: #495057;
}

.slot-header i[b-sp0hk6k5h2] {
    font-size: 1.2rem;
    color: #6c757d;
}

.slot-content[b-sp0hk6k5h2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
}

.image-preview-container[b-sp0hk6k5h2] {
    position: relative;
    width: 100%;
    max-width: 200px;
}

.preview-image[b-sp0hk6k5h2] {
    width: 100%;
    height: auto;
    max-height: 180px;
    object-fit: contain;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.remove-btn[b-sp0hk6k5h2] {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 28px;
    height: 28px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: white;
}

.upload-status[b-sp0hk6k5h2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: #d4edda;
    border-radius: 6px;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

.panel-footer[b-sp0hk6k5h2] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #dee2e6;
}

.panel-footer .btn[b-sp0hk6k5h2] {
    min-width: 140px;
}

/* Mobile styles */
@media (max-width: 576px) {
    .label-upload-panel[b-sp0hk6k5h2] {
        padding: 1rem;
    }

    .upload-slots[b-sp0hk6k5h2] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .upload-slot[b-sp0hk6k5h2] {
        min-height: 150px;
    }

    .panel-footer[b-sp0hk6k5h2] {
        flex-direction: column-reverse;
    }

    .panel-footer .btn[b-sp0hk6k5h2] {
        width: 100%;
        min-height: 44px; /* iOS touch target */
        font-size: 16px; /* Prevent iOS zoom */
    }
}
/* /Pages/LabelCola/ColaMain.razor.rz.scp.css */
.page-container[b-e8dfwpi8zi] {
    padding: 1rem;
    max-width: 1600px;
    margin: 0 auto;
}

/* Page Tabs */
.page-tabs[b-e8dfwpi8zi] {
    display: flex;
    gap: 0;
    margin-bottom: 1rem;
    border-bottom: 2px solid #e9ecef;
}

.page-tabs .tab[b-e8dfwpi8zi] {
    padding: 0.6rem 1.5rem;
    text-decoration: none;
    color: #6c757d;
    font-weight: 500;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all 0.2s;
}

.page-tabs .tab:hover[b-e8dfwpi8zi] {
    color: #11998e;
    background: #f8f9fa;
}

.page-tabs .tab.active[b-e8dfwpi8zi] {
    color: #11998e;
    border-bottom-color: #11998e;
    font-weight: 600;
}

/* Sticky Header - fixed at top while scrolling (non-mobile) */
.sticky-header[b-e8dfwpi8zi] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: white;
    padding-bottom: 1rem;
    margin: -1rem -1rem 1rem -1rem;
    padding: 1rem 1rem 1rem 1rem;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.page-header[b-e8dfwpi8zi] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.page-header h2[b-e8dfwpi8zi] {
    margin: 0;
    color: #333;
    min-width: 80px;
}

/* View Mode Toggle */
.view-toggle[b-e8dfwpi8zi] {
    display: flex;
    gap: 0.25rem;
    background: #f0f0f0;
    padding: 0.2rem;
    border-radius: 6px;
}

.view-toggle .btn[b-e8dfwpi8zi] {
    font-size: 0.8rem;
    padding: 0.3rem 0.75rem;
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.view-toggle .btn i[b-e8dfwpi8zi] {
    font-size: 0.9rem;
}

.expand-controls[b-e8dfwpi8zi] {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
}

.expand-controls .btn[b-e8dfwpi8zi] {
    font-size: 0.8rem;
    padding: 0.25rem 0.6rem;
}

.expand-controls .btn span[b-e8dfwpi8zi] {
    font-size: 0.7rem;
    margin-right: 0.25rem;
}

.loading-indicator[b-e8dfwpi8zi] {
    color: #6c757d;
    font-size: 0.875rem;
    animation: pulse-b-e8dfwpi8zi 1.5s infinite;
}

@keyframes pulse-b-e8dfwpi8zi {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.content-area[b-e8dfwpi8zi] {
    padding-top: 0.5rem;
}

/* Client Group */
.client-group[b-e8dfwpi8zi] {
    margin-bottom: 2rem;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
    overflow: hidden;
}

.client-header[b-e8dfwpi8zi] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
    color: white;
    cursor: pointer;
    user-select: none;
    transition: filter 0.2s;
}

.client-header:hover[b-e8dfwpi8zi] {
    filter: brightness(1.1);
}

.client-header.expanded[b-e8dfwpi8zi] {
    border-bottom: 1px solid rgba(255,255,255,0.2);
}

.expand-icon[b-e8dfwpi8zi] {
    font-size: 0.75rem;
    width: 1rem;
    text-align: center;
    transition: transform 0.2s;
}

.client-header h4[b-e8dfwpi8zi] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.client-code[b-e8dfwpi8zi] {
    background: rgba(255,255,255,0.25);
    padding: 0.25rem 0.6rem;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.client-dba[b-e8dfwpi8zi] {
    font-size: 0.8rem;
    opacity: 0.85;
    font-style: italic;
}

.client-count[b-e8dfwpi8zi] {
    margin-left: auto;
    font-size: 0.85rem;
    opacity: 0.9;
}

/* Card Grid Layout */
.card-grid[b-e8dfwpi8zi] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
    padding: 1rem;
}

/* Recent view - flat grid outside of client groups */
.card-grid.recent-view[b-e8dfwpi8zi] {
    padding: 0;
}

/* Card Styles */
.card[b-e8dfwpi8zi] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    overflow: hidden;
    transition: box-shadow 0.2s, transform 0.2s;
    display: flex;
    flex-direction: column;
    border: 1px solid #eee;
}

.card:hover[b-e8dfwpi8zi] {
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    transform: translateY(-2px);
}

/* Card Images */
.card-images[b-e8dfwpi8zi] {
    background: #f8f9fa;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 120px;
    gap: 2px;
}

.card-image[b-e8dfwpi8zi] {
    flex: 1;
    width: 50%;
    height: 120px;
    object-fit: contain;
    transition: transform 0.2s;
    background: #f8f9fa;
}

.card-image.clickable[b-e8dfwpi8zi] {
    cursor: pointer;
}

.card-image.clickable:hover[b-e8dfwpi8zi] {
    transform: scale(1.05);
    opacity: 0.9;
}

.card-image:only-child[b-e8dfwpi8zi] {
    width: 100%;
}

.no-image[b-e8dfwpi8zi] {
    color: #999;
    font-size: 0.875rem;
    padding: 2rem;
    text-align: center;
}

/* Card Body */
.card-body[b-e8dfwpi8zi] {
    padding: 0.75rem;
    flex: 1;
}

.card-title[b-e8dfwpi8zi] {
    font-weight: 600;
    font-size: 1rem;
    color: #333;
    margin-bottom: 0.25rem;
    line-height: 1.3;
}

.card-client[b-e8dfwpi8zi] {
    font-size: 0.85rem;
    color: #11998e;
    font-weight: 500;
    margin-bottom: 0.25rem;
}

.card-meta[b-e8dfwpi8zi] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.25rem;
}

.meta-tag[b-e8dfwpi8zi] {
    background: #e9ecef;
    color: #495057;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    font-size: 0.75rem;
}

.card-fanciful[b-e8dfwpi8zi] {
    font-style: italic;
    color: #666;
    font-size: 0.8rem;
    margin-bottom: 0.25rem;
}

.card-details[b-e8dfwpi8zi] {
    font-size: 0.8rem;
    color: #666;
}

.detail-row[b-e8dfwpi8zi] {
    display: flex;
    gap: 0.4rem;
    margin-bottom: 0.15rem;
}

.detail-label[b-e8dfwpi8zi] {
    color: #888;
    min-width: 45px;
}

.detail-value[b-e8dfwpi8zi] {
    color: #333;
    font-weight: 500;
}

/* Card Actions */
.card-actions[b-e8dfwpi8zi] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 0.75rem;
    border-top: 1px solid #eee;
    background: #fafafa;
}

.card-actions .btn[b-e8dfwpi8zi] {
    font-size: 0.75rem;
    padding: 0.2rem 0.5rem;
}

.references-badge[b-e8dfwpi8zi] {
    margin-left: auto;
    background: #6c757d;
    color: white;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    font-size: 0.7rem;
}

/* No Results */
.no-results[b-e8dfwpi8zi] {
    text-align: center;
    padding: 3rem 1rem;
    color: #666;
}

.no-results p[b-e8dfwpi8zi] {
    margin-bottom: 1rem;
}

/* Responsive */
@media (max-width: 768px) {
    /* Disable sticky header on mobile */
    .sticky-header[b-e8dfwpi8zi] {
        position: relative;
        margin: 0;
        padding: 1rem;
        box-shadow: none;
    }

    .card-grid[b-e8dfwpi8zi] {
        grid-template-columns: 1fr;
    }

    .client-header[b-e8dfwpi8zi] {
        flex-wrap: wrap;
    }

    .client-code[b-e8dfwpi8zi] {
        order: 1;
    }

    .client-dba[b-e8dfwpi8zi] {
        order: 2;
        width: 100%;
        margin-top: 0.25rem;
    }

    .client-count[b-e8dfwpi8zi] {
        width: 100%;
        margin-left: 0;
        margin-top: 0.25rem;
        order: 3;
    }

    .card-actions[b-e8dfwpi8zi] {
        flex-wrap: wrap;
    }

    .references-badge[b-e8dfwpi8zi] {
        margin-left: 0;
        margin-top: 0.5rem;
        width: 100%;
        text-align: center;
    }
}
/* /Pages/LabelCola/ColaModal.razor.rz.scp.css */
/* /Pages/LabelCola/ColaNew.razor.rz.scp.css */
.container[b-z50kc6cea3] {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 10px;
  margin: 0 auto;
  max-width: 100vw;
  height: 85vh;
  font-size: 12px;
  padding: 0px;
}
.removeImage[b-z50kc6cea3]{
  display:flex;
  justify-content: space-between;
  position: relative;
  top: 0;
  right: 0;
  background-color: red;
  color: white;
  padding: 5px;
  border-radius: 5px;
  cursor: pointer;
}
.item2[b-z50kc6cea3] {
  height: 100%;
  overflow-y: auto;
}
.item[b-z50kc6cea3]{
height: 100%;
  overflow-y: auto;
}
@media screen and (max-width: 639px) {
  .container[b-z50kc6cea3] {
    max-width: 100vw;
    height: 85vh;
  }

  .item[b-z50kc6cea3] {
    grid-column: 1 / -1;
  }

  img[b-z50kc6cea3] {
    height: auto;
    max-width: calc(100vw - 80px);

  }
}


.responsive-image[b-z50kc6cea3] {
  max-width: 100%;
  height: auto;
  display: block;
}
.alert.alert-danger[b-z50kc6cea3] {
  margin: 2px 0; /* Adjust the top and bottom margin as needed */
  padding: 5px; /* Adjust the padding as needed */
}
.image-control[b-z50kc6cea3] {
  border-bottom: solid 1px grey;
}

.select-container[b-z50kc6cea3] {
  padding: 3px;
}

.image-container[b-z50kc6cea3] {
  position: relative;
  width: 100%; /* Adjust this value based on your layout requirements */
  overflow: hidden;
  max-height: 50%;
}

img[b-z50kc6cea3] {
  height: auto;
/*  max-width: calc(100vw - 80px);
*/ max-width: calc(50% - 80px);
}

/*  img:hover {
    transform: scale(2.0);
  }*/

.bold[b-z50kc6cea3] {
  font-weight: bold;
}

input[type="checkbox"][b-z50kc6cea3] {
  vertical-align: middle;
  display: inline-block;
}


.greyBoarder[b-z50kc6cea3] {
  padding-bottom: 5px;
  margin-bottom: 15px;
  border-bottom: solid 1px grey;
}
/* /Pages/LabelCola/ColaNewPanel.razor.rz.scp.css */
.cola-panel-container[b-bs3gi6t0pf] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    padding: 1rem;
    font-size: 0.9rem;
}

.cola-form-grid[b-bs3gi6t0pf] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    flex: 1;
    overflow-y: auto;
}

/* Images section - spans full width */
.cola-images-section[b-bs3gi6t0pf] {
    grid-column: 1 / -1;
    border-bottom: 1px solid #e9ecef;
    padding-bottom: 1rem;
    margin-bottom: 0.5rem;
}

.images-header[b-bs3gi6t0pf] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0.75rem;
}

.images-list[b-bs3gi6t0pf] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.image-item[b-bs3gi6t0pf] {
    flex: 0 0 auto;
    max-width: 200px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.5rem;
    background: #f8f9fa;
}

.image-controls[b-bs3gi6t0pf] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.image-controls input[type="file"][b-bs3gi6t0pf] {
    font-size: 0.75rem;
}

.image-preview[b-bs3gi6t0pf] {
    text-align: center;
}

.responsive-image[b-bs3gi6t0pf] {
    max-width: 100%;
    max-height: 150px;
    height: auto;
    display: block;
    border-radius: 4px;
}

/* Form columns */
.form-column[b-bs3gi6t0pf] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.form-group[b-bs3gi6t0pf] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.form-group label[b-bs3gi6t0pf] {
    font-size: 0.85rem;
    margin-bottom: 0;
}

.form-group label b[b-bs3gi6t0pf] {
    font-weight: 600;
}

.form-group .form-control[b-bs3gi6t0pf],
.form-group .form-select[b-bs3gi6t0pf] {
    font-size: 0.9rem;
    padding: 0.375rem 0.5rem;
}

.form-check-group[b-bs3gi6t0pf] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.form-check[b-bs3gi6t0pf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.form-check-input[b-bs3gi6t0pf] {
    margin: 0;
}

.form-check-label[b-bs3gi6t0pf] {
    font-weight: 600;
    font-size: 0.85rem;
}

/* Validation errors */
.validation-errors[b-bs3gi6t0pf] {
    max-height: 100px;
    overflow-y: auto;
    margin-top: 1rem;
}

.alert-sm[b-bs3gi6t0pf] {
    padding: 0.375rem 0.75rem;
    margin-bottom: 0.25rem;
    font-size: 0.85rem;
}

/* Footer */
.cola-panel-footer[b-bs3gi6t0pf] {
    position: sticky;
    bottom: 0;
    background: white;
    padding: 1rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin: 1rem -1rem -1rem -1rem;
}

/* Mobile - single column */
@media (max-width: 768px) {
    .cola-form-grid[b-bs3gi6t0pf] {
        grid-template-columns: 1fr;
    }

    .image-item[b-bs3gi6t0pf] {
        max-width: 150px;
    }

    .responsive-image[b-bs3gi6t0pf] {
        max-height: 100px;
    }
}

/* Tablet */
@media (min-width: 769px) and (max-width: 1024px) {
    .cola-form-grid[b-bs3gi6t0pf] {
        gap: 1rem;
    }
}
/* /Pages/LabelCola/ColaScanPanel.razor.rz.scp.css */
.cola-scan-panel[b-mjs4cs6d4g] {
    padding: 1rem;
}

.cola-upload-card[b-mjs4cs6d4g] {
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    overflow: hidden;
}

.cola-upload-header[b-mjs4cs6d4g] {
    background: #f8f9fa;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #dee2e6;
}

.upload-area[b-mjs4cs6d4g] {
    padding: 2rem;
    text-align: center;
    background: #fff;
    transition: background 0.2s;
}

.upload-area:hover:not(.has-file)[b-mjs4cs6d4g] {
    background: #f8f9fa;
}


.upload-area.has-file[b-mjs4cs6d4g] {
    padding: 1rem;
}

.upload-drop-zone[b-mjs4cs6d4g] {
    position: relative;
    cursor: pointer;
    display: block;
    text-align: center;
}

.upload-input-overlay[b-mjs4cs6d4g] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.upload-icon[b-mjs4cs6d4g] {
    font-size: 3rem;
    margin-bottom: 0.5rem;
    display: block;
}

.upload-text[b-mjs4cs6d4g] {
    display: block;
    font-weight: 500;
    margin-bottom: 0.25rem;
}

.upload-hint[b-mjs4cs6d4g] {
    display: block;
    font-size: 0.875rem;
    color: #6c757d;
}

.file-selected[b-mjs4cs6d4g] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.form-section-title[b-mjs4cs6d4g] {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e9ecef;
}

.dba-item[b-mjs4cs6d4g] {
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 0.25rem;
}

.scan-field-label[b-mjs4cs6d4g] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
    display: block;
    margin-bottom: 0.25rem;
}

.confidence-badge[b-mjs4cs6d4g] {
    font-size: 0.7rem;
    padding: 0.15rem 0.35rem;
    border-radius: 0.25rem;
}

.confidence-badge.low[b-mjs4cs6d4g] {
    background: #fff3cd;
    color: #856404;
}

.cursor-pointer[b-mjs4cs6d4g] {
    cursor: pointer;
}

.raw-json-content[b-mjs4cs6d4g] {
    background: #f8f9fa;
    padding: 0.75rem;
    border-radius: 0.25rem;
    white-space: pre-wrap;
    word-break: break-word;
}

.matching-results[b-mjs4cs6d4g] {
    background: #f8f9fa;
    padding: 0.75rem;
    border-radius: 0.375rem;
}

.match-row[b-mjs4cs6d4g] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.match-label[b-mjs4cs6d4g] {
    font-weight: 500;
    min-width: 100px;
    font-size: 0.875rem;
}

.match-field[b-mjs4cs6d4g] {
    flex: 1;
}

.match-field .scan-field-label[b-mjs4cs6d4g] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}
/* /Pages/LabelCola/LabelMain.razor.rz.scp.css */
.page-container[b-q5isgn6c1j] {
    padding: 1rem;
    max-width: 1600px;
    margin: 0 auto;
}

/* Page Tabs */
.page-tabs[b-q5isgn6c1j] {
    display: flex;
    gap: 0;
    margin-bottom: 1rem;
    border-bottom: 2px solid #e9ecef;
}

.page-tabs .tab[b-q5isgn6c1j] {
    padding: 0.6rem 1.5rem;
    text-decoration: none;
    color: #6c757d;
    font-weight: 500;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all 0.2s;
}

.page-tabs .tab:hover[b-q5isgn6c1j] {
    color: #667eea;
    background: #f8f9fa;
}

.page-tabs .tab.active[b-q5isgn6c1j] {
    color: #667eea;
    border-bottom-color: #667eea;
    font-weight: 600;
}

/* Sticky Header - fixed at top while scrolling (non-mobile) */
.sticky-header[b-q5isgn6c1j] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: white;
    padding-bottom: 1rem;
    margin: -1rem -1rem 1rem -1rem;
    padding: 1rem 1rem 1rem 1rem;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.page-header[b-q5isgn6c1j] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.page-header h2[b-q5isgn6c1j] {
    margin: 0;
    color: #333;
    min-width: 80px;
}

/* View Mode Toggle */
.view-toggle[b-q5isgn6c1j] {
    display: flex;
    gap: 0.25rem;
    background: #f0f0f0;
    padding: 0.2rem;
    border-radius: 6px;
}

.view-toggle .btn[b-q5isgn6c1j] {
    font-size: 0.8rem;
    padding: 0.3rem 0.75rem;
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.view-toggle .btn i[b-q5isgn6c1j] {
    font-size: 0.9rem;
}

.expand-controls[b-q5isgn6c1j] {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
}

.expand-controls .btn[b-q5isgn6c1j] {
    font-size: 0.8rem;
    padding: 0.25rem 0.6rem;
}

.expand-controls .btn span[b-q5isgn6c1j] {
    font-size: 0.7rem;
    margin-right: 0.25rem;
}

/* Inactive Toggle */
.inactive-toggle[b-q5isgn6c1j] {
    display: flex;
    align-items: center;
    margin-left: 1rem;
    padding: 0.25rem 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    font-size: 0.85rem;
}

.inactive-toggle .form-check-label[b-q5isgn6c1j] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
    color: #6c757d;
    white-space: nowrap;
}

.inactive-toggle .form-check-input[b-q5isgn6c1j] {
    margin: 0;
}

.inactive-toggle .form-check-input:checked + span[b-q5isgn6c1j],
.inactive-toggle:has(.form-check-input:checked) .form-check-label[b-q5isgn6c1j] {
    color: #dc3545;
}

.content-area[b-q5isgn6c1j] {
    padding-top: 0.5rem;
}

/* Client Group */
.client-group[b-q5isgn6c1j] {
    margin-bottom: 2rem;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
    overflow: hidden;
}

.client-header[b-q5isgn6c1j] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    cursor: pointer;
    user-select: none;
    transition: filter 0.2s;
}

.client-header:hover[b-q5isgn6c1j] {
    filter: brightness(1.1);
}

.client-header.expanded[b-q5isgn6c1j] {
    border-bottom: 1px solid rgba(255,255,255,0.2);
}

.expand-icon[b-q5isgn6c1j] {
    font-size: 0.75rem;
    width: 1rem;
    text-align: center;
    transition: transform 0.2s;
}

.client-header h4[b-q5isgn6c1j] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.client-code[b-q5isgn6c1j] {
    background: rgba(255,255,255,0.25);
    padding: 0.25rem 0.6rem;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.client-dba[b-q5isgn6c1j] {
    font-size: 0.8rem;
    opacity: 0.85;
    font-style: italic;
}

.client-count[b-q5isgn6c1j] {
    margin-left: auto;
    font-size: 0.85rem;
    opacity: 0.9;
}

/* Card Grid Layout */
.card-grid[b-q5isgn6c1j] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
    padding: 1rem;
}

/* Recent view - flat grid outside of client groups */
.card-grid.recent-view[b-q5isgn6c1j] {
    padding: 0;
}

/* Card Styles */
.card[b-q5isgn6c1j] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    overflow: hidden;
    transition: box-shadow 0.2s, transform 0.2s;
    display: flex;
    flex-direction: column;
    border: 1px solid #eee;
}

.card:hover[b-q5isgn6c1j] {
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    transform: translateY(-2px);
}

/* Inactive Label Card */
.card.inactive[b-q5isgn6c1j] {
    opacity: 0.65;
    background: #f8f8f8;
    border-color: #dc3545;
    border-style: dashed;
}

.card.inactive .card-title[b-q5isgn6c1j]::after {
    content: " (Inactive)";
    color: #dc3545;
    font-size: 0.75rem;
    font-weight: normal;
}

/* Card Images */
.card-images[b-q5isgn6c1j] {
    display: flex;
    gap: 2px;
    background: #f8f9fa;
    min-height: 120px;
}

.card-image[b-q5isgn6c1j] {
    flex: 1;
    width: 50%;
    height: 120px;
    object-fit: contain;
    transition: transform 0.2s;
    background: #f8f9fa;
}

.card-image.clickable[b-q5isgn6c1j] {
    cursor: pointer;
}

.card-image.clickable:hover[b-q5isgn6c1j] {
    transform: scale(1.05);
    opacity: 0.9;
}

.card-image:only-child[b-q5isgn6c1j] {
    width: 100%;
}

/* Card Body */
.card-body[b-q5isgn6c1j] {
    padding: 0.75rem;
    flex: 1;
}

.card-title[b-q5isgn6c1j] {
    font-weight: 600;
    font-size: 1rem;
    color: #333;
    margin-bottom: 0.25rem;
    line-height: 1.3;
}

.card-client[b-q5isgn6c1j] {
    font-size: 0.85rem;
    color: #667eea;
    font-weight: 500;
    margin-bottom: 0.25rem;
}

.card-meta[b-q5isgn6c1j] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.25rem;
}

.meta-tag[b-q5isgn6c1j] {
    background: #e9ecef;
    color: #495057;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    font-size: 0.75rem;
}

.card-fanciful[b-q5isgn6c1j] {
    font-style: italic;
    color: #666;
    font-size: 0.8rem;
}

/* Card Actions */
.card-actions[b-q5isgn6c1j] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 0.75rem;
    border-top: 1px solid #eee;
    background: #fafafa;
}

.card-actions .btn[b-q5isgn6c1j] {
    font-size: 0.75rem;
    padding: 0.2rem 0.5rem;
}

.references-badge[b-q5isgn6c1j] {
    margin-left: auto;
    background: #6c757d;
    color: white;
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    font-size: 0.7rem;
}

/* No Results */
.no-results[b-q5isgn6c1j] {
    text-align: center;
    padding: 3rem 1rem;
    color: #666;
}

.no-results p[b-q5isgn6c1j] {
    margin-bottom: 1rem;
}

/* Responsive */
@media (max-width: 768px) {
    /* Disable sticky header on mobile */
    .sticky-header[b-q5isgn6c1j] {
        position: relative;
        margin: 0;
        padding: 1rem;
        box-shadow: none;
    }

    .card-grid[b-q5isgn6c1j] {
        grid-template-columns: 1fr;
    }

    .client-header[b-q5isgn6c1j] {
        flex-wrap: wrap;
    }

    .client-code[b-q5isgn6c1j] {
        order: 1;
    }

    .client-dba[b-q5isgn6c1j] {
        order: 2;
        width: 100%;
        margin-top: 0.25rem;
    }

    .client-count[b-q5isgn6c1j] {
        width: 100%;
        margin-left: 0;
        margin-top: 0.25rem;
        order: 3;
    }

    .card-actions[b-q5isgn6c1j] {
        flex-wrap: wrap;
    }

    .references-badge[b-q5isgn6c1j] {
        margin-left: 0;
        margin-top: 0.5rem;
        width: 100%;
        text-align: center;
    }
}
/* /Pages/LabelCola/LabelModal.razor.rz.scp.css */

textarea[b-maj6he02ud] {
    text-transform: uppercase;
}

.container[b-maj6he02ud] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 10px;
    margin: 0 auto;
    max-width: 100vw;
    overflow-y: auto;
    overflow: auto;
}

@media screen and (min-width: 640px) {
    .container[b-maj6he02ud] {
        max-height: 550px; 
    }
}

.spinner[b-maj6he02ud] {
   position: absolute;
   top: 50%;
   left: 50%;
}
.container-spinner[b-maj6he02ud] {
   position: relative;
   min-height:100px;
}


.scrollable[b-maj6he02ud]{
    overflow-y:auto;
}
@media screen and (max-width: 639px) {
    
    .container[b-maj6he02ud] {
        max-width: 100vw;!important;
        height: 100vh;
        max-height: 100vh;
    }

    .scrollable[b-maj6he02ud] {
        overflow-y: auto;
    }

    .item[b-maj6he02ud] {
        grid-column: 1 / -1;
    }

    img[b-maj6he02ud] {
        height: auto;
        max-width: calc(100vw - 80px);
    }
}

.image-container[b-maj6he02ud] {
    padding: 3px;
}

.image-control[b-maj6he02ud] {
    border-bottom: solid 1px grey;
    max-height:300px;
}

.select-container[b-maj6he02ud] {
    padding: 3px;
}

img[b-maj6he02ud] {
    height: auto;
    max-width: calc(100vw - 80px);
}

.bold[b-maj6he02ud] {
    font-weight: bold;
}

input[type="checkbox"][b-maj6he02ud] {
    vertical-align: middle;
    display: inline-block;
}


.greyBoarder[b-maj6he02ud] {
    padding-bottom: 5px;
    margin-bottom: 15px;
    border-bottom: solid 1px grey;
}

/* /Pages/LabelCola/LabelNewPanel.razor.rz.scp.css */
.label-panel-container[b-ktyy1pmp4q] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 0.5rem;
    font-size: 0.8rem;
    background: linear-gradient(180deg, #f8f9fa 0%, #eef1f5 100%);
}

.loading-container[b-ktyy1pmp4q] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px;
}

.label-form-grid[b-ktyy1pmp4q] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.6rem;
    flex: 1;
    overflow-y: auto;
    background: white;
    border-radius: 8px;
    padding: 0.6rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
}

/* Images section - spans full width */
.images-section[b-ktyy1pmp4q] {
    grid-column: 1 / -1;
    border-bottom: 1px solid #e9ecef;
    padding-bottom: 0.5rem;
    margin-bottom: 0.25rem;
}

.section-header[b-ktyy1pmp4q] {
    display: flex;
    align-items: center;
    margin-bottom: 0.4rem;
}

.section-title[b-ktyy1pmp4q] {
    font-weight: 600;
    font-size: 0.8rem;
    color: #374151;
    letter-spacing: -0.01em;
}

.image-upload-group[b-ktyy1pmp4q] {
    display: flex;
    gap: 1.25rem;
    flex-wrap: wrap;
}

.image-upload-item[b-ktyy1pmp4q] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.image-label[b-ktyy1pmp4q] {
    font-size: 0.65rem;
    font-weight: 700;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.image-preview[b-ktyy1pmp4q] {
    margin-top: 0.3rem;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 0.2rem;
    background: #f9fafb;
}

.image-preview img[b-ktyy1pmp4q] {
    max-width: 100%;
    max-height: 70px;
    height: auto;
    display: block;
    border-radius: 4px;
}

/* ===== FORM COLUMNS ===== */
.form-column[b-ktyy1pmp4q] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.form-group[b-ktyy1pmp4q] {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* ===== LABELS ===== */
.form-group > label[b-ktyy1pmp4q] {
    font-size: 0.72rem;
    font-weight: 500;
    margin-bottom: 0;
    margin-top: 0.35rem;
    line-height: 1.2;
    min-width: 54px;
    max-width: 54px;
    flex-shrink: 0;
    text-align: right;
    color: #6b7280;
}

.form-group > label b[b-ktyy1pmp4q] {
    font-weight: 600;
    color: #374151;
}

/* ===== INPUTS & SELECTS - Polished Look ===== */
.form-group > .form-control[b-ktyy1pmp4q],
.form-group > .form-select[b-ktyy1pmp4q],
.form-group > input[b-ktyy1pmp4q],
.form-group > select[b-ktyy1pmp4q],
.form-group > textarea[b-ktyy1pmp4q],
.form-group select[b-ktyy1pmp4q],
select.form-select[b-ktyy1pmp4q],
.label-panel-container select[b-ktyy1pmp4q],
.label-panel-container input[b-ktyy1pmp4q],
.label-panel-container .form-control[b-ktyy1pmp4q],
.label-panel-container .form-select[b-ktyy1pmp4q] {
    font-size: 0.8rem !important;
    padding: 0.35rem 0.5rem !important;
    height: auto !important;
    min-height: 1.85rem !important;
    line-height: 1.3 !important;
    border-radius: 6px;
    border: 1px solid #d1d5db;
    background-color: #fff;
    color: #1f2937;
    transition: all 0.15s ease;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

/* Placeholder styling */
.label-panel-container input[b-ktyy1pmp4q]::placeholder,
.label-panel-container textarea[b-ktyy1pmp4q]::placeholder {
    color: #9ca3af;
    font-style: italic;
}

/* Hover state */
.form-group > .form-control:hover[b-ktyy1pmp4q],
.form-group > .form-select:hover[b-ktyy1pmp4q],
.label-panel-container select:hover[b-ktyy1pmp4q],
.label-panel-container input:hover[b-ktyy1pmp4q] {
    border-color: #9ca3af;
}

/* Focus state - clean blue glow */
.form-group > .form-control:focus[b-ktyy1pmp4q],
.form-group > .form-select:focus[b-ktyy1pmp4q],
.label-panel-container select:focus[b-ktyy1pmp4q],
.label-panel-container input:focus[b-ktyy1pmp4q] {
    border-color: #3b82f6;
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15), 0 1px 2px rgba(0,0,0,0.04);
}

.form-group > .form-control[b-ktyy1pmp4q],
.form-group > .form-select[b-ktyy1pmp4q],
.form-group > input:not([type="checkbox"])[b-ktyy1pmp4q],
.form-group > select[b-ktyy1pmp4q],
.form-group > textarea[b-ktyy1pmp4q] {
    flex: 1;
}

/* Force nested components (like AVASelectElement) to match */
[b-ktyy1pmp4q] select,
[b-ktyy1pmp4q] .form-select,
[b-ktyy1pmp4q] input,
[b-ktyy1pmp4q] .form-control {
    font-size: 0.8rem !important;
    padding: 0.35rem 0.5rem !important;
    min-height: 1.85rem !important;
    line-height: 1.3 !important;
    border-radius: 6px;
    border: 1px solid #d1d5db;
    transition: all 0.15s ease;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

[b-ktyy1pmp4q] select:focus,
[b-ktyy1pmp4q] input:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15), 0 1px 2px rgba(0,0,0,0.04);
}

/* ===== DROPDOWN ARROW STYLING ===== */
.form-group > .form-select[b-ktyy1pmp4q],
.label-panel-container select[b-ktyy1pmp4q],
[b-ktyy1pmp4q] select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.5rem center;
    background-size: 12px;
    padding-right: 1.75rem !important;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}

/* ===== VALIDATION STYLES ===== */
.form-group > .is-invalid[b-ktyy1pmp4q],
.label-panel-container .is-invalid[b-ktyy1pmp4q] {
    border-color: #ef4444 !important;
    background-image: none;
}

.form-group > .is-invalid:focus[b-ktyy1pmp4q],
.label-panel-container .is-invalid:focus[b-ktyy1pmp4q] {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.15), 0 1px 2px rgba(0,0,0,0.04);
}

.field-error[b-ktyy1pmp4q] {
    width: 100%;
    margin-left: 59px;
    font-size: 0.68rem;
    color: #dc2626;
    margin-top: 0.1rem;
    font-weight: 500;
}

.ava-invalid[b-ktyy1pmp4q]  select {
    border-color: #ef4444 !important;
}

/* Handle nested components like AVASelectElement */
.form-group > div[b-ktyy1pmp4q] {
    flex: 1;
}

[b-ktyy1pmp4q] .form-group select,
[b-ktyy1pmp4q] .form-group input {
    flex: 1;
}

/* ===== TEXTAREA ===== */
.form-group textarea[b-ktyy1pmp4q] {
    text-transform: uppercase;
    min-height: 2.2rem;
    resize: vertical;
}

/* ===== CHECKBOXES ===== */
.form-check-group[b-ktyy1pmp4q] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.75rem;
    margin-top: 0.3rem;
    padding: 0.35rem 0.5rem;
    background: #f9fafb;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
}

.form-check[b-ktyy1pmp4q] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin: 0;
}

.form-check-input[b-ktyy1pmp4q] {
    margin: 0;
    width: 0.9rem;
    height: 0.9rem;
    cursor: pointer;
    border-radius: 4px;
    border: 1.5px solid #d1d5db;
    transition: all 0.15s ease;
}

.form-check-input:checked[b-ktyy1pmp4q] {
    background-color: #3b82f6;
    border-color: #3b82f6;
}

.form-check-input:focus[b-ktyy1pmp4q] {
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.form-check-label[b-ktyy1pmp4q] {
    font-size: 0.72rem;
    color: #374151;
    cursor: pointer;
    user-select: none;
}

/* ===== EMAIL SECTION ===== */
.email-section[b-ktyy1pmp4q] {
    margin-top: 0.5rem;
    padding: 0.5rem;
    background: white;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

/* ===== FOOTER ===== */
.label-panel-footer[b-ktyy1pmp4q] {
    position: sticky;
    bottom: 0;
    background: linear-gradient(180deg, transparent 0%, #f8f9fa 20%);
    padding: 0.6rem 0 0 0;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.label-panel-footer .btn[b-ktyy1pmp4q] {
    min-width: 70px;
    font-size: 0.8rem;
    font-weight: 500;
    padding: 0.35rem 0.75rem;
    border-radius: 6px;
    transition: all 0.15s ease;
}

.label-panel-footer .btn-primary[b-ktyy1pmp4q] {
    box-shadow: 0 1px 3px rgba(59, 130, 246, 0.3);
}

.label-panel-footer .btn-primary:hover[b-ktyy1pmp4q] {
    box-shadow: 0 2px 6px rgba(59, 130, 246, 0.4);
    transform: translateY(-1px);
}

/* ===== OCR SCANNING STYLES ===== */
.ocr-scan-section[b-ktyy1pmp4q] {
    padding: 0.4rem;
    background: #f9fafb;
    border-radius: 8px;
    border: 1px dashed #d1d5db;
}

.ocr-scanning-indicator[b-ktyy1pmp4q] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.75rem;
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border: 1px solid #93c5fd;
    border-radius: 6px;
    color: #1d4ed8;
    font-size: 0.78rem;
    font-weight: 500;
}

.ocr-complete-indicator[b-ktyy1pmp4q] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.75rem;
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    border: 1px solid #6ee7b7;
    border-radius: 6px;
    color: #047857;
    font-size: 0.78rem;
    font-weight: 500;
    flex-wrap: wrap;
    gap: 0.2rem;
}

.ocr-complete-indicator .btn-link[b-ktyy1pmp4q] {
    padding: 0;
    font-size: 0.72rem;
    color: #047857;
}

.ocr-check-badge[b-ktyy1pmp4q] {
    display: inline-flex;
    align-items: center;
    font-size: 0.58rem;
    font-weight: 700;
    padding: 0.1rem 0.35rem;
    margin-left: 0.3rem;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    color: #92400e;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    vertical-align: middle;
    border: 1px solid #fcd34d;
}

.ocr-check-badge[b-ktyy1pmp4q]::before {
    content: "!";
    margin-right: 0.15rem;
    font-size: 0.55rem;
    font-weight: 800;
}

/* ===== AI PROMPT CARD ===== */
.ai-prompt-card[b-ktyy1pmp4q] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.85rem;
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border: 1px solid #93c5fd;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.1);
}

.ai-prompt-icon[b-ktyy1pmp4q] {
    font-size: 1.5rem;
    color: #2563eb;
    line-height: 1;
}

.ai-prompt-content[b-ktyy1pmp4q] {
    flex: 1;
}

.ai-prompt-content strong[b-ktyy1pmp4q] {
    color: #1e40af;
    font-size: 0.88rem;
}

.ai-prompt-content p[b-ktyy1pmp4q] {
    color: #4b5563;
    font-size: 0.8rem;
    margin-top: 0.3rem;
}

.ai-prompt-content .btn[b-ktyy1pmp4q] {
    font-size: 0.78rem;
    padding: 0.3rem 0.6rem;
    border-radius: 6px;
    font-weight: 500;
}

/* ===== AI ERROR CARD ===== */
.ai-error-card[b-ktyy1pmp4q] {
    display: flex;
    align-items: center;
    padding: 0.6rem 0.85rem;
    background: linear-gradient(135deg, #fefce8 0%, #fef9c3 100%);
    border: 1px solid #fcd34d;
    border-radius: 8px;
    color: #713f12;
    font-size: 0.8rem;
    flex-wrap: wrap;
}

.ai-error-card .btn-link[b-ktyy1pmp4q] {
    color: #a16207;
    font-size: 0.78rem;
    text-decoration: underline;
    font-weight: 500;
}

/* ===== MOBILE - SINGLE COLUMN ===== */
@media (max-width: 768px) {
    .label-form-grid[b-ktyy1pmp4q] {
        grid-template-columns: 1fr;
    }

    .image-upload-group[b-ktyy1pmp4q] {
        flex-direction: column;
    }

    .form-group[b-ktyy1pmp4q] {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .form-group > label[b-ktyy1pmp4q] {
        text-align: left;
        max-width: none;
        margin-top: 0;
        margin-bottom: 0.15rem;
    }

    .field-error[b-ktyy1pmp4q] {
        margin-left: 0;
    }

    .image-preview img[b-ktyy1pmp4q] {
        max-height: 60px;
    }

    /* Larger touch targets on mobile */
    .label-panel-container select[b-ktyy1pmp4q],
    .label-panel-container input[b-ktyy1pmp4q],
    .label-panel-container .form-control[b-ktyy1pmp4q],
    .label-panel-container .form-select[b-ktyy1pmp4q] {
        min-height: 2.5rem !important;
        font-size: 16px !important; /* Prevents iOS zoom */
    }
}
/* /Pages/LabelCola/LabelScanPanel.razor.rz.scp.css */
/* Label Scan Panel Styles */

.label-scan-panel[b-4otxtns9uo] {
    padding: 1rem;
}

/* OCR Toggle Section */
.ocr-toggle-section[b-4otxtns9uo] {
    padding: 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}

.ocr-toggle-section .form-check-input[b-4otxtns9uo] {
    width: 2.5em;
    height: 1.25em;
    cursor: pointer;
}

.ocr-toggle-section .form-check-input:checked[b-4otxtns9uo] {
    background-color: #198754;
    border-color: #198754;
}

.ocr-toggle-section .form-check-label[b-4otxtns9uo] {
    cursor: pointer;
    font-weight: 500;
}

/* OCR Disabled State */
.ocr-disabled-section[b-4otxtns9uo] {
    background: #f8f9fa;
    border-radius: 12px;
    padding: 2rem;
}

.ocr-disabled-section i[b-4otxtns9uo] {
    opacity: 0.6;
}

.ocr-disabled-section p[b-4otxtns9uo] {
    color: #6c757d;
}

/* Upload Section */
.scan-upload-section[b-4otxtns9uo] {
    padding: 1rem 0;
}

/* Label Upload Cards */
.label-upload-card[b-4otxtns9uo] {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}

.label-upload-header[b-4otxtns9uo] {
    padding: 0.5rem 0.75rem;
    background: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    font-size: 0.9rem;
}

.upload-area[b-4otxtns9uo] {
    padding: 1.5rem;
    text-align: center;
    transition: border-color 0.2s, background-color 0.2s;
    min-height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.upload-area:hover:not(.has-file)[b-4otxtns9uo] {
    background-color: rgba(13, 110, 253, 0.05);
}

.upload-area.has-file[b-4otxtns9uo] {
    background-color: #d1e7dd;
}

.upload-label[b-4otxtns9uo] {
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    margin: 0;
    width: 100%;
}

.upload-icon[b-4otxtns9uo] {
    font-size: 2rem;
    color: #0d6efd;
}

.upload-text[b-4otxtns9uo] {
    font-size: 0.95rem;
    font-weight: 500;
    color: #495057;
}

.upload-hint[b-4otxtns9uo] {
    font-size: 0.8rem;
    color: #6c757d;
}

.file-selected[b-4otxtns9uo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
}

.file-selected span[b-4otxtns9uo] {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Processing State */
.scan-processing[b-4otxtns9uo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

/* Results Section */
.scan-results[b-4otxtns9uo] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.results-header[b-4otxtns9uo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
}

.results-form[b-4otxtns9uo] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    max-height: 60vh;
    overflow-y: auto;
    padding-right: 0.5rem;
}

.results-footer[b-4otxtns9uo] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #dee2e6;
}

/* Optional Fields */
.optional-fields[b-4otxtns9uo] {
    margin-top: 0.5rem;
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 6px;
}

.optional-fields summary[b-4otxtns9uo] {
    cursor: pointer;
    font-size: 0.875rem;
    color: #6c757d;
    user-select: none;
}

.optional-fields summary:hover[b-4otxtns9uo] {
    color: #495057;
}

.optional-content[b-4otxtns9uo] {
    padding-top: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Raw JSON Debug Section */
.raw-json-section[b-4otxtns9uo] {
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 6px;
    border: 1px dashed #dee2e6;
}

.raw-json-section summary[b-4otxtns9uo] {
    cursor: pointer;
    user-select: none;
}

.raw-json-content[b-4otxtns9uo] {
    margin-top: 0.5rem;
    padding: 0.5rem;
    background: #1e1e1e;
    color: #d4d4d4;
    border-radius: 4px;
    font-size: 0.75rem;
    max-height: 200px;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-all;
}

/* Source Badge */
.source-badge[b-4otxtns9uo] {
    display: inline-block;
    padding: 0.1rem 0.4rem;
    font-size: 0.7rem;
    font-weight: 500;
    border-radius: 3px;
    background: #e7f1ff;
    color: #0d6efd;
    text-transform: capitalize;
}

/* Scan Field Component */
[b-4otxtns9uo] .scan-field {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

[b-4otxtns9uo] .scan-field-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

[b-4otxtns9uo] .scan-field-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
    margin: 0;
}

[b-4otxtns9uo] .confidence-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
}

[b-4otxtns9uo] .confidence-badge.low {
    background-color: #fff3cd;
    color: #856404;
}

[b-4otxtns9uo] .confidence-badge i {
    font-size: 0.7rem;
}

[b-4otxtns9uo] .source-indicator {
    font-size: 0.7rem;
    padding: 0.1rem 0.4rem;
    border-radius: 3px;
    background: #e7f1ff;
    color: #0d6efd;
    text-transform: capitalize;
}

/* Mobile Adjustments */
@media (max-width: 576px) {
    .ocr-toggle-section[b-4otxtns9uo] {
        padding: 0.5rem 0.75rem;
    }

    .upload-area[b-4otxtns9uo] {
        padding: 1rem;
    }

    .upload-icon[b-4otxtns9uo] {
        font-size: 1.75rem;
    }

    .upload-text[b-4otxtns9uo] {
        font-size: 0.9rem;
    }

    .results-form[b-4otxtns9uo] {
        max-height: 50vh;
    }

    .results-footer[b-4otxtns9uo] {
        flex-direction: column;
    }

    .results-footer button[b-4otxtns9uo] {
        width: 100%;
    }
    
    .raw-json-content[b-4otxtns9uo] {
        font-size: 0.65rem;
    }
}
/* /Pages/LabelCola/LabelViewPanel.razor.rz.scp.css */
.label-view-panel[b-gvl005g93p] {
    display: flex;
    flex-direction: column;
    height: 100%;
    font-size: 0.82rem;
    background: #f8f9fa;
    overflow-y: auto;
}

.loading-container[b-gvl005g93p] {
    display: flex;
    justify-content: center;
    padding: 2rem;
}

.not-found[b-gvl005g93p] {
    text-align: center;
    padding: 2rem;
    color: #6c757d;
}

/* Stats Bar */
.stats-bar[b-gvl005g93p] {
    display: flex;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    padding: 0.75rem;
    gap: 0.5rem;
}

.stat[b-gvl005g93p] {
    flex: 1;
    text-align: center;
    padding: 0.5rem;
    background: rgba(255,255,255,0.15);
    border-radius: 6px;
}

.stat-value[b-gvl005g93p] {
    display: block;
    font-size: 1rem;
    font-weight: 700;
    color: white;
}

.stat-label[b-gvl005g93p] {
    display: block;
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: rgba(255,255,255,0.8);
    margin-top: 0.15rem;
}

.stat.status.approved[b-gvl005g93p] {
    background: rgba(25, 135, 84, 0.4);
}

.stat.status.pending[b-gvl005g93p] {
    background: rgba(255, 193, 7, 0.4);
}

/* Images Section */
.images-section[b-gvl005g93p] {
    padding: 0.75rem;
    background: white;
    border-bottom: 1px solid #e9ecef;
}

.images-row[b-gvl005g93p] {
    display: flex;
    gap: 0.75rem;
    overflow-x: auto;
    padding-bottom: 0.25rem;
}

.image-thumb[b-gvl005g93p] {
    flex-shrink: 0;
    text-align: center;
    cursor: pointer;
}

.image-thumb img[b-gvl005g93p] {
    width: 100px;
    height: 120px;
    object-fit: contain;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: #f8f9fa;
    transition: transform 0.2s, box-shadow 0.2s;
}

.image-thumb:hover img[b-gvl005g93p] {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.image-thumb .image-label[b-gvl005g93p] {
    display: block;
    font-size: 0.68rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

/* Sections */
.section[b-gvl005g93p] {
    background: white;
    margin: 0.5rem;
    border-radius: 8px;
    padding: 0.75rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.section-title[b-gvl005g93p] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #667eea;
    margin-bottom: 0.5rem;
    padding-bottom: 0.35rem;
    border-bottom: 2px solid #667eea;
}

/* Details Grid */
.details-grid[b-gvl005g93p] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
    padding: 0 0.5rem;
}

.detail-item[b-gvl005g93p] {
    display: flex;
    flex-direction: column;
    padding: 0.4rem 0;
    border-bottom: 1px solid #f1f3f4;
    gap: 0.15rem;
}

.detail-item:last-child[b-gvl005g93p] {
    border-bottom: none;
}

.detail-item .label[b-gvl005g93p] {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #868e96;
    font-weight: 600;
}

.detail-item .value[b-gvl005g93p] {
    color: #212529;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.detail-item .value.mono[b-gvl005g93p] {
    font-family: 'SF Mono', Monaco, Consolas, monospace;
    font-size: 0.72rem;
    line-height: 1.4;
    word-break: break-word;
}

.detail-item .value.hash[b-gvl005g93p] {
    font-size: 0.65rem;
    word-break: break-all;
    background: #f1f3f4;
    padding: 0.2rem 0.4rem;
    border-radius: 3px;
}

.detail-item .value.link[b-gvl005g93p] {
    color: #667eea;
    text-decoration: none;
}

.detail-item .value.link:hover[b-gvl005g93p] {
    text-decoration: underline;
}

/* Compliance Flags */
.compliance-flags[b-gvl005g93p] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.5rem;
}

.flag[b-gvl005g93p] {
    font-size: 0.68rem;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    background: #f1f3f4;
    color: #868e96;
}

.flag.on[b-gvl005g93p] {
    background: #d1e7dd;
    color: #0f5132;
}

.flag.on[b-gvl005g93p]::before {
    content: "✓ ";
}

/* Romantic Section */
.romantic-section[b-gvl005g93p] {
    margin: 0.5rem;
}

.romantic-section .section-title[b-gvl005g93p] {
    color: #722f37;
    border-bottom-color: #722f37;
}

.romantic-text[b-gvl005g93p] {
    font-style: italic;
    line-height: 1.6;
    color: #495057;
    padding: 0.5rem;
    background: #fdf8f8;
    border-left: 3px solid #722f37;
    border-radius: 0 6px 6px 0;
}

/* OCR Section */
.ocr-section[b-gvl005g93p] {
    margin: 0.5rem;
}

.ocr-section .section-title[b-gvl005g93p] {
    color: #0d6efd;
    border-bottom-color: #0d6efd;
}

.ocr-json[b-gvl005g93p] {
    margin-top: 0.5rem;
    padding: 0.75rem;
    background: #1e1e1e;
    color: #d4d4d4;
    border-radius: 6px;
    font-size: 0.7rem;
    max-height: 200px;
    overflow: auto;
}

/* Footer */
.panel-footer[b-gvl005g93p] {
    margin-top: auto;
    padding: 0.75rem;
    background: #f1f3f4;
    border-top: 1px solid #e9ecef;
}

.timestamp[b-gvl005g93p] {
    font-size: 0.7rem;
    color: #868e96;
}

/* Image Overlay */
.image-overlay[b-gvl005g93p] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.9);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 10000;
    cursor: pointer;
}

.image-overlay img[b-gvl005g93p] {
    max-width: 90vw;
    max-height: 80vh;
    object-fit: contain;
    border-radius: 8px;
}

.close-hint[b-gvl005g93p] {
    color: rgba(255,255,255,0.5);
    margin-top: 1rem;
    font-size: 0.8rem;
}

/* Mobile */
@media (max-width: 600px) {
    .details-grid[b-gvl005g93p] {
        grid-template-columns: 1fr;
    }

    .stats-bar[b-gvl005g93p] {
        flex-wrap: wrap;
    }

    .stat[b-gvl005g93p] {
        min-width: 45%;
    }
}
/* /Pages/LabelCola/SearchSortBar.razor.rz.scp.css */
.search-sort-bar[b-vj6nao395l] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1rem;
    border: 1px solid #e9ecef;
}

/* Search Section */
.search-section[b-vj6nao395l] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    min-width: 250px;
}

.search-input-wrapper[b-vj6nao395l] {
    position: relative;
    flex: 1;
    max-width: 400px;
}

.search-input[b-vj6nao395l] {
    width: 100%;
    padding: 0.5rem 2rem 0.5rem 0.75rem;
    border: 1px solid #ced4da;
    border-radius: 6px;
    font-size: 0.95rem;
    transition: border-color 0.2s, box-shadow 0.2s;
    background: white;
}

.search-input:focus[b-vj6nao395l] {
    outline: none;
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
}

.clear-btn[b-vj6nao395l] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
    padding: 0.25rem;
    font-size: 0.875rem;
    line-height: 1;
}

.clear-btn:hover[b-vj6nao395l] {
    color: #dc3545;
}

.result-count[b-vj6nao395l] {
    color: #6c757d;
    font-size: 0.875rem;
    white-space: nowrap;
    font-weight: 500;
}

/* Sort Section */
.sort-section[b-vj6nao395l] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.sort-group[b-vj6nao395l] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.sort-group label[b-vj6nao395l] {
    color: #495057;
    font-size: 0.875rem;
    font-weight: 500;
    margin: 0;
    white-space: nowrap;
}

/* Override global select styles */
.sort-select[b-vj6nao395l] {
    display: inline-block;
    width: auto;
    min-width: 120px;
    padding: 0.4rem 2rem 0.4rem 0.75rem;
    border: 1px solid #ced4da;
    border-radius: 6px;
    font-size: 0.875rem;
    background: white url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") no-repeat right 0.5rem center/12px 12px;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.sort-select:focus[b-vj6nao395l] {
    outline: none;
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15);
}

.sort-direction-btn[b-vj6nao395l] {
    padding: 0.4rem 0.75rem;
    border: 1px solid #ced4da;
    border-radius: 6px;
    background: white;
    font-size: 0.875rem;
    cursor: pointer;
    transition: background-color 0.2s, border-color 0.2s;
    white-space: nowrap;
}

.sort-direction-btn:hover[b-vj6nao395l] {
    background: #e9ecef;
    border-color: #adb5bd;
}

/* Action Section */
.action-section[b-vj6nao395l] {
    margin-left: auto;
}

.action-section .btn[b-vj6nao395l] {
    padding: 0.5rem 1rem;
    font-size: 0.95rem;
}

/* Responsive */
@media (max-width: 768px) {
    .search-sort-bar[b-vj6nao395l] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-section[b-vj6nao395l] {
        width: 100%;
    }

    .search-input-wrapper[b-vj6nao395l] {
        max-width: none;
    }

    .sort-section[b-vj6nao395l] {
        width: 100%;
        justify-content: flex-start;
    }

    .sort-group[b-vj6nao395l] {
        width: 100%;
    }

    .sort-select[b-vj6nao395l] {
        flex: 1;
    }

    .action-section[b-vj6nao395l] {
        width: 100%;
        margin-left: 0;
    }

    .action-section .btn[b-vj6nao395l] {
        width: 100%;
    }
}
/* /Pages/Lab/LabBulkAnalysisRequestModal.razor.rz.scp.css */
.table-container[b-cpa12wc9mk] {
  max-height: 60vh;
  overflow-y: hidden;
  position: relative;
}

/* Remove spin buttons for number input */
input[type="number"][b-cpa12wc9mk]::-webkit-inner-spin-button,
input[type="number"][b-cpa12wc9mk]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  appearance: none;
}

.setMaxHeight[b-cpa12wc9mk] {
 max-height:200px;
 overflow-y:auto;
}
.buttonRow[b-cpa12wc9mk]{
  display:flex;
  flex-direction:row;
  justify-content:flex-end;
  gap:10px;
}
.button-divider[b-cpa12wc9mk] {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  position: absolute;
  bottom: 0;
  width: 100%;
}
.checkbox-label[b-cpa12wc9mk] {
  display: flex;
  align-items: center;
}

td[b-cpa12wc9mk], th[b-cpa12wc9mk] {
  text-align: center;
  padding:1px;
}
.table-sticky[b-cpa12wc9mk] {
  table-layout: fixed;
  width: 100%; /* Or a defined width */
}
table[b-cpa12wc9mk] {
  width: 100%; /* Ensure the table spans the entire width of the container */
  border-collapse: collapse; /* Optional: To remove any spacing between table cells */
}

.table-sticky-thead[b-cpa12wc9mk] {
  position: sticky; /* Set the <thead> as a sticky element */
  top: 0; /* Stick the <thead> to the top of the container */
  background-color: white; /* Set the background color of the <thead> */
  z-index: 1; /* Ensure the <thead> stays above the <tbody> while scrolling */
}
.checkmark[b-cpa12wc9mk] {
  width: 30px;
  height: 30px;
  background-color: green;
  border-radius: 50%; /* Make it round */
  position: relative;
  transform: scaleX(-1); /* Flip about Y-axis */
}

  .checkmark[b-cpa12wc9mk]::before {
    content: '';
    position: absolute;
    width: 5px;
    height: 12px;
    border: 3px solid white;
    border-top: none;
    border-right: none;
    top: 25%;
    left: 40%; /* Adjust left position */
    transform: rotate(-45deg);
  }


.grey-x:hover[b-cpa12wc9mk]{
  cursor:pointer;
}
.grey-x[b-cpa12wc9mk] {
  width: 30px;
  height: 30px;
  background-color: grey;
  border-radius: 50%; /* Make it round */
  position: relative;
}

  .grey-x[b-cpa12wc9mk]::before,
  .grey-x[b-cpa12wc9mk]::after {
    content: '';
    position: absolute;
    width: 5px;
    height: 12px; /* Adjust height to make it smaller */
    background-color: white;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .grey-x[b-cpa12wc9mk]::before {
    transform: translate(-50%, -50%) rotate(45deg);
  }

  .grey-x[b-cpa12wc9mk]::after {
    transform: translate(-50%, -50%) rotate(-45deg);
  }

.red-x[b-cpa12wc9mk] {
  width: 30px;
  height: 30px;
  background-color: red;
  border-radius: 50%; /* Make it round */
  position: relative;
}

  .red-x[b-cpa12wc9mk]::before,
  .red-x[b-cpa12wc9mk]::after {
    content: '';
    position: absolute;
    width: 5px;
    height: 12px; /* Adjust height to make it smaller */
    background-color: white;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .red-x[b-cpa12wc9mk]::before {
    transform: translate(-50%, -50%) rotate(45deg);
  }

  .red-x[b-cpa12wc9mk]::after {
    transform: translate(-50%, -50%) rotate(-45deg);
  }
.row[b-cpa12wc9mk] {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* Create three equal-width columns */
  gap: 5px; /* Adjust the gap between columns if needed */
}

/*.column {
  border: 1px solid #ccc;  Optional: Add borders for visualization 
  padding: 5px;  Optional: Add padding for spacing 
}
.parent-container{
  position:relative;
  height:10vh;
  margin-top:3px;
  padding-top:3px;
}*/
.sticky-header[b-cpa12wc9mk] {

  position: sticky;
  top: 0; /* Stick the header to the top of the container */
  background-color: white; /* Optional: Set the background color of the sticky header */
  z-index: 2; /* Ensure the header appears above the table body */
}
/*tbody {
  overflow-y: auto;*/ /* Enable scrolling for the table body */
  /*max-height:60vh;*/
  /*max-height: calc(60vh - 40px);*/ /* Adjust the max height to accommodate the header height */
/*}*/
.scroll-container[b-cpa12wc9mk] {
  overflow-y: auto; /* Enable scrolling for the table wrapper */
  max-height: calc(60vh - 40px); /* Adjust the max height to accommodate the header height */
  overflow-x: hidden;
}
/* Style the tab container */
.binder-tabs[b-cpa12wc9mk] {
  border-bottom: 2px solid #ddd;
}

/* Default tab style */
.binder-tabs .nav-link[b-cpa12wc9mk] {
  background: #f8f9fa;
  border: 1px solid #ddd;
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  padding: 10px 15px;
  font-weight: bold;
  color: #495057;
  transition: all 0.3s ease-in-out;
}

    /* Hover effect */
    .binder-tabs .nav-link:hover[b-cpa12wc9mk] {
      background: #e9ecef;
    }

    /* Active tab styling */
    .binder-tabs .nav-link.active[b-cpa12wc9mk] {
      background: #ffffff;
      color: #007bff;
      border-bottom: 2px solid white;
      box-shadow: 0 -3px 5px rgba(0, 0, 0, 0.1);
      position: relative;
      z-index: 2;
      font-weight: bold;
    }

      /* Active tab - subtle elevation effect */
      .binder-tabs .nav-link.active[b-cpa12wc9mk]::before {
        content: "";
        position: absolute;
        bottom: -1px;
        left: 0;
        width: 100%;
        height: 4px;
        background: #007bff; /* Active tab indicator */
        border-radius: 4px 4px 0 0;
      }

/* Styling the tab content area */
.tab-content[b-cpa12wc9mk] {
  border: 1px solid #ddd;
  border-top: none;
  padding: 3px;
  background: white;
  border-radius: 0 0 8px 8px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
}
.centered-select[b-cpa12wc9mk] {
  text-align: center;
  text-align-last: center;
}
.narrow-input[b-cpa12wc9mk] {
  max-width: 50px; /* Adjust this value as needed */
  width: 100%; /* Ensures responsiveness */
  text-align: center; /* Centers the number */
  padding-right: 0; /* Ensures no extra padding */
}
.margin-reduced[b-cpa12wc9mk] {
  white-space: nowrap; /* Prevent text from wrapping */
  overflow: hidden; /* Hide overflowing text */
  text-overflow: ellipsis; /* Show "..." when text is cut off */
  max-width: 150px; /* Ensure there's a limit for ellipsis to work */
}

@media (max-width: 1200px) {
  .margin-reduced[b-cpa12wc9mk] {
    max-width: 100px; /* Reduce the width further when the screen is small */
  }
}
.date-input[b-cpa12wc9mk] {
  font-size: 0.8rem;
  padding: 2px 4px;
  height: auto;
  display: inline-block;
  box-sizing: border-box;
  width: 100%; /* Expand to column width */
}
.narrow-column[b-cpa12wc9mk] {
  width: 8ch; /* Or try 100px */
  white-space: nowrap;
}

.date-input[b-cpa12wc9mk] {
  font-size: 0.8rem;
  padding: 2px 4px;
  height: auto;
  display: inline-block;
  box-sizing: border-box;
  width: 100%; /* Expand to column width */
}

.debug-border th[b-cpa12wc9mk] {
  border: 1px solid red;
}

.debug-border td[b-cpa12wc9mk] {
  border: 1px solid blue;
}

.debug-border tr[b-cpa12wc9mk] {
  border: 1px dashed green;
}

.debug-border table[b-cpa12wc9mk] {
  border: 2px solid purple;
}
.save-button-cell[b-cpa12wc9mk] {
  text-align: center;
  width: 80px; /* Reserved width for button space */
}
.textarea-edit[b-cpa12wc9mk] {
  width: 100%;
  min-height: 60px; /* Or whatever makes sense */
  font-size: 0.9rem;
  padding: 4px;
  resize: vertical; /* Let user resize vertically */
}
.notes-input[b-cpa12wc9mk] {
  width: 100%;
  min-width: 150px;
  padding: 4px;
  font-size: 0.9rem;
}

.notes-textarea[b-cpa12wc9mk] {
  width: 100%;
  min-height: 60px;
  padding: 4px;
  font-size: 0.9rem;
  resize: vertical;
}

.fas.fa-expand-arrows-alt[b-cpa12wc9mk],
.fas.fa-compress-arrows-alt[b-cpa12wc9mk] {
  color: #007bff;
}

  .fas.fa-expand-arrows-alt:hover[b-cpa12wc9mk],
  .fas.fa-compress-arrows-alt:hover[b-cpa12wc9mk] {
    color: #0056b3;
  }

/* Prevent clicking outside the modal */
.background-block[b-cpa12wc9mk] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5); /* Translucent grey */
  z-index: 1000;
}

/* Modal Box */
.modal-box[b-cpa12wc9mk] {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  z-index: 1001;
  min-width: 90vw;
  max-width: 90vw;
 height:90vh;
}
.global-close-button[b-cpa12wc9mk] {
  position: fixed;
  top: 20px;
  right: 20px;
  transform: translate(24px, -24px); /* right and up */
  z-index: 1100;
  border: none;
  outline: none;
  cursor: pointer;
  transition: opacity 0.2s ease-out, transform 0.2s ease-out;
}


  .global-close-button:hover[b-cpa12wc9mk] {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
  }



@media (max-width: 600px) {
  .global-close-button[b-cpa12wc9mk] {
    top: 10px;
    right: 10px;
  }
}


/* /Pages/Lab/LabContactDestination.razor.rz.scp.css */

/* 🔹 Wrapper to control the entire section */
.requestor-destination-wrapper[b-4f6f2bk5fr] {
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden; /* ✅ Ensures nothing escapes the wrapper */

}

/* 🔹 Ensure tables adjust to their container */
.requestor-table[b-4f6f2bk5fr] {
  width: 100%;
  table-layout: fixed; /* ✅ Keeps tables inside wrapper */
  max-width: 100%; /* ✅ Ensures no overflow */
  /* 🔲 Add border and style */
  border: 1px solid #dee2e6;
  border-radius: 0.5rem;
  /* 🌫️ Subtle shadow */
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}



  /* 🔹 Table Cells */
  .requestor-table th[b-4f6f2bk5fr], .requestor-table td[b-4f6f2bk5fr] {
    padding: .25rem;
    text-align: left;
    border-bottom: 1px solid #ddd;
  }

  /* 🔹 Make inputs take up most of the cell */
  .requestor-table input[b-4f6f2bk5fr] {
    width: 100%; /* ✅ Full width within their cell */
    max-width: 100%; /* ✅ Prevents exceeding parent container */
    padding: 6px;
    font-size: 0.9rem;
    box-sizing: border-box; /* ✅ Ensures padding doesn't expand width */
  }




/* 🔹 Keep buttons styled consistently */
.btn-sm[b-4f6f2bk5fr] {
  padding: 5px 10px;
  font-size: 0.85rem;
}

/* 🔹 Ensure quantity input does not take up too much space */
.narrow-input[b-4f6f2bk5fr] {
  max-width: 80px;
  text-align: center;
}

td input.quantity-input[b-4f6f2bk5fr] {
  margin: 0 auto;
  display: block;
}
/* /Pages/Lab/LabContactSearch.razor.rz.scp.css */

/* 🔹 Wrapper to control the entire section */
.requestor-destination-wrapper[b-v8t016mwfp] {
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden; /* ✅ Ensures nothing escapes the wrapper */
}

/* 🔹 Ensure tables adjust to their container */
.requestor-table[b-v8t016mwfp] {
  width: 100%;
  table-layout: fixed; /* ✅ Keeps tables inside wrapper */
  max-width: 100%; /* ✅ Ensures no overflow */
  /* 🔲 Add border and style */
  border: 1px solid #dee2e6;
  border-radius: 0.5rem;
  /* 🌫️ Subtle shadow */
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}



/* 🔹 Table Cells */
.requestor-table th[b-v8t016mwfp], .requestor-table td[b-v8t016mwfp]
 {
  padding: .25rem;
  text-align: left;
  border-bottom: 1px solid #ddd;
}

/* 🔹 Make inputs take up most of the cell */
.requestor-table input[b-v8t016mwfp] {
  width: 100%; /* ✅ Full width within their cell */
  max-width: 100%; /* ✅ Prevents exceeding parent container */
  padding: 6px;
  font-size: 0.9rem;
  box-sizing: border-box; /* ✅ Ensures padding doesn't expand width */
}




/* 🔹 Keep buttons styled consistently */
.btn-sm[b-v8t016mwfp] {
  padding: 5px 10px;
  font-size: 0.85rem;
}

/* 🔹 Ensure quantity input does not take up too much space */
.narrow-input[b-v8t016mwfp] {
  max-width: 80px;
  text-align: center;
}
/* /Pages/Lab/LabRequestRecipientDestination.razor.rz.scp.css */
/* 🔹 Requestor & Destination Sections */

.requestor-destination-wrapper[b-nx7bbdf73r] {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;

}

.requestor-container[b-nx7bbdf73r] {
  flex: 1 1 0;
  min-height: 0; /* 🔑 Allows it to shrink within flex */
  overflow-y: auto;
  /*  background: aqua;*/
  margin-bottom: .5rem;
  padding: .5rem;
  border-radius: 8px;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}

.control-container[b-nx7bbdf73r] {
  flex: 0 0 auto; /* 🔒 Fixed height */
/*  background: blue;*/
  padding: 15px;
  border-radius: 8px;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  margin-top: auto; /* 👇 Push to bottom if needed */
}


/* 🔹 Ensure tables adjust to their container */
.requestor-table[b-nx7bbdf73r], .destination-table[b-nx7bbdf73r] {
  width: 100%;
  table-layout: fixed; /* ✅ Keeps tables inside wrapper */
  max-width: 100%; /* ✅ Ensures no overflow */
}

/* 🔹 Make destination table scrollable ONLY vertically */
.destination-table-wrapper[b-nx7bbdf73r] {
  max-height: 200px; /* Allows vertical scrolling after 2 rows */
  overflow-y: auto;
  overflow-x: hidden; /* ✅ Prevents horizontal scrolling */
  border: 1px solid #ddd;
  padding: 5px;
}

/* 🔹 Table Cells */
.requestor-table th[b-nx7bbdf73r], .requestor-table td[b-nx7bbdf73r],
.destination-table th[b-nx7bbdf73r], .destination-table td[b-nx7bbdf73r] {
  padding: 8px;
  text-align: left;
  border-bottom: 1px solid #ddd;
}

/* 🔹 Make inputs take up most of the cell */
.requestor-table input[b-nx7bbdf73r], .destination-table input[b-nx7bbdf73r] {
  width: 100%; /* ✅ Full width within their cell */
  max-width: 100%; /* ✅ Prevents exceeding parent container */
  padding: 6px;
  font-size: 0.9rem;
  box-sizing: border-box; /* ✅ Ensures padding doesn't expand width */
}

/* 🔹 Align Add Destination button with the title */
.destination-container h4[b-nx7bbdf73r] {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* 🔹 Keep buttons styled consistently */
.btn-sm[b-nx7bbdf73r] {
  padding: 5px 10px;
  font-size: 0.85rem;
}

/* 🔹 Ensure quantity input does not take up too much space */
.narrow-input[b-nx7bbdf73r] {
  max-width: 80px;
  text-align: center;
}
/* /Pages/Maintenance/maintenanceControlModal.razor.rz.scp.css */
.flex-container[b-adqvu4lawi] {
    display: flex;
}

.flex-item[b-adqvu4lawi] {
    flex: 1;
}

.flexRowModal[b-adqvu4lawi] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: baseline;
    align-content: flex-end;
    justify-content: flex-end;
    gap: 5px;
}
/* /Pages/Maintenance/MaintenanceMain.razor.rz.scp.css */

@media print {
    @page {
        size: portrait
    }
}
h3[b-k8pimap89r]{
    color:white;
}
.whiteFont[b-k8pimap89r] {
    color: white;

}

.headerRow[b-k8pimap89r] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
}
maxHeight[b-k8pimap89r] {
    max-height: 300px;
    overflow-y: auto;
}
.container-fluid[b-k8pimap89r]{

}

.reducePadding[b-k8pimap89r]{
    padding-top:3px;
    padding-bottom:3px;
}
.mainContainerMaintenance[b-k8pimap89r] {
    display: flex;
    flex-direction: column;
    height: 98vh;
 overflow-y: hidden;
}

.tabContainer[b-k8pimap89r] {
    flex: 0 1 auto;
    margin: 3px;
}

.flex-container[b-k8pimap89r] {
    display: flex;
    justify-content: space-between;
    border-bottom: solid 2px grey;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
}

.tab-nav[b-k8pimap89r] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 5px;
    white-space: nowrap;
}

.tab-link[b-k8pimap89r] {
    padding: 5px;
    border-radius: 5px;
    border: 1px solid #d9d9d9;
    text-decoration: none;
/*    color: #000;
*/
color:white;
    background-color: transparent;
    /*    background-color: #f5f5f5;
*/ margin-right: 5px;
}

.tab-link:hover[b-k8pimap89r] {
        border: 1px solid black
    }

.tab-panel.active[b-k8pimap89r] {
    display: block;
}

.tab-link:not(.active)[b-k8pimap89r] {
    background-color: transparent;
    /*    background-color: #f5f5f5;*/
    /*    color: #000;
*/
    color: white;
}

    .tab-link:not(.active):hover[b-k8pimap89r] {
        background-color:transparent;
/*        background-color: #e6f7ff;*/
    }

.tab-link:last-of-type[b-k8pimap89r] {
    margin-right: 0;
}

.active[b-k8pimap89r] {
    background-color: #007bff; /* pretty/popular blue color */
    color: #fff; /* white text to improve visibility */
    border-radius: 5px;
    border: 1px solid #007bff; /* matching border color */
    border-bottom: none;
    height: 100%;
}


.flex-container[b-k8pimap89r] {
    display: flex;
    justify-content: space-between;

}

.mainContainerMaintenance .flex-item[b-k8pimap89r] {
    flex: 2;
    padding: 1px;
    margin: 1px;
    text-align: center; /* Optional; aligns the text in the center */
}

.mainContainerMaintenance .flex-item1[b-k8pimap89r] {
    flex: 1;
    padding: 1px;
    margin: 1px;
    text-align: right; /* Optional; aligns the text in the center */
}

.bodyContainer1Maintenance[b-k8pimap89r] {
    position: sticky;
    top: 0;
    z-index: 1;
    /*    background-color: aqua;
*/
/*    background-image: linear-gradient(180deg, #3a7bd5 0%, #00d2ff 100%);
*/    background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/86186/wildtextures-dark-wood-board.jpg");
    /*    margin-right: 25px;
*/
}


.bodyContainer2Maintenance[b-k8pimap89r] {
    flex: 1 1 auto;
    overflow-y: auto;
}


.button-container[b-k8pimap89r] {
    display: grid;
    grid-auto-rows: min-content;
    row-gap: 5px; /* Optional: Add some space between the buttons */
}



.btn-outline-white[b-k8pimap89r] {
    color: white;
    border-color: white;
}

    .btn-outline-white:hover[b-k8pimap89r] {
        color: #fff;
        background-color: #007bff;
        border-color: #007bff;
    }

    .btn-outline-white:focus[b-k8pimap89r], .btn-outline-primary.focus[b-k8pimap89r] {
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
    }











.flexRow[b-k8pimap89r] {
    display: flex;
    flex-flow: row nowrap;
    align-items: baseline;
    gap: 2em;
}

.flexGrid[b-k8pimap89r] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.headPicture[b-k8pimap89r] {
    width: 200px;
}

.centerHeader[b-k8pimap89r] {
    display: flex;
    justify-content: center;
}

.parent[b-k8pimap89r] {
    display: flex;
    flex-wrap: wrap;
}

.child[b-k8pimap89r] {
    flex: 1 0 25%;
    margin: 5px;
    height: 100px;
}

img[b-k8pimap89r] {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;
    width: 150px;
}

    img:hover[b-k8pimap89r] {
        transform: scale(1.5);
    }

.column-Header[b-k8pimap89r] {
    display: grid;
}

.statusFont[b-k8pimap89r] {
    font-size: 150%;
}

.nav-link[b-k8pimap89r] {
    cursor: pointer;
}


/* /Pages/Maintenance/MaintenanceModal.razor.rz.scp.css */
.flexRowModal[b-ui2ili7e9s] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: baseline;
    align-content: flex-end;
    justify-content: flex-end;
    gap: 5px;
}
.flexRowModal2[b-ui2ili7e9s] {
    display: flex;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 5px;
}

.flexRowModal2-item[b-ui2ili7e9s] {
    flex-grow: 1;
    flex-basis: 0;
    max-width: 100%;
}

.form-input[b-ui2ili7e9s] {
    margin: 5px;
}

.form-control[b-ui2ili7e9s] {
    margin: 5px;
}

.form-select[b-ui2ili7e9s] {
    margin: 5px;
}

.container-fluid[b-ui2ili7e9s] {
    max-height: 800px;
    overflow-y: auto;
}

.custom-input-file[b-ui2ili7e9s] {
    display: inline-block;
    position: relative;
    overflow: hidden;
    padding: 0;
    cursor: pointer !important;
}

    .custom-input-file input[type="file"][b-ui2ili7e9s] {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        cursor: pointer;
    }

    .custom-input-file .button-text[b-ui2ili7e9s] {
        display: inline-block;
        padding: 0.375rem 0.75rem;
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.5;
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        cursor: pointer;
        border: 1px solid transparent;
        border-radius: 0.25rem;
        background-color: #007bff;
        color: #fff;
    }

        .custom-input-file .button-text:hover[b-ui2ili7e9s] {
            background-color: #0069d9;
        }

        .custom-input-file .button-text:focus[b-ui2ili7e9s] {
            outline: 0;
            box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
        }

        .custom-input-file .button-text:disabled[b-ui2ili7e9s] {
            opacity: 0.65;
            cursor: not-allowed;
        }
.checkbox-label[b-ui2ili7e9s] {
    display: flex;
    align-items: center;
}

    .checkbox-label input[b-ui2ili7e9s] {
        margin-right: 0.5rem;
    }
/* /Pages/Misc/Appellation.razor.rz.scp.css */
.mainContainer[b-uew95s48c7]{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
}

    .mainContainer > div[b-uew95s48c7] {
        flex-basis: 100%;
    }


.headingContainer[b-uew95s48c7] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}
ul[b-uew95s48c7] {
    list-style-type:none;
    padding-left:8px;
}
/* /Pages/Misc/AppellationModal.razor.rz.scp.css */
.mainContainer[b-g9gofvoys7] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

    .mainContainer > div[b-g9gofvoys7] {
        flex-basis: 100%;
    }
    .container-with-columns[b-g9gofvoys7]{
        display:flex;
        flex-direction:row;
        flex-wrap:nowrap;
    }
        .container-with-columns > div[b-g9gofvoys7] {
            flex-basis: 100%;
        }

.row[b-g9gofvoys7] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    min-width: 200px;
    align-items: center;
}
label[b-g9gofvoys7]{
    font-weight:bold;
}
.buttonContainer[b-g9gofvoys7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: solid 1px grey;
}

.flex-start[b-g9gofvoys7] {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    gap: 10px;
    align-items: center;
}
.flex-end[b-g9gofvoys7] {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    gap:10px;
}
.uppercase[b-g9gofvoys7] {
    text-transform: uppercase;
}
/* /Pages/Misc/CountyModal.razor.rz.scp.css */
.mainRow[b-bte725eco9]{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    margin:5px;
    gap:3px;
}
/* /Pages/Misc/Forecast.razor.rz.scp.css */
/* Forecast component - compact weather bar */

.weather-bar[b-gnc8cltlt7] {
    width: 100%;
    padding: 0.75rem 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.weather-loading[b-gnc8cltlt7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    font-size: 0.9rem;
}

.weather-content[b-gnc8cltlt7] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
    justify-content: center;
}

.weather-icon[b-gnc8cltlt7] {
    font-size: 2rem;
    line-height: 1;
}

.weather-icon i[b-gnc8cltlt7] {
    display: block;
}

.weather-temp[b-gnc8cltlt7] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.temp-value[b-gnc8cltlt7] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #212529;
    line-height: 1.2;
}

.temp-range[b-gnc8cltlt7] {
    font-size: 0.8rem;
    color: #6c757d;
}

.weather-condition[b-gnc8cltlt7] {
    font-size: 0.95rem;
    color: #495057;
    text-transform: capitalize;
}

.weather-rain[b-gnc8cltlt7] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.9rem;
    color: #0d6efd;
    padding: 0.25rem 0.5rem;
    background: rgba(13, 110, 253, 0.1);
    border-radius: 1rem;
}

.weather-rain i[b-gnc8cltlt7] {
    font-size: 0.85rem;
}

.weather-location[b-gnc8cltlt7] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    color: #6c757d;
}

.weather-location i[b-gnc8cltlt7] {
    font-size: 0.8rem;
    color: #dc3545;
}

/* ========== MOBILE STYLES ========== */
@media (max-width: 575px) {
    .weather-bar[b-gnc8cltlt7] {
        padding: 0.75rem 0.5rem;
    }

    .weather-content[b-gnc8cltlt7] {
        gap: 0.75rem;
        width: 100%;
    }

    .weather-icon[b-gnc8cltlt7] {
        font-size: 2.5rem;
    }

    .temp-value[b-gnc8cltlt7] {
        font-size: 1.75rem;
    }

    .temp-range[b-gnc8cltlt7] {
        font-size: 0.85rem;
    }

    .weather-condition[b-gnc8cltlt7] {
        display: none; /* Hide on very small screens to save space */
    }

    .weather-location[b-gnc8cltlt7] {
        display: none; /* Hide on mobile - user knows where they are */
    }

    .weather-rain[b-gnc8cltlt7] {
        font-size: 0.95rem;
        min-height: 44px; /* Touch target */
        padding: 0.5rem 0.75rem;
    }
}

/* Tablet */
@media (min-width: 576px) and (max-width: 767px) {
    .weather-content[b-gnc8cltlt7] {
        gap: 1rem;
    }

    .weather-icon[b-gnc8cltlt7] {
        font-size: 2.25rem;
    }
}

/* Desktop - slightly more spacing */
@media (min-width: 992px) {
    .weather-content[b-gnc8cltlt7] {
        gap: 2rem;
    }

    .weather-icon[b-gnc8cltlt7] {
        font-size: 2.5rem;
    }

    .temp-value[b-gnc8cltlt7] {
        font-size: 1.75rem;
    }
}
/* /Pages/Misc/LocatedWithinModal.razor.rz.scp.css */

.mainRow[b-if115rw367] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin: 5px;
    gap: 3px;
}
/* /Pages/Misc/NumberPad.razor.rz.scp.css */
button[b-q0tf7fbzdw]{
  border-radius:50%;
  width: 50px;
  height: 50px;
}
.container[b-q0tf7fbzdw]{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 500px;
  width: 400px;
  background-color: #f5f5f5;
  border:solid 1px #000;

}
.col[b-q0tf7fbzdw]{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding:12px;
}
h1[b-q0tf7fbzdw] {
  text-align: center;
  font-size: 2.2em;
  color: #dfffff;
  position: relative;
  z-index: 2;
}

.entry-illustration[b-q0tf7fbzdw] {
  position: absolute;
}

  .entry-illustration:last-of-type[b-q0tf7fbzdw] {
    margin-right: 0px;
  }

:checked ~ .first-entry[b-q0tf7fbzdw] {
  background-color: #dfffff;
}

:checked ~ :checked ~ .second-entry[b-q0tf7fbzdw] {
  background-color: #dfffff;
}

:checked ~ :checked ~ :checked ~ .third-entry[b-q0tf7fbzdw] {
  background-color: #dfffff;
}

:checked ~ :checked ~ :checked ~ :checked ~ .forth-entry[b-q0tf7fbzdw] {
  background-color: #dfffff;
}

.numberEntry[b-q0tf7fbzdw] {
  background-color: #f5f5f5;
  border: 2px solid #007bff;
  color: #007bff;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  margin: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5em;
  color: #000;
  cursor: pointer;
  transition: 0.3s;
}
/* /Pages/Misc/PartialOverlapSubAVAModal.razor.rz.scp.css */
.mainRow[b-nptu0hujy1] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin: 5px;
    gap: 3px;
}
/* /Pages/Misc/UploadPDFMain.razor.rz.scp.css */
.main-row[b-gqj49te9sj] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 3px;
    width: 100%;
}

.saveButtonRow[b-gqj49te9sj] {
    margin: 4px;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    gap: 5px;
}

.row[b-gqj49te9sj] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 3px;
}

.row2[b-gqj49te9sj] {
    min-height: 20px;
    background-color: lightgray;
}

.col[b-gqj49te9sj] {
    margin: 3px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

.scrollControl[b-gqj49te9sj] {
    max-height:400px;
    overflow-y:auto;
}
.emptySelect[b-gqj49te9sj]{
    min-height:38px;
}
/* /Pages/Projected/progressReport.razor.rz.scp.css */

@media print {
  @page {
    size: portrait;
    max-width: none !important;
  }
}

.flexColumn[b-0fjb0tr48h] {
  width: 100%;
  display: flex;
  flex-direction: column;
  /*flex-wrap:nowrap;*/
  justify-content: center;
  align-content: space-between;
  align-items: center;
}

.flexRow[b-0fjb0tr48h] {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}

.underLine[b-0fjb0tr48h] {
  border-bottom: solid 4px darkgrey;
}

.fontFamily[b-0fjb0tr48h] {
  font-family: 'Comic Neue', cursive;
}

.largeFont[b-0fjb0tr48h] {
  font-size: 7em;
  color: blue
}

.extraLargeFont[b-0fjb0tr48h] {
  font-size: 8em;
  color: red;
}

.mediumFont[b-0fjb0tr48h] {
  font-size: 3.5em;
  color: green
}

/*@import url('https://fonts.googleapis.com/css2?family=Comic+Neue:wght@400;700&display=swap');
*/
/* /Pages/Projected/projectedMain.razor.rz.scp.css */
#blocks[b-d3h536f0xd] {
    border-collapse: collapse;
}

#blocks td[b-d3h536f0xd] {
    padding: 1px;
    margin: 0;
}

tr[b-d3h536f0xd] {
    width: 100%;
}
.trBorder[b-d3h536f0xd]{
    border-bottom:solid 1px grey;
}

table[b-d3h536f0xd] {
    width: 100%;
    border-collapse: collapse;
}

td[b-d3h536f0xd] {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 20px;
}

p[b-d3h536f0xd] {
    margin: 0;
}

#summary[b-d3h536f0xd] {
    margin: 0;
    background-color: white;
}

#sticky[b-d3h536f0xd] {
    position: sticky;
    position: -webkit-sticky;
    background: #f83d23;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    box-shadow: 0 0 6px #000;
    color: #fff;
    top: 2rem;
}

.extra[b-d3h536f0xd], #wrapper[b-d3h536f0xd] {
    width: 75%;
    margin: auto;
    background-color: green;
    height: 800px;
}

body[b-d3h536f0xd] {
    font-family: georgia;
    height: 1000px;
}

h4[b-d3h536f0xd] {
    text-align: center;
}

@media (min-height: 768px) {
    #wrapper[b-d3h536f0xd] {
        height: 2000px;
    }
}

.buttonPaddingClass[b-d3h536f0xd] {
    padding: 1px
}

#buttonPadding[b-d3h536f0xd] {
    padding: 1px
}

.flexRow[b-d3h536f0xd] {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    gap: 3px;
    justify-content: space-between;
}

.flexWrapper[b-d3h536f0xd] {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-auto-rows: auto;
}

button[b-d3h536f0xd] {
    border-radius: 3px;
    vertical-align: middle;
    text-align: center;
}

.buttonColumn[b-d3h536f0xd] {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    gap: 3px;
}

.clientSummaryCard[b-d3h536f0xd] {
    vertical-align: top;
    max-width: 250px;
    padding-left: 3px;
    padding-right: 5px;
}

.mainTable tr[b-d3h536f0xd] {
}

.glowingRow[b-d3h536f0xd] {
  box-shadow: inset 0 0 20px rgba(255, 0, 0, 0.5);
}
/* /Pages/Projected/ProjectionCompleteModal.razor.rz.scp.css */
.flexRow[b-wr1pfyeb67] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap:nowrap;
}
/* /Pages/Projected/ReceiveFruit.razor.rz.scp.css */
.enableScroll[b-lt45sl2y4b]{
  overflow:auto;
}
.container-fluid[b-lt45sl2y4b] {
    max-height: 450px;
    overflow: auto;
}

.vintage[b-lt45sl2y4b] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
}

.vintage2[b-lt45sl2y4b] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    justify-content: space-between;
}

.largeFont[b-lt45sl2y4b] {
    font-size: 2.5em;
}

.mediumFont[b-lt45sl2y4b] {
    font-size: 1em;
}

.hidden[b-lt45sl2y4b] {
    display: none;
}


.flex-Row[b-lt45sl2y4b] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}
.column[b-lt45sl2y4b]{
display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
}

ul.no-bullets[b-lt45sl2y4b] {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
/* /Pages/PumpOver/ColdSoakReport.razor.rz.scp.css */

/* /Pages/PumpOver/PumpOverContractModal.razor.rz.scp.css */
.table-container[b-rcinb6quiq] {
  max-height: 750px; /* Adjust based on your needs */
  overflow-y: auto; /* Enable scrolling for the table body */
  width: 100%; /* Full width for the table */
}

.table thead th[b-rcinb6quiq] {
  position: sticky; /* Stick the thead at the top */
  top: 0; /* Stick it to the top of the table container */
  background-color: deepskyblue; /* Ensure the header doesn't blend with rows scrolling under it */
  z-index: 1; /* Ensure the header stays on top of other content */
}
/*tbody {
  display: block;
  max-height: 750px;*/ /* Same as the container height */
/*overflow-y: auto;
}*/
th[b-rcinb6quiq], td[b-rcinb6quiq] {
  padding: 3px;
  text-align: left;
  border: 1px solid #ddd; /* Add borders to the table */
}

.flicker[b-rcinb6quiq] {
  animation: flicker-b-rcinb6quiq 1s infinite ease-in-out; /* Adjust the '1s' for the speed */
}

@keyframes flicker-b-rcinb6quiq {
  0% {
    transform: rotateY(0deg);
  }

  50% {
    transform: rotateY(180deg);
  }

  100% {
    transform: rotateY(0deg);
  }
}


.highlight-row[b-rcinb6quiq] {
  background-color: #f5f5a5 !important; /* Light yellow background */
}
/* CSS */
.comment-line[b-rcinb6quiq] {
  margin-bottom: 2px; /* Adds spacing between comment lines */
}

  .comment-line span[b-rcinb6quiq] {
    font-weight: bold; /* Makes the labels bold */
  }
/* /Pages/PumpOver/PumpOversMain.razor.rz.scp.css */
.table-container[b-7u0cn1gd5m] {
  max-height: 750px; /* Adjust based on your needs */
  overflow-y: auto; /* Enable scrolling for the table body */
  width: 100%; /* Full width for the table */
}

.table thead th[b-7u0cn1gd5m] {
  position: sticky; /* Stick the thead at the top */
  top: 0; /* Stick it to the top of the table container */
  background-color: deepskyblue; /* Ensure the header doesn't blend with rows scrolling under it */
  z-index: 1; /* Ensure the header stays on top of other content */
}

th[b-7u0cn1gd5m], td[b-7u0cn1gd5m] {
  padding: 3px;
  text-align: left;
  border: 1px solid #ddd; /* Add borders to the table */
}

.flicker[b-7u0cn1gd5m] {
  animation: flicker-b-7u0cn1gd5m 1s infinite ease-in-out; /* Adjust the '1s' for the speed */
}

@keyframes flicker-b-7u0cn1gd5m {
  0% {
    transform: rotateY(0deg);
  }

  50% {
    transform: rotateY(180deg);
  }

  100% {
    transform: rotateY(0deg);
  }
}


.highlight-row[b-7u0cn1gd5m] {
  background-color: #f5f5a5 !important; /* Light yellow background */
}
/* CSS */
.comment-line[b-7u0cn1gd5m] {
  margin-bottom: 2px; /* Adds spacing between comment lines */
}

  .comment-line span[b-7u0cn1gd5m] {
    font-weight: bold; /* Makes the labels bold */
  }
/* /Pages/Settings/LookupItemPanel.razor.rz.scp.css */
.lookup-form[b-bu6f794723] {
    padding: 1.25rem;
}

.form-section[b-bu6f794723] {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
}

.form-section:last-of-type[b-bu6f794723] {
    border-bottom: none;
}

.form-label.required[b-bu6f794723]::after {
    content: " *";
    color: #dc3545;
}

.form-actions[b-bu6f794723] {
    position: sticky;
    bottom: 0;
    background: #fff;
    padding: 1rem 0;
    border-top: 1px solid #dee2e6;
    margin-top: 1rem;
}
/* /Pages/Settings/LookupSettingsPanel.razor.rz.scp.css */
.lookup-settings-list[b-qwc29emt2o] {
    padding: 0.75rem;
}

.table-selector-dropdown[b-qwc29emt2o] {
    margin-bottom: 0.75rem;
}

.list-header[b-qwc29emt2o] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.lookup-settings-edit[b-qwc29emt2o] {
    padding: 1rem;
}

.form-label.required[b-qwc29emt2o]::after {
    content: " *";
    color: #dc3545;
}
/* /Pages/Settings/LookupTablesPage.razor.rz.scp.css */
.lookup-layout[b-3shaanmklk] {
    display: flex;
    gap: 1.5rem;
    min-height: 400px;
}

/* Left sidebar */
.table-selector[b-3shaanmklk] {
    width: 220px;
    flex-shrink: 0;
    border-right: 1px solid #e9ecef;
    padding-right: 1rem;
}

.selector-group[b-3shaanmklk] {
    margin-bottom: 1rem;
}

.selector-group-label[b-3shaanmklk] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6c757d;
    padding: 0.25rem 0.5rem;
    margin-bottom: 0.25rem;
}

.selector-item[b-3shaanmklk] {
    display: block;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    padding: 0.375rem 0.75rem;
    border-radius: 0.375rem;
    color: #495057;
    font-size: 0.875rem;
    cursor: pointer;
    transition: background-color 0.15s;
}

.selector-item:hover[b-3shaanmklk] {
    background-color: #f0f0f0;
}

.selector-item.active[b-3shaanmklk] {
    background-color: #0d6efd;
    color: #fff;
}

/* Right content */
.table-content[b-3shaanmklk] {
    flex: 1;
    min-width: 0;
}

.table-content-header[b-3shaanmklk] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.table-content-header h5[b-3shaanmklk] {
    margin: 0;
}

/* Mobile: stack vertically */
@media (max-width: 768px) {
    .lookup-layout[b-3shaanmklk] {
        flex-direction: column;
    }

    .table-selector[b-3shaanmklk] {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #e9ecef;
        padding-right: 0;
        padding-bottom: 1rem;
    }
}
/* /Pages/Shared/Components/ContactsBusinessAutocomplete.razor.rz.scp.css */
.contacts-business-autocomplete[b-qxmblmtpat] {
    position: relative;
    width: 100%;
}

.input-wrapper[b-qxmblmtpat] {
    position: relative;
    display: flex;
    align-items: center;
}

.input-wrapper input[b-qxmblmtpat] {
    padding-right: 28px;
}

.input-spinner[b-qxmblmtpat],
.input-icon[b-qxmblmtpat] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.8rem;
    pointer-events: none;
}

.input-icon.valid[b-qxmblmtpat] {
    color: var(--bs-success);
}

.dropdown-menu[b-qxmblmtpat] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1050;
    max-height: 200px;
    overflow-y: auto;
    margin-top: 2px;
    padding: 4px 0;
    font-size: 0.875rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 4px;
    background: var(--bs-body-bg);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.dropdown-item[b-qxmblmtpat] {
    display: flex;
    flex-direction: column;
    padding: 6px 12px;
    cursor: pointer;
    border: none;
    background: none;
    width: 100%;
    text-align: left;
}

.dropdown-item:hover[b-qxmblmtpat],
.dropdown-item.active[b-qxmblmtpat] {
    background-color: var(--bs-primary);
    color: white;
}

.dropdown-item.disabled[b-qxmblmtpat] {
    cursor: default;
    font-size: 0.8rem;
}

.dropdown-item.disabled:hover[b-qxmblmtpat] {
    background-color: transparent;
    color: var(--bs-secondary);
}

.business-name[b-qxmblmtpat] {
    font-weight: 500;
}

.bond-number[b-qxmblmtpat] {
    font-size: 0.75rem;
    opacity: 0.8;
}
/* /Pages/Shared/Components/ContactsBusinessPicker.razor.rz.scp.css */
.cb-picker-autocomplete[b-etjs02114d] {
    position: relative;
}

.cb-picker-input-wrapper[b-etjs02114d] {
    position: relative;
}

.cb-picker-icon[b-etjs02114d] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
}

.cb-picker-icon.valid[b-etjs02114d] {
    color: #198754;
}

.cb-picker-dropdown[b-etjs02114d] {
    position: absolute;
    width: 100%;
    max-height: 300px;
    overflow-y: auto;
    z-index: 1050;
}

.cb-picker-dropdown .dropdown-item[b-etjs02114d] {
    display: flex;
    flex-direction: column;
    padding: 0.4rem 0.75rem;
    white-space: normal;
}

.cb-picker-name[b-etjs02114d] {
    font-weight: 500;
}

.cb-picker-detail[b-etjs02114d] {
    display: flex;
    gap: 0.75rem;
    font-size: 0.8rem;
}
/* /Pages/Shared/Components/DbaAutocomplete.razor.rz.scp.css */
.dba-autocomplete[b-j7utoa0ulz] {
    position: relative;
    width: 100%;
}

.input-wrapper[b-j7utoa0ulz] {
    position: relative;
    display: flex;
    align-items: center;
}

.input-wrapper input[b-j7utoa0ulz] {
    padding-right: 28px;
}

.input-spinner[b-j7utoa0ulz],
.input-icon[b-j7utoa0ulz] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.8rem;
    pointer-events: none;
}

.input-icon.valid[b-j7utoa0ulz] {
    color: var(--bs-success);
}

.dropdown-menu[b-j7utoa0ulz] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1050;
    max-height: 250px;
    overflow-y: auto;
    margin-top: 2px;
    padding: 4px 0;
    font-size: 0.875rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 4px;
    background: var(--bs-body-bg);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.dropdown-item[b-j7utoa0ulz] {
    display: flex;
    flex-direction: column;
    padding: 6px 12px;
    cursor: pointer;
    border: none;
    background: none;
    width: 100%;
    text-align: left;
}

.dropdown-item:hover[b-j7utoa0ulz],
.dropdown-item.active[b-j7utoa0ulz] {
    background-color: var(--bs-primary);
    color: white;
}

.dropdown-item.disabled[b-j7utoa0ulz] {
    cursor: default;
    font-size: 0.8rem;
}

.dropdown-item.disabled:hover[b-j7utoa0ulz] {
    background-color: transparent;
    color: var(--bs-secondary);
}

.dropdown-item.create-new[b-j7utoa0ulz] {
    flex-direction: row;
    gap: 0.5rem;
    border-top: 1px solid var(--bs-border-color);
    margin-top: 4px;
    padding-top: 8px;
    color: var(--bs-primary);
    font-weight: 500;
}

.dropdown-item.create-new:hover[b-j7utoa0ulz],
.dropdown-item.create-new.active[b-j7utoa0ulz] {
    background-color: var(--bs-primary);
    color: white;
}

.dba-name[b-j7utoa0ulz] {
    font-weight: 500;
}

.dba-owner[b-j7utoa0ulz] {
    font-size: 0.75rem;
    opacity: 0.8;
}
/* /Pages/Shared/Components/LookupGearButton.razor.rz.scp.css */
.lookup-gear-btn[b-wcogmrjsaf] {
    padding: 0.15rem 0.35rem;
    font-size: 0.75rem;
    line-height: 1;
    flex-shrink: 0;
}
/* /Pages/Shared/Components/TankAutocomplete.razor.rz.scp.css */
.tank-autocomplete[b-otb39sufmk] {
    position: relative;
    width: 100%;
}

.input-wrapper[b-otb39sufmk] {
    position: relative;
    display: flex;
    align-items: center;
}

.input-wrapper input[b-otb39sufmk] {
    padding-right: 28px;
}

.input-spinner[b-otb39sufmk],
.input-icon[b-otb39sufmk] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.8rem;
    pointer-events: none;
}

.input-icon.valid[b-otb39sufmk] {
    color: var(--bs-success);
}

.input-icon.invalid[b-otb39sufmk] {
    color: var(--bs-danger);
}

.dropdown-menu[b-otb39sufmk] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1050;
    max-height: 200px;
    overflow-y: auto;
    margin-top: 2px;
    padding: 4px 0;
    font-size: 0.875rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 4px;
    background: var(--bs-body-bg);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.dropdown-item[b-otb39sufmk] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 12px;
    cursor: pointer;
    border: none;
    background: none;
    width: 100%;
    text-align: left;
}

.dropdown-item:hover[b-otb39sufmk],
.dropdown-item.active[b-otb39sufmk] {
    background-color: var(--bs-primary);
    color: white;
}

.dropdown-item.disabled[b-otb39sufmk] {
    cursor: default;
    font-size: 0.8rem;
}

.dropdown-item.disabled:hover[b-otb39sufmk] {
    background-color: transparent;
    color: var(--bs-secondary);
}

.tank-code[b-otb39sufmk] {
    font-weight: 500;
}

.tank-capacity[b-otb39sufmk] {
    font-size: 0.75rem;
    opacity: 0.8;
}

.invalid-feedback[b-otb39sufmk] {
    font-size: 0.75rem;
    margin-top: 2px;
}
/* /Pages/Vessels/TankBlendBridgeModal.razor.rz.scp.css */
.mainBody[b-z7pyqbu1wu]{
  direction:flex;
flex-direction: column;
max-height:500px;
overflow-y:auto;
}
/* /Pages/Vessels/TankDipInputModal.razor.rz.scp.css */

.bottomButtons[b-4rlgxwgr48] {
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
   gap: 5px;
   align-items: center;
   justify-content: flex-end;
}

.tankMeasurementRow[b-4rlgxwgr48] {
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
   justify-content:space-between;
}
.container[b-4rlgxwgr48]{
   overflow-y:auto;
   max-height: 500px;
}
.container-spinner[b-4rlgxwgr48] {
   position: relative;
   min-height: 100px;
}
.spinner[b-4rlgxwgr48] {
   position: absolute;
   top: 50%;
   left: 50%;
}
/* /Pages/Vessels/TankSpecs.razor.rz.scp.css */
td[b-wd3xqhb77w] {
   text-align: center !important;

}
th[b-wd3xqhb77w] {
   text-align: center !important;
   background-color: #f2f2f2;
   position: sticky;
   top: 0;
   z-index: 998; /* Add this line */
}


table[b-wd3xqhb77w] {
   border-collapse: collapse;
   width: 100%;
}

th[b-wd3xqhb77w], td[b-wd3xqhb77w] {
   padding: 3px;
   text-align: left;
}


.wrapper[b-wd3xqhb77w] {
/*   position:absolute;
*/
   flex: 1;
  
/*   height: calc(100% - 60px);*/
   width: calc(100% - 10px); /* Subtract the height of the navbar (e.g., 60px) */
}

.table-container[b-wd3xqhb77w] {
   height: 100%;
   position: relative;
   overflow: auto;
}
.nowrap-list[b-wd3xqhb77w] {
   /*list-style-type: none;*/ /* Remove bullets from the list */
   padding: 0; /* Remove the default padding from the list */
}

   .nowrap-list li[b-wd3xqhb77w] {
      display: flex; /* Use Flexbox to lay out the label and content */
      align-items: center; /* Vertically center the label and content */
   }

   .nowrap-list label[b-wd3xqhb77w] {
      margin-right: 5px; /* Add space between the label and content */
   }
   .nowrap-list button[b-wd3xqhb77w] {
      white-space: nowrap; /* Prevent the button text from wrapping */
   }

.upper-row[b-wd3xqhb77w] {
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: #f2f2f2;
   padding: 10px 0;
   position: sticky;
 
   z-index: 1000;
}
.mainContainer[b-wd3xqhb77w]{
   border:solid 1px red;
   
}
.sticky-search[b-wd3xqhb77w] {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   background-color: white;
   padding: 10px;
   z-index: 999;
   border: solid 1px red;
}
.flex-container[b-wd3xqhb77w] {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: solid grey 1px;
}
/* /Pages/WineLots/WineLotModal.razor.rz.scp.css */
.arrivalContainer[b-j080kk6atx] {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    justify-content: flex-end;
    align-items: center;
    gap:3px;
}

.vesselContainer[b-j080kk6atx] {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: flex-end;
    align-items: center;
}

.size-extra-large[b-j080kk6atx] {
    min-height: 650px;
}

.buttonContainer[b-j080kk6atx] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: right;
    gap: 10px;
    position: relative;
    bottom: 0px;
    padding-top:15px;
}

.grid[b-j080kk6atx] {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
}

table[b-j080kk6atx] {
    display: grid;
    border-collapse: collapse;
    min-width: 100%;
    grid-template-columns: minmax(100px, 1fr) minmax(150px, 1.67fr) minmax(100px, 1fr) minmax(100px, 1fr);
    overflow-y: scroll;
    max-height: 600px;
    margin: 0px;
}
.child[b-j080kk6atx]{
    border:solid 1px grey;
    padding:3px;
    margin:5px;
}

thead[b-j080kk6atx],
tbody[b-j080kk6atx],
tr[b-j080kk6atx] {
    display: contents;
}

th[b-j080kk6atx],
td[b-j080kk6atx] {
    padding: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

th[b-j080kk6atx] {
    position: sticky;
    top: 0;
    background: #ddd;
    text-align: left;
    font-weight: normal;
    font-size: 1.1rem;
    color: white;
}

    th:last-child[b-j080kk6atx] {
        border: 0;
    }

td[b-j080kk6atx] {
    padding-top: 10px;
    padding-bottom: 10px;
    color: #808080;
}

tr:nth-child(even) td[b-j080kk6atx] {
    background: #f2f2f2;
}

#newLot[b-j080kk6atx]{
 text-transform: uppercase;
}
/* /Pages/WineLots/WineLotsPage.razor.rz.scp.css */

#stickySearch[b-gp9k37ra86] {
    background-color: white;
    position: fixed;
    height: 120px;
    padding: 10px 10px;
    z-index: 1;
    left: 270px;
    box-sizing: border-box;
    width: 100%;
}

#mainList[b-gp9k37ra86] {
    position: relative;
    padding: 0px;
    width: 100%;
}

table[b-gp9k37ra86] {
    margin-top: 120px;
}

.th_main[b-gp9k37ra86] {
    position: sticky;
    top: 120px;
    background-color: white;
}

#MainTable[b-gp9k37ra86] {
    text-align: left;
    position: relative;
    border-collapse: collapse;
}

#category-select[b-gp9k37ra86] {
    left: 0px;
    top: 0px;
    width: 200px;
    text-align: right;
}

    #category-select label[b-gp9k37ra86] {
        float: left;
        margin: 1px;
    }

    #category-select select[b-gp9k37ra86] {
        max-width: 200px;
        margin: 2px;
    }

.tabs[b-gp9k37ra86] {
    display: flex;
    border-bottom: 1px solid #D7DBDD;
}

.tab[b-gp9k37ra86] {
    cursor: pointer;
    padding: 5px 30px;
    color: #16A2D7;
    font-size: 18px;
    border-bottom: 2px solid transparent;
}

    .tab.is-tab-selected[b-gp9k37ra86] {
        border-bottom-color: #4EBBE4;
    }

.flex-container[b-gp9k37ra86] {
    display: flex;
    flex-wrap: nowrap;
    background-color: white;
    width: 100%;
}

    .flex-container > div[b-gp9k37ra86] {
        background-color: white;
        width: 300px;
        margin: 10px;
        text-align: center;
    }

/* /Pages/Winemaking/RecurringEventModal.razor.rz.scp.css */
.recurrence-form[b-8eyjkysa7c] {
  font-family: Arial, sans-serif;
/*  max-width: 600px;
*/  margin: auto;
  margin:0px;
  width:100%;
}

.recurrence-pattern[b-8eyjkysa7c] {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
  border-bottom: 1px solid #ddd;
  width: 100%;
}

.recurrence-options[b-8eyjkysa7c] {
  flex: 1;
  border-right: 1px solid #ddd;
}

.weekly-options[b-8eyjkysa7c] {
  flex: 3;
}

  .recurrence-options label[b-8eyjkysa7c],
  .weekly-options label[b-8eyjkysa7c],
  .date-group label[b-8eyjkysa7c],
  .end-options label[b-8eyjkysa7c] {
    display: block;
    margin: 5px 0;
  }

.checkbox-group[b-8eyjkysa7c] {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.monthly-group[b-8eyjkysa7c] {
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
}

.date-group[b-8eyjkysa7c], .end-options[b-8eyjkysa7c] {
  display: flex;
  flex-direction: column;
}

.small-input[b-8eyjkysa7c] {
  width: 60px;
}
.form-input[type="radio"][b-8eyjkysa7c] {
  /* Resetting any applied styles to default */
  width: auto; /* Resets any previously set width */
  height: auto; /* Resets any previously set height */
  margin: 0 5px 0 0; /* Ensures a small margin to the right of the button */
  vertical-align: middle; /* Aligns radio buttons vertically in line with the text */
}
.recurrence-pattern label[b-8eyjkysa7c],
.range-of-recurrence label[b-8eyjkysa7c] {
  display: block;
  margin: 10px 0;
}

.weekly-options div[b-8eyjkysa7c],
.range-of-recurrence div[b-8eyjkysa7c] {
  margin-left: 20px;
}
.range-of-recurrence[b-8eyjkysa7c] {
  display: flex;
  justify-content: space-between; /* This will space out your columns evenly */
  align-items: center; /* This will vertically align your inputs and labels */
}

.start-column[b-8eyjkysa7c], .end-options-column[b-8eyjkysa7c], .end-by-column[b-8eyjkysa7c] {
  flex: 1; /* This will give each column an equal amount of space */
  display: flex;
  flex-direction: column; /* This will stack the elements in each column on top of each other */
}

.small-input[b-8eyjkysa7c] {
  width: 60px;
  margin-bottom: 10px; /* To provide some space between the number input and the date label */
}

.flex-container[b-8eyjkysa7c] {
  display: flex;
}

.column[b-8eyjkysa7c] {
  flex: 1;
}

.flex-column[b-8eyjkysa7c] {
  display: flex;
  flex-direction: column;
}
.button-row[b-8eyjkysa7c] {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: 10px;
  border-top: 1px solid #ddd;
}

.inline-label[b-8eyjkysa7c] {
  display: flex;
  align-items: center; /* Aligns items vertically in the center */
  justify-content: flex-start; /* Aligns items to the start of the label */
  flex-wrap: nowrap; /* Prevents the items from wrapping */
  white-space:nowrap;
}

.end-options-column label[b-8eyjkysa7c] {
  display: flex;
  align-items: center;
  white-space: nowrap;
}

  .end-options-column label input[type="radio"][b-8eyjkysa7c],
  .end-options-column label input[type="number"][b-8eyjkysa7c] {
    margin-right: 5px;
  }

.end-options-column input[type="number"][b-8eyjkysa7c] {
  text-align: right; /* Align text to the right */
  padding-right: 5px; /* Add padding to the right side */
  width: 75px; /* Adjust width as needed */
}

/*.end-options-column input[type="number"]::-webkit-inner-spin-button,
.end-options-column input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}*/
/* /Pages/Winemaking/WinemakingSchedule.razor.rz.scp.css */
.week-calendar[b-a139efxmbv] {
  margin-top:5px;
  grid-template-rows: auto 1fr;
  height: 95vh;
  overflow-y: hidden;
  display: grid;
  grid-template-rows: auto auto 1fr;
}

.calendar-header[b-a139efxmbv], .calendar-content[b-a139efxmbv] {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}

.calendar-header[b-a139efxmbv] {
  position: sticky;
  top: 0;
  background-color: #f0f0f0;
  z-index: 10;
  box-shadow: 0 2px 2px -1px rgba(0,0,0,0.4);
  max-height: 5vh;
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

  .calendar-header[b-a139efxmbv]::-webkit-scrollbar, .calendar-content[b-a139efxmbv]::-webkit-scrollbar {
    display: none;
  }

  .calendar-header > div[b-a139efxmbv], .calendar-content > div[b-a139efxmbv] {
    border: 1px solid red;
    padding: 3px;
    text-align: center;
  }

.calendar-content[b-a139efxmbv] {
  align-items: start;
  overflow-y: hidden;
  max-height: 90vh;
}

.day-column[b-a139efxmbv] {
  display: flex;
  flex-direction: column;
}

.day-number[b-a139efxmbv] {
  text-align: center;
  background-color: #f0f0f0;
  padding: 10px;
  border-bottom: 1px solid #ddd;
}

.day-content[b-a139efxmbv] {
  flex-grow: 1;
  padding: 10px;
}

*[b-a139efxmbv] {
  box-sizing: border-box;
}

.content-column[b-a139efxmbv] {
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  max-height: 80vh;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.button-container[b-a139efxmbv] {
  display: flex;
  flex-direction: row;
  flex-grow: 0;
  justify-content:space-between
}

.content-column[b-a139efxmbv]::-webkit-scrollbar {
  display: none;
}


.content-column > div[b-a139efxmbv], .team-cell[b-a139efxmbv], .team-cell-header[b-a139efxmbv] {
  border: 1px solid #ccc; /* Softer border color */
  padding: 3px;
  text-align: center;
  background-color: #f0f7ff; /* Soft blue as the base background color */
}

  .content-column > div:hover[b-a139efxmbv], .team-cell:hover[b-a139efxmbv], .team-cell-header:hover[b-a139efxmbv] {
    background: linear-gradient(to right, #e6f2e4, #faf3e0); /* Gradient from pastel green to warm beige */
    cursor: pointer; /* Ensures it's clear these are interactive elements */
  }

  .content-column > div:active[b-a139efxmbv], .team-cell:active[b-a139efxmbv], .team-cell-header:active[b-a139efxmbv] {
    background-color: #f3e8ff; /* Light lavender for an active or selected state */
  }

/* Additional styling for the team-cell-header to differentiate from team-cell */
.team-cell-header[b-a139efxmbv] {
  display: flex;
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content: space-between;
  align-items: center;
  border-radius: 5px; /* Adds rounded corners to the header for a more polished look */
  font-weight: bold; /* Optional: makes the header text bold */
}

.btn-outline-primary[b-a139efxmbv] {
  visibility: hidden;
}

.btn-container:hover .btn-outline-primary[b-a139efxmbv] {
  visibility: visible;
}
.btn-outline-primary[b-a139efxmbv]{
  padding:3px;
}
/* /Pages/Winemaking/winemakingschedulemodal.razor.rz.scp.css */
.main-container[b-ezgqocsng7]{
  display: flex;
  flex-direction: column;
  max-height: 70vh;
  overflow-y: auto;
}

.header-row[b-ezgqocsng7]{
  display: flex;
  flex-direction:row;
  flex-wrap:wrap;
  justify-content: space-between;
  align-items: center;
  padding: 5px;
  border-bottom: 1px solid #ddd;
}

.grey-x:hover[b-ezgqocsng7] {
  cursor: pointer;
}

.grey-x[b-ezgqocsng7] {
  width: 30px;
  height: 30px;
  background-color: grey;
  border-radius: 50%; /* Make it round */
  position: relative;
}

  .grey-x[b-ezgqocsng7]::before,
  .grey-x[b-ezgqocsng7]::after {
    content: '';
    position: absolute;
    width: 5px;
    height: 12px; /* Adjust height to make it smaller */
    background-color: white;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .grey-x[b-ezgqocsng7]::before {
    transform: translate(-50%, -50%) rotate(45deg);
  }

  .grey-x[b-ezgqocsng7]::after {
    transform: translate(-50%, -50%) rotate(-45deg);
  }

.button-row[b-ezgqocsng7] {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: 10px;
  border-top: 1px solid #ddd;
}

.blue-plus:hover[b-ezgqocsng7] {
  cursor: pointer;
}

.blue-plus[b-ezgqocsng7] {
  width: 30px;
  height: 30px;
  background-color: blue; /* Changed to blue */
  border-radius: 50%; /* Make it round */
  position: relative;
}

  .blue-plus[b-ezgqocsng7]::before,
  .blue-plus[b-ezgqocsng7]::after {
    content: '';
    position: absolute;
    width: 5px;
    height: 12px; /* Adjust height to make it smaller */
    background-color: white;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .blue-plus[b-ezgqocsng7]::before {
    transform: translate(-50%, -50%) rotate(90deg);
  }

  .blue-plus[b-ezgqocsng7]::after {
    transform: translate(-50%, -50%);
  }
.red-x:hover[b-ezgqocsng7] {
  cursor: pointer;
}

.red-x[b-ezgqocsng7] {
  width: 30px;
  height: 30px;
  background-color: red; /* Changed to red */
  border-radius: 50%; /* Make it round */
  position: relative;
}

  .red-x[b-ezgqocsng7]::before,
  .red-x[b-ezgqocsng7]::after {
    content: '';
    position: absolute;
    width: 5px;
    height: 12px; /* Adjust height to make it smaller */
    background-color: white;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .red-x[b-ezgqocsng7]::before {
    transform: translate(-50%, -50%) rotate(45deg);
  }

  .red-x[b-ezgqocsng7]::after {
    transform: translate(-50%, -50%) rotate(-45deg);
  }
.centered-cell[b-ezgqocsng7] {
  text-align: center;
  vertical-align: middle;
}

  .centered-cell > div[b-ezgqocsng7] {
    display: inline-block;
  }

/* /Pages/WineProfile/wineprofilemain.razor.rz.scp.css */
.wrapper[b-iopj0ls7iz] {
  display: flex;
  flex-flow: row wrap;
  font-weight: bold;
  text-align: center;
  height: 95vh;
  margin-top: 5px;
  overflow: hidden;
  border-radius: 10px 10px 10px 10px;
}

  .wrapper > *[b-iopj0ls7iz] {
    padding: 10px;
    flex: 1 100%;
  }


.header[b-iopj0ls7iz] {
  background: linear-gradient(135deg, #E0F2FF 0%, #B0D1FF 60%, #B0C4DE 100%);
  color: black;
  padding: 10px 20px;
  border-bottom: 1px solid #B0B0B0;
  border-radius: 10px 10px 10px 10px;
  height: 10vh;
}

.headerRow[b-iopj0ls7iz] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}

  .headerRow > *[b-iopj0ls7iz] {
    display: flex;
    align-items: center;
    justify-content: center;
  }

.footer[b-iopj0ls7iz] {
  max-width: 100vw;
  height: 12vh;
  background: linear-gradient(135deg, #E0F2FF 0%, #B0D1FF 60%, #B0C4DE 100%);
  color: #333333; /* Dark text for readability */
/*  padding: 10px 10px;*/
  border: 1px solid #B0B0B0; /* Nickel grey border */
  border-radius: 10px 10px 10px 10px; /* Rounded corners at the bottom */
  overflow: hidden; /* Hide any content that overflows the container */
/*  margin-bottom:10px;*/
}

.card-containerFooter[b-iopj0ls7iz] {
  display: flex;
  overflow-x: auto; /* Allow horizontal scrolling */
  gap: 10px; /* Adjust the spacing between cards */
  height: 100%;
}

  .card-containerFooter[b-iopj0ls7iz]::-webkit-scrollbar {
    height: 10px; /* Set the height of the scrollbar */
  }

  .card-containerFooter[b-iopj0ls7iz]::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey; /* Add some shadow for a 3D effect */
    border-radius: 10px; /* Rounded corners */
  }

  .card-containerFooter[b-iopj0ls7iz]::-webkit-scrollbar-thumb {
    background: #B0B0B0; /* Nickel grey color for the scrollbar thumb */
    border-radius: 10px; /* Rounded corners */
  }


.card-container[b-iopj0ls7iz] {
  display: flex;
  overflow-x: scroll; /* Allow horizontal scrolling */
}


.cards[b-iopj0ls7iz] {
  display: flex;
  gap: 10px; /* Adjust the spacing between cards */
}

.card[b-iopj0ls7iz] {
  flex: 0 0 auto;
  width: calc(10vw - 20px); /* Adjust the width proportionally */
  height: calc(10vh - 20px); /* Adjust the height proportionally */
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden; /* Hide any content that overflows the card */
  scroll-snap-align: start;
}

  .card:hover[b-iopj0ls7iz] {
    transform: scale(1.1);
    cursor: pointer;
    z-index: 1; /* Ensure the card appears on top during hover */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s, box-shadow 0.2s; /* Smooth transition */
    border-radius: 10px;
    overflow: hidden; /* Hide any content that overflows the card */
  }

  .card p[b-iopj0ls7iz] {
    font-weight: bold;
    text-align: center; /* Center text horizontally within the card */
    margin: 0;
  }

.primary[b-iopj0ls7iz] {
  text-align: left;
  background: linear-gradient(135deg, #E0F2FF 0%, #B0D1FF 60%, #B0C4DE 100%);
  overflow-y: auto;
  flex-grow: 1;
  height: 76vh;
  border: 1px solid #B0B0B0; /* Nickel grey border */
  border-radius: 10px;
}

.aside-1[b-iopj0ls7iz] {
  background: linear-gradient(135deg, #E0F2FF 0%, #B0D1FF 60%, #B0C4DE 100%);
  /*background: #f4f4f4;*/ /* Light grey background */
  overflow-y: auto;
  height: 76vh;
  border: 1px solid #B0B0B0; /* Nickel grey border */
  border-radius: 10px;
}

.aside-2[b-iopj0ls7iz] {
  background: linear-gradient(135deg, #E0F2FF 0%, #B0D1FF 60%, #B0C4DE 100%);
  /*background: #f4f4f4;*/ /* Light grey background */
  overflow-y: auto;
  height: 76vh;
  border: 1px solid #B0B0B0; /* Nickel grey border */
  border-radius: 10px;
}

#myList[b-iopj0ls7iz] {
  list-style: none;
  padding: 0;
  margin: 0;
}

.custom-link[b-iopj0ls7iz] {
  color: inherit; /* Use the same color as the parent's font color */
  text-decoration: underline; /* Add underline to simulate a link */
  cursor: pointer; /* Change cursor to pointer on hover */
  transition: color 0.2s; /* Smooth transition for color change */
  text-align: left; /* Align text to the left */
}

  .custom-link:hover[b-iopj0ls7iz] {
    color: blue; /* Change color on hover */
  }

.grid-card-container[b-iopj0ls7iz] {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.grid-card[b-iopj0ls7iz] {
  padding: 3px;
  width: 350px;
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  transition: transform 0.3s, box-shadow 0.3s;
}
.grid-card-wide[b-iopj0ls7iz] {
  padding: 3px;
  width: 450px;
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  transition: transform 0.3s, box-shadow 0.3s;
}

.grid-row[b-iopj0ls7iz] {
  display: flex; /* Use flex layout for horizontal alignment */
  gap: 5px; /* Adjust gap between items in the row */
  padding: 1px;
}

.spaceBetween[b-iopj0ls7iz] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}

.grid-item[b-iopj0ls7iz] {
  width: 25%;
  text-align: center; /* Optional: to center the text within each div */
}

.grid-card p[b-iopj0ls7iz] {
  font-weight: bold;
  text-align: center;
  margin: 0;
}

.grid-card:hover[b-iopj0ls7iz] {
  /*transform: scale(1.1);*/
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.columnQty[b-iopj0ls7iz] {
  display: flex;
  flex-direction: column; /* Organize the content vertically */
  gap: 2px; /* Adjust the gap between rows */
  align-items: flex-start; /* Align items to the start */
}



@media all and (min-width: 600px) {
  .aside[b-iopj0ls7iz] {
    flex: 1 0 0;
  }
}

@media all and (min-width: 800px) {
  .primary[b-iopj0ls7iz] {
    flex: 3 0px;
  }

  .aside-1[b-iopj0ls7iz] {
    order: 1;
  }

  .primary[b-iopj0ls7iz] {
    order: 2;
  }

  .aside-2[b-iopj0ls7iz] {
    order: 3;
  }

  .footer[b-iopj0ls7iz] {
    order: 4;
  }
}

*[b-iopj0ls7iz] {
  box-sizing: border-box;
}

.home-button[b-iopj0ls7iz] {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px; /* Adjust as needed */
  border: none;
  background: none;
  cursor: pointer;
}

.home-icon[b-iopj0ls7iz] {
  color: blue; /* Set the icon color to blue */
  font-size: 24px; /* Adjust the size as needed */
  overflow: hidden; /* Prevent overflow */
}
ul li[b-iopj0ls7iz]{
  list-style:none;
}
.wineLotItem:hover[b-iopj0ls7iz]{
  cursor:pointer;
  box-shadow:0 10px 20px rgba(0,0,0,0.2);
  border-radius:10px;
}
select[b-iopj0ls7iz] {
  box-shadow: 0 10px 20px rgba(0,0,0,0.2);
  border-radius: 10px;
  width:max-content;
}

.tankItem[b-iopj0ls7iz] {
  border-radius: 10px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); /* Slightly reduced shadow */
  transition: box-shadow 0.3s ease; /* Add a transition for smoother hover effect */
}

  .tankItem:hover[b-iopj0ls7iz] {
    cursor: pointer;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3); /* Increased shadow on hover */
    border-radius: 15px; /* Slightly increased border radius on hover */
  }

  .tankHeader[b-iopj0ls7iz]{
    background: linear-gradient(135deg, #E0F2FF 0%, #B0D1FF 60%, #B0C4DE 100%);
    color: black;
    padding: 10px 20px;
    border-bottom: 1px solid #B0B0B0;
    border-radius: 10px 10px 10px 10px;
/*   max-height: 10vh;
*/   overflow-y:hidden;
  }

  .tankBody[b-iopj0ls7iz]{
    height:90%;
overflow-y:auto;
  }


.round-button[b-iopj0ls7iz] {
  background-color: #007bff;
  color: white;
  border: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
/* /Shared/CloudinaryImageUploader.razor.rz.scp.css */
.cloudinary-uploader[b-pxulqhjwk4] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.upload-btn[b-pxulqhjwk4] {
    min-height: 48px; /* Touch-friendly minimum */
    min-width: 160px;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

/* Mobile-first: larger touch targets */
@media (max-width: 768px) {
    .upload-btn[b-pxulqhjwk4] {
        min-height: 56px;
        min-width: 100%;
        font-size: 1.1rem;
    }
    
    .upload-btn i[b-pxulqhjwk4] {
        font-size: 1.4rem;
    }
}

.upload-preview[b-pxulqhjwk4] {
    position: relative;
    display: inline-block;
    max-width: 200px;
}

.preview-image[b-pxulqhjwk4] {
    max-width: 100%;
    max-height: 150px;
    border-radius: 8px;
    border: 1px solid #dee2e6;
    object-fit: contain;
}

.pdf-preview[b-pxulqhjwk4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    color: #dc3545;
}

.pdf-preview i[b-pxulqhjwk4] {
    font-size: 1.5rem;
}

.pdf-preview span[b-pxulqhjwk4] {
    color: #495057;
    font-size: 0.875rem;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.remove-btn[b-pxulqhjwk4] {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 28px;
    height: 28px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: white;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.remove-btn:hover[b-pxulqhjwk4] {
    background: #dc3545;
    color: white;
    border-color: #dc3545;
}

/* Camera icon emphasis for mobile */
@media (max-width: 768px) {
    .upload-btn .bi-camera-fill[b-pxulqhjwk4] {
        font-size: 1.5rem;
    }
}

/* Quick action buttons - 3-column grid */
.quick-upload-actions[b-pxulqhjwk4] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    width: 100%;
}

.quick-btn[b-pxulqhjwk4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 72px;
    padding: 0.75rem 0.5rem;
    background: #f8f9fa;
    border: 2px dashed #dee2e6;
    border-radius: 12px;
    cursor: pointer;
    transition: transform 0.15s, box-shadow 0.15s;
    -webkit-tap-highlight-color: transparent;
}

.quick-btn:active[b-pxulqhjwk4] {
    transform: scale(0.95);
}

.quick-btn:disabled[b-pxulqhjwk4],
.quick-btn.disabled[b-pxulqhjwk4] {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

.quick-btn:disabled:active[b-pxulqhjwk4],
.quick-btn.disabled:active[b-pxulqhjwk4] {
    transform: none;
}

/* Visually hidden but accessible - for file inputs triggered by labels */
.visually-hidden[b-pxulqhjwk4] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.quick-btn i[b-pxulqhjwk4] {
    font-size: 1.5rem;
    margin-bottom: 0.25rem;
}

.quick-btn span[b-pxulqhjwk4] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* Camera button - blue theme */
.quick-btn.camera-btn[b-pxulqhjwk4] {
    background: linear-gradient(135deg, #e7f3ff 0%, #dbeafe 100%);
    border-color: #93c5fd;
    color: #1d4ed8;
}

/* Gallery button - green theme */
.quick-btn.gallery-btn[b-pxulqhjwk4] {
    background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
    border-color: #86efac;
    color: #15803d;
}

/* More button - neutral */
.quick-btn.more-btn[b-pxulqhjwk4] {
    background: #f1f5f9;
    border-color: #cbd5e1;
    color: #475569;
}

/* Upload progress bar */
.upload-progress-bar[b-pxulqhjwk4] {
    width: 100%;
    height: 36px;
    background: #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    margin-top: 0.5rem;
}

.upload-progress-bar .progress-fill[b-pxulqhjwk4] {
    height: 100%;
    background: linear-gradient(90deg, #3b82f6 0%, #60a5fa 100%);
    animation: progress-pulse-b-pxulqhjwk4 1.5s ease-in-out infinite;
    width: 30%;
}

@keyframes progress-pulse-b-pxulqhjwk4 {
    0%, 100% { opacity: 1; width: 30%; }
    50% { opacity: 0.7; width: 70%; }
}

.upload-progress-bar .progress-text[b-pxulqhjwk4] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 500;
    color: #1e293b;
}

/* Improved mobile preview */
@media (max-width: 768px) {
    .upload-preview[b-pxulqhjwk4] {
        width: 100%;
        max-width: none;
        margin-top: 0.75rem;
    }

    .preview-image[b-pxulqhjwk4] {
        width: 100%;
        max-height: 200px;
        object-fit: contain;
        border-radius: 12px;
    }

    /* Larger remove button for touch */
    .remove-btn[b-pxulqhjwk4] {
        width: 40px;
        height: 40px;
        top: -12px;
        right: -12px;
        font-size: 1rem;
    }
}

/* Responsive: show quick actions on mobile, single button on desktop */
.has-quick-actions .desktop-upload-btn[b-pxulqhjwk4] {
    display: none;
}

@media (min-width: 769px) {
    .has-quick-actions .quick-upload-actions[b-pxulqhjwk4] {
        display: none;
    }

    .has-quick-actions .desktop-upload-btn[b-pxulqhjwk4] {
        display: flex;
    }
}

/* ============================================
   Crop Overlay - Fullscreen image cropping UI
   ============================================ */

/* Backdrop ensures nothing behind is clickable */
.crop-overlay-backdrop[b-pxulqhjwk4] {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.9);
    pointer-events: all;
}

.crop-overlay[b-pxulqhjwk4] {
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: #1a1a1a;
    display: flex;
    flex-direction: column;
    /* Safe area for notched phones */
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
}

.crop-overlay-header[b-pxulqhjwk4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background: rgba(0, 0, 0, 0.8);
    flex-shrink: 0;
}

.crop-title[b-pxulqhjwk4] {
    color: white;
    font-size: 1.1rem;
    font-weight: 600;
}

.crop-cancel-btn[b-pxulqhjwk4],
.crop-confirm-btn[b-pxulqhjwk4] {
    border: none;
    border-radius: 6px;
    padding: 0.6rem 1rem;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    min-width: 80px;
    min-height: 44px;
}

.crop-cancel-btn[b-pxulqhjwk4] {
    background: rgba(255, 255, 255, 0.1);
    color: white;
}

.crop-confirm-btn[b-pxulqhjwk4] {
    background: #22c55e;
    color: white;
}

.crop-cancel-btn:active[b-pxulqhjwk4] {
    background: rgba(255, 255, 255, 0.2);
}

.crop-confirm-btn:active[b-pxulqhjwk4] {
    background: #16a34a;
}

.crop-container[b-pxulqhjwk4] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    min-height: 0;
    padding: 1rem;
}

.crop-container img[b-pxulqhjwk4] {
    max-width: 100%;
    max-height: 100%;
    display: block;
}

.crop-overlay-footer[b-pxulqhjwk4] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    background: rgba(0, 0, 0, 0.8);
    flex-shrink: 0;
}

/* Mobile optimizations for crop overlay */
@media (max-width: 768px) {
    .crop-overlay-header[b-pxulqhjwk4] {
        padding: 0.5rem 0.75rem;
    }

    .crop-title[b-pxulqhjwk4] {
        font-size: 1rem;
    }

    .crop-cancel-btn[b-pxulqhjwk4],
    .crop-confirm-btn[b-pxulqhjwk4] {
        font-size: 1.1rem;
        padding: 0.6rem 1rem;
        min-width: 85px;
        min-height: 48px;
    }

    .crop-container[b-pxulqhjwk4] {
        padding: 0.5rem;
    }

    .crop-overlay-footer[b-pxulqhjwk4] {
        padding: 0.5rem 0.75rem;
        padding-bottom: calc(0.5rem + env(safe-area-inset-bottom));
    }

    .crop-overlay-footer .btn[b-pxulqhjwk4] {
        font-size: 0.8rem;
        padding: 0.4rem 0.75rem;
    }
}
/* /Shared/DailyFlowLayout.razor.rz.scp.css */
/* Full viewport height layout - no page scrollbar */
.dailyflow-container[b-wr1hj25eeq] {
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow: hidden;
}

.dailyflow-content[b-wr1hj25eeq] {
  flex: 1;
  display: flex;
  overflow: hidden;
  min-height: 0; /* Important for flex children to shrink */
}

.dailyflow-main[b-wr1hj25eeq] {
  flex: 0 0 75%;
  overflow-y: auto;
  padding: 0.5rem;
}

.dailyflow-sidebar[b-wr1hj25eeq] {
  flex: 0 0 25%;
  overflow-y: auto;
  background-color: #f8f9fa;
  padding: 0.5rem;
  border-left: 1px solid #dee2e6;
}

/* Override Bootstrap container padding for this layout */
.content[b-wr1hj25eeq] {
  margin-top: 0;
  padding-top: 0 !important;
}

.col-9[b-wr1hj25eeq], .col-3[b-wr1hj25eeq] {
  padding: 0;
}

/* Scrollable list inside sidebar */
.scrollable-list[b-wr1hj25eeq] {
  height: 100%;
  overflow-y: auto;
  background-color: #f8f9fa;
}

/* Sidebar collapsed state */
.sidebar-collapsed .dailyflow-main[b-wr1hj25eeq] {
  flex: 1 1 100%;
}

.sidebar-collapsed .dailyflow-sidebar[b-wr1hj25eeq] {
  flex: 0 0 0;
  width: 0;
  padding: 0;
  border: none;
  overflow: hidden;
  transition: all 0.2s ease;
}

/* Smooth transition for sidebar */
.dailyflow-sidebar[b-wr1hj25eeq] {
  transition: all 0.2s ease;
}

.dailyflow-main[b-wr1hj25eeq] {
  transition: flex 0.2s ease;
}

/* ========== Mobile Responsive Breakpoints ========== */

/* Phone - hide sidebar completely */
@media (max-width: 480px) {
  .dailyflow-sidebar[b-wr1hj25eeq] {
    display: none;
  }

  .dailyflow-main[b-wr1hj25eeq] {
    flex: 1 1 100%;
  }
}

/* Tablet - make sidebar narrower or hide */
@media (max-width: 768px) and (min-width: 481px) {
  .dailyflow-sidebar[b-wr1hj25eeq] {
    flex: 0 0 30%;
  }

  .dailyflow-main[b-wr1hj25eeq] {
    flex: 0 0 70%;
  }
}
/* /Shared/DataGrid/NwcDataGrid.razor.rz.scp.css */
.nwc-datagrid[b-divib39lc7] {
    border: 1px solid #dee2e6;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}

/* Loading overlay */
.loading-overlay[b-divib39lc7] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3rem;
}

/* Empty state */
.empty-state[b-divib39lc7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    color: #6c757d;
}

.empty-state i[b-divib39lc7] {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
}

/* Desktop table */
.table-desktop[b-divib39lc7] {
    overflow-x: auto;
}

.table-desktop table[b-divib39lc7] {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
}

.table-desktop thead[b-divib39lc7] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #f8f9fa;
}

.table-desktop th[b-divib39lc7] {
    padding: 0.625rem 0.75rem;
    border-bottom: 2px solid #dee2e6;
    font-weight: 600;
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: #495057;
    white-space: nowrap;
    user-select: none;
}

.table-desktop th.sortable[b-divib39lc7] {
    cursor: pointer;
}

.table-desktop th.sortable:hover[b-divib39lc7] {
    color: #0d6efd;
}

.table-desktop th.active-sort[b-divib39lc7] {
    color: #0d6efd;
}

.sort-icon[b-divib39lc7] {
    font-size: 0.75rem;
    margin-left: 0.25rem;
    vertical-align: middle;
}

.table-desktop td[b-divib39lc7] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #e9ecef;
    vertical-align: middle;
    font-size: 0.875rem;
}

.table-desktop tbody tr[b-divib39lc7] {
    cursor: pointer;
    transition: background-color 0.1s;
}

.table-desktop tbody tr:hover[b-divib39lc7] {
    background-color: #f8f9fa;
}

.action-header[b-divib39lc7] {
    width: 1%;
    white-space: nowrap;
}

.action-cell[b-divib39lc7] {
    white-space: nowrap;
    text-align: right;
}

/* Mobile cards */
.cards-mobile[b-divib39lc7] {
    display: none;
}

.mobile-card[b-divib39lc7] {
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 0.75rem;
    margin: 0.5rem;
    cursor: pointer;
    transition: background-color 0.1s;
}

.mobile-card:hover[b-divib39lc7] {
    background-color: #f8f9fa;
}

.card-body[b-divib39lc7] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1rem;
}

.card-field[b-divib39lc7] {
    display: flex;
    flex-direction: column;
}

.card-field.priority-1[b-divib39lc7] {
    width: 100%;
    font-weight: 600;
    font-size: 1rem;
    flex-direction: row;
    justify-content: space-between;
}

.card-field.priority-1 .card-label[b-divib39lc7] {
    display: none;
}

.card-field.priority-2[b-divib39lc7],
.card-field.priority-3[b-divib39lc7] {
    font-size: 0.875rem;
}

.card-label[b-divib39lc7] {
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #6c757d;
}

.card-actions[b-divib39lc7] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e9ecef;
}

.card-actions[b-divib39lc7]  .btn {
    min-height: 44px;
    min-width: 44px;
}

@media (max-width: 768px) {
    .table-desktop[b-divib39lc7] {
        display: none;
    }

    .cards-mobile[b-divib39lc7] {
        display: block;
    }
}
/* /Shared/DataGrid/NwcDataGridToolbar.razor.rz.scp.css */
.nwc-datagrid-toolbar[b-0rx2krgqkj] {
    padding: 0.75rem;
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

.toolbar-top[b-0rx2krgqkj] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.toolbar-search[b-0rx2krgqkj] {
    flex: 1;
    position: relative;
    max-width: 400px;
}

.toolbar-search .search-icon[b-0rx2krgqkj] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
    z-index: 1;
}

.toolbar-search input[b-0rx2krgqkj] {
    padding-left: 2.25rem;
    padding-right: 2.25rem;
}

.toolbar-search .btn-clear[b-0rx2krgqkj] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: none;
    color: #6c757d;
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
}

.toolbar-search .btn-clear:hover[b-0rx2krgqkj] {
    color: #212529;
}

.toolbar-count[b-0rx2krgqkj] {
    white-space: nowrap;
}

/* Filter dropdowns */
.toolbar-filters[b-0rx2krgqkj] {
    display: flex;
    gap: 0.375rem;
    align-items: center;
}

.filter-dropdown[b-0rx2krgqkj] {
    position: relative;
}

.filter-dropdown-toggle[b-0rx2krgqkj] {
    border-radius: 50rem;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    min-height: 32px;
    font-size: 0.8125rem;
    white-space: nowrap;
}

.filter-dropdown-toggle .badge[b-0rx2krgqkj] {
    font-size: 0.6875rem;
}

.filter-dropdown-menu[b-0rx2krgqkj] {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1050;
    min-width: 180px;
    max-height: 280px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
    padding: 0.25rem 0;
    margin-top: 0.25rem;
}

.filter-dropdown-item[b-0rx2krgqkj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    cursor: pointer;
    font-size: 0.8125rem;
    white-space: nowrap;
    margin: 0;
}

.filter-dropdown-item:hover[b-0rx2krgqkj] {
    background-color: #f8f9fa;
}

.filter-dropdown-item input[type="checkbox"][b-0rx2krgqkj] {
    flex-shrink: 0;
}

.filter-item-label[b-0rx2krgqkj] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}

.filter-dropdown-item .badge[b-0rx2krgqkj] {
    font-size: 0.6875rem;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .toolbar-top[b-0rx2krgqkj] {
        flex-direction: column;
        align-items: stretch;
    }

    .toolbar-search[b-0rx2krgqkj] {
        max-width: none;
    }

    .toolbar-count[b-0rx2krgqkj] {
        text-align: right;
    }

    .toolbar-filters[b-0rx2krgqkj] {
        flex-wrap: wrap;
    }

    .filter-dropdown-toggle[b-0rx2krgqkj] {
        min-height: 44px;
    }
}
/* /Shared/ImageUploader.razor.rz.scp.css */
.image-uploader[b-3ij4ioq29c] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.upload-btn[b-3ij4ioq29c] {
    min-height: 48px;
    min-width: 160px;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    cursor: pointer;
}

/* Mobile-first: larger touch targets */
@media (max-width: 768px) {
    .upload-btn[b-3ij4ioq29c] {
        min-height: 56px;
        min-width: 100%;
        font-size: 1.1rem;
    }
    
    .upload-btn i[b-3ij4ioq29c] {
        font-size: 1.4rem;
    }
}

.upload-preview[b-3ij4ioq29c] {
    position: relative;
    display: inline-block;
    max-width: 200px;
}

.preview-image[b-3ij4ioq29c] {
    max-width: 100%;
    max-height: 150px;
    border-radius: 8px;
    border: 1px solid #dee2e6;
    object-fit: contain;
}

.pdf-preview[b-3ij4ioq29c] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 8px;
}

.pdf-preview i[b-3ij4ioq29c] {
    font-size: 1.5rem;
}

.pdf-preview span[b-3ij4ioq29c] {
    color: #495057;
    font-size: 0.875rem;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.remove-btn[b-3ij4ioq29c] {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 28px;
    height: 28px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: white;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.remove-btn:hover[b-3ij4ioq29c] {
    background: #dc3545;
    color: white;
    border-color: #dc3545;
}

@media (max-width: 768px) {
    .upload-btn .bi-camera-fill[b-3ij4ioq29c] {
        font-size: 1.5rem;
    }
}
/* /Shared/MainLayout.razor.rz.scp.css */
.page[b-xoa4iblbny] {
  position: relative;
  display: flex;
  flex-direction: column;
}

.custom[b-xoa4iblbny] {
  padding-right: 0.5rem !important;
  padding-left: 0.5rem !important;
}

main[b-xoa4iblbny] {
  flex: 1;
}

.sidebar[b-xoa4iblbny] {
  background-image: linear-gradient(180deg, rgb(5, 46, 118) 0%, #0366d6 70%);
  overflow-y: auto;
}

.top-row[b-xoa4iblbny] {
  background-color: #f7f7f7;
  border-bottom: 1px solid #d6d5d5;
  justify-content: flex-end;
  height: 3.5rem;
  display: flex;
  align-items: center;
}

  .top-row[b-xoa4iblbny]  a, .top-row .btn-link[b-xoa4iblbny] {
    white-space: nowrap;
    margin-left: 1.5rem;
  }

  .top-row a:first-child[b-xoa4iblbny] {
    overflow: hidden;
    text-overflow: ellipsis;
  }

@media (max-width: 640.98px) {
  .top-row:not(.auth)[b-xoa4iblbny] {
    display: none;
  }

  .top-row.auth[b-xoa4iblbny] {
    justify-content: space-between;
  }

  .top-row a[b-xoa4iblbny], .top-row .btn-link[b-xoa4iblbny] {
    margin-left: 0;
  }

  /* Mobile: sidebar becomes overlay, no fixed width */
  .sidebar[b-xoa4iblbny] {
    width: auto;
    height: auto;
    position: relative;
  }

  /* Prevent body scroll when mobile menu is open */
  .page:has(.sidebar.collapse.show)[b-xoa4iblbny] {
    overflow: hidden;
  }
}

@media (min-width: 641px) {
  .page[b-xoa4iblbny] {
    flex-direction: row;
  }

  .sidebar[b-xoa4iblbny] {
    width: 250px;
    height: 100vh;
    position: sticky;
    top: 0;
  }

  .top-row[b-xoa4iblbny] {
    position: sticky;
    top: 0;
    z-index: 1;
  }

  .top-row[b-xoa4iblbny], article[b-xoa4iblbny] {
    padding-left: 2rem !important;
    padding-right: 1.5rem !important;
  }
}


@media print {
  .no-print[b-xoa4iblbny], .no-print *[b-xoa4iblbny] {
    display: none !important;
  }
}
/* /Shared/NavButtonNavMenu.razor.rz.scp.css */
.fixed-top[b-rt2qrrqjc3] {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   z-index: 1030;
   max-height:90px;
   overflow-y:auto;
}

.navbar[b-rt2qrrqjc3] {
   background-image: linear-gradient(180deg, rgb(5, 46, 118) 0%, #0366d6 70%);
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: space-between;
   z-index: 1000; /* Add this line */
}

.nav[b-rt2qrrqjc3] {
   display: flex;
   flex-direction: row;
   padding-left: 0;
   margin-bottom: 0;
   list-style: none;
}

.nav-item[b-rt2qrrqjc3] {
   font-size: 0.9rem;
   padding: 0.5rem;
}

.nav-link[b-rt2qrrqjc3] {
   display: flex;
   align-items: center;
   line-height: 3rem;
}


.navbar-brand[b-rt2qrrqjc3] {
   font-size: 1.1rem;
}

/*.oi {
   width: 2rem;
   font-size: 1.1rem;
   vertical-align: text-top;
   top: -2px;
}*/



   .nav-item:first-of-type[b-rt2qrrqjc3] {
      padding-top: .5rem;
   }

   .nav-item:last-of-type[b-rt2qrrqjc3] {
      padding-bottom: .5rem;
   }

   .nav-item[b-rt2qrrqjc3]  a {
      color: #d7d7d7;
      border-radius: 4px;
      height: 2rem;
      display: flex;
      align-items: center;
      line-height: 3rem;
   }

      .nav-item[b-rt2qrrqjc3]  a.active {
         background-color: rgba(255,255,255,0.25);
         color: white;
      }

      .nav-item[b-rt2qrrqjc3]  a:hover {
         background-color: rgba(255,255,255,0.1);
         color: white;
      }

.caret[b-rt2qrrqjc3] {
   border-left: 4px solid transparent;
   border-right: 4px solid transparent;
   border-top: 4px solid;
   display: inline-block;
   height: 0;
   margin-left: 10px;
   vertical-align: middle;
   width: 0;
}

/*.nav-link {
   padding-bottom: 2em;
   padding-top: 2em;
}*/

/*.navbar-toggler {
   background-color: rgba(255, 255, 255, 0.1);
}*/


/* /Shared/NavButtonTopLayout.razor.rz.scp.css */
body[b-atju02hdxa], html[b-atju02hdxa] {
  height: 100%;
  margin: 0;
  padding: 0;
}

.page[b-atju02hdxa] {
  display: flex;
  flex-direction: column;
  height: 100vh;
}

.header[b-atju02hdxa] {
  height: 90px;
  background-color: #f8f9fa;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1030;
}

.content[b-atju02hdxa] {
  margin-top: 0px; /* space for the fixed header */
}

.scrollable-list[b-atju02hdxa] {
  max-height: calc(100vh - 90px); /* full height minus the header height */
  overflow-y: auto;
  background-color: #f8f9fa;
  padding-top: 10px;
}

.col-9[b-atju02hdxa], .col-3[b-atju02hdxa] {
  padding: 0;
}
/* /Shared/NavMenu.razor.rz.scp.css */
.flex-row-noWrap[b-lbyr7deu1r] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}

/* Let the layout gradient show through */
.top-row[b-lbyr7deu1r] {
    height: 3.5rem;
    background: transparent;
}

/* If an inner .sidebar was added inside NavMenu, keep it transparent so the outer layout gradient shows */
.sidebar[b-lbyr7deu1r] {
    background: transparent !important;
}

/* Optional brand sizing */
.navbar-brand[b-lbyr7deu1r] {
    font-size: 1.1rem;
}

/* Icon sizing (Open Iconic) */
.oi[b-lbyr7deu1r] {
    width: 1.25rem;
    font-size: 1rem;
    vertical-align: text-top;
    top: -1px;
}

/* Navigation items */
.nav-item[b-lbyr7deu1r] {
    font-size: 0.95rem;
    padding-bottom: 0.35rem;
}

.nav-item:first-of-type[b-lbyr7deu1r] {
    padding-top: 0.5rem;
}

.nav-item:last-of-type[b-lbyr7deu1r] {
    padding-bottom: 0.5rem;
}

/* White links on the gradient */
.nav-item[b-lbyr7deu1r]  a {
    color: #ffffff;
    border-radius: 4px;
    height: auto;
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    line-height: 1.25rem;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
}

/* Active/hover on dark gradient */
.nav-item[b-lbyr7deu1r]  a.active {
    background-color: rgba(255, 255, 255, 0.15);
    color: #fff;
}

.nav-item[b-lbyr7deu1r]  a:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: #fff;
}

/* Caret inherits link color (white) */
.caret[b-lbyr7deu1r] {
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid currentColor;
    display: inline-block;
    height: 0;
    margin-left: 10px;
    vertical-align: middle;
    width: 0;
}

/* Keep reasonable vertical rhythm */
.nav-link[b-lbyr7deu1r] {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

/* === Submenu indent (slight) === */
.nav.flex-column .nav.flex-column[b-lbyr7deu1r] {
    margin-left: .5rem;
    padding-left: .25rem;
}

.nav.flex-column .nav.flex-column .nav-item[b-lbyr7deu1r] {
    padding-left: .25rem !important;
    padding-right: .25rem !important;
}

.submenu[b-lbyr7deu1r] {
    margin-left: .5rem;
    padding-left: .25rem;
}

.nav-item[b-lbyr7deu1r]  a.nav-link {
    padding: .25rem .5rem;
}

/* ========== HAMBURGER BUTTON ========== */
.hamburger-btn[b-lbyr7deu1r] {
    display: none; /* Hidden on desktop */
    background: transparent;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    min-width: 44px;
    min-height: 44px;
}

.hamburger-icon[b-lbyr7deu1r] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 24px;
    height: 18px;
}

.hamburger-icon span[b-lbyr7deu1r] {
    display: block;
    width: 100%;
    height: 2px;
    background-color: #fff;
    border-radius: 1px;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

/* ========== CLOSE BUTTON ========== */
.close-menu-btn[b-lbyr7deu1r] {
    display: none; /* Hidden on desktop */
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    background: transparent;
    border: none;
    color: #fff;
    font-size: 1.5rem;
    cursor: pointer;
    min-width: 44px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
}

.close-menu-btn:hover[b-lbyr7deu1r] {
    color: rgba(255, 255, 255, 0.8);
}

/* ========== MOBILE BACKDROP ========== */
.mobile-nav-backdrop[b-lbyr7deu1r] {
    display: none;
}

/* ========== DESKTOP STYLES (641px+) ========== */
@media (min-width: 641px) {
    .hamburger-btn[b-lbyr7deu1r] {
        display: none !important;
    }

    .close-menu-btn[b-lbyr7deu1r] {
        display: none !important;
    }

    .collapse[b-lbyr7deu1r] {
        display: block;
    }

    .notCollapse[b-lbyr7deu1r] {
        display: none;
    }
}

/* ========== MOBILE STYLES (up to 640px) ========== */
@media (max-width: 640px) {
    .hamburger-btn[b-lbyr7deu1r] {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .close-menu-btn[b-lbyr7deu1r] {
        display: flex;
    }

    /* Mobile nav backdrop overlay */
    .mobile-nav-backdrop[b-lbyr7deu1r] {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: 998;
        -webkit-backdrop-filter: blur(2px);
        backdrop-filter: blur(2px);
    }

    /* Sidebar as full-screen overlay */
    .sidebar[b-lbyr7deu1r] {
        position: fixed !important;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100% !important;
        height: 100vh !important;
        z-index: 999;
        overflow-y: auto;
        padding-top: 3.5rem;
        padding-bottom: calc(1rem + env(safe-area-inset-bottom));
        background-image: linear-gradient(180deg, rgb(5, 46, 118) 0%, #0366d6 70%) !important;
    }

    /* Hide menu when collapsed */
    .sidebar.collapse:not(.show)[b-lbyr7deu1r] {
        display: none !important;
    }

    /* Show menu when expanded */
    .sidebar.collapse.show[b-lbyr7deu1r] {
        display: block !important;
    }

    /* Larger touch targets for mobile */
    .nav-item[b-lbyr7deu1r] {
        font-size: 1.1rem;
        padding-bottom: 0.25rem;
    }

    .nav-item[b-lbyr7deu1r]  a {
        min-height: 44px;
        padding: 0.75rem 1rem;
    }

    .nav-item[b-lbyr7deu1r]  a.nav-link {
        min-height: 44px;
        padding: 0.75rem 1rem;
    }

    /* Submenu items slightly smaller but still touch-friendly */
    .submenu .nav-item[b-lbyr7deu1r]  a {
        min-height: 40px;
        padding: 0.5rem 1rem;
    }

    /* More visible active state on mobile */
    .nav-item[b-lbyr7deu1r]  a.active {
        background-color: rgba(255, 255, 255, 0.2);
    }
}
/* /Shared/SecondaryLayout.razor.rz.scp.css */

@media print {
    .no-print[b-8fdpz0p6qh], .no-print *[b-8fdpz0p6qh] {
        display: none !important;
    }
}

html[b-8fdpz0p6qh],
body[b-8fdpz0p6qh] {
    height: 100%;
    margin: 0;
    padding: 0;
}

.page[b-8fdpz0p6qh] {
    display: flex;
    flex-direction: column;
    height: 100vh;
}

.main[b-8fdpz0p6qh] {
    flex-grow: 1;
    padding-bottom: 5px;
    overflow-y: auto;
}

.page[b-8fdpz0p6qh] {
    position: relative;
    display: flex;
    flex-direction: column;
}

.main[b-8fdpz0p6qh] {
    flex: 1;
}

.sidebar[b-8fdpz0p6qh] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-8fdpz0p6qh] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-8fdpz0p6qh]  a, .top-row .btn-link[b-8fdpz0p6qh] {
        white-space: nowrap;
        margin-left: 1.5rem;
    }

    .top-row a:first-child[b-8fdpz0p6qh] {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row:not(.auth)[b-8fdpz0p6qh] {
        display: none;
    }

    .top-row.auth[b-8fdpz0p6qh] {
        justify-content: space-between;
    }

    .top-row a[b-8fdpz0p6qh], .top-row .btn-link[b-8fdpz0p6qh] {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-8fdpz0p6qh] {
        flex-direction: row;
    }

    .sidebar[b-8fdpz0p6qh] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-8fdpz0p6qh] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .main > div[b-8fdpz0p6qh] {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }
}
/* /Shared/SlidingPanel.razor.rz.scp.css */
/* Overlay - positioned behind sticky header */
.sliding-panel-overlay[b-bdsimjaa6a] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    opacity: 1;
    transition: opacity 0.3s ease;
}

.sliding-panel-overlay.fade-out[b-bdsimjaa6a] {
    opacity: 0;
}

/* Panel - slides in from right */
/* NOTE: Do NOT add transform here - it creates a stacking context that traps
   position:fixed children (like crop overlays) inside the panel */
.sliding-panel[b-bdsimjaa6a] {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    height: 100dvh; /* Dynamic viewport height for mobile */
    width: var(--panel-width, 55%);
    background: white;
    z-index: 1001;
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    /* transform removed - was breaking position:fixed children */
}

.sliding-panel.slide-in[b-bdsimjaa6a] {
    animation: slideIn-b-bdsimjaa6a 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    /* No 'forwards' - we don't want to retain transform which breaks stacking */
}

.sliding-panel.slide-out[b-bdsimjaa6a] {
    animation: slideOut-b-bdsimjaa6a 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    /* forwards is OK here since panel is closing anyway */
}

@keyframes slideIn-b-bdsimjaa6a {
    from {
        transform: translateX(100%);
    }
    to {
        transform: none; /* Use 'none' instead of translateX(0) */
    }
}

@keyframes slideOut-b-bdsimjaa6a {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(100%);
    }
}

/* Header */
.sliding-panel-header[b-bdsimjaa6a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
    flex-shrink: 0;
}

.sliding-panel-title[b-bdsimjaa6a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 1.1rem;
}

.sliding-panel-close[b-bdsimjaa6a] {
    background: none;
    border: none;
    font-size: 1.5rem;
    line-height: 1;
    padding: 0.25rem 0.5rem;
    cursor: pointer;
    color: #6c757d;
    border-radius: 4px;
    transition: background-color 0.15s ease;
}

.sliding-panel-close:hover[b-bdsimjaa6a] {
    background-color: #e9ecef;
    color: #343a40;
}

/* Body - scrollable */
.sliding-panel-body[b-bdsimjaa6a] {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
}

/* Mobile - full width */
@media (max-width: 768px) {
    .sliding-panel[b-bdsimjaa6a] {
        width: var(--panel-mobile-width, 100%);
    }
}

/* Tablet - slightly narrower */
@media (min-width: 769px) and (max-width: 1024px) {
    .sliding-panel[b-bdsimjaa6a] {
        width: 70%;
    }
}

/* Focus trap visual indicator */
.sliding-panel:focus[b-bdsimjaa6a] {
    outline: none;
}
/* /Shared/Tooltip.razor.rz.scp.css */
.tooltip-wrapper[b-ilyk7v6chc] {
    position: relative;
    display: inline-block;
    /*    border-bottom: 1px dotted red;
*/
    cursor: help;
}

span[b-ilyk7v6chc] {
    visibility: hidden;
    position: absolute;
    width: 250px;
    bottom: 100%;
    left: 50%;
    margin-left: -60px;
    background-color: #363636;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    z-index: 1;
    white-space: pre-line
}

span[b-ilyk7v6chc]::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}

.tooltip-wrapper:hover span[b-ilyk7v6chc] { visibility: visible; }
/* /Shared/UserMenu.razor.rz.scp.css */
.user-menu-container[b-oung6bz41i] {
    position: relative;
}

/* ========== Auth Status Bar ========== */
.user-status[b-oung6bz41i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.15s ease;
    user-select: none;
}

.user-status.authenticated[b-oung6bz41i] {
    background: rgba(255, 255, 255, 0.1);
}

.user-status.authenticated:hover[b-oung6bz41i] {
    background: rgba(255, 255, 255, 0.2);
}

.user-status.not-authenticated[b-oung6bz41i] {
    background: rgba(255, 200, 50, 0.15);
    border: 1px solid rgba(255, 200, 50, 0.3);
    cursor: default;
}

/* ========== Avatar ========== */
.user-avatar[b-oung6bz41i] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.25);
    color: #fff;
    font-weight: 600;
    font-size: 0.85rem;
    flex-shrink: 0;
}

/* ========== User Info ========== */
.user-info[b-oung6bz41i] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.user-name[b-oung6bz41i] {
    color: #fff;
    font-size: 0.85rem;
    font-weight: 500;
}

.user-role[b-oung6bz41i] {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.7rem;
}

.chevron-icon[b-oung6bz41i] {
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.65rem;
    margin-left: 0.125rem;
}

/* ========== Not Authenticated ========== */
.not-auth-icon[b-oung6bz41i] {
    color: rgba(255, 200, 50, 0.8);
    font-size: 1.25rem;
}

.not-auth-label[b-oung6bz41i] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.8rem;
}

.sign-in-btn[b-oung6bz41i] {
    background: rgba(255, 255, 255, 0.15);
    color: #fff !important;
    text-decoration: none !important;
    padding: 0.2rem 0.65rem;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: 500;
    transition: background-color 0.15s ease;
}

.sign-in-btn:hover[b-oung6bz41i] {
    background: rgba(255, 255, 255, 0.25);
}

/* ========== Dropdown ========== */
.user-dropdown[b-oung6bz41i] {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    min-width: 220px;
    z-index: 1050;
    overflow: hidden;
}

.dropdown-user-header[b-oung6bz41i] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
}

.dropdown-avatar[b-oung6bz41i] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgb(5, 46, 118);
    color: #fff;
    font-weight: 600;
    font-size: 0.95rem;
    flex-shrink: 0;
}

.dropdown-action[b-oung6bz41i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.6rem 1rem;
    border: none;
    background: transparent;
    color: #333;
    font-size: 0.85rem;
    cursor: pointer;
    transition: background-color 0.1s ease;
}

.dropdown-action:hover[b-oung6bz41i] {
    background: #f5f5f5;
}

/* ========== Backdrop ========== */
.user-menu-backdrop[b-oung6bz41i] {
    position: fixed;
    inset: 0;
    z-index: 1040;
}