/* ===== CimaPlus / CimaTours Voucher ===== */

.cpv-wrapper {
    max-width:720px;
    margin:24px auto;
    font-family:'Segoe UI',Arial,sans-serif;
    padding:0 12px;
}

/* ── Tarjeta ─────────────────────────────────────────────────────── */
.cpv-voucher {
    border:1px solid #dde;
    border-radius:12px;
    overflow:hidden;
    background:#fff !important;
    box-shadow:0 4px 20px rgba(0,0,0,.12);
}

/* ── Banner ──────────────────────────────────────────────────────── */
.cpv-header { overflow:hidden; line-height:0; }
.cpv-banner-img { width:100%; display:block; object-fit:cover; }

/* ── Título ──────────────────────────────────────────────────────── */
.cpv-title-section {
    padding:16px 24px 14px;
    text-align:center;
    border-bottom:1px solid #eee;
}

.cpv-title-main {
    font-size:22px;
    font-weight:900;
    color:#1a2c5b;
    letter-spacing:2px;
    margin:0 0 4px;
    text-transform:uppercase;
}

.cpv-title-sub {
    font-size:10.5px;
    letter-spacing:3px;
    text-transform:uppercase;
    color:#999;
    margin:0 0 12px;
    font-weight:500;
}

/* ── Caja de confirmación ────────────────────────────────────────── */
.cpv-confirm-box {
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:#f0f4fa;
    border-radius:8px;
    padding:8px 18px;
    font-size:13px;
    color:#444;
    max-width:100%;
    flex-wrap:wrap;
    justify-content:center;
}

.cpv-confirm-icon { font-size:18px; flex-shrink:0; }

.cpv-confirm-info {
    text-align:left;
    line-height:1.8;
}

