/**
 * ARD Payment Plan Table Widget
 * Teal/gold theme with animated table (staggered reveal, hover).
 */
.ard-pp {
    --ard-pp-primary: #0d5c5c;
    --ard-pp-secondary: #1a7a7a;
    --ard-pp-accent: #c9a227;
    --ard-pp-text: #ffffff;
    --ard-pp-font-heading: 'Miguer', sans-serif;
    --ard-pp-font-content: 'Montserrat', sans-serif;
    /* Animation: set via widget control or defaults (slow) */
    --ard-pp-duration: 1.2s;
    --ard-pp-stagger: 0.15s;
    font-family: 'Montserrat', sans-serif !important;
    padding: 2rem 1rem;
    overflow: hidden;
}

.ard-pp__inner {
    max-width: 1200px;
    margin: 0 auto;
}

/* ----- Header ----- */
.ard-pp__header {
    text-align: center;
    margin-bottom: 2rem;
}

.ard-pp__title {
    font-family: 'Miguer', sans-serif !important;
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 700;
    color: var(--ard-pp-primary);
    margin: 0 0 0.5rem;
    letter-spacing: 0.05em;
    text-align: center;
}

.ard-pp__subtitle {
    font-family: 'Miguer', sans-serif !important;
    font-size: clamp(0.95rem, 2vw, 1.15rem);
    font-weight: 500;
    color: var(--ard-pp-primary);
    margin: 0 0 1rem;
    text-align: center;
    opacity: 0.9;
}

.ard-pp__ruda {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--ard-pp-primary);
    border: 2px solid var(--ard-pp-accent);
}

.ard-pp__ruda-text {
    font-size: 0.6rem;
    line-height: 1.2;
    color: var(--ard-pp-text);
    text-align: center;
    padding: 4px;
    max-width: 70px;
}

/* ----- Table ----- */
.ard-pp__table-wrap {
    overflow-x: auto;
    margin-bottom: 2rem;
    border-radius: 8px;
    box-shadow: 0 8px 32px rgba(13, 92, 92, 0.25);
}

.ard-pp__table {
    width: 100%;
    border-collapse: collapse;
    min-width: 800px;
}

/* Head row: hidden initially for animation */
.ard-pp__row--head .ard-pp__cell {
    opacity: 0;
    transform: translateY(-12px);
    transition: opacity var(--ard-pp-duration, 1.2s) ease, transform var(--ard-pp-duration, 1.2s) ease, background 0.2s ease;
}

.ard-pp.ard-pp--visible .ard-pp__row--head .ard-pp__cell {
    opacity: 1;
    transform: translateY(0);
}

.ard-pp__row--head .ard-pp__cell {
    font-family: 'Montserrat', sans-serif !important;
    background: var(--ard-pp-primary);
    color: var(--ard-pp-text);
    font-weight: 600;
    font-size: 0.75rem;
    padding: 0.85rem 0.5rem;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.15);
}

/* Stagger header cells */
.ard-pp__row--head .ard-pp__cell:nth-child(1) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 0.33); }
.ard-pp__row--head .ard-pp__cell:nth-child(2) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 0.66); }
.ard-pp__row--head .ard-pp__cell:nth-child(3) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 1); }
.ard-pp__row--head .ard-pp__cell:nth-child(4) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 1.33); }
.ard-pp__row--head .ard-pp__cell:nth-child(5) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 1.66); }
.ard-pp__row--head .ard-pp__cell:nth-child(6) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 2); }
.ard-pp__row--head .ard-pp__cell:nth-child(7) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 2.33); }
.ard-pp__row--head .ard-pp__cell:nth-child(8) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 2.66); }
.ard-pp__row--head .ard-pp__cell:nth-child(9) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 3); }
.ard-pp__row--head .ard-pp__cell:nth-child(10) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 3.33); }
.ard-pp__row--head .ard-pp__cell:nth-child(11) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 3.66); }
.ard-pp__row--head .ard-pp__cell:nth-child(12) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 4); }

/* Body rows: hidden initially */
.ard-pp__row--body {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity var(--ard-pp-duration, 1.2s) ease, transform var(--ard-pp-duration, 1.2s) ease;
}

