.wc-orders-controls {
    margin-bottom: 20px;
    padding: 15px;
    background: #f9f9f9;
    border-radius: 5px;
}
.wc-orders-controls > div {
    margin-bottom: 10px;
}
.total-orders {
    font-size: 16px;
    color: #2c3e50;
}
.search-field {
    display: flex;
    gap: 10px;
    align-items: center;
}
.search-field input {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    width: 250px;
}
.search-field button, .export-buttons button {
    background: #0073aa;
    color: white;
    border: none;
    padding: 8px 15px;
    border-radius: 4px;
    cursor: pointer;
}
.search-field button:hover, .export-buttons button:hover {
    background: #005a87;
}
.export-buttons {
    display: flex;
    gap: 10px;
    align-items: center;
}
.filter-toggle label {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}
.wc-orders-table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
}
.wc-orders-table th,
.wc-orders-table td {
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid #ddd;
    vertical-align: top;
}
.wc-orders-table th {
    background-color: #f5f5f5;
    font-weight: bold;
    position: relative;
}
.wc-orders-table th.sortable { cursor: pointer; user-select: none; }
.wc-orders-table th.sortable:hover { background-color: #e8e8e8; }
.sort-arrow { display: inline-block; margin-left: 5px; font-size: 12px; }
.sort-arrow:after { content: "↕"; }
.wc-orders-table th.sorted-asc .sort-arrow:after { content: "↑"; }
.wc-orders-table th.sorted-desc .sort-arrow:after { content: "↓"; }
.wc-orders-table tr.non-completed { background-color: #f0f0f0; opacity: 0.7; }
.wc-orders-table tbody tr:hover { background-color: #f9f9f9; }

/* Customer info styling */
.customer-info { min-width: 200px; }
.customer-name { font-weight: bold; margin-bottom: 4px; }
.customer-phone { font-size: 0.9em; color: #666; margin-bottom: 2px; }
.customer-email { font-size: 0.85em; color: #0073aa; word-break: break-all; }

.wc-orders-pagination { text-align: center; margin: 20px 0; }
.page-btn {
    background: white; border: 1px solid #ddd; padding: 8px 12px; margin: 0 2px; cursor: pointer; border-radius: 3px;
}
.page-btn:hover { background: #f0f0f0; }
.page-btn.current { background: #0073aa; color: white; border-color: #0073aa; }

#orders-table-container { position: relative; }
.loading { opacity: 0.6; pointer-events: none; }
.loading:after {
    content: "Cargando...";
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: rgba(0,0,0,0.8); color: white; padding: 10px 20px; border-radius: 5px; z-index: 1000;
}