/**
 * Tiger Testimonial Carousel — "Field Notes" preset.
 *
 * Pixel match for the reference design (testimonials-cards.html): a plain
 * white/near-black card, a decorative serif quote mark in place of the icon
 * badge, an emerald accent, muted-gold star ratings and a flat-color
 * initials avatar instead of a photo.
 *
 * !important is used deliberately: several of the properties below are also
 * emitted by the widget's own Style controls at equal CSS specificity
 * ({{WRAPPER}} .tg-tc-card === .tg-tc-preset-field-notes .tg-tc-card, both 2
 * classes), so which one wins is otherwise a coin flip decided by enqueue
 * order — confirmed empirically to go either way. Pixel fidelity to the
 * reference design was an explicit requirement, so this preset fixes those
 * specific properties rather than leaving them user-tunable. Avatar size,
 * card padding via other means, and date/name HTML tag remain live via
 * their own controls.
 *
 * Scoped entirely under .tg-tc-preset-field-notes so it's inert unless that
 * preset is selected.
 *
 * @package TigerElements
 */

.tg-tc-preset-field-notes .tg-tc-card {
    background: #ffffff !important;
    border: 1px solid #dde2dd !important;
    border-radius: 4px !important;
    box-shadow: 0 1px 2px rgba(22, 29, 26, 0.05) !important;
    padding: 2.1rem 1.8rem 1.7rem !important;
}

@media (prefers-color-scheme: dark) {
    .tg-tc-preset-field-notes .tg-tc-card {
        background: #171d19 !important;
        border-color: #29332c !important;
        box-shadow: none !important;
    }
}

.tg-tc-preset-field-notes .tg-tc-card:hover {
    transform: translateY(-3px) translateZ(0) !important;
    border-color: #1f6f5c !important;
    box-shadow: 0 14px 28px rgba(22, 29, 26, 0.1) !important;
}

@media (prefers-color-scheme: dark) {
    .tg-tc-preset-field-notes .tg-tc-card:hover {
        border-color: #55d9b0 !important;
    }
}

/* Quote mark: a plain decorative serif " instead of the icon badge. Font
   size is a fixed rem value (not derived from the Icon Size control) so it
   matches the reference design exactly regardless of that control's value. */
.tg-tc-preset-field-notes .tg-tc-quote-icon {
    position: static !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    border-radius: 0 !important;
    display: block !important;
    margin: 0 0 0.2rem !important;
    line-height: 1;
}

.tg-tc-preset-field-notes .tg-tc-quote-icon i,
.tg-tc-preset-field-notes .tg-tc-quote-icon svg {
    display: none !important;
}

.tg-tc-preset-field-notes .tg-tc-quote-icon::before {
    content: "\201C";
    font-family: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
    font-size: 2.6rem !important;
    color: #1f6f5c !important;
    opacity: 0.5;
}

@media (prefers-color-scheme: dark) {
    .tg-tc-preset-field-notes .tg-tc-quote-icon::before {
        color: #55d9b0 !important;
    }
}

/* Ratings sit close under the mark, matching the reference's tighter gap. */
.tg-tc-preset-field-notes .tg-tc-rating {
    margin-top: -0.4rem !important;
}

.tg-tc-preset-field-notes .tg-tc-card .tg-tc-rating {
    color: #c98a2b !important;
}

@media (prefers-color-scheme: dark) {
    .tg-tc-preset-field-notes .tg-tc-card .tg-tc-rating {
        color: #f0b955 !important;
    }
}

.tg-tc-preset-field-notes .tg-tc-text {
    font-family: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
    font-style: italic;
    font-size: 1.08rem !important;
    line-height: 1.55 !important;
    color: #161d1a !important;
}

@media (prefers-color-scheme: dark) {
    .tg-tc-preset-field-notes .tg-tc-text {
        color: #eef2ef !important;
    }
}

/* Initials avatar instead of a photo. */
.tg-tc-preset-field-notes .tg-tc-user-avatar {
    display: none !important;
}

.tg-tc-preset-field-notes .tg-tc-user-initials {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 50%;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: #ffffff;
    background: #1f6f5c;
    flex-shrink: 0;
}

@media (prefers-color-scheme: dark) {
    .tg-tc-preset-field-notes .tg-tc-user-initials {
        background: #55d9b0;
        color: #101512;
    }
}

.tg-tc-preset-field-notes .tg-tc-user-details .tg-tc-user-name {
    font-weight: 700 !important;
    font-size: 0.95rem !important;
}

.tg-tc-preset-field-notes .tg-tc-user-details p {
    font-size: 0.82rem !important;
    color: #6b6053 !important;
}

@media (prefers-color-scheme: dark) {
    .tg-tc-preset-field-notes .tg-tc-user-details p {
        color: #a89d8a !important;
    }
}

.tg-tc-preset-field-notes .tg-tc-user-info {
    border-top-color: #dde2dd !important;
}

@media (prefers-color-scheme: dark) {
    .tg-tc-preset-field-notes .tg-tc-user-info {
        border-top-color: #29332c !important;
    }
}