/* ---------- PQC Overtime: Beauty pass (Bootstrap 5 compatible) ---------- */

:root{
  --pqc-radius: 14px;
  --pqc-shadow: 0 6px 22px rgba(16,24,40,.06), 0 2px 6px rgba(16,24,40,.04);
}
html, body { background: #f6f8fb; }

.logo-pqc { height: 40px; width: auto; }

.brand {
  font-weight: 700;
  letter-spacing: .3px;
  color: #1f2937;
}

.sheet{
  background: #fff;
  border-radius: var(--pqc-radius);
  box-shadow: var(--pqc-shadow);
  padding: 1.25rem;
}

/* Put this at the very end */
.container > .sheet{
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: min(1600px, 100vw - 2rem);  /* adjust max as you like */
  max-width: none;                    /* override earlier max */
  margin-left: 0; margin-right: 0;    /* ensure no extra margins */
}

/* printing: don't shift */
@media print {
  .container > .sheet{
    left: 0;
    transform: none;
    width: auto;
  }
}

/* headings / labels */
h2.h5{ margin: 0; font-weight: 700; color: #111827; }
.small-label{
  font-size: .78rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #6b7280;
}

/* autosuggest dropdowns */
.dropdown-menu{
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(0,0,0,.08);
  padding: .25rem;
}
.dropdown-item{
  border-radius: 6px;
  padding: .5rem .75rem;
}

/* table look */
.table#recordsTable{
  border-radius: 10px;
  overflow: hidden; /* keeps rounded corners with .table-responsive */
}
.table#recordsTable thead th{
  position: sticky; top: 0;
  background: #f8fafc;
  z-index: 2;
  border-bottom: 1px solid #e5e7eb;
  font-size: .8rem; color: #64748b; text-transform: uppercase;
}
.table#recordsTable tbody td{
  vertical-align: middle;
  background: #fff;
}
.table#recordsTable tfoot th,
.table#recordsTable tfoot td{
  background: #f8fafc;
}

/* tighter inputs inside table */
#recordsTable input.form-control,
#recordsTable select.form-select{
  height: 36px;
  padding: .25rem .5rem;
  font-size: .9rem;
}

/* column widths (match your <colgroup> classes) */
.col-branch { width: 86px; }  
.col-code { width: 86px; }  
.col-total { width: 86px; }  
.col-qty { width: 86px; }  

.col-sl     { width: 56px; }             /* serial */
.col-start,
.col-end    { width: 96px; }             /* time inputs */
.col-work   { width: 180px; }            /* work type */
.col-sign   { width: 160px; }            /* signature cell */
.col-name   { width: auto; }             /* let name flex */
.col-phone   { width: auto; }             /* let name flex */
/*
.col-code   { width: 84px;  }
.col-name   { width: 200px; }
.col-start, .col-end, .col-total, .col-qty { width: 110px; }
.col-work   { width: 180px; }
.col-sign   { width: 160px; }
*/
/* geo badge */
#geoBadge{ color:#6b7280; }

/* sticky action bar (bottom buttons) */
.toolbar-sticky{
  position: sticky; bottom: -1px;
  background: #fff; padding: .75rem 0 .25rem;
  border-top: 1px solid #e5e7eb;
}

/* signature preview */
img.sign-preview{ border-radius: 6px; }

/* print styles */
@media print {
  body { background: #fff; }
  .sheet{ box-shadow: none; padding: 0; }
  .btn, .dropdown-menu, #geoBadge, #add1, #add5, #btnLogout { display: none !important; }
  .table { page-break-inside: auto; }
  .table tr{ page-break-inside: avoid; page-break-after: auto; }
}

/* responsive: hide less-important columns on small screens */
@media (max-width: 767.98px){
  .hide-sm { display: none !important; }
  .sheet{ padding: .75rem; }
}