/* Base styles */
:root {
    --primary: #2563eb;
    --primary-hover: #1d4ed8;
    --primary-foreground: #ffffff;
    --background: #f9fafb;
    --foreground: #111827;
    --card: #ffffff;
    --card-foreground: #111827;
    --border: #e5e7eb;
    --input: #e5e7eb;
    --ring: #2563eb;
    --radius: 0.5rem;
    --muted: #f3f4f6;
    --muted-foreground: #6b7280;
    --accent: #f3f4f6;
    --accent-foreground: #111827;
    --destructive: #ef4444;
    --destructive-foreground: #ffffff;
    --success: #10b981;
    --success-foreground: #ffffff;

    --bs-blue: #007bff;
    --bs-indigo: #6610f2;
    --bs-purple: #696cff;
    --bs-pink: #e83e8c;
    --bs-red: #ff3e1d;
    --bs-orange: #fd7e14;
    --bs-yellow: #ffab00;
    --bs-green: #71dd37;
    --bs-teal: #20c997;
    --bs-cyan: #03c3ec;
    --bs-black: #22303e;
    --bs-white: #fff;
    --bs-gray: #7a838b;
    --bs-gray-dark: #4e5965;
    --bs-gray-25: #fbfbfb;
    --bs-gray-60: #f2f3f3;
    --bs-gray-80: #edeef0;
    --bs-gray-100: #e9eaec;
    --bs-gray-200: #e4e6e8;
    --bs-gray-300: #bdc1c5;
    --bs-gray-400: #a7acb2;
    --bs-gray-500: #91979f;
    --bs-gray-600: #7a838b;
    --bs-gray-700: #646e78;
    --bs-gray-800: #4e5965;
    --bs-gray-900: #384551;
    --bs-primary: #696cff;
    --bs-secondary: #8592a3;
    --bs-success: #71dd37;
    --bs-info: #03c3ec;
    --bs-warning: #ffab00;
    --bs-danger: #ff3e1d;
    --bs-light: #dbdee0;
    --bs-dark: #2b2c40;
    --bs-gray: #91979f;
    --bs-primary-rgb: 105, 108, 255;
    --bs-secondary-rgb: 133, 146, 163;
    --bs-success-rgb: 113, 221, 55;
    --bs-info-rgb: 3, 195, 236;
    --bs-warning-rgb: 255, 171, 0;
    --bs-danger-rgb: 255, 62, 29;
    --bs-light-rgb: 219, 222, 224;
    --bs-dark-rgb: 43, 44, 64;
    --bs-gray-rgb: 145, 151, 159;
    --bs-primary-text-emphasis: #2a2b66;
    --bs-secondary-text-emphasis: #353a41;
    --bs-success-text-emphasis: #2d5816;
    --bs-info-text-emphasis: #014e5e;
    --bs-warning-text-emphasis: #664400;
    --bs-danger-text-emphasis: #66190c;
    --bs-light-text-emphasis: #646e78;
    --bs-dark-text-emphasis: #646e78;
    --bs-primary-bg-subtle: #e7e7ff;
    --bs-secondary-bg-subtle: #ebeef0;
    --bs-success-bg-subtle: #e8fadf;
    --bs-info-bg-subtle: #d7f5fc;
    --bs-warning-bg-subtle: #fff2d6;
    --bs-danger-bg-subtle: #ffe0db;
    --bs-light-bg-subtle: #f4f5f6;
    --bs-dark-bg-subtle: #dddde0;
    --bs-primary-border-subtle: #d2d3ff;
    --bs-secondary-border-subtle: #dadee3;
    --bs-success-border-subtle: #d4f5c3;
    --bs-info-border-subtle: #b3edf9;
    --bs-warning-border-subtle: #ffe6b3;
    --bs-danger-border-subtle: #ffc5bb;
    --bs-light-border-subtle: #e4e6e8;
    --bs-dark-border-subtle: #bfc0c6;
    --bs-white-rgb: 255, 255, 255;
    --bs-black-rgb: 34, 48, 62;
    --bs-font-sans-serif: "Public Sans", -apple-system, blinkmacsystemfont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    --bs-font-monospace: "SFMono-Regular", menlo, monaco, consolas, "Liberation Mono", "Courier New", monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --bs-root-font-size: 16px;
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 0.9375rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.375;
    --bs-body-color: #646e78;
    --bs-body-color-rgb: 100, 110, 120;
    --bs-body-bg: #f5f5f9;
    --bs-body-bg-rgb: 245, 245, 249;
    --bs-emphasis-color: #22303e;
    --bs-emphasis-color-rgb: 34, 48, 62;
    --bs-secondary-color: #a7acb2;
    --bs-secondary-color-rgb: 167, 172, 178;
    --bs-secondary-bg: #e4e6e8;
    --bs-secondary-bg-rgb: 228, 230, 232;
    --bs-tertiary-color: rgba(100, 110, 120, 0.5);
    --bs-tertiary-color-rgb: 100, 110, 120;
    --bs-tertiary-bg: #e9eaec;
    --bs-tertiary-bg-rgb: 233, 234, 236;
    --bs-heading-color: #384551;
    --bs-link-color: #696cff;
    --bs-link-color-rgb: 105, 108, 255;
    --bs-link-decoration: none;
    --bs-link-hover-color: #5f61e6;
    --bs-link-hover-color-rgb: 95, 97, 230;
    --bs-code-color: #e83e8c;
    --bs-highlight-color: #646e78;
    --bs-highlight-bg: #ffeecc;
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #e4e6e8;
    --bs-border-color-translucent: rgba(34, 48, 62, 0.175);
    --bs-border-radius: 0.375rem;
    --bs-border-radius-sm: 0.25rem;
    --bs-border-radius-lg: 0.5rem;
    --bs-border-radius-xl: 0.625rem;
    --bs-border-radius-xxl: 1rem;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl);
    --bs-border-radius-pill: 50rem;
    --bs-box-shadow: 0 0.1875rem 0.5rem 0 rgba(34, 48, 62, 0.1);
    --bs-box-shadow-sm: 0 0.125rem 0.375rem 0 rgba(34, 48, 62, 0.08);
    --bs-box-shadow-lg: 0 0.25rem 0.75rem 0 rgba(34, 48, 62, 0.14);
    --bs-box-shadow-inset: inset 0 1px 2px rgba(34, 48, 62, 0.075);
    --bs-focus-ring-width: 0.15rem;
    --bs-focus-ring-opacity: 0.75;
    --bs-focus-ring-color: rgba(100, 110, 120, 0.75);
    --bs-form-valid-color: #71dd37;
    --bs-form-valid-border-color: #71dd37;
    --bs-form-invalid-color: #ff3e1d;
    --bs-form-invalid-border-color: #ff3e1d;

    --text-color: #22252a;
    --theme-color: #00962a;
    --background-color-main: #ff7a51;
    --theme-color-rgb: 0, 150, 42;
    --link-text-color: #1677ff;
    --font-farmily: "Arial", sans-serif;
    --border-color-input: #e8e8f7;
    --text-font-size: .75rem;
    --icon-font-size: .7rem;
    --text-header-font-size: .9rem;
    --text-color-grey: #55556b;
    --text-color-placeholder: #a8afc7;
}

.table-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    width: 100%;
}

.table-actions-left {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.table-actions-right {
    display: flex;
    gap: 0.5rem;
}

.search-container {
    position: relative;
    width: 16rem;
}

.search-icon {
    position: absolute;
    left: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--muted-foreground);
}

.search-input {
    width: 100%;
    padding: 0.5rem 0.5rem 0.5rem 2rem;
    border: 1px solid var(--input);
    border-radius: var(--radius);
    font-size: 0.875rem;
}

.table-container {
    border: 1px solid var(--border);
    overflow: hidden;
}

.table {
    width: 100%;
    border-collapse: collapse;
}

.table th {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--muted-foreground);
    background-color: var(--muted);
}

.table td {
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border);
    font-size: 0.875rem;
    color: var(--text-color);
}

.table tr:hover {
    background-color: var(--accent);
}

.table-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    border: 1px solid var(--border);
    border-top: none;
    border-bottom-left-radius: var(--radius);
    border-bottom-right-radius: var(--radius);
    background-color: var(--card);
}

.table-footer-info {
    font-size: 0.875rem;
    color: var(--muted-foreground);
}

.table-footer-pagination {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}