:root{--primary-color:#667eea;--primary-dark:#5568d3;--secondary-color:#764ba2;--success-color:#10b981;--warning-color:#f59e0b;--danger-color:#ef4444;--info-color:#3b82f6;--estado-pendiente:#f59e0b;--estado-confirmado:#3b82f6;--estado-entregado:#10b981;--estado-cancelado:#ef4444;--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-400:#9ca3af;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--gray-900:#111827;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--border-radius-sm:0.375rem;--border-radius-md:0.5rem;--border-radius-lg:0.75rem;--border-radius-xl:1rem;--shadow-sm:0 1px 2px 0 rgba(0,0,0,.05);--shadow-md:0 4px 6px -1px rgba(0,0,0,.1);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1);--shadow-xl:0 20px 25px -5px rgba(0,0,0,.1);--transition-fast:150ms ease-in-out;--transition-normal:250ms ease-in-out;--transition-slow:350ms ease-in-out}.page-header{align-items:center;border-bottom:2px solid var(--gray-200);display:flex;justify-content:space-between;margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-md)}.page-header-title{align-items:center;color:var(--gray-800);display:flex;font-size:1.75rem;font-weight:600;gap:var(--spacing-sm);margin:0}.page-header-title i{color:var(--primary-color)}.page-header-actions{display:flex;gap:var(--spacing-sm)}.card-modern{background:#fff;border:1px solid var(--gray-200);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);overflow:hidden;transition:all var(--transition-normal)}.card-modern:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card-modern-header{background:var(--gray-50);border-bottom:1px solid var(--gray-200);padding:var(--spacing-lg)}.card-modern-header-title{align-items:center;color:var(--gray-800);display:flex;font-size:1.125rem;font-weight:600;gap:var(--spacing-sm);margin:0}.card-modern-body{padding:var(--spacing-lg)}.card-modern-footer{background:var(--gray-50);border-top:1px solid var(--gray-200);padding:var(--spacing-md) var(--spacing-lg)}.card-gradient{background:linear-gradient(135deg,var(--primary-color) 0,var(--secondary-color) 100%);border:none;color:#fff}.card-gradient .card-modern-header{background:hsla(0,0%,100%,.1);border-color:hsla(0,0%,100%,.2)}.btn-modern{align-items:center;border:1px solid transparent;border-radius:var(--border-radius-md);cursor:pointer;display:inline-flex;font-size:.875rem;font-weight:500;gap:var(--spacing-sm);padding:.625rem 1.25rem;text-decoration:none;transition:all var(--transition-fast)}.btn-modern:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn-modern:active{transform:translateY(0)}.btn-modern i{font-size:1rem}.btn-primary-modern{background:var(--primary-color);color:#fff}.btn-primary-modern:hover{background:var(--primary-dark);color:#fff}.btn-success-modern{background:var(--success-color);color:#fff}.btn-warning-modern{background:var(--warning-color);color:#fff}.btn-danger-modern{background:var(--danger-color);color:#fff}.btn-outline-modern{background:#fff;border-color:var(--gray-300);color:var(--gray-700)}.btn-outline-modern:hover{background:var(--gray-50);border-color:var(--gray-400);color:var(--gray-800)}.btn-sm-modern{font-size:.8125rem;padding:.5rem 1rem}.btn-lg-modern{font-size:1rem;padding:.875rem 1.75rem}.badge-modern{align-items:center;border-radius:var(--border-radius-md);display:inline-flex;font-size:.8125rem;font-weight:500;gap:var(--spacing-xs);padding:.375rem .75rem;white-space:nowrap}.badge-pendiente{background:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.3);color:var(--estado-pendiente)}.badge-confirmado{background:rgba(59,130,246,.1);border:1px solid rgba(59,130,246,.3);color:var(--estado-confirmado)}.badge-entregado{background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.3);color:var(--estado-entregado)}.badge-cancelado{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);color:var(--estado-cancelado)}.empty-state{padding:var(--spacing-2xl) var(--spacing-lg);text-align:center}.empty-state-icon{color:var(--gray-300);font-size:4rem;margin-bottom:var(--spacing-lg)}.empty-state-title{color:var(--gray-600);font-size:1.5rem;font-weight:600;margin-bottom:var(--spacing-md)}.empty-state-description{color:var(--gray-500);font-size:1rem}.data-group,.empty-state-description{margin-bottom:var(--spacing-lg)}.data-label{align-items:center;color:var(--gray-600);display:flex;font-size:.875rem;font-weight:500;gap:var(--spacing-xs);margin-bottom:var(--spacing-xs)}.data-value{color:var(--gray-900);font-size:1rem;font-weight:500}.data-value-large{font-size:1.5rem;font-weight:600}.data-value-highlight{color:var(--primary-color)}.data-value-success{color:var(--success-color)}.stats-card{background:#fff;border:1px solid var(--gray-200);border-radius:var(--border-radius-lg);padding:var(--spacing-lg);text-align:center;transition:all var(--transition-normal)}.stats-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.stats-card-icon{font-size:2.5rem;margin-bottom:var(--spacing-md)}.stats-card-value{font-size:2rem;font-weight:700;margin-bottom:var(--spacing-xs)}.stats-card-label{color:var(--gray-600);font-size:.875rem;font-weight:500}.stats-card-primary .stats-card-icon{color:var(--primary-color)}.stats-card-success .stats-card-icon{color:var(--success-color)}.stats-card-warning .stats-card-icon{color:var(--warning-color)}.stats-card-info .stats-card-icon{color:var(--info-color)}.action-group{display:flex;flex-wrap:wrap;gap:var(--spacing-sm)}.action-group-vertical{flex-direction:column}@media (max-width:768px){.page-header{align-items:flex-start;flex-direction:column;gap:var(--spacing-md)}.action-group,.page-header-actions{flex-direction:column;width:100%}.btn-modern{justify-content:center;width:100%}.card-modern-body{padding:var(--spacing-md)}}.loading-spinner{animation:spin .8s linear infinite;border:3px solid var(--gray-200);border-radius:50%;border-top-color:var(--primary-color);display:inline-block;height:1.5rem;width:1.5rem}@keyframes spin{to{transform:rotate(1turn)}}.fade-in{animation:fadeIn var(--transition-normal)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.slide-up{animation:slideUp var(--transition-normal)}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}