/* =========================================================
   PEPPER POP — PAYMENTS & CHECKOUT
   ========================================================= */

/* Admin payment settings */
.payment-settings-panel{margin:18px 0}
.payment-settings-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);
  gap:16px;
}
.payment-settings-card{
  border:1px solid #ead8c3;
  border-radius:20px;
  background:#fffaf3;
  padding:16px;
}
.payment-settings-card h3{margin:0 0 4px}
.payment-settings-card>p{margin:0 0 14px;color:#7d7168;font-size:11px;line-height:1.5}
.payment-form{display:grid;gap:12px}
.payment-form label{
  display:grid;gap:6px;font-size:11px;font-weight:850;color:#5d5148
}
.payment-form input[type="text"],
.payment-form input[type="number"],
.payment-form textarea{
  width:100%;border:1px solid #ddcbb7;background:white;border-radius:12px;padding:11px;outline:0
}
.payment-form textarea{resize:vertical}
.payment-toggle-row{
  display:grid;grid-template-columns:1fr 1fr;gap:10px
}
.payment-toggle-card{
  display:flex!important;flex-direction:row!important;align-items:center;gap:10px!important;
  min-height:58px;padding:10px 12px;border:1px solid #e4d2bd;border-radius:14px;background:white
}
.payment-toggle-card input{width:18px;height:18px;accent-color:var(--red);margin:0}
.payment-toggle-card span{display:flex;flex-direction:column;gap:2px}
.payment-toggle-card strong{font-size:12px}
.payment-toggle-card small{font-size:9px;color:#887a70}
.payment-qr-preview{
  min-height:240px;border-radius:18px;background:#f5e7d5;border:1px dashed #d5b892;
  display:grid;place-items:center;overflow:hidden;padding:14px;text-align:center
}
.payment-qr-preview img{max-width:230px;max-height:230px;object-fit:contain;background:white;padding:8px;border-radius:14px}
.payment-qr-preview .empty-payment-qr{display:grid;gap:7px;color:#88796d;font-size:11px}
.payment-qr-preview .empty-payment-qr b{font-size:40px}
.payment-qr-actions{display:flex;gap:8px;margin-top:10px}
.payment-qr-actions>*{margin:0}
.payment-status-legend{display:grid;gap:8px;margin-top:12px}
.payment-status-legend div{display:flex;align-items:center;gap:8px;font-size:10px;color:#6f6258}

/* Payment badges */
.payment-badge{
  display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;
  font-size:8px;font-weight:950;letter-spacing:.04em;white-space:nowrap
}
.payment-badge.counter_due{background:#fff0ca;color:#8a5a00}
.payment-badge.pending{background:#ffe5cc;color:#a45100}
.payment-badge.paid{background:#dff5e8;color:#176c45}
.payment-badge.failed{background:#ffe1df;color:#a22020}
.payment-badge.refunded{background:#e9e2f7;color:#654a95}
.payment-method-label{font-size:9px;color:#7a6e65;font-weight:850}
.payment-actions-inline{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}
.payment-actions-inline button{
  border:1px solid #dec8ae;background:white;border-radius:9px;padding:6px 8px;
  font-size:8px;font-weight:900;cursor:pointer
}
.payment-actions-inline button.mark-paid{background:#1e7a50;color:white;border-color:#1e7a50}

/* Customer checkout */
.checkout-payment{
  margin:15px 0;
  padding:14px;
  border:1px solid #ead6bd;
  border-radius:19px;
  background:linear-gradient(180deg,#fffaf2,#fff4e4)
}
.checkout-payment-head{
  display:flex;justify-content:space-between;align-items:start;gap:10px;margin-bottom:10px
}
.checkout-payment-head strong{display:block;font-size:13px}
.checkout-payment-head span{font-size:9px;color:#88796d}
.checkout-payment-options{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.checkout-payment-option{
  position:relative;cursor:pointer
}
.checkout-payment-option input{position:absolute;opacity:0;pointer-events:none}
.checkout-payment-card{
  min-height:84px;border:1px solid #decbb3;background:white;border-radius:16px;padding:12px;
  display:flex;align-items:center;gap:10px;
  transition:.18s ease
}
.checkout-payment-option input:checked+.checkout-payment-card{
  border-color:#bd171d;box-shadow:0 0 0 3px rgba(189,23,29,.07);background:#fff9f4
}
.checkout-payment-card .pay-icon{
  width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#f4e4cf;font-size:22px
}
.checkout-payment-card strong{display:block;font-size:12px}
.checkout-payment-card small{display:block;margin-top:2px;color:#87796f;font-size:9px;line-height:1.35}
.checkout-payment-card.disabled{opacity:.45;cursor:not-allowed}
.upi-checkout-panel{
  margin-top:10px;padding:12px;border-radius:16px;background:#fff;border:1px solid #e7d6c2
}
.upi-checkout-inner{
  display:grid;grid-template-columns:128px 1fr;gap:12px;align-items:center
}
.upi-checkout-qr{
  width:128px;height:128px;border:1px solid #ead7c0;border-radius:14px;background:white;
  display:grid;place-items:center;padding:7px;overflow:hidden
}
.upi-checkout-qr img,.upi-checkout-qr canvas{max-width:100%;max-height:100%}
.upi-checkout-copy strong{display:block;font-size:12px}
.upi-checkout-copy p{margin:4px 0 7px;color:#766960;font-size:9px;line-height:1.45}
.upi-checkout-copy code{
  display:block;padding:6px 8px;border-radius:8px;background:#f6eadb;font-size:9px;word-break:break-all
}
.upi-open-button{
  display:inline-flex;margin-top:8px;padding:8px 11px;border-radius:10px;background:#1c1815;color:white;
  font-size:9px;font-weight:900;text-decoration:none
}
.checkout-payment-note{
  margin:8px 0 0;color:#88796d;font-size:9px;line-height:1.45
}
.checkout-minimum-warning{
  margin:9px 0 0;padding:8px 10px;border-radius:10px;background:#fff0d4;color:#875600;font-size:9px;font-weight:800
}

/* Customer order payment status */
.customer-payment-status{
  display:flex;align-items:center;justify-content:center;gap:8px;
  margin:10px 0 4px;padding:9px 10px;border-radius:12px;background:#f6eadb;
  font-size:10px
}
.customer-payment-status .payment-badge{font-size:9px}

/* Kitchen payment row */
.kitchen-payment-row{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin:7px 0;padding:7px 8px;border-radius:10px;background:#f6eadb
}
.kitchen-payment-row>div{display:flex;flex-direction:column;gap:2px}
.kitchen-payment-row strong{font-size:9px}
.kitchen-payment-row span{font-size:8px;color:#77695f}

@media(max-width:800px){
  .payment-settings-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .payment-toggle-row{grid-template-columns:1fr}
  .checkout-payment-options{grid-template-columns:1fr}
  .upi-checkout-inner{grid-template-columns:1fr}
  .upi-checkout-qr{margin:auto}
}


/* Razorpay gateway */
.razorpay-settings-card{
  background:
    radial-gradient(circle at 100% 0,rgba(82,92,230,.08),transparent 15rem),
    #fffaf3;
}
.gateway-heading{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px
}
.gateway-heading>div:first-child{display:flex;align-items:center;gap:10px}
.gateway-heading h3{margin:0 0 2px}
.gateway-heading p{margin:0!important;font-size:9px!important;color:#7d7168!important}
.gateway-logo{
  width:42px;height:42px;border-radius:13px;display:grid;place-items:center;
  background:linear-gradient(135deg,#4a5bf3,#182275);color:white;font-weight:950;font-size:20px;
  box-shadow:0 8px 18px rgba(51,65,180,.18)
}
.gateway-status{
  padding:6px 9px;border-radius:999px;font-size:8px;font-weight:950;letter-spacing:.06em;white-space:nowrap
}
.gateway-status.off{background:#eee6df;color:#756b65}
.gateway-status.ready{background:#e7e9ff;color:#3a48b6}
.gateway-status.on{background:#def5e7;color:#176c45}
.gateway-secret-hint{
  margin:0;padding:9px 10px;border-radius:10px;background:#f4eadf;color:#776b62;
  font-size:9px;line-height:1.45
}
.gateway-actions{display:flex;gap:8px}
.gateway-actions>*{margin:0}
.payment-form input[type="password"]{
  width:100%;border:1px solid #ddcbb7;background:white;border-radius:12px;padding:11px;outline:0
}

/* Online checkout */
.checkout-payment-option.featured-online .checkout-payment-card{
  background:linear-gradient(135deg,#fff,#f7f5ff);
}
.checkout-payment-option.featured-online input:checked+.checkout-payment-card{
  border-color:#4a5bf3;
  box-shadow:0 0 0 3px rgba(74,91,243,.08);
}
.online-pay-icon{
  background:linear-gradient(135deg,#4a5bf3,#202b8e)!important;
  color:white!important;
  font-weight:950
}
.online-checkout-info{
  margin-top:10px;padding:11px 12px;border-radius:14px;
  background:linear-gradient(135deg,#f6f7ff,#fff);
  border:1px solid #dfe3ff;
  display:flex;flex-direction:column;gap:3px
}
.online-checkout-info strong{font-size:10px;color:#29368f}
.online-checkout-info span{font-size:9px;line-height:1.45;color:#6e6f7e}