/* R1245 — PhotoBridge frame/chassis customer only. Keep the store owner's UI unchanged. */
/* The actual scroller (and, on Windows, its parent iframe) must carry the wash;
   a gradient behind the opaque workspace isn't visible beneath the second header. */
html.pb1126FrameStore .pb1126ContentPanel[data-panel="store"],
html.pb1126FrameStore .pb1126ContentPanel[data-panel="store"] iframe{
  background-color:#f3f7fc!important;
  background-image:linear-gradient(180deg,#d9ecff 0%,#e8f4ff 110px,#f2f8ff 260px,#f5f7fb 485px)!important;
}
html body.rentalPhotographerMode.frameCustomerStore #storePhotographerWorkspace#storePhotographerWorkspace>.shell{
  background:#f5f7fb linear-gradient(180deg,#d9ecff 0,#e7f3ff 105px,#f0f7ff 270px,#f5f7fb 480px)!important;
  background-repeat:no-repeat!important;
  background-size:100% 100%!important;
  border-top:1px solid #485566!important;
}
/* The Windows desktop host has its own second header, independent of the iframe nav. */
html.pb1126FrameStore body #pb1126ChromeHost #pb1126DesktopHeader.pb1126FrameStore>.pb1126Secondary{
  border-bottom:1px solid #485566!important;
  box-shadow:0 1px 0 rgba(45,55,72,.20)!important;
}
html body.frameCustomerStore #frameCustomerNav{
  border-bottom:1px solid #485566!important;
  box-shadow:0 1px 0 rgba(45,55,72,.20)!important;
}
html body.frameCustomerStore #storePhotographerWorkspace :is(#salesPanel,#frameOrdersPanel,#financePanel)>.box{
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
}
html body.frameCustomerStore #storePhotographerWorkspace :is(#salesPanel,#frameOrdersPanel,#financePanel) {
  background:transparent!important;
  background-image:none!important;
}

/* One clearly readable invoice action in the list. PDF stays in the viewer header. */
body.frameCustomerStore #financePanel .invoiceActionStackV813 .invoicePdfBtnV812{
  display:none!important;
}
body.frameCustomerStore #financePanel .invoiceActionStackV813{
  display:flex!important;align-items:center!important;justify-content:center!important;
  min-width:0!important;
}
body.frameCustomerStore #financePanel .invoiceActionStackV813 [data-equipment-invoice-view-v812]{
  min-height:36px!important;padding:7px 16px!important;
  border-radius:10px!important;border:1px solid #cddbf1!important;
  background:#eef4ff!important;color:#315b9f!important;
  font:800 11px Vazirmatn,Tahoma,sans-serif!important;
}

/* The six-column paper now fits the invoice viewer without escaping its boundaries. */
body.frameCustomerStore #equipmentInvoiceModalV812{
  padding:clamp(6px,1.5vw,18px)!important;
  align-items:center!important;
}
body.frameCustomerStore #equipmentInvoiceModalV812 .equipmentInvoiceCardV812{
  box-sizing:border-box!important;
  width:min(1000px,100%)!important;
  height:min(850px,calc(100dvh - 24px))!important;
  max-height:calc(100dvh - 24px)!important;
  min-width:0!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr)!important;
  overflow:hidden!important;
}
body.frameCustomerStore #equipmentInvoiceModalV812 .equipmentInvoiceCardV812>header{
  position:relative!important;flex:0 0 auto!important;
  padding:12px 16px!important;min-width:0!important;
}
body.frameCustomerStore #equipmentInvoiceModalV812 .equipmentInvoiceHeadActionsV812{
  flex:0 0 auto!important;
}
body.frameCustomerStore #equipmentInvoiceModalV812 .equipmentInvoiceBodyV812{
  box-sizing:border-box!important;
  min-width:0!important;min-height:0!important;
  width:100%!important;padding:14px!important;
  overflow:auto!important;overscroll-behavior:contain;
}
body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper{
  box-sizing:border-box!important;
  width:100%!important;min-width:0!important;
  max-width:100%!important;margin:0 auto!important;
  padding:clamp(12px,2.3vw,26px)!important;
  overflow-wrap:anywhere!important;
}
body.frameCustomerStore #equipmentInvoiceModalV812 .pb922TableScroll{
  width:100%!important;min-width:0!important;max-width:100%!important;
  overflow-x:auto!important;
}
body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper table{
  width:100%!important;min-width:0!important;
  table-layout:fixed!important;
  border-collapse:collapse!important;
}
body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper th,
body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper td{
  box-sizing:border-box!important;
  font-size:clamp(9px,1vw,12px)!important;line-height:1.6!important;
  padding:8px 5px!important;
  overflow-wrap:anywhere!important;word-break:normal!important;
}
body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper :is(.pb922Head,.pb922Facts,.pb922Totals,.pb922Sign){
  min-width:0!important;max-width:100%!important;
}