.ard-pp.ard-pp--visible .ard-pp__row--body {
    opacity: 1;
    transform: translateY(0);
}

.ard-pp__row--body:nth-child(1) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 1.33); }
.ard-pp__row--body:nth-child(2) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 2.33); }
.ard-pp__row--body:nth-child(3) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 3.33); }
.ard-pp__row--body:nth-child(4) { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 4.33); }

/* Body cells */
.ard-pp__cell--body {
    padding: 0.75rem 0.5rem;
    font-size: 0.8rem;
    color: var(--ard-pp-text);
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: transform 0.25s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.ard-pp__cell--dark {
    background: var(--ard-pp-primary);
}

.ard-pp__cell--light {
    background: var(--ard-pp-secondary);
}

/* Cell entrance: subtle scale */
.ard-pp__row--body .ard-pp__cell {
    opacity: 0;
    transform: scale(0.95);
    transition: opacity var(--ard-pp-duration, 1.2s) ease, transform var(--ard-pp-duration, 1.2s) ease, background 0.2s ease, box-shadow 0.2s ease;
}

.ard-pp.ard-pp--visible .ard-pp__row--body .ard-pp__cell {
    opacity: 1;
    transform: scale(1);
}

.ard-pp__row--body:nth-child(1) .ard-pp__cell { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 1.66), calc(var(--ard-pp-stagger, 0.15s) * 1.66), 0s, 0s; }
.ard-pp__row--body:nth-child(2) .ard-pp__cell { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 2.66), calc(var(--ard-pp-stagger, 0.15s) * 2.66), 0s, 0s; }
.ard-pp__row--body:nth-child(3) .ard-pp__cell { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 3.66), calc(var(--ard-pp-stagger, 0.15s) * 3.66), 0s, 0s; }
.ard-pp__row--body:nth-child(4) .ard-pp__cell { transition-delay: calc(var(--ard-pp-stagger, 0.15s) * 4.66), calc(var(--ard-pp-stagger, 0.15s) * 4.66), 0s, 0s; }

/* Hover: highlight row */
.ard-pp__row--body:hover .ard-pp__cell--dark {
    background: #0a4a4a;
    box-shadow: inset 0 0 0 1px var(--ard-pp-accent);
}

.ard-pp__row--body:hover .ard-pp__cell--light {
    background: #156868;
    box-shadow: inset 0 0 0 1px var(--ard-pp-accent);
}

.ard-pp__row--body .ard-pp__cell:hover {
    transform: scale(1.02);
    z-index: 1;
}

/* ----- Terms ----- */
.ard-pp__terms {
    background: var(--ard-pp-primary);
    color: var(--ard-pp-text);
    padding: 1.25rem 1.5rem;
    border-radius: 8px;
    opacity: 0;
    transform: translateY(16px);
    transition: opacity var(--ard-pp-duration, 1.2s) ease calc(var(--ard-pp-stagger, 0.15s) * 5), transform var(--ard-pp-duration, 1.2s) ease calc(var(--ard-pp-stagger, 0.15s) * 5);
}

.ard-pp.ard-pp--visible .ard-pp__terms {
    opacity: 1;
    transform: translateY(0);
}

.ard-pp__terms-title {
    font-family: 'Miguer', sans-serif !important;
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
    color: var(--ard-pp-accent);
    text-align: center;
}

.ard-pp__terms-list {
    margin: 0;
    padding-left: 1.5rem;
    font-size: 1rem;
    line-height: 1.6;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.35rem 2rem;
    list-style-type: square;
}

.ard-pp__terms-list li {
    margin-bottom: 0.35rem;
}

.ard-pp__terms-list li::marker {
    font-size: 1.4em;
}

/* Responsive */
@media (max-width: 768px) {
    .ard-pp {
        padding: 1.5rem 0.75rem;
    }
    .ard-pp__terms-list {
        grid-template-columns: 1fr;
    }
    .ard-pp__row--head .ard-pp__cell,
    .ard-pp__cell--body {
        font-size: 0.7rem;
        padding: 0.5rem 0.35rem;
    }
    .ard-pp__ruda-text {
        font-size: 0.5rem;
    }
}