/* M-PAiSA Frontend Styles */
.mpaisa-payment-box {
    max-width: 380px;
    border: 2px solid #e60000;
    border-radius: 14px;
    overflow: hidden;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    box-shadow: 0 4px 20px rgba(230,0,0,0.12);
}

.mpaisa-payment-header {
    background: linear-gradient(135deg, #1a0000 0%, #e60000 100%);
    padding: 14px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.mpaisa-brand { color: white; font-weight: 700; font-size: 18px; display: flex; align-items: center; gap: 8px; }
.mpaisa-mode-badge { background: rgba(255,255,255,0.2); color: white; font-size: 11px; padding: 3px 10px; border-radius: 20px; text-transform: uppercase; letter-spacing: 1px; }

.mpaisa-payment-details { padding: 24px 20px 16px; text-align: center; background: #fff; }
.mpaisa-amount-display { display: flex; align-items: baseline; justify-content: center; gap: 6px; margin-bottom: 8px; }
.mpaisa-currency { font-size: 18px; color: #666; font-weight: 600; }
.mpaisa-amount { font-size: 42px; font-weight: 800; color: #1a0000; line-height: 1; }
.mpaisa-item-name { color: #555; font-size: 14px; }

.mpaisa-pay-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: calc(100% - 40px);
    margin: 0 20px 16px;
    padding: 14px;
    background: #e60000;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s, transform 0.1s;
}
.mpaisa-pay-button:hover  { background: #cc0000; }
.mpaisa-pay-button:active { transform: scale(0.98); }
.mpaisa-pay-button:disabled { background: #aaa; cursor: not-allowed; }

.mpaisa-status-msg {
    margin: 0 20px 16px;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 13px;
    text-align: center;
}
.mpaisa-status-msg.info    { background: #e8f4fd; color: #0c5460; border: 1px solid #bee5eb; }
.mpaisa-status-msg.error   { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
.mpaisa-status-msg.success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }

.mpaisa-footer-note { padding: 10px 20px; background: #fafafa; border-top: 1px solid #eee; text-align: center; color: #999; }

.mpaisa-error { color: #c00; padding: 10px; background: #fff0f0; border: 1px solid #fcc; border-radius: 6px; }

/* Result page */
.mpaisa-result-box {
    max-width: 480px;
    margin: 40px auto;
    padding: 40px 32px;
    border-radius: 14px;
    text-align: center;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.mpaisa-result-success  { background: #d4edda; border: 2px solid #28a745; }
.mpaisa-result-cancelled{ background: #fff3cd; border: 2px solid #ffc107; }
.mpaisa-result-failed   { background: #f8d7da; border: 2px solid #dc3545; }

.mpaisa-result-icon   { font-size: 56px; margin-bottom: 12px; }
.mpaisa-result-title  { margin: 0 0 8px; font-size: 26px; }
.mpaisa-result-desc   { color: #444; margin-bottom: 20px; }

.mpaisa-result-meta { background: rgba(255,255,255,0.6); border-radius: 8px; padding: 16px; margin-bottom: 24px; text-align: left; }
.mpaisa-result-meta div { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid rgba(0,0,0,0.08); font-size: 14px; }
.mpaisa-result-meta div:last-child { border-bottom: none; }
.mpaisa-result-meta span { color: #666; }

.mpaisa-result-home-btn {
    display: inline-block;
    padding: 12px 28px;
    background: #333;
    color: white;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
}
.mpaisa-result-home-btn:hover { background: #111; color: white; }