﻿/* 1. Style the error message text (Inspinia Red) */
.field-validation-error {
    color: #ed5565; /* Standard Inspinia Red */
    font-size: 0.85rem;
    font-weight: 600;
    margin-top: 5px;
    display: block;
}

/* 2. Highlight the input box with a red border */
.input-validation-error {
    border: 1px solid #ed5565 !important;
    background-color: #fff8f8; /* Very light red background */
}

/* 3. Style the Validation Summary (if you use it) */
.validation-summary-errors {
    color: #ed5565;
    font-weight: bold;
    font-size: 1rem;
    padding: 10px;
    border: 1px solid #ed5565;
    background: #fdf0f0;
    border-radius: 4px;
    margin-bottom: 20px;
}

    .validation-summary-errors ul {
        list-style: none;
        padding-left: 0;
    }



/* --- PREMIUM FOUNDER PILL --- */

/* --- PROFESSIONAL FOUNDER SEAL (CIRCLE) --- */
/* --- GOLDEN HARMONY FOUNDER SEAL --- */

/* --- IMPROVED FOUNDER SEAL --- */
.founder-seal-circle {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    /* CHANGE: changed 'help' to 'pointer' to remove the question mark */
    cursor: pointer;
    background: #ffc107; /* Solid gold for better visibility */
    border: 2px solid #ffffff;
    color: #ffffff;
    font-size: 1rem;
    position: relative;
    z-index: 10;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}

    .founder-seal-circle i {
        display: block;
        /* This ensures it is mathematically centered */
        transform: translateY(-0.5px);
    }

    /* Hover: Swap to a solid gold look */
    .founder-seal-circle:hover {
        background: #ffc107;
        color: #ffffff;
        transform: scale(1.1);
    }

@keyframes founder-seal-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.4);
    }

    70% {
        box-shadow: 0 0 0 8px rgba(255, 193, 7, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(255, 193, 7, 0);
    }
}

/* --- FIX FOR POPUP CORNERS & STYLE --- */
.founder-popover {
    /* Important: Hide overflow to ensure corners are perfectly round */
    overflow: hidden;
    border-radius: 12px !important;
    border: 1.5px solid #ffc107 !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1) !important;
}

    /* Fix for the top-left/right corners of the header */
    .founder-popover .popover-header {
        background-color: #fff9e6 !important;
        color: #856404 !important;
        font-weight: bold;
        font-size: 0.85rem;
        border-bottom: 1px solid #ffeeba !important;
        padding: 10px 15px;
        /* Explicitly round the top corners of the header */
        border-radius: 11px 11px 0 0 !important;
    }

    .founder-popover .popover-body {
        padding: 12px 15px;
        font-size: 0.85rem;
        color: #555;
        line-height: 1.5;
    }

    /* Fix the arrow color to match the gold border */
    .founder-popover .popover-arrow::after {
        border-top-color: #ffc107 !important;
    }