.cpv-confirm-info strong { color:#1a2c5b; }

.cpv-confirm-loc {
    font-size:14px;
    margin-bottom:1px;
}

/* ── Barra de servicio ───────────────────────────────────────────── */
.cpv-service-bar {
    color:#fff !important;
    padding:10px 20px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
}

.cpv-sbar-left {
    font-size:15px;
    font-style:italic;
    letter-spacing:.3px;
    line-height:1.3;
}

.cpv-sbar-left strong {
    font-weight:800;
    font-style:normal;
}

.cpv-sbar-right {
    font-size:10px;
    font-weight:700;
    letter-spacing:.8px;
    text-transform:uppercase;
    text-align:right;
    flex-shrink:0;
    max-width:45%;
    line-height:1.4;
    opacity:.95;
}

/* ── Tabla de datos (ancho completo) ─────────────────────────────── */
.cpv-vtable { width:100%; border-collapse:collapse; }

.cpv-vtable tr { border-top:1px solid #e8e8e8; }
.cpv-vtable tr:first-child { border-top:none; }

.cpv-vtable td {
    padding:8px 14px;
    vertical-align:middle;
    font-size:13px;
    line-height:1.5;
}

.cpv-td-lbl {
    width:36%;
    font-weight:700;
    color:#1a2c5b !important;
    background:#f4f6fa !important;
    white-space:nowrap;
}

.cpv-td-val { color:#333 !important; background:#fff !important; }

.cpv-row-icon { margin-right:6px; font-size:13px; }

/* ── Sección QR ──────────────────────────────────────────────────── */
.cpv-qr-section {
    background:linear-gradient(160deg, #e0f7fa 0%, #e8f5e9 100%);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
    padding:22px 16px;
    border-top:1px solid #c5e8d0;
}

.cpv-qr-leaf {
    font-size:54px;
    line-height:1;
    opacity:.45;
    user-select:none;
    flex-shrink:0;
    transform:scaleX(-1);
}

.cpv-qr-leaf-r { transform:scaleX(1); }

.cpv-qr-center { text-align:center; flex-shrink:0; }

.cpv-qr-img {
    width:150px;
    height:150px;
    display:block;
    margin:0 auto;
    border:1px solid #cde;
    border-radius:8px;
    padding:4px;
    background:#fff;
}

.cpv-qr-label {
    font-size:11px;
    color:#555;
    margin-top:8px;
    line-height:1.6;
}

/* ── Sección Importante ──────────────────────────────────────────── */
.cpv-importante {
    background:#e8f4fd;
    padding:12px 20px 14px;
    border-top:1px solid #cce0f5;
}

.cpv-imp-header {
    font-size:13px;
    font-weight:700;
    color:#1565c0;
    margin:0 0 8px;
    display:flex;
    align-items:center;
    gap:7px;
}

.cpv-imp-icon {
    background:#1565c0;
    color:#fff;
    border-radius:50%;
    width:18px;
    height:18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:11px;
    font-style:italic;
    font-weight:900;
    flex-shrink:0;
}

.cpv-imp-list {
    margin:0;
    padding:0;
    list-style:none;
}

.cpv-imp-list li {
    font-size:11px;
    color:#444;
    margin-bottom:5px;
    line-height:1.5;
    display:flex;
    gap:8px;
    align-items:flex-start;
}

.cpv-imp-list li::before { content:'✅'; flex-shrink:0; font-size:11px; }

/* ── Footer ──────────────────────────────────────────────────────── */
.cpv-footer {
    border-top:1px solid #e8e8e8;
    background:#fafafa !important;
}

.cpv-footer-inner { display:flex; align-items:stretch; }

.cpv-footer-brand {
    padding:12px 14px;
    min-width:100px;
    border-right:1px solid #e0e0e0;
    text-align:center;
    flex-shrink:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:2px;
}

.cpv-brand-name {
    font-size:13px;
    font-weight:900;
    color:#1a2c5b;
    letter-spacing:.5px;
    line-height:1.2;
}

.cpv-brand-tagline {
    font-size:8px;
    color:#999;
    text-transform:uppercase;
    letter-spacing:1px;
}

.cpv-contact-bar { display:flex; flex:1; }

.cpv-contact-group {
    flex:1;
    padding:8px 10px;
    font-size:10.5px;
    border-right:1px solid #e0e0e0;
}

.cpv-contact-group:last-child { border-right:none; }

.cpv-contact-row {
    display:flex;
    align-items:center;
    gap:5px;
    margin-bottom:3px;
    color:#444;
    line-height:1.5;
}

/* ── Botones ─────────────────────────────────────────────────────── */
.cpv-actions {
    margin-top:12px;
    display:flex;
    flex-direction:column;
    gap:8px;
}

.cpv-btn {
    display:flex !important;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:13px 20px;
    border-radius:8px;
    font-size:15px;
    font-weight:600;
    cursor:pointer;
    text-decoration:none !important;
    border:none;
    width:100%;
    box-sizing:border-box;
    letter-spacing:.3px;
}

.cpv-btn-print    { background:#1a2c5b !important; color:#fff !important; }
.cpv-btn-whatsapp { background:#25d366 !important; color:#fff !important; }

/* ── Impresión ───────────────────────────────────────────────────── */
@media print {
    @page { size: A4 portrait; margin: 6mm; }

    .no-print { display:none !important; }

    html, body { margin:0 !important; padding:0 !important; }

    .cpv-wrapper { margin:0 !important; max-width:100% !important; padding:0 !important; }

    .cpv-voucher {
        box-shadow:none !important;
        border:1px solid #ccc !important;
        border-radius:0 !important;
        page-break-inside:avoid;
    }

    .cpv-banner-img {
        width:100% !important;
        max-height:none !important;
        object-fit:contain !important;
    }

    .cpv-title-main { font-size:17px !important; }
    .cpv-title-sub  { font-size:9px !important; }
    .cpv-confirm-box { font-size:11px !important; padding:6px 12px !important; }

    .cpv-service-bar { font-size:12px !important; padding:8px 14px !important; }

    .cpv-vtable td { padding:5px 10px !important; font-size:11px !important; }

    .cpv-qr-section { padding:14px 12px !important; }
    .cpv-qr-img { width:110px !important; height:110px !important; }
    .cpv-qr-label { font-size:9px !important; }

    .cpv-importante { padding:8px 14px !important; }
    .cpv-imp-header { font-size:11px !important; }
    .cpv-imp-list li { font-size:9.5px !important; }

    .cpv-footer-brand { padding:8px 10px !important; }
    .cpv-brand-name { font-size:11px !important; }
    .cpv-contact-row { font-size:9px !important; }
}

/* ── Responsive ──────────────────────────────────────────────────── */
@media (max-width:560px) {
    .cpv-sbar-right { display:none; }
    .cpv-qr-leaf { display:none; }
    .cpv-footer-inner { flex-direction:column; }
    .cpv-footer-brand { border-right:none; border-bottom:1px solid #e0e0e0; flex-direction:row; justify-content:center; gap:10px; }
    .cpv-contact-bar { flex-direction:column; }
    .cpv-contact-group { border-right:none; border-bottom:1px solid #e0e0e0; }
    .cpv-contact-group:last-child { border-bottom:none; }
}