/* STRIDE Table Visual Enhancements */

/* IMPORTANT: Fix flag-icons conflict with sector classes */
/* The flag-icons library uses .fi for Finland flag, but we use .fi for Financial sector */
/* This causes .fi::before to add content:" " which misaligns card view */
/* Override flag-icons ::before for grid items to prevent card misalignment */
.grid-item.fi::before,
.grid-item.fi::after {
    content: none !important;
    display: none !important;
}

/* Also prevent any other flag-icons country codes that might conflict */
.grid-item::before,
.grid-item::after {
    content: none !important;
}

/* Flag icons sizing - enhance but don't override background-image */
/* Scoped to STRIDE table only to prevent affecting other elements */
#legislation-stride-table td .fi {
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    vertical-align: middle;
    display: inline-block;
}

/* Make flags larger in table - using 4:3 ratio */
#legislation-stride-table td .fi.fi-lg {
    width: 40px;
    height: 30px;
    font-size: 30px;
    line-height: 30px;
}

/* Native HTML5 progress element styling in table cells */
#legislation-stride-table td progress {
    -webkit-appearance: none;
    appearance: none;
    margin-top: 4px;
    display: block;
}

/* Style the progress bar background (unfilled) */
#legislation-stride-table td progress::-webkit-progress-bar {
    background-color: var(--lx-surface-inset);
    border-radius: 3px;
}

/* Style the progress bar fill */
#legislation-stride-table td progress::-webkit-progress-value {
    background-color: var(--lx-blue-solid);
    border-radius: 3px;
}

/* Firefox styling */
#legislation-stride-table td progress {
    background-color: var(--lx-surface-inset);
    border-radius: 3px;
}

#legislation-stride-table td progress::-moz-progress-bar {
    background-color: var(--lx-blue-solid);
    border-radius: 3px;
}

/* Ensure tooltips work properly in table cells */
#legislation-stride-table [data-bs-toggle="tooltip"] {
    cursor: default;
}

/* Align flag with badge vertically */
#legislation-stride-table td .d-inline-flex.align-items-center {
    gap: 0.25rem;
}

/* Responsive progress bars */
@media (max-width: 768px) {
    #legislation-stride-table td .progress {
        min-width: 40px !important;
    }
}

/* Hover effect for rows with visual elements */
#legislation-stride-table tbody tr:hover {
    background-color: rgba(0,0,0,0.02);
}

/* Stage progress indicator (optional future enhancement) */
/* Scoped to table only to prevent affecting cards */
#legislation-stride-table .stage-progress {
    display: inline-flex;
    gap: 2px;
    align-items: center;
}

#legislation-stride-table .stage-progress .stage-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--lx-border);
}

#legislation-stride-table .stage-progress .stage-dot.active {
    background-color: var(--lx-blue-solid);
}

#legislation-stride-table .stage-progress .stage-dot.completed {
    background-color: var(--lx-success-solid);
}