:root {
    --font-content-color: rgba(51, 54, 57, 0.9);
    --font-title-color: #47494b;
    --icon-color: #a2a4a8;
    --color-primary: #fa8c16;
    --menu-bg: #f1f3f6;
    --menu-text-color: var(--font-content-color);
    --menu-active-color: var(--color-primary);
    --button-hover-color: #ffa940;
  
    /* Table styles */
    --font-weight-strong: 500;
    --row-active-bg: #F9FAFB;
    --table-header-bg: #F9FAFB;
    --table-header-color: rgba(51, 54, 57, 0.8);
    --table-header-sort-active-bg: #f0f0f0;
    --table-header-sort-hover-bg: #f0f0f0;
    --table-body-sort-bg: #fafafa;
    --table-row-hover-bg: #F9FAFB;
    --table-row-selected-bg: #F9FAFB;
    --table-row-selected-hover-bg: #F9FAFB;
    --table-row-expanded-bg: rgba(0, 0, 0, 0.02);
    --table-cell-padding-block: 10px;
    --table-cell-padding-inline: 8px;
    --table-cell-padding-block-md: 12px;
    --table-cell-padding-inline-md: 8px;
    --table-cell-padding-block-sm: 8px;
    --table-cell-padding-inline-sm: 8px;
    --table-border-color: #f2f4f6;
    --table-header-border-radius: 4px;
    --table-footer-bg: #fafafa;
    --table-footer-color: rgba(51, 54, 57, 0.8);
    --table-cell-font-size: 14px;
    --table-cell-font-size-md: 14px;
    --table-cell-font-size-sm: 14px;
    --table-header-split-color: transparent;
    --table-fixed-header-sort-active-bg: #f0f0f0;
    --table-header-filter-hover-bg: rgba(0, 0, 0, 0.06);
    --table-filter-dropdown-menu-bg: #ffffff;
    --table-filter-dropdown-bg: #ffffff;
    --table-expand-icon-bg: #ffffff;
    --table-selection-column-width: 32px;
    --table-sticky-scroll-bar-bg: rgba(0, 0, 0, 0.25);
    --table-sticky-scroll-bar-border-radius: 100px;
    --table-expand-icon-margin-top: 1.3px;
    --table-header-icon-color: rgba(162, 164, 168, 0.65);
    --table-header-icon-hover-color: rgba(51, 54, 57, 0.52);
    --table-expand-icon-half-inner: 7px;
    --table-expand-icon-size: 17px;
    --table-expand-icon-scale: 0.9411764705882353;

    --primary-color: #fa8c16;
    --primary-hover: #e67d0e;
    --primary-light: #fff7e6;
    --text-color: #2c3e50;
    --light-gray: #f5f7fa;
    --success-color: #52c41a;
    --warning-color: #faad14;
    --danger-color: #ff4d4f;
    --border-radius: 8px;
    --transition-speed: 0.3s;
}
  
  /* Override Element Plus primary color */
  :root {
    --el-color-primary: var(--color-primary);
    --el-button-bg-color: var(--color-primary);
    --el-button-border-color: var(--color-primary);
    --el-button-hover-bg-color: var(--button-hover-color);
    --el-button-hover-border-color: var(--button-hover-color);
    --el-color-primary-light-3: var(--button-hover-color);
    --el-color-primary-light-5: rgba(255, 169, 64, 0.5);
    --el-color-primary-light-7: rgba(255, 169, 64, 0.3);
    --el-color-primary-light-8: rgba(255, 169, 64, 0.2);
    --el-color-primary-light-9: rgba(255, 169, 64, 0.1);
    --el-color-primary-dark-2: #e67d06;
  }
  
  /* Custom tooltip styles */
  .el-popper.is-light {
    background-color: white !important;
    color: var(--font-content-color) !important;
    border: 1px solid #e4e7ed !important;
  }
  
  .el-popper.is-light .el-popper__arrow::before {
    background-color: white !important;
    border: 1px solid #e4e7ed !important;
  }
  
  /* Table styles */
  .el-table {
    --el-table-header-bg-color: var(--table-header-bg);
    --el-table-header-text-color: var(--table-header-color);
    --el-table-text-color: var(--font-content-color);
    --el-table-border-color: var(--table-border-color);
    --el-table-border: 1px solid var(--table-border-color);
    --el-table-row-hover-bg-color: var(--table-row-hover-bg);
    --el-table-current-row-bg-color: var(--row-active-bg);
    font-size: var(--table-cell-font-size) !important;
  }
  
  .el-table th.el-table__cell {
    background-color: var(--table-header-bg) !important;
    color: var(--table-header-color) !important;
    font-weight: var(--font-weight-strong) !important;
    padding: var(--table-cell-padding-block) var(--table-cell-padding-inline) !important;
  }
  
  .el-table td.el-table__cell {
    padding: var(--table-cell-padding-block) var(--table-cell-padding-inline) !important;
  }
  
  .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
    background-color: var(--table-row-hover-bg) !important;
  }
  
  .el-table__body tr.current-row > td.el-table__cell {
    background-color: var(--row-active-bg) !important;
  }
  
  .el-table .sort-caret {
    border-top-color: var(--table-header-icon-color);
    border-bottom-color: var(--table-header-icon-color);
  }
  
  .el-table .ascending .sort-caret.ascending {
    border-bottom-color: var(--table-header-icon-hover-color);
  }
  
  .el-table .descending .sort-caret.descending {
    border-top-color: var(--table-header-icon-hover-color);
  }
  
  .el-table__fixed-right-patch {
    background-color: var(--table-header-bg) !important;
  }
  
  .el-table--border::after,
  .el-table--group::after {
    background-color: var(--table-border-color) !important;
  }

