/* ===== MPCDC FRONTEND STYLES - UPDATED WITH TABLE VIEW ===== *//* CSS Variables */:root {    --mpcdc-vermillion: #DA2B1D;    --mpcdc-amber: #E3734D;    --mpcdc-lavender: #8868A8;    --mpcdc-jet-black: #313131;    --mpcdc-abalone: #B2B3AE;    --mpcdc-spacing-xs: 8px;    --mpcdc-spacing-sm: 12px;    --mpcdc-spacing-md: 16px;    --mpcdc-spacing-lg: 24px;    --mpcdc-spacing-xl: 32px;    --mpcdc-radius-sm: 4px;    --mpcdc-radius-md: 8px;    --mpcdc-radius-lg: 12px;    --mpcdc-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);    --mpcdc-shadow-md: 0 4px 8px rgba(0, 0, 0, 0.15);    --mpcdc-shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.2);    --mpcdc-transition: all 0.3s ease;    --mpcdc-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;    --mpcdc-font-size-small: 14px;    --mpcdc-font-size-base: 16px;    --mpcdc-font-size-large: 18px;}/* ===== RESOURCE TABLE STYLES ===== */.mpcdc-resource-library-table {    width: 100%;    margin: var(--mpcdc-spacing-lg) 0;}.resource-table-filters {    background: #ffffff;    border: 1px solid #e0e0e0;    border-radius: var(--mpcdc-radius-md);    padding: var(--mpcdc-spacing-md);    margin-bottom: var(--mpcdc-spacing-md);}.filter-row {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));    gap: var(--mpcdc-spacing-sm);    align-items: end;}.filter-item {    display: flex;    flex-direction: column;}.mpcdc-input,.mpcdc-select {    width: 100%;    padding: var(--mpcdc-spacing-sm);    border: 2px solid var(--mpcdc-abalone);    border-radius: var(--mpcdc-radius-sm);    font-size: var(--mpcdc-font-size-base);    font-family: var(--mpcdc-font-family);    transition: var(--mpcdc-transition);}.mpcdc-input:focus,.mpcdc-select:focus {    outline: none;    border-color: var(--mpcdc-lavender);    box-shadow: 0 0 0 3px rgba(136, 104, 168, 0.2);}.resource-table-wrapper {    overflow-x: auto;    background: #ffffff;    border-radius: var(--mpcdc-radius-md);    box-shadow: var(--mpcdc-shadow-sm);}.mpcdc-resource-table {    width: 100%;    border-collapse: collapse;    min-width: 900px;}.mpcdc-resource-table thead {    background: var(--mpcdc-jet-black);    color: #ffffff;}.mpcdc-resource-table th {    padding: var(--mpcdc-spacing-md);    text-align: left;    font-weight: 600;    font-size: var(--mpcdc-font-size-base);    border-bottom: 2px solid var(--mpcdc-vermillion);    white-space: nowrap;}.mpcdc-resource-table th.sortable {    cursor: pointer;    user-select: none;    position: relative;    padding-right: 30px;}.mpcdc-resource-table th.sortable:hover {    background: rgba(255, 255, 255, 0.1);}.mpcdc-resource-table th .sort-indicator {    position: absolute;    right: 10px;    top: 50%;    transform: translateY(-50%);    width: 0;    height: 0;    border-left: 5px solid transparent;    border-right: 5px solid transparent;    opacity: 0.3;}.mpcdc-resource-table th.sortable .sort-indicator {    border-top: 5px solid #ffffff;}.mpcdc-resource-table th.sort-asc .sort-indicator {    border-top: 5px solid #ffffff;    border-bottom: none;    opacity: 1;}.mpcdc-resource-table th.sort-desc .sort-indicator {    border-top: none;    border-bottom: 5px solid #ffffff;    opacity: 1;}.mpcdc-resource-table tbody tr {    border-bottom: 1px solid #e0e0e0;    transition: background-color 0.2s ease;}.mpcdc-resource-table tbody tr:hover {    background-color: #f5f5f5;}.mpcdc-resource-table td {    padding: var(--mpcdc-spacing-md);    font-size: 15px;    vertical-align: top;}.mpcdc-resource-table td.resource-title strong {    display: block;    color: var(--mpcdc-jet-black);    font-weight: 600;    margin-bottom: 4px;}.mpcdc-resource-table td .resource-description {    font-size: 14px;    color: #666;    margin-top: 4px;    line-height: 1.4;}.mpcdc-resource-table td.resource-type {    color: var(--mpcdc-vermillion);    font-weight: 500;}.mpcdc-resource-table td.resource-tags {    font-size: 14px;    color: #666;}.mpcdc-resource-table td.resource-downloads {    text-align: center;    font-weight: 600;    color: var(--mpcdc-lavender);}.mpcdc-resource-table td.no-resources {    text-align: center;    padding: var(--mpcdc-spacing-xl);    color: #999;    font-style: italic;}.resource-table-pagination {    margin-top: var(--mpcdc-spacing-md);    text-align: center;}.resource-table-pagination a,.resource-table-pagination span {    display: inline-block;    padding: 8px 12px;    margin: 0 4px;    border: 1px solid #ddd;    border-radius: var(--mpcdc-radius-sm);    text-decoration: none;    color: var(--mpcdc-jet-black);    transition: var(--mpcdc-transition);}.resource-table-pagination a:hover {    background: var(--mpcdc-vermillion);    color: #ffffff;    border-color: var(--mpcdc-vermillion);}.resource-table-pagination .current {    background: var(--mpcdc-lavender);    color: #ffffff;    border-color: var(--mpcdc-lavender);}/* Mobile Responsive Table */@media (max-width: 768px) {    .filter-row {        grid-template-columns: 1fr;    }        .resource-table-wrapper {        border-radius: 0;    }        .mpcdc-resource-table {        font-size: 14px;    }        .mpcdc-resource-table th,    .mpcdc-resource-table td {        padding: var(--mpcdc-spacing-sm);    }        .mpcdc-resource-table .resource-description {        display: none;    }}/* ===== FILE UPLOAD STYLES ===== */.file-selected-indicator {    padding: var(--mpcdc-spacing-sm);    background: #E8F5E9;    border: 1px solid #4CAF50;    border-radius: var(--mpcdc-radius-sm);    margin-top: var(--mpcdc-spacing-sm);}.file-info {    display: block;    margin-top: var(--mpcdc-spacing-xs);    font-size: var(--mpcdc-font-size-small);    color: #666;}.mpcdc-form-row.drag-over {    background: #f0f0f0;    border: 2px dashed var(--mpcdc-lavender);    border-radius: var(--mpcdc-radius-sm);}/* ===== FORM SECTION HEADERS ===== */.mpcdc-form-section-header {    margin: var(--mpcdc-spacing-lg) 0 var(--mpcdc-spacing-md);    padding-bottom: var(--mpcdc-spacing-sm);    border-bottom: 2px solid var(--mpcdc-vermillion);}.mpcdc-form-section-header h4 {    margin: 0 0 var(--mpcdc-spacing-xs);    color: var(--mpcdc-jet-black);    font-size: 18px;}.mpcdc-form-section-header p {    margin: 0;    color: #666;    font-size: 14px;}/* ===== NOTIFICATION STYLES ===== */.mpcdc-notification {    position: fixed;    top: 20px;    right: 20px;    padding: var(--mpcdc-spacing-md) var(--mpcdc-spacing-lg);    border-radius: var(--mpcdc-radius-md);    box-shadow: var(--mpcdc-shadow-lg);    z-index: 10000;    min-width: 300px;    max-width: 500px;    opacity: 0;    transform: translateX(400px);    transition: all 0.3s ease;    font-size: var(--mpcdc-font-size-base);    font-weight: 500;}.mpcdc-notification.show {    opacity: 1;    transform: translateX(0);}.mpcdc-notification-success {    background: #4CAF50;    color: #ffffff;}.mpcdc-notification-error {    background: #f44336;    color: #ffffff;}.mpcdc-notification-info {    background: #2196F3;    color: #ffffff;}.mpcdc-notification-warning {    background: #FF9800;    color: #ffffff;}@media (max-width: 600px) {    .mpcdc-notification {        left: 10px;        right: 10px;        min-width: auto;    }}/* ===== GENERAL FORM STYLES ===== */.mpcdc-form-container {    background: #ffffff;    border-radius: var(--mpcdc-radius-lg);    box-shadow: var(--mpcdc-shadow-md);    padding: var(--mpcdc-spacing-xl);    margin: var(--mpcdc-spacing-lg) 0;}.mpcdc-form-header {    margin-bottom: var(--mpcdc-spacing-lg);    padding-bottom: var(--mpcdc-spacing-md);    border-bottom: 2px solid var(--mpcdc-vermillion);}.mpcdc-form-header h3 {    margin: 0 0 var(--mpcdc-spacing-xs);    color: var(--mpcdc-jet-black);    font-size: 24px;}.mpcdc-form-header p {    margin: 0;    color: #666;    font-size: var(--mpcdc-font-size-base);}.mpcdc-form-row {    margin-bottom: var(--mpcdc-spacing-md);}.mpcdc-form-row-half {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));    gap: var(--mpcdc-spacing-md);    margin-bottom: var(--mpcdc-spacing-md);}.mpcdc-form-col {    display: flex;    flex-direction: column;}.mpcdc-form label {    display: block;    margin-bottom: var(--mpcdc-spacing-xs);    font-weight: 500;    color: var(--mpcdc-jet-black);    font-size: var(--mpcdc-font-size-base);}.mpcdc-form input[type="text"],.mpcdc-form input[type="email"],.mpcdc-form input[type="password"],.mpcdc-form input[type="url"],.mpcdc-form input[type="date"],.mpcdc-form input[type="datetime-local"],.mpcdc-form input[type="file"],.mpcdc-form select,.mpcdc-form textarea {    width: 100%;    padding: var(--mpcdc-spacing-sm);    border: 2px solid var(--mpcdc-abalone);    border-radius: var(--mpcdc-radius-sm);    font-size: var(--mpcdc-font-size-base);    font-family: var(--mpcdc-font-family);    transition: var(--mpcdc-transition);    background: #ffffff;}.mpcdc-form input:focus,.mpcdc-form select:focus,.mpcdc-form textarea:focus {    outline: none;    border-color: var(--mpcdc-lavender);    box-shadow: 0 0 0 3px rgba(136, 104, 168, 0.2);}.mpcdc-form input.error,.mpcdc-form select.error,.mpcdc-form textarea.error {    border-color: #f44336;}.mpcdc-form small {    display: block;    margin-top: var(--mpcdc-spacing-xs);    color: #666;    font-size: var(--mpcdc-font-size-small);}.char-counter {    text-align: right;    color: var(--mpcdc-lavender);}.mpcdc-checkbox-group {    display: grid;    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));    gap: var(--mpcdc-spacing-sm);    margin-top: var(--mpcdc-spacing-xs);}.mpcdc-checkbox-group label {    display: flex;    align-items: center;    margin-bottom: 0;    cursor: pointer;    font-weight: 400;}.mpcdc-checkbox-group input[type="checkbox"],.mpcdc-checkbox-group input[type="radio"] {    width: auto;    margin-right: var(--mpcdc-spacing-xs);}/* ===== BUTTON STYLES ===== */.mpcdc-btn {    display: inline-block;    padding: var(--mpcdc-spacing-sm) var(--mpcdc-spacing-lg);    border: none;    border-radius: var(--mpcdc-radius-sm);    font-family: var(--mpcdc-font-family);    font-size: var(--mpcdc-font-size-base);    font-weight: 500;    text-decoration: none;    cursor: pointer;    transition: var(--mpcdc-transition);    text-align: center;}.mpcdc-btn-primary {    background-color: var(--mpcdc-vermillion);    color: #ffffff;}.mpcdc-btn-primary:hover {    background-color: #c12419;    transform: translateY(-2px);    box-shadow: var(--mpcdc-shadow-md);}.mpcdc-btn-primary:disabled {    background-color: #ccc;    cursor: not-allowed;    transform: none;}.mpcdc-btn-secondary {    background-color: var(--mpcdc-amber);    color: #ffffff;}.mpcdc-btn-secondary:hover {    background-color: #c74e29;    transform: translateY(-2px);    box-shadow: var(--mpcdc-shadow-md);}.mpcdc-btn-small {    padding: 8px 16px;    font-size: 14px;}.mpcdc-form-actions {    display: flex;    gap: var(--mpcdc-spacing-sm);    margin-top: var(--mpcdc-spacing-lg);    padding-top: var(--mpcdc-spacing-md);    border-top: 1px solid #e0e0e0;}/* ===== SUCCESS/ERROR MESSAGES ===== */.success-message,.error-message {    padding: var(--mpcdc-spacing-md);    border-radius: var(--mpcdc-radius-sm);    margin: var(--mpcdc-spacing-md) 0;    font-weight: 500;}.success-message {    background: #E8F5E9;    border: 1px solid #4CAF50;    color: #2E7D32;}.error-message {    background: #FFEBEE;    border: 1px solid #f44336;    color: #C62828;}/* ===== UTILITY CLASSES ===== */.text-center {    text-align: center;}.mb-0 {    margin-bottom: 0;}.mt-lg {    margin-top: var(--mpcdc-spacing-lg);}.hidden {    display: none;}/* ===== RESPONSIVE DESIGN ===== */@media (max-width: 768px) {    .mpcdc-form-container {        padding: var(--mpcdc-spacing-md);    }        .mpcdc-form-row-half {        grid-template-columns: 1fr;    }        .mpcdc-form-actions {        flex-direction: column;    }        .mpcdc-btn {        width: 100%;    }}