/* PayMyDine Waiter POS V2.6 — owner-theme visual polish */

:root,
:host,
.pmd-pos-app {
  --pmd-pos-navy: #062f2a;
  --pmd-pos-navy-2: #001c18;
  --pmd-pos-orange: #c89b4a;
  --pmd-pos-orange-soft: #fff8ec;
  --pmd-pos-blue: #0f766e;
  --pmd-pos-green: #087f5b;
  --pmd-pos-green-soft: #e8f4ee;
  --pmd-pos-amber: #c88924;
  --pmd-pos-red: #d64545;
  --pmd-pos-bg: #f1f4f2;
  --pmd-pos-card: #ffffff;
  --pmd-pos-line: #d9e3df;
  --pmd-pos-muted: #63736e;
  --pmd-pos-shadow: 0 18px 46px rgba(0, 28, 24, .10);
  --pmd-pos-owner-gradient:
    radial-gradient(circle at 36% 0%, rgba(200, 155, 74, .11), transparent 30%),
    linear-gradient(180deg, #000403 0%, #00100e 16%, #001c18 42%, #022a25 72%, #063a33 100%);
}

.pmd-pos-app {
  background:
    radial-gradient(circle at 16% -10%, rgba(200,155,74,.08), transparent 28%),
    #f1f4f2;
}

.pmd-pos-topbar {
  background: var(--pmd-pos-owner-gradient) !important;
  border-bottom: 1px solid rgba(200,155,74,.24) !important;
  box-shadow: 0 15px 36px rgba(0,16,14,.18) !important;
}

.pmd-pos-table-title strong {
  color: #fff9ef !important;
  text-shadow: 0 1px 18px rgba(0,0,0,.18);
}

.pmd-pos-table-title span,
.pmd-pos-waiter {
  color: rgba(255,249,239,.72) !important;
}

.pmd-pos-status-dot {
  background: #3ddc97 !important;
  box-shadow: 0 0 0 5px rgba(61,220,151,.12) !important;
}

.pmd-pos-back,
.pmd-pos-ghost-btn,
.pmd-pos-topbar .pmd-pos-icon-btn {
  border-color: rgba(255,249,239,.18) !important;
  background: rgba(255,249,239,.075) !important;
  color: #fff9ef !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.pmd-pos-back:hover,
.pmd-pos-ghost-btn:hover,
.pmd-pos-topbar .pmd-pos-icon-btn:hover {
  background: rgba(255,249,239,.14) !important;
  border-color: rgba(200,155,74,.48) !important;
  transform: translateY(-1px);
}

.pmd-pos-workspace {
  background: transparent !important;
}

.pmd-pos-catalog,
.pmd-pos-cart {
  border-color: rgba(6,47,42,.12) !important;
  box-shadow: 0 18px 44px rgba(0,28,24,.075) !important;
}

.pmd-pos-tools,
.pmd-pos-cart-head,
.pmd-pos-checkout {
  background: rgba(255,255,255,.98) !important;
}

.pmd-pos-search:focus,
.pmd-pos-table-note:focus,
.pmd-pos-note-input:focus,
.pmd-pos-payment-input:focus {
  border-color: #0f766e !important;
  box-shadow: 0 0 0 4px rgba(15,118,110,.10) !important;
}

.pmd-pos-view-toggle button.is-active,
.pmd-pos-category.is-active {
  background: linear-gradient(145deg, #063a33, #001c18) !important;
  border-color: #063a33 !important;
  color: #fff9ef !important;
  box-shadow: 0 8px 20px rgba(0,44,38,.17) !important;
}

.pmd-pos-category:hover:not(.is-active) {
  border-color: rgba(6,58,51,.36) !important;
  background: #f7faf8 !important;
}

/* Configuration problems belong to the individual food card, not a page-wide alarm. */
.pmd-pos-warning[data-pos-menu-warning] {
  display: none !important;
}

.pmd-pos-menu-scroll {
  background:
    linear-gradient(rgba(255,255,255,.66), rgba(255,255,255,.66)),
    radial-gradient(circle at 0 0, rgba(200,155,74,.09), transparent 32%);
}

.pmd-pos-product {
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
  border-color: #d8e2de !important;
  background: linear-gradient(155deg, #ffffff 0%, #fbfdfc 100%) !important;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease !important;
}

.pmd-pos-product:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(6,58,51,.38) !important;
  box-shadow: 0 14px 30px rgba(0,44,38,.10) !important;
}

.pmd-pos-product.has-pmd-thumb {
  padding-right: 82px !important;
}

.pmd-pos-product-thumb {
  position: absolute;
  z-index: 0;
  top: 12px;
  right: 12px;
  width: 58px;
  height: 58px;
  overflow: hidden;
  border: 1px solid rgba(6,47,42,.10);
  border-radius: 15px;
  background: linear-gradient(145deg, #edf4f1, #fff9ef);
  box-shadow: 0 7px 18px rgba(0,28,24,.09);
  pointer-events: none;
}

.pmd-pos-product-thumb img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.pmd-pos-product > div:not(.pmd-pos-product-thumb),
.pmd-pos-product-foot {
  position: relative;
  z-index: 1;
}

.pmd-pos-product-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 7px;
}

.pmd-pos-product-tag {
  min-height: 19px;
  display: inline-flex;
  align-items: center;
  padding: 0 7px;
  border: 1px solid rgba(8,127,91,.16);
  border-radius: 999px;
  background: #edf8f3;
  color: #087f5b;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.pmd-pos-product-tag.is-allergen {
  border-color: rgba(200,137,36,.22);
  background: #fff8e8;
  color: #9a620d;
}

.pmd-pos-price {
  color: #a97724 !important;
}

.pmd-pos-product.is-price-required {
  border-style: dashed !important;
  background: linear-gradient(155deg, #fffdf8, #faf7ef) !important;
}

.pmd-pos-product.is-price-required:hover {
  border-color: rgba(200,155,74,.58) !important;
  box-shadow: 0 12px 28px rgba(111,78,25,.09) !important;
}

.pmd-pos-product.is-price-required .pmd-pos-price {
  color: #8c6a31 !important;
  font-size: 11px !important;
  letter-spacing: .01em;
}

.pmd-pos-price-required-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  margin-top: 7px;
  padding: 0 8px;
  border: 1px solid rgba(200,155,74,.30);
  border-radius: 999px;
  background: #fff8e9;
  color: #7c5a23;
  font-size: 9px;
  font-weight: 900;
}

.pmd-pos-order-pill {
  background: #e7f6ef !important;
  color: #087f5b !important;
}

.pmd-pos-action.send,
.pmd-pos-pay-button,
.pmd-pos-modal-add,
.pmd-pos-detail-add {
  background: linear-gradient(135deg, #d6ad62 0%, #c89b4a 55%, #b98834 100%) !important;
  color: #062f2a !important;
  box-shadow: 0 11px 26px rgba(151,105,35,.22) !important;
}

.pmd-pos-action.send:hover:not(:disabled),
.pmd-pos-pay-button:hover:not(:disabled),
.pmd-pos-modal-add:hover:not(:disabled),
.pmd-pos-detail-add:hover:not(:disabled) {
  filter: brightness(1.035);
  transform: translateY(-1px);
}

.pmd-pos-action.hold {
  background: #edf3f0 !important;
  color: #063a33 !important;
}

.pmd-pos-action:disabled,
.pmd-pos-secondary-actions button:disabled,
.pmd-pos-detail-add:disabled {
  background: #e8eeeb !important;
  color: #98a6a1 !important;
  box-shadow: none !important;
}

.pmd-pos-line-item {
  border-color: #dbe5e1 !important;
  background: #fafcfb !important;
}

.pmd-pos-note-input,
.pmd-pos-table-note {
  border-color: #d7e2de !important;
  background: #fbfdfc !important;
}

/* Long press: calm tactile feedback, no rotating blue outline. */
.pmd-pos-product.is-long-pressing {
  transform: scale(.982) !important;
  border-color: rgba(200,155,74,.72) !important;
  background: linear-gradient(155deg, #fffdf8, #fff8ea) !important;
  box-shadow: 0 0 0 4px rgba(200,155,74,.12), 0 12px 28px rgba(0,44,38,.10) !important;
}

.pmd-pos-product.is-long-pressing::before {
  content: "Details" !important;
  position: absolute !important;
  z-index: 5 !important;
  inset: auto 10px 10px auto !important;
  width: auto !important;
  height: 25px !important;
  display: inline-flex !important;
  align-items: center;
  padding: 0 9px;
  border: 1px solid rgba(200,155,74,.35) !important;
  border-radius: 999px !important;
  background: rgba(255,249,239,.96) !important;
  color: #063a33 !important;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: .035em;
  opacity: 1 !important;
  animation: pmd-pos-v26-detail-cue .18s ease both !important;
  pointer-events: none;
}

.pmd-pos-product.is-long-pressing::after {
  display: none !important;
  animation: none !important;
}

@keyframes pmd-pos-v26-detail-cue {
  from { opacity: 0; transform: translateY(4px) scale(.92); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Product details: warm, brand-aligned, less mechanical. */
.pmd-pos-detail-backdrop {
  background: rgba(0,16,14,.70) !important;
  backdrop-filter: blur(12px) saturate(.85) !important;
}

.pmd-pos-detail-dialog {
  border: 1px solid rgba(200,155,74,.24) !important;
  border-radius: 26px !important;
  background: #fff !important;
  box-shadow: 0 34px 100px rgba(0,16,14,.34) !important;
}

.pmd-pos-detail-gallery {
  background:
    radial-gradient(circle at 28% 20%, rgba(200,155,74,.18), transparent 32%),
    linear-gradient(155deg, #e9f2ee 0%, #fff9ef 100%) !important;
}

.pmd-pos-detail-placeholder {
  width: min(78%, 330px) !important;
  height: min(62%, 330px) !important;
  border: 1px solid rgba(6,58,51,.12) !important;
  border-radius: 34px !important;
  background:
    radial-gradient(circle at 34% 26%, rgba(200,155,74,.18), transparent 34%),
    linear-gradient(145deg, #f7fbf9, #e7f1ed) !important;
  color: #063a33 !important;
  box-shadow: 0 24px 55px rgba(0,44,38,.10) !important;
}

.pmd-pos-detail-placeholder small {
  color: #6b7a75 !important;
}

.pmd-pos-detail-kicker {
  color: #0f766e !important;
}

.pmd-pos-detail-price {
  color: #a97724 !important;
}

.pmd-pos-detail-chip.is-chef {
  border-color: rgba(15,118,110,.25) !important;
  background: #e9f7f3 !important;
  color: #08665f !important;
}

.pmd-pos-detail-chip.is-bestseller {
  border-color: rgba(200,155,74,.28) !important;
  background: #fff8e9 !important;
  color: #8a6120 !important;
}

.pmd-pos-detail-chip.is-diet {
  border-color: rgba(8,127,91,.22) !important;
  background: #eaf7f0 !important;
  color: #087f5b !important;
}

.pmd-pos-detail-nutrition-item,
.pmd-pos-detail-prep-card {
  border-color: #d9e4df !important;
  background: #f8fbf9 !important;
}

.pmd-pos-detail-footer {
  background: #fffdf8 !important;
  border-top-color: rgba(6,47,42,.10) !important;
}

.pmd-pos-detail-close,
.pmd-pos-detail-x {
  color: #063a33 !important;
  border-color: #d6e1dc !important;
  background: #fff !important;
}

/* Waiter dashboard: line notes remain attached to the correct food. */
.pmd-v26-item-notes {
  display: grid;
  gap: 7px;
  margin: 10px 0 12px;
}

.pmd-v26-item-note {
  padding: 9px 10px;
  border: 1px solid #ead8b8;
  border-left: 3px solid #c89b4a;
  border-radius: 11px;
  background: #fffaf0;
  color: #5d4824;
  font-size: 11px;
  line-height: 1.4;
}

.pmd-v26-item-note b {
  display: block;
  margin-bottom: 2px;
  color: #062f2a;
  font-size: 11px;
}

@media (max-width: 820px) {
  .pmd-pos-product.has-pmd-thumb {
    padding-right: 72px !important;
  }
  .pmd-pos-product-thumb {
    width: 50px;
    height: 50px;
    top: 10px;
    right: 10px;
    border-radius: 13px;
  }
}

@media (max-width: 520px) {
  .pmd-pos-product-thumb {
    width: 46px;
    height: 46px;
  }
  .pmd-pos-product.has-pmd-thumb {
    padding-right: 64px !important;
  }
  .pmd-pos-detail-dialog {
    border-radius: 24px 24px 0 0 !important;
  }
}
