/* Projects index only; navigation, GET filters and row actions retain native behavior. */
.projects-container {
    --pi-bg: #f5f7fb; --pi-surface: #fff; --pi-text: #17243b;
    --pi-muted: #64748b; --pi-border: #e2e8f0; --pi-accent: #555bd4; --pi-soft: #eef0ff;
    padding: 24px; min-width: 0; color: var(--pi-text); background: var(--pi-bg);
}
.projects-container .page-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; margin-bottom: 24px; }
.projects-container .page-title { margin: 0; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.3; font-weight: 700; letter-spacing: -.035em; color: var(--pi-text); }
.projects-container .page-description { margin: 8px 0 0; color: var(--pi-muted); font-size: .85rem; line-height: 1.6; }
.projects-container .header-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.projects-container :is(.btn-modern, .btn-success-modern, .btn-outline-modern) { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 9px 14px; border: 1px solid var(--pi-border); border-radius: 8px; font-size: .8rem; line-height: 1.5; font-weight: 600; text-decoration: none; cursor: pointer; box-shadow: none; transition: background-color .15s, border-color .15s; }
.projects-container .btn-modern { background: var(--pi-accent); border-color: var(--pi-accent); color: #fff; }
.projects-container .btn-modern:hover { background: #454bb8; border-color: #454bb8; color: #fff; }
.projects-container :is(.btn-success-modern, .btn-outline-modern) { color: var(--pi-muted); background: var(--pi-surface); }
.projects-container .btn-success-modern i { color: #19835c; }
.projects-container :is(.btn-success-modern, .btn-outline-modern):hover { color: var(--pi-accent); border-color: #b8c0ed; background: var(--pi-soft); }
.projects-container :is(.filter-card, .results-card) { border: 1px solid var(--pi-border); border-radius: 14px; background: var(--pi-surface); box-shadow: 0 2px 8px #17243b03; overflow: hidden; }
.projects-container .filter-card { margin-bottom: 20px; }
.projects-container .collapsible-filters > .filter-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 20px; cursor: pointer; list-style: none; color: var(--pi-text); }
.projects-container .filter-toggle::-webkit-details-marker { display: none; }
.projects-container .filter-toggle:hover { background: var(--pi-soft); }
.projects-container .filter-toggle:focus-visible { outline: 3px solid #818cf8; outline-offset: -4px; border-radius: 12px; }
.projects-container .filter-chevron { color: var(--pi-muted); font-size: .75rem; }
.projects-container .collapsible-filters[open] > .filter-toggle .filter-chevron { transform: rotate(180deg); }
.projects-container .collapsible-filters[open] > .filter-toggle { border-bottom: 1px solid var(--pi-border); }
.projects-container .card-header-modern { padding: 18px 20px 0; }
.projects-container .card-title-modern { display: flex; align-items: center; gap: 8px; margin: 0; font-size: .9rem; font-weight: 700; color: var(--pi-text); }
.projects-container .card-title-modern i { color: var(--pi-muted); font-size: .8rem; }
.projects-container .card-body-modern { padding: 18px 20px 20px; }
.projects-container .filter-grid { display: grid; grid-template-columns: 1.6fr repeat(5, minmax(0, 1fr)); gap: 14px; }
.projects-container .form-group-modern { display: flex; flex-direction: column; min-width: 0; }
.projects-container .form-label-modern { color: var(--pi-muted); font-size: .74rem; font-weight: 600; margin-bottom: 7px; line-height: 1.5; }
.projects-container .form-label-modern i { display: none; }
.projects-container .form-control-modern { width: 100%; min-width: 0; height: 42px; padding: 9px 12px; border: 1px solid var(--pi-border); border-radius: 8px; background: var(--pi-bg); color: var(--pi-text); font-size: .8rem; line-height: 1.5; }
.projects-container .form-control-modern::placeholder { color: var(--pi-muted); opacity: .8; }
.projects-container .form-control-modern:focus { background: var(--pi-surface); border-color: var(--pi-accent); box-shadow: 0 0 0 3px #6366f114; outline: none; }
.projects-container .filter-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--pi-border); }
.projects-container .projects-results-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; padding: 18px 20px; }
.projects-container .projects-results-heading h2 { display: flex; align-items: center; gap: 10px; margin: 0; color: var(--pi-text); font-size: .95rem; font-weight: 700; }
.projects-container .projects-result-count { display: inline-flex; padding: 4px 9px; border-radius: 6px; font-size: .75rem; font-weight: 650; font-variant-numeric: tabular-nums; color: var(--pi-accent); background: var(--pi-soft); }
.projects-container .projects-results-heading p { margin: 0; color: var(--pi-muted); font-size: .74rem; }
.projects-container .table-container { max-height: 70vh; overflow: auto; scrollbar-width: thin; scrollbar-color: #b9c3d7 var(--pi-bg); }
.projects-container .table-modern { width: 100%; min-width: 1150px; border-collapse: separate; border-spacing: 0; font-size: .8rem; }
.projects-container .table-modern th { position: sticky; top: 0; z-index: 2; padding: 13px 14px; border-block: 1px solid var(--pi-border); background: var(--pi-bg); color: var(--pi-muted); text-align: left; font-weight: 600; font-size: .72rem; white-space: nowrap; }
.projects-container .table-modern th a { display: inline-flex; align-items: center; gap: 6px; }
.projects-container .table-modern th a::after { content: '↕'; opacity: .6; font-size: .75rem; }
.projects-container .table-modern th a:hover { color: var(--pi-accent) !important; }
.projects-container .table-modern th i { display: none; }
.projects-container .table-modern td { padding: 15px 14px; border-bottom: 1px solid var(--pi-border); color: var(--pi-text); background: var(--pi-surface); vertical-align: middle; line-height: 1.6; }
.projects-container .table-modern tr:last-child td { border-bottom: 0; }
.projects-container .table-modern tr:is(:hover, :focus-within) td { background: var(--pi-soft); }
.projects-container .project-row { cursor: pointer; }
.projects-container .table-modern td:first-child { color: var(--pi-muted); font-size: .75rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.projects-container .table-modern td:nth-child(2) { min-width: 240px; max-width: 340px; overflow-wrap: anywhere; }
.projects-container .table-modern td:nth-child(2) a { color: var(--pi-text) !important; font-weight: 650; }
.projects-container .table-modern td:nth-child(2) a:hover { color: var(--pi-accent) !important; text-decoration: underline !important; text-underline-offset: 3px; }
.projects-container .table-modern td:nth-child(3), .projects-container .table-modern td:nth-child(4) { min-width: 130px; }
.projects-container .table-modern td:nth-child(6), .projects-container .table-modern td:nth-child(7) { white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--pi-muted); }
.projects-container .status-badge { display: inline-flex; padding: 4px 8px; border-radius: 6px; font-size: .68rem; font-weight: 600; line-height: 1.5; white-space: nowrap; }
.projects-container .action-buttons { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.projects-container .btn-action { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 6px; border: 1px solid var(--pi-border); border-radius: 7px; background: var(--pi-surface); color: var(--pi-muted); font-size: .78rem; text-decoration: none; box-shadow: none; cursor: pointer; }
.projects-container .btn-action:hover { color: var(--pi-accent); border-color: #b8c0ed; background: var(--pi-soft); }
.projects-container .btn-action.btn-danger { color: #c2414b; }
.projects-container .btn-action.btn-danger:hover { background: #fff1f2; border-color: #fecdd3; }
.projects-container .pagination-container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; padding: 16px 4px; }
.projects-container .pagination-info { color: var(--pi-muted); font-size: .78rem; }
.projects-container .pagination-buttons { display: flex; gap: 8px; }
.projects-container .pagination-buttons .disabled { opacity: .45; cursor: default; pointer-events: none; }
.projects-container .empty-state { padding: 56px 24px; text-align: center; }
.projects-container .empty-state-icon { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin-bottom: 20px; border-radius: 16px; color: var(--pi-accent); background: var(--pi-soft); font-size: 24px; }
.projects-container .empty-state-title { font-size: 1.1rem; font-weight: 650; color: var(--pi-text); margin-bottom: 8px; }
.projects-container .empty-state-text { color: var(--pi-muted); font-size: .85rem; }
.projects-container :is(a, button, input, select, [tabindex]):focus-visible { outline: 3px solid #818cf8; outline-offset: 3px; }
@media (max-width: 1199.98px) { .projects-container .filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767.98px) {
    .projects-container { padding: 16px; }
    .projects-container .page-header { align-items: stretch; }
    .projects-container .header-actions { width: 100%; }
    .projects-container .header-actions > a { flex: 1; }
    .projects-container .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .projects-container .card-body-modern { padding: 16px; }
    .projects-container .card-header-modern, .projects-container .projects-results-heading { padding: 16px; }
    .projects-container .card-header-modern { padding-bottom: 0; }
    .projects-container .pagination-container { flex-direction: column; align-items: stretch; }
    .projects-container .pagination-buttons > a { flex: 1; }
}
@media (max-width: 479.98px) { .projects-container .filter-grid { grid-template-columns: 1fr; } .projects-container .filter-actions > * { flex: 1; } }
:is([data-theme="dark"], [data-bs-theme="dark"], [data-marketing-theme="dark"], body.dark-mode) .projects-container { --pi-bg: #151c2b; --pi-surface: #1e293b; --pi-text: #e2e8f0; --pi-muted: #a8b4c8; --pi-border: #334155; --pi-accent: #a4b0ff; --pi-soft: #293452; }
:is([data-theme="dark"], [data-bs-theme="dark"], [data-marketing-theme="dark"], body.dark-mode) .projects-container .btn-modern { color: #151c2b; }
:is([data-theme="dark"], [data-bs-theme="dark"], [data-marketing-theme="dark"], body.dark-mode) .projects-container .btn-modern:hover { color: #fff; }
:is([data-theme="dark"], [data-bs-theme="dark"], [data-marketing-theme="dark"], body.dark-mode) .projects-container .btn-action.btn-danger { color: #fda4af; }
:is([data-theme="dark"], [data-bs-theme="dark"], [data-marketing-theme="dark"], body.dark-mode) .projects-container .btn-action.btn-danger:hover { background: #482c3a; border-color: #9f5365; }
:is([data-theme="dark"], [data-bs-theme="dark"], [data-marketing-theme="dark"], body.dark-mode) .projects-container .btn-success-modern i { color: #6ee7b7; }