/* LatePoint Vouchers & Gift Cards — partner portal (front-end). Brand: #191998 / #ffc600 */

.vg-portal { max-width: 900px; margin: 0 auto; font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; color: #1f2733; }
.vg-portal * { box-sizing: border-box; }

.vg-portal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.vg-portal-eyebrow { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: #191998; opacity: .75; font-weight: 600; }
.vg-portal-title { font-size: 26px; font-weight: 800; margin: 2px 0 0; color: #191998; }

.vg-badge { padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.vg-badge-warn { background: #fdecec; color: #c0392b; }

.vg-stat-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 22px; }
.vg-stat-card { background: #fff; border: 1px solid #e7eaf0; border-radius: 12px; padding: 14px 16px; }
.vg-stat-card-primary { background: #191998; border-color: transparent; border-top: 3px solid #ffc600; color: #fff; }
.vg-stat-label { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; opacity: .7; margin-bottom: 5px; }
.vg-stat-value { font-size: 20px; font-weight: 800; line-height: 1.1; }
.vg-stat-sub { font-size: 12px; opacity: .65; margin-top: 4px; }

.vg-tabs { display: flex; flex-wrap: wrap; gap: 6px; border-bottom: 1px solid #e7eaf0; margin-bottom: 18px; }
.vg-tab-btn { background: none; border: none; padding: 10px 14px; font-size: 14px; font-weight: 600; color: #6b7688; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.vg-tab-btn.is-active { color: #191998; border-bottom-color: #ffc600; }

.vg-tab-panel { display: none; }
.vg-tab-panel.is-active { display: block; }

.vg-portal-card { background: #fff; border: 1px solid #e7eaf0; border-radius: 14px; padding: 22px; margin-bottom: 16px; }

.vg-form-help { font-size: 13px; color: #6b7688; margin: 0 0 16px; }
.vg-field { margin-bottom: 14px; }
.vg-field-row { display: flex; gap: 14px; flex-wrap: wrap; }
.vg-field-row .vg-field { flex: 1; min-width: 160px; }
.vg-field-narrow { max-width: 200px; }
.vg-field label, .vg-block-label { display: block; font-size: 12px; font-weight: 600; color: #4a5468; margin-bottom: 6px; }
.vg-block-label { margin-top: 6px; }

.vg-portal input[type="text"], .vg-portal input[type="email"], .vg-portal input[type="number"], .vg-portal select, .vg-portal textarea {
	width: 100%; padding: 10px 12px; border: 1px solid #d3d9e3; border-radius: 8px; font-size: 14px; background: #fff; color: #1f2733;
}
.vg-portal input:focus, .vg-portal select:focus, .vg-portal textarea:focus { outline: none; border-color: #191998; box-shadow: 0 0 0 3px rgba(25, 25, 152, .12); }

.vg-recipient-rows { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
.vg-recipient-row { display: grid; grid-template-columns: 2fr 1.4fr 70px 34px; gap: 8px; align-items: center; }
.vg-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 40px; border: 1px solid #e3c3c3; border-radius: 8px; color: #c0392b; text-decoration: none; font-size: 18px; font-weight: 700; }
.vg-icon-btn:hover { background: #fdecec; }
.vg-link { display: inline-block; font-size: 13px; font-weight: 600; color: #191998; text-decoration: none; margin-bottom: 14px; }

.vg-issue-summary { font-size: 13px; font-weight: 600; padding: 9px 12px; border-radius: 8px; margin: 4px 0 14px; }
.vg-issue-summary.is-ok { background: #eeeefb; color: #191998; }
.vg-issue-summary.is-over { background: #fdecec; color: #c0392b; }

.vg-btn { display: inline-block; border: none; border-radius: 9px; padding: 12px 22px; font-size: 14px; font-weight: 700; cursor: pointer; text-decoration: none; }
.vg-btn-primary { background: #191998; color: #fff; }
.vg-btn-primary:hover { background: #12126e; }
.vg-btn.is-loading { opacity: .6; pointer-events: none; }

.vg-portal-message { padding: 12px 16px; border-radius: 10px; font-weight: 600; font-size: 14px; margin-bottom: 16px; }
.vg-portal-message.is-success { background: #eaf7ef; color: #1a7a45; border-left: 3px solid #1a9d54; }
.vg-portal-message.is-error { background: #fdecec; color: #c0392b; border-left: 3px solid #c0392b; }

.vg-table-scroll { overflow-x: auto; }
.vg-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.vg-table th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #8892a6; padding: 8px 10px; border-bottom: 1px solid #eef0f4; white-space: nowrap; }
.vg-table td { padding: 10px; border-bottom: 1px solid #f2f4f8; }
.vg-code { font-family: Menlo, Consolas, monospace; font-weight: 700; color: #191998; background: #eeeefb; padding: 2px 7px; border-radius: 5px; }
.vg-muted { color: #8892a6; }

.vg-status { padding: 3px 9px; border-radius: 999px; font-size: 11px; font-weight: 700; text-transform: capitalize; }
.vg-status-sent, .vg-status-active { background: #eaf7ef; color: #1a7a45; }
.vg-status-draft { background: #eef1f6; color: #6b7688; }
.vg-status-redeemed, .vg-status-depleted { background: #eeeefb; color: #191998; }
.vg-status-expired, .vg-status-cancelled { background: #fdecec; color: #c0392b; }

.vg-portal-empty { max-width: 480px; }
.vg-portal-notice { text-align: center; padding: 40px 24px; }
.vg-portal-notice-icon { font-size: 34px; color: #191998; opacity: .5; margin-bottom: 10px; }
.vg-portal-notice h3 { margin: 0 0 8px; font-size: 20px; color: #191998; }
.vg-portal-notice p { color: #6b7688; margin: 0 0 16px; }

@media (max-width: 600px) {
	.vg-recipient-row { grid-template-columns: 1fr; }
	.vg-field-narrow { max-width: none; }
}