/* Keep a single order status on the right and a single cancelled marker below history. */
body.frameCustomerStore #frameOrdersPanel .frameOrderCustomer .salePaymentMeta{display:none!important}
body.frameCustomerStore #frameOrdersPanel .frameOrderCustomer:has(.frameOrderCancelled)>b.saleOrderCancelled{
  display:none!important;
}
/* Payment button: consistent with PhotoBridge pill buttons and semantic status. */
body.frameCustomerStore #frameOrdersPanel .pb1242PaymentButton{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  gap:7px!important;width:auto!important;max-width:100%!important;
  min-height:36px!important;white-space:normal!important;
  padding:7px 14px!important;margin:7px 0 0!important;
  border-radius:10px!important;border:1px solid #bcd3f5!important;
  background:linear-gradient(180deg,#eef5ff,#e7f0ff)!important;
  color:#2456a3!important;box-shadow:none!important;
  font:800 11px/1.5 Vazirmatn,Tahoma,sans-serif!important;
  cursor:pointer;
}
body.frameCustomerStore #frameOrdersPanel .pb1242PaymentButton:hover{
  border-color:#80adf2!important;background:#e2efff!important;
}
body.frameCustomerStore #frameOrdersPanel .pb1242PaymentButton[data-frame-receipt-status="pending"]{
  background:#fff8e9!important;border-color:#f2d49a!important;color:#855a16!important;
}
body.frameCustomerStore #frameOrdersPanel .pb1242PaymentButton[data-frame-receipt-status="rejected"]{
  background:#fff1f1!important;border-color:#f3b7b7!important;color:#ad3939!important;
}
body.frameCustomerStore #frameOrdersPanel .pb1242PaymentButton[data-frame-receipt-status="approved"]{
  background:#eaf7f0!important;border-color:#a8dfc4!important;color:#23754c!important;
}

/* Receipt dialog: styled upload surface, not the browser's raw file control. */
body.frameCustomerStore .pb1242PaymentDialog{
  width:min(610px,100%)!important;
  border-radius:17px!important;
}
body.frameCustomerStore .pb1242PaymentBody{display:grid;gap:12px}
body.frameCustomerStore .pb1242ReceiptForm{
  gap:10px!important;margin:2px 0 0!important;
}
body.frameCustomerStore .pb1242ReceiptPicker{
  position:relative!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  flex-direction:column!important;gap:7px!important;
  min-height:100px!important;
  border:1px dashed #a8bde0!important;border-radius:12px!important;
  background:#f3f7ff!important;color:#345f9e!important;
  padding:16px!important;text-align:center!important;
  font:850 12px/1.7 Vazirmatn,Tahoma,sans-serif!important;
  cursor:pointer!important;
}
body.frameCustomerStore .pb1242ReceiptPicker::before{
  content:"↑";display:grid;place-items:center;width:30px;height:30px;
  border-radius:50%;background:#e3eeff;color:#245bb1;font:900 20px/1 Arial,sans-serif;
}
body.frameCustomerStore .pb1242ReceiptPicker:focus-within{
  outline:2px solid #7aa7ee!important;outline-offset:2px;
}
body.frameCustomerStore .pb1242ReceiptPicker input[type=file]{
  position:absolute!important;inset:0!important;
  display:block!important;width:100%!important;height:100%!important;
  margin:0!important;opacity:0!important;cursor:pointer!important;
}
body.frameCustomerStore .pb1242ReceiptPreview{
  justify-self:center!important;max-height:180px!important;
  border:1px solid #dfe8f4!important;border-radius:11px!important;
  background:#fff;padding:5px!important;
}
body.frameCustomerStore .pb1242ReceiptForm>small{
  font-size:10px!important;color:#738298!important;text-align:center!important;
}
body.frameCustomerStore .pb1242ReceiptForm>button[type=submit]{
  min-height:44px!important;width:100%!important;
  border:1px solid #2667d9!important;border-radius:11px!important;
  background:linear-gradient(135deg,#2678f2,#315efb)!important;
  color:#fff!important;font:850 12px Vazirmatn,Tahoma,sans-serif!important;
  box-shadow:none!important;cursor:pointer!important;
}
body.frameCustomerStore .pb1242ReceiptForm>button[type=submit]:disabled{
  opacity:.65!important;cursor:wait!important;
}
body.frameCustomerStore .pb1242PaymentStatus{
  margin:0!important;border:1px solid #d6e5fa!important;font-size:11px!important;
}
body.frameCustomerStore .pb1242ReceiptLink{
  margin:5px 0!important;color:#2456a3!important;
}
@media(max-width:700px){
  body.frameCustomerStore #equipmentInvoiceModalV812 .equipmentInvoiceCardV812{
    height:calc(100dvh - 16px)!important;max-height:calc(100dvh - 16px)!important;
    border-radius:14px!important;
  }
  body.frameCustomerStore #equipmentInvoiceModalV812 .equipmentInvoiceCardV812>header{
    gap:5px!important;padding:9px 10px!important;
  }
  body.frameCustomerStore #equipmentInvoiceModalV812 .equipmentInvoiceHeadActionsV812 #equipmentInvoicePdfV812{
    padding:7px 9px!important;font-size:10px!important;white-space:nowrap!important;
  }
  body.frameCustomerStore #equipmentInvoiceModalV812 .equipmentInvoiceBodyV812{padding:7px!important}
  body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper{padding:10px!important}
  body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper .pb922Head{
    gap:7px!important;flex-wrap:wrap!important;margin-bottom:10px!important;
  }
  body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper h1{font-size:15px!important}
  body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper h2{font-size:13px!important}
  body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper .pb922Facts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;font-size:10px!important;
  }
  body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper th,
  body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper td{
    font-size:8.5px!important;padding:6px 2px!important;
  }
  body.frameCustomerStore #equipmentInvoiceModalV812 .pb922Paper .pb922Grand{font-size:12px!important}
}