/* Button Styles */
.el-button {
    border-radius: var(--border-radius);
    font-weight: 500;
    transition: all var(--transition-speed) ease;
    text-transform: none;
    height: 44px;
    padding: 0 24px;
    font-size: 16px;
    border: 1px solid transparent;
}

.el-button:hover,
.el-button:focus {
    transform: translateY(-1px);
}

.el-button--primary {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
}

.el-button--primary:hover,
.el-button--primary:focus {
    background: var(--primary-hover);
    border-color: var(--primary-hover);
    color: #fff;
    box-shadow: 0 4px 12px rgba(250, 140, 22, 0.2);
}

.el-button--primary.is-plain {
    background: var(--primary-light);
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.el-button--primary.is-plain:hover,
.el-button--primary.is-plain:focus {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
}

/* Register Button Specific Styles */
.register-btn {
    background: linear-gradient(45deg, var(--primary-color), var(--primary-hover));
    border: none;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-size: 14px;
}

.register-btn:hover,
.register-btn:focus {
    background: linear-gradient(45deg, var(--primary-hover), var(--primary-color));
    box-shadow: 0 6px 16px rgba(250, 140, 22, 0.3);
}

/* Disabled State */
.el-button.is-disabled,
.el-button.is-disabled:hover {
    background-color: #f5f5f5;
    border-color: #d9d9d9;
    color: #999;
    cursor: not-allowed;
    transform: none;
}

/* Loading State */
.el-button.is-loading:not(:has(.el-icon-loading)) {
    position: relative;
    pointer-events: none;
    opacity: 0.8;
}

    .el-button.is-loading:not(:has(.el-icon-loading)):before {
        content: '';
        position: absolute;
        left: 50%;
        top: 50%;
        width: 16px;
        height: 16px;
        margin: -8px 0 0 -8px;
        border: 2px solid #fff;
        border-top-color: transparent;
        border-radius: 50%;
        animation: button-loading 0.6s linear infinite;
    }

@keyframes button-loading {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .el-button {
        height: 40px;
        padding: 0 20px;
        font-size: 14px;
    }
}

.el-dialog{
    border-radius:var(--border-radius);
}