/* ───── Gift Link Builder ───── */
/* Reuses .ma-overlay, .ma-topbar, .ma-main, .ma-toolbar, .ma-panel, .ma-phone from miniapp-builder.css */

/* Gift page list (before entering builder) */
.gl-page{padding:24px;max-width:960px;margin:0 auto}
.gl-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}
.gl-header h2{font-size:1.35rem;font-weight:700;color:#e2e8f0;display:flex;align-items:center;gap:8px}
.gl-create-btn{padding:8px 18px;border:none;border-radius:10px;background:linear-gradient(135deg,#f97316,#ef4444);color:#fff;font-weight:600;font-size:.88rem;cursor:pointer;display:flex;align-items:center;gap:6px}
.gl-create-btn:hover{filter:brightness(1.1)}
.gl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.gl-card{background:rgba(30,41,59,.85);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px;cursor:pointer;transition:all .2s}
.gl-card:hover{border-color:rgba(249,115,22,.4);transform:translateY(-2px);box-shadow:0 4px 20px rgba(249,115,22,.15)}
.gl-card-banner{width:100%;height:120px;border-radius:10px;object-fit:cover;background:linear-gradient(135deg,#1e293b,#334155);margin-bottom:12px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.gl-card-banner img{width:100%;height:100%;object-fit:cover}
.gl-card-banner .gl-no-banner{color:#64748b;font-size:.85rem}
.gl-card-name{font-weight:600;color:#e2e8f0;font-size:1rem;margin-bottom:4px}
.gl-card-slug{font-size:.82rem;color:#94a3b8;font-family:monospace;margin-bottom:8px}
.gl-card-foot{display:flex;align-items:center;justify-content:space-between}
.gl-card-stats{font-size:.78rem;color:#64748b;display:flex;gap:12px}
.gl-card-stats span{display:flex;align-items:center;gap:3px}
.gl-badge{padding:2px 8px;border-radius:6px;font-size:.72rem;font-weight:600;text-transform:uppercase}
.gl-badge.draft{background:rgba(100,116,139,.25);color:#94a3b8}
.gl-badge.active{background:rgba(34,197,94,.2);color:#22c55e}

/* Phone simulator: Gift Page preview */
.gl-preview{width:100%;height:100%;background:#f5f5f5;font-family:-apple-system,BlinkMacSystemFont,sans-serif;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;position:relative;color:#1a1a1a}
.gl-preview *{box-sizing:border-box}
.gl-p-banner{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:linear-gradient(135deg,#667eea,#764ba2)}
.gl-p-banner img{width:100%;height:100%;object-fit:cover}
.gl-p-card{margin:-30px 16px 16px;background:#fff;border-radius:16px;padding:20px;box-shadow:0 2px 20px rgba(0,0,0,.08);position:relative;z-index:1}
.gl-p-greeting{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.gl-p-avatar{width:40px;height:40px;border-radius:50%;background:#e8e8e8;display:flex;align-items:center;justify-content:center;color:#999;font-size:20px;overflow:hidden;flex-shrink:0}
.gl-p-greeting-text{font-weight:700;font-size:1.05rem;color:#1a1a1a}
.gl-p-voucher-title{font-weight:600;font-size:.95rem;color:#333;margin-bottom:2px}
.gl-p-voucher-count{font-size:.8rem;color:#999;margin-bottom:14px}
.gl-p-voucher-item{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid #eee;border-radius:12px;margin-bottom:12px;background:#fafafa}
.gl-p-voucher-logo{width:56px;height:56px;border-radius:10px;background:#f0f0f0;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.gl-p-voucher-logo img{width:100%;height:100%;object-fit:contain}
.gl-p-voucher-info{flex:1;min-width:0}
.gl-p-voucher-name{font-weight:700;font-size:.9rem;color:#1a1a1a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gl-p-voucher-desc{font-size:.78rem;color:#888;margin-top:2px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical}
.gl-p-cta{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-radius:24px;border:1.5px solid #ddd;font-weight:600;font-size:.9rem;color:#333;cursor:pointer;margin-top:8px;background:#fff;transition:all .2s}
.gl-p-explore{padding:16px;font-weight:600;font-size:.95rem;color:#333;border-left:3px solid #1890ff}
.gl-p-tabs{display:flex;justify-content:space-around;padding:10px 0;background:#fff;border-top:1px solid #eee;margin-top:auto;flex-shrink:0}
.gl-p-tab{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.7rem;color:#999}
.gl-p-tab:first-child{color:#1890ff}
.gl-p-tab i{font-size:18px}
.gl-p-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#999;gap:8px}
.gl-p-empty i{font-size:48px;opacity:.3}

/* Splash screen preview */
.gl-p-splash{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;background:#fff;gap:16px}
.gl-p-splash-logo{width:80px;height:80px;border-radius:20px;background:#f0f0f0;display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.08)}
.gl-p-splash-logo img{width:100%;height:100%;object-fit:contain}
.gl-p-splash-name{font-weight:700;font-size:1.1rem;color:#333}

/* Link panel */
.gl-link-box{background:rgba(30,41,59,.6);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:14px;margin:12px 0;display:flex;align-items:center;gap:8px}
.gl-link-url{flex:1;font-family:monospace;font-size:.85rem;color:#f97316;word-break:break-all}
.gl-copy-btn{padding:6px 14px;border:none;border-radius:8px;background:#f97316;color:#fff;font-size:.82rem;font-weight:600;cursor:pointer;white-space:nowrap}
.gl-copy-btn:hover{filter:brightness(1.1)}
.gl-stats-row{display:flex;gap:16px;margin:12px 0}
.gl-stat{flex:1;background:rgba(30,41,59,.6);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:14px;text-align:center}
.gl-stat-val{font-size:1.4rem;font-weight:700;color:#e2e8f0}
.gl-stat-label{font-size:.75rem;color:#64748b;margin-top:2px}

/* Voucher editor */
.gl-voucher-add{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;border:1.5px dashed rgba(255,255,255,.15);border-radius:10px;color:#94a3b8;cursor:pointer;font-size:.85rem;margin-top:8px;transition:all .2s}
.gl-voucher-add:hover{border-color:#f97316;color:#f97316}
.gl-voucher-ed{background:rgba(30,41,59,.5);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:12px;margin-bottom:8px;position:relative}
.gl-voucher-ed .gl-v-del{position:absolute;top:8px;right:8px;width:22px;height:22px;border-radius:6px;border:1px solid rgba(255,255,255,.15);background:rgba(239,68,68,.2);color:#ef4444;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px}
.gl-voucher-ed .gl-v-del:hover{background:rgba(239,68,68,.4)}