/* Match the counter to the dashboard's navy glass and electric blue. */
body.pos-expanded {
  background:
    radial-gradient(ellipse at 89% -10%, rgba(16,57,244,.20), transparent 46%),
    radial-gradient(ellipse at 5% 60%, rgba(35,98,232,.08), transparent 34%),
    var(--bg);
}

.pos-screen .pos-register {
  --register-ink: #f4f8ff;
  --register-muted: #b7c6dc;
  --register-line: rgba(183,210,255,.20);
  background:
    radial-gradient(ellipse at 90% 0, rgba(35,98,232,.18), transparent 60%),
    linear-gradient(145deg, rgba(20,39,81,.91), rgba(16,26,45,.95));
  border-color: rgba(130,174,255,.30);
  box-shadow: 0 20px 65px #02091966, inset 0 1px 0 #b7d2ff18;
}

.pos-screen .pos-sale-panel,
.pos-screen .pos-product-card {
  background: linear-gradient(150deg, rgba(43,66,103,.38), rgba(18,31,57,.59));
  border-color: rgba(183,210,255,.20);
}

.pos-screen .pos-sale-panel,
.pos-screen .pos-cart-lines,
.pos-screen .pos-checkout-controls {
  scrollbar-color: #4779c7 #14223e;
}

.pos-screen .pos-product-card:hover {
  border-color: #82aeff99;
  box-shadow: 0 12px 26px #030b2033, 0 0 20px #2362e820;
}

.pos-screen .pos-register input,
.pos-screen .pos-register select,
.pos-screen .pos-register textarea,
.pos-screen .pos-header-fields input,
.pos-screen .pos-header-fields select,
.pos-screen .pos-staff-picker summary {
  background: rgba(20,34,62,.84);
  border-color: rgba(130,174,255,.28);
  color: #f4f8ff;
}

.pos-screen .pos-register input:focus,
.pos-screen .pos-register select:focus,
.pos-screen .pos-register textarea:focus,
.pos-screen .pos-header-fields input:focus,
.pos-screen .pos-header-fields select:focus,
.pos-screen .pos-staff-picker summary:focus-visible {
  outline-color: #82aeff88;
  border-color: #82aeff;
}

.pos-screen .pos-header-fields .pos-field > span,
.pos-screen .pos-customer-search [role=option] small {
  color: #b7c6dc;
}

.pos-screen .register-search {
  background: rgba(20,39,81,.52);
  border-color: rgba(130,174,255,.28);
}

.pos-screen .pos-register .register-search input {
  background: transparent;
  border: 0;
  color: #f4f8ff;
}

.pos-screen .register-search svg {
  color: #91b9ff;
}

.pos-screen .pos-sale-columns {
  background: #2362e825;
  border-color: rgba(183,210,255,.16);
}

.pos-screen .pos-register-summary {
  background: #2362e81c;
  border-color: rgba(183,210,255,.12);
}

.pos-screen .pos-checkout-controls {
  background: #101a2d40;
  border-color: rgba(183,210,255,.16);
}

.pos-screen .pos-payment-bar {
  background: linear-gradient(110deg, #142751f5, #101a2df5);
  border-color: rgba(130,174,255,.28);
}

.pos-screen .pos-customer-search [role=listbox],
.pos-screen .pos-staff-options {
  background: #14223ef7;
  border-color: #82aeff66;
  box-shadow: 0 12px 35px #02081788;
  scrollbar-color: #4779c7 #14223e;
}

.pos-screen .pos-customer-search [role=option]:hover,
.pos-screen .pos-customer-search [role=option]:focus,
.pos-screen .pos-staff-options button:hover,
.pos-screen .pos-staff-options button:focus-visible {
  background: #2362e84d;
  outline-color: #82aeff88;
  color: #fff;
}

.pos-screen .pos-staff-options button[aria-selected=true] {
  background: #2362e866;
  color: #d3e3ff;
}

.pos-screen .btn.cyan {
  background: #2362e82e;
  border-color: #82aeff66;
  color: #d3e3ff;
}

.pos-screen .pos-header-fields .pos-customer-plus,
.pos-screen .pos-card-plus {
  background: linear-gradient(135deg, #4f82ff, #2362e8);
  border-color: #91b9ff;
  color: #fff;
  box-shadow: 0 3px 10px #2362e840;
}

.pos-screen .pos-product-add:hover .pos-card-plus {
  background: linear-gradient(135deg, #6b96ff, #3977f4);
  box-shadow: 0 3px 14px #2362e865;
}

.pos-screen .pos-payable {
  background: linear-gradient(125deg, #1039f4, #216be8);
  border-color: #82aeffb3;
  box-shadow: 0 0 20px #2362e840;
  animation: pos-blue-total-glow 4s ease-in-out infinite;
}

.pos-screen .pos-payable span {
  color: #dce8ff;
}

.pos-screen .pos-payable b {
  color: #fff;
  text-shadow: 0 1px 12px #91b9ff40;
}

@keyframes pos-blue-total-glow {
  0%, 100% { box-shadow: 0 0 15px #2362e826; border-color: #82aeffb3; }
  50% { box-shadow: 0 0 24px #2362e860; border-color: #b7d2ff; }
}

@media (prefers-reduced-motion: reduce) {
  .pos-screen .pos-payable { animation: none; }
}

.pos-screen .pos-edit-reference {
  display: block;
  margin-top: 3px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: .02em;
  color: #b7d2ff;
}

.pos-screen.pos-editing-order .pos-payment-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pos-screen .pos-order-save {
  background: linear-gradient(135deg, #3977f4, #1039f4);
  color: #fff;
  box-shadow: 0 3px 12px #2362e840;
}

.pos-screen .pos-edit-paid {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  min-width: 0;
  font-size: 12px;
  color: #b7c6dc;
}

.pos-screen .pos-edit-paid b {
  font-size: 15px;
  color: #7ce0b0;
}

.pos-screen .pos-edit-paid small {
  font-size: 11px;
  color: #f1cb82;
}

.pos-screen #pos-customer-error.form-error{margin:0;padding:5px 8px;font-size:11px;color:#ffb7bf;line-height:1.4}
.pos-screen #pos-customer[aria-invalid="true"]{border-color:#ef737f;box-shadow:0 0 0 2px rgba(239,115,127,.15)}