/* R1248 — Windows-only parity with the STORE OWNER page.
   Source: equipment-rental-portal.html #pbR100F94HeaderActionsAndDepth.
   There is ONE softly fading separator at the second header; the scroll
   surface has NO extra top border. The blue fade ends within 92px. */
@media (min-width:821px){
  /* Underlying owner canvas; do not stack a second blue gradient in the iframe host. */
  html.pb1126FrameStore .pb1126ContentPanel[data-panel="store"],
  html.pb1126FrameStore .pb1126ContentPanel[data-panel="store"] iframe{
    background:#f4f6fa!important;
    background-image:none!important;
  }
  /* Desktop host header: no full-width dark line and no lower drop-shadow. */
  html.pb1126FrameStore body #pb1126ChromeHost
  #pb1126DesktopHeader.pb1126FrameStore>.pb1126Secondary{
    position:relative!important;
    border-bottom:0!important;
    box-shadow:none!important;
  }
  html.pb1126FrameStore body #pb1126ChromeHost
  #pb1126DesktopHeader.pb1126FrameStore>.pb1126Secondary::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:18px!important;right:18px!important;bottom:0!important;
    height:1px!important;
    pointer-events:none!important;
    background:linear-gradient(90deg,transparent 0%,rgba(152,162,179,.34) 12%,rgba(152,162,179,.34) 88%,transparent 100%)!important;
    z-index:2!important;
  }
  /* Standalone desktop renders its secondary tabs in the iframe instead. */
  html body.rentalPhotographerMode.frameCustomerStore #frameCustomerNav{
    border-bottom:0!important;
    box-shadow:none!important;
  }
  html body.rentalPhotographerMode.frameCustomerStore #frameCustomerNav::after{
    content:""!important;display:block!important;position:absolute!important;
    left:18px!important;right:18px!important;bottom:0!important;height:1px!important;
    pointer-events:none!important;
    background:linear-gradient(90deg,transparent 0%,rgba(152,162,179,.34) 12%,rgba(152,162,179,.34) 88%,transparent 100%)!important;
  }
  /* Remove the previous sky-blue layer behind the iframe scroller, too. */
  html body.rentalPhotographerMode.frameCustomerStore
  #storePhotographerWorkspace#storePhotographerWorkspace{
    background:#f4f6fa!important;
    background-image:none!important;
  }
  /* Exact same blend as owner page:
     .105 -> .045 at 38% -> zero at 92px over #f4f6fa.
     It is drawn ONCE, on the visible scroller, not again on its frame. */
  html body.rentalPhotographerMode.frameCustomerStore
  #storePhotographerWorkspace#storePhotographerWorkspace>.shell{
    border-top:0!important;
    box-shadow:none!important;
    background-color:#f4f6fa!important;
    background-image:linear-gradient(180deg,rgba(49,94,251,.105) 0px,rgba(49,94,251,.045) 35px,rgba(49,94,251,0) 92px)!important;
    background-repeat:no-repeat!important;
    background-size:100% 100%!important;
  }
}
