/* ---------------------------------------------------------
   CORE CARD
   --------------------------------------------------------- */

.vatg-final-summary {
    position: relative;
    max-width: 100%;
    margin: 1.5rem auto;
    padding: 1.5rem;
    background: #ffffff;
    border: none;
    border-radius: 0;
    box-shadow: none;
    font-family: inherit;
}

/* ---------------------------------------------------------
   HEADER: TITLE + META (LEFT) / THUMBNAIL (RIGHT)
   --------------------------------------------------------- */

.vatg-final-summary-header {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
    grid-template-rows: auto auto;
    grid-template-areas:
        "title title"
        "meta  thumb";
    column-gap: 2rem;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(91, 60, 136, 0.2);
}

/* Title block inside header */
.vatg-final-summary-title-block {
    grid-area: title;
}

/* Main record title (from first page of PDF) */
.vatg-final-summary-h1 {
    margin: 0 0 0.25rem;
    font-size: 1.9rem;
    line-height: 1.2;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #3b2759;
}

/* Secondary subtitle: "Private Record Finalized" */
.vatg-final-summary-h2 {
    margin: 0;
    font-size: 1.05rem;
    line-height: 1.4;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6b5690;
}

/* Meta column (Bundle / Finalized On / etc.) */

.vatg-final-summary-meta {
    grid-area: meta;
    margin: 0;
}

/* Thumbnail column */

.vatg-final-summary-thumbnail {
    grid-area: thumb;
    position: relative;       /* needed for watermark overlay */
    max-width: 280px;
    width: 100%;
    justify-self: end;
    margin-top: 0;            /* aligns top with first meta row */
    background: #ffffff;
    border: 1px solid #dddddd;
    overflow: hidden;
}

.vatg-final-summary-thumbnail img {
    display: block;
    width: 100%;
    height: auto;
}

/* Watermark overlay on thumbnail */

.vatg-final-summary-thumbnail::after {
    content: "Created in private with My Mothers Trust";
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.5rem;
    text-align: center;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0.4);
    background: transparent;
    transform: rotate(-18deg);
    pointer-events: none;
    mix-blend-mode: multiply;
    opacity: 0.2;
}

/* ---------------------------------------------------------
   META LINES / LABELS / VALUES
   --------------------------------------------------------- */

.vatg-final-summary-line {
    margin: 0.1rem 0;
    font-size: 0.9rem;
    padding: 0.12rem 0.35rem;
    border-radius: 4px;
}

.vatg-final-summary-meta .vatg-final-summary-line:nth-child(even),
.vatg-final-summary-column .vatg-final-summary-line:nth-child(even) {
    background: rgba(91, 60, 136, 0.03);
}

.vatg-final-summary-label {
    display: inline-block;
    min-width: 130px;
    font-weight: 600;
    color: #4d3a70;
}

.vatg-final-summary-value {
    color: #222;
}

/* ---------------------------------------------------------
   BODY SECTIONS
   --------------------------------------------------------- */

.vatg-final-summary-body {
    border-top: 1px dashed rgba(0, 0, 0, 0.08);
    padding-top: 1.25rem;
    margin-top: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.vatg-final-summary-section h3 {
    margin: 0 0 0.75rem;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #444;
}

/* Parties (member + beneficiary) */

.vatg-final-summary-parties {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.vatg-final-summary-column {
    flex: 1 1 260px;
    padding: 1rem;
    border-radius: 8px;
    background: #fafafa;
    border: 1px solid rgba(0, 0, 0, 0.04);
}

/* Technical trace */

.vatg-final-summary-technical {
    padding: 1rem;
    border-radius: 8px;
    background: #fdfcf8;
    border: 1px solid rgba(0, 0, 0, 0.04);
    border-left: 3px solid rgba(91, 60, 136, 0.5);
}

.vatg-final-summary-note {
    margin-top: 0.5rem;
    font-size: 0.8rem;
    color: #777;
}

/* ---------------------------------------------------------
   FOOTER / ACTIONS
   --------------------------------------------------------- */

.vatg-final-summary-footer {
    border-top: 1px dashed rgba(91, 60, 136, 0.35);
    padding-top: 1rem;
    margin-top: 1.5rem;
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
}

.vatg-final-summary-footer::before {
    content: "My Mothers Trust — private ledger copy";
    font-size: 0.8rem;
    font-style: italic;
    color: rgba(91, 60, 136, 0.8);
    margin-right: auto;
    align-self: center;
}

/* Button styling for the Print Summary action */

.vatg-final-summary-actions .vatg-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1.25rem;
    border-radius: 999px;
    border: 1px solid rgba(91, 60, 136, 0.4);
    background: #f5f1ff;
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition:
        background 0.15s ease,
        transform 0.08s ease,
        box-shadow 0.15s ease;
}

.vatg-final-summary-actions .vatg-button:hover {
    background: #ebe2ff;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
    transform: translateY(-1px);
}

.vatg-final-summary-actions .vatg-button:active {
    transform: translateY(0);
    box-shadow: none;
}

/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 900px) {
    .vatg-final-summary-header {
        grid-template-columns: 1fr;
        grid-template-areas:
            "title"
            "thumb"
            "meta";
    }

    .vatg-final-summary-thumbnail {
        justify-self: flex-start;
        margin-top: 1.5rem;
    }
}

/* ---------------------------------------------------------
   PRINT-FRIENDLY (LIGHT TOUCH)
   --------------------------------------------------------- */

@media print {
    @page {
        margin: 0;
    }

    body {
        margin: 0;
    }

    .vatg-final-summary {
        box-shadow: none;
        border: 0;
        margin: 0;
        max-width: 100%;
        padding: 0;
    }

    .vatg-final-summary-footer,
    .vatg-final-summary-actions .vatg-button {
        display: none !important;
    }
}