:root {
    --primary-color: #6a1b9a; --primary-light: #f3e5f5; --admin-bg: #f4f6f9; --sidebar-bg: #2c3e50; --sidebar-text: #bdc3c7; --sidebar-text-hover: #ffffff; --sidebar-active-bg: var(--primary-color); --header-height: 65px; --card-shadow: 0 4px 15px rgba(0, 0, 0, 0.07); --border-radius: 10px; --success-color: #28a745; --warning-color: #ffc107; --danger-color: #dc3545; --info-color: #17a2b8;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { background-color: var(--admin-bg); color: #333; font-family: 'Poppins', 'Noto Sans Bengali', sans-serif; overflow-x: hidden; }
.admin-header { position: fixed; top: 0; left: 0; width: 100%; height: var(--header-height); background-color: #ffffff; border-bottom: 1px solid #e0e0e0; z-index: 1000; display: flex; align-items: center; }
.header-container { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 0 30px; }
.admin-header .logo { color: var(--primary-color); font-size: 1.6em; font-weight: 700; }
.admin-nav .nav-link { color: #555; text-decoration: none; margin-left: 25px; font-weight: 500; background: none; border: none; cursor: pointer; font-size: 1em; transition: color 0.2s; display: inline-flex; align-items: center; }
.admin-nav .nav-link:hover { color: var(--primary-color); }
.admin-nav .nav-link i { margin-right: 8px; }
.admin-nav .logout { color: #d32f2f; }
.admin-container { display: flex; padding-top: var(--header-height); }
.admin-sidebar { position: fixed; top: var(--header-height); left: 0; width: 260px; height: calc(100vh - var(--header-height)); background-color: var(--sidebar-bg); padding: 20px; transition: width 0.3s; display: flex; flex-direction: column; overflow-y: auto; }
.sidebar-item { display: flex; align-items: center; padding: 14px; color: var(--sidebar-text); text-decoration: none; border-radius: var(--border-radius); margin-bottom: 8px; font-weight: 500; transition: background-color 0.2s, color 0.2s; white-space: nowrap; }
.sidebar-item i { margin-right: 15px; width: 20px; text-align: center; font-size: 1.1em; }
.sidebar-item:hover { background-color: rgba(255, 255, 255, 0.1); color: var(--sidebar-text-hover); }
.sidebar-item.active { background-color: var(--sidebar-active-bg); color: #fff; font-weight: 600; }
.sidebar-divider { height: 1px; background-color: rgba(255, 255, 255, 0.1); margin: 15px 0; }
#admin-main-content { margin-left: 260px; width: calc(100% - 260px); padding: 30px; }
.content-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; }
.content-header h2 { font-size: 1.8em; color: #2c3e50; font-weight: 600; }
.action-btn, .mark-returned-btn { background-color: var(--primary-color); color: #fff; border: none; padding: 12px 22px; border-radius: var(--border-radius); cursor: pointer; font-weight: 600; font-size: 1em; transition: background-color 0.2s, transform 0.2s; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }
.action-btn:hover, .mark-returned-btn:hover { background-color: #4a148c; transform: translateY(-2px); }
.action-btn i { margin-right: 8px; }
.mark-returned-btn { background-color: var(--info-color); padding: 8px 12px; font-size: 0.9em; }
.mark-returned-btn:hover { background-color: #117a8b; }
.toolbar { margin-bottom: 20px; background-color: #fff; padding: 15px; border-radius: var(--border-radius); box-shadow: var(--card-shadow); }
.search-wrapper { position: relative; }
.search-wrapper i { position: absolute; top: 50%; left: 15px; transform: translateY(-50%); color: #aaa; }
#product-search-input, #order-search-input, #customer-search-input { width: 100%; padding: 12px 15px 12px 45px; border: 1px solid #ddd; border-radius: 8px; font-size: 1em; }
.filter-btn-container { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
.filter-btn { padding: 8px 15px; font-size: 0.9em; font-weight: 500; border: 1px solid #ccc; border-radius: 20px; background-color: #fff; color: #333; cursor: pointer; transition: all 0.2s ease-in-out; position: relative; }
.filter-btn:hover { background-color: #f0f0f0; border-color: #aaa; }
.filter-btn.active { background-color: var(--primary-color); color: #fff; border-color: var(--primary-color); font-weight: 600; }
.order-count-badge { position: absolute; top: -8px; right: -8px; background-color: var(--danger-color); color: white; border-radius: 50%; min-width: 20px; height: 20px; font-size: 0.75em; font-weight: bold; display: flex; justify-content: center; align-items: center; padding: 0 5px; border: 2px solid white; }
.status-btn-new-order.active { background-color: var(--warning-color); border-color: var(--warning-color); color: #212529; }
.status-btn-order-confirmed.active { background-color: var(--primary-color); }
.status-btn-on-the-way.active { background-color: var(--info-color); border-color: var(--info-color); }
.status-btn-completed.active { background-color: var(--success-color); border-color: var(--success-color); }
/* --- NEW: Added delivery-failed to this group --- */
.status-btn-cancelled.active, .status-btn-payment-failed.active, .status-btn-stock-out.active, .status-btn-delivery-failed.active { background-color: var(--danger-color); border-color: var(--danger-color); }
.status-btn-return-requests.active { background-color: #d32f2f; border-color: #d32f2f;}
.status-btn-all-orders.active { background-color: #6c757d; border-color: #6c757d; }
.dashboard-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 25px; }
.stat-card { background-color: #fff; padding: 25px; border-radius: var(--border-radius); box-shadow: var(--card-shadow); display: flex; align-items: center; }
.stat-icon { width: 60px; height: 60px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-right: 20px; flex-shrink: 0; }
.stat-icon i { font-size: 1.8em; }
.stat-info h3 { font-size: 1.1em; color: #666; margin-bottom: 5px; font-weight: 500; }
.stat-info p { font-size: 2em; font-weight: 700; color: #2c3e50; }
.data-table-container { background: #fff; border-radius: var(--border-radius); overflow-x: auto; box-shadow: var(--card-shadow); }
.data-table { width: 100%; border-collapse: collapse; }
.data-table th, .data-table td { padding: 16px 20px; text-align: left; border-bottom: 1px solid #f0f0f0; white-space: nowrap; vertical-align: middle; }
.data-table.compact-table th, .data-table.compact-table td { padding: 12px 15px; font-size: 0.9em; white-space: normal; }
.data-table th { background-color: #f9fafb; font-weight: 600; color: #555; }
.data-table td { color: #444; }
.data-table img { width: 50px; height: 50px; object-fit: cover; border-radius: 8px; }
.data-table .action-buttons button, .data-table .view-details-btn { background: none; border: none; cursor: pointer; font-size: 1em; margin: 0 5px; padding: 5px 8px; border-radius: 5px; line-height: 1; transition: background-color 0.2s; }
.edit-btn { color: #f57c00; }
.delete-btn { color: #d32f2f; }
.view-details-btn { color: #1e88e5; border: 1px solid #1e88e5; font-weight: 600; }
.return-action-btn { background: none; border: none; cursor: pointer; font-size: 1em; margin: 0 5px; padding: 5px 8px; border-radius: 5px; line-height: 1; transition: background-color 0.2s; }
.return-action-btn.approve { color: var(--success-color); }
.return-action-btn.reject { color: var(--danger-color); }
.edit-btn:hover { background-color: #fff3e0; }
.delete-btn:hover { background-color: #ffebee; }
.view-details-btn:hover { background-color: #e3f2fd; }
.return-action-btn.approve:hover { background-color: #e8f5e9; }
.return-action-btn.reject:hover { background-color: #ffebee; }
.order-product-color-thumb { width: 30px; height: 30px; border-radius: 4px; margin-left: 10px; cursor: pointer; border: 1px solid #ddd; vertical-align: middle; }
tr.order-row-completed { background-color: rgba(40, 167, 69, 0.08) !important; }
tr.order-row-completed:hover { background-color: rgba(40, 167, 69, 0.15) !important; }
/* --- NEW: Added delivery-failed to this group --- */
tr.order-row-cancelled, tr.order-row-payment-failed, tr.order-row-stock-out, tr.order-row-delivery-failed { background-color: rgba(220, 53, 69, 0.08) !important; }
tr.order-row-cancelled:hover, tr.order-row-payment-failed:hover, tr.order-row-stock-out:hover, tr.order-row-delivery-failed:hover { background-color: rgba(220, 53, 69, 0.15) !important; }
tr.order-row-returned { background-color: rgba(108, 117, 125, 0.08) !important; }
tr.order-row-returned:hover { background-color: rgba(108, 117, 125, 0.15) !important; }

.stock-status-select, .order-status-select { padding: 6px 10px; border: 1px solid #ddd; border-radius: 6px; background-color: #f9f9f9; cursor: pointer; min-width: 120px; }
.return-status-badge { padding: 4px 10px; border-radius: 12px; color: #fff; font-weight: 500; font-size: 0.85em; }
.return-status-badge.pending { background-color: var(--warning-color); color: #212529; }
.return-status-badge.approved { background-color: var(--success-color); }
.return-status-badge.rejected { background-color: var(--danger-color); }
.return-status-badge.returned { background-color: #6c757d; }

.customer-icon { font-size: 1.5em; color: var(--sidebar-text); padding-right: 15px; }
.pagination-container { display: flex; justify-content: center; align-items: center; padding: 20px 0; gap: 8px; }
.page-link { padding: 8px 14px; border: 1px solid #ddd; background-color: #fff; color: var(--primary-color); text-decoration: none; border-radius: 6px; cursor: pointer; transition: all 0.2s; }
.page-link:hover { background-color: var(--primary-light); }
.page-link.active { background-color: var(--primary-color); color: #fff; border-color: var(--primary-color); font-weight: bold; }
.page-link.disabled { color: #aaa; background-color: #f5f5f5; cursor: not-allowed; }
.modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); display: none; justify-content: center; align-items: flex-start; z-index: 1002; padding: 5vh 20px; overflow-y: auto; }
.modal-overlay:not(.hidden) { display: flex; }
.modal-content { background-color: #fff; color: #333; padding: 40px; border-radius: var(--border-radius); width: 100%; max-width: 700px; position: relative; box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2); }
.close-modal-btn { position: absolute; top: 15px; right: 20px; background: none; border: none; color: #aaa; font-size: 2.5em; cursor: pointer; line-height: 1; }
.modal-content h3 { margin-bottom: 25px; text-align: center; font-size: 1.8em; font-weight: 600; }
.form-group { margin-bottom: 20px; }
.form-group label { display: block; margin-bottom: 8px; font-weight: 600; color: #444; }
.form-group input, .form-group textarea, .form-group select { width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 8px; font-size: 1em; background-color: #fdfdff; }
.form-row { display: flex; gap: 20px; }
.form-row .form-group { flex: 1; }
#image-urls-container input, #color-image-urls-container input { margin-bottom: 10px; }
#image-urls-container input:last-child, #color-image-urls-container input:last-child { margin-bottom: 0; }
#product-category, #size-presets { height: 120px; }
.submit-btn { width: 100%; padding: 15px; background-color: var(--primary-color); color: #fff; border: none; border-radius: 8px; font-size: 1.1em; font-weight: 700; cursor: pointer; margin-top: 10px; }
.settings-form-container { max-width: 600px; margin: 0 auto; background: #fff; padding: 30px; border-radius: var(--border-radius); box-shadow: var(--card-shadow); }
.settings-form-container p { margin-bottom: 20px; color: #555; text-align: center; }
#order-details-content p { margin-bottom: 12px; font-size: 1.1em; line-height: 1.6; }
#order-details-content p strong { color: #333; display: inline-block; width: 150px; font-weight: 600; }
#order-details-content h4 { margin-top: 20px; margin-bottom: 10px; border-bottom: 1px solid #eee; padding-bottom: 5px; }
.confirm-modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); display: flex; justify-content: center; align-items: center; z-index: 2000; }
.confirm-modal-content { background-color: #fff; padding: 30px; border-radius: var(--border-radius); box-shadow: var(--card-shadow); text-align: center; max-width: 400px; width: 90%; }
.confirm-modal-content p { font-size: 1.1em; margin-bottom: 25px; color: #333; line-height: 1.5; }
.confirm-modal-buttons { display: flex; justify-content: center; gap: 15px; }
.confirm-modal-buttons button { padding: 10px 30px; border: none; border-radius: 8px; font-size: 1em; font-weight: 600; cursor: pointer; transition: opacity 0.2s; }
.confirm-btn-yes { background-color: var(--primary-color); color: #fff; }
.confirm-btn-no { background-color: #6c757d; color: #fff; }
.confirm-btn-yes:hover, .confirm-btn-no:hover { opacity: 0.9; }
.hidden { display: none !important; }
.radio-group-container { display: flex; gap: 20px; padding-top: 5px; }
.radio-label { display: flex; align-items: center; cursor: pointer; font-weight: normal; margin-bottom: 0; }
.radio-label input[type="radio"] { margin-right: 8px; transform: scale(1.1); }
#paid-delivery-options-container { border: 1px solid #e9e9e9; border-radius: 8px; padding: 20px; margin-top: -10px; margin-bottom: 20px; background-color: #fafafa; }
#custom-delivery-fields-container { margin-top: 15px; }
.image-viewer-content { position: relative; max-width: 90vw; max-height: 90vh; }
.image-viewer-content img { display: block; max-width: 100%; max-height: 100%; border-radius: 10px; }