:root{--color-primary: #1a56db;--color-primary-dark: #1e429f;--color-success: #057a55;--color-warning: #c27803;--color-danger: #c81e1e;--color-bg: #f4f6fb;--color-surface: #ffffff;--color-border: #e5e7eb;--color-text: #111827;--color-text-muted: #6b7280;--radius: 14px;--radius-sm: 10px;--touch-target: 56px;--font-size-base: 16px;--font-size-lg: 20px;--font-size-xl: 24px;--shadow-card: 0 1px 3px rgba(0,0,0,.08), 0 4px 12px rgba(0,0,0,.06);--shadow-card-hover: 0 2px 6px rgba(0,0,0,.1), 0 8px 20px rgba(0,0,0,.09)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:var(--font-size-base);color:var(--color-text);background:var(--color-bg);min-height:100vh;-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer;border:none;background:none}a{color:inherit;text-decoration:none}input,textarea,select{font-family:inherit;font-size:var(--font-size-base)}.layout{display:flex;flex-direction:column;min-height:100vh}.page-content{flex:1;max-width:800px;margin:0 auto;width:100%;padding:20px 16px 90px}.navbar{background:#1a1a2e;color:#fff;padding:0 16px;height:60px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px #1a56db59,0 1px #ffffff1a inset;border-bottom:1px solid rgba(255,255,255,.12)}.navbar-brand{font-size:20px;font-weight:800;letter-spacing:-.5px}.navbar-actions{display:flex;gap:8px;align-items:center}.navbar-actions a,.navbar-actions button{color:#fff;opacity:.85;font-size:14px;padding:6px 10px;border-radius:var(--radius-sm);transition:opacity .15s,background .15s}.navbar-actions a:hover,.navbar-actions button:hover{opacity:1;background:#ffffff2e}.navbar-link-active{background:#ffffff38!important;opacity:1!important;border-radius:var(--radius-sm);font-weight:700!important}.navbar-user{display:flex;flex-direction:column;align-items:flex-end;margin-right:4px}.navbar-user-name{font-size:13px;font-weight:600;color:#fff;line-height:1.2}.navbar-role-pill{display:inline-block;padding:2px 8px;border-radius:999px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin-top:2px}.role-nyc_loader{background:#fff3;color:#fff}.role-nyc_supervisor{background:#93c5fd59;color:#bfdbfe}.role-honduras_receiver{background:#6ee7b74d;color:#6ee7b7}.role-admin{background:#c4b5fd4d;color:#c4b5fd}.role-superadmin{background:#fca5a54d;color:#fca5a5}.role-customer_support{background:#67e8f94d;color:#67e8f9}.role-delivery_agent{background:#fbbf244d;color:#fbbf24}@media (max-width: 480px){.navbar-user-name{display:none}.navbar-user{margin-right:2px}}.navbar-hamburger{display:none;background:#ffffff1f;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#fff;font-size:20px;line-height:1;width:38px;height:38px;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;padding:0}.navbar-mobile-backdrop,.navbar-mobile-menu{display:none}@media (max-width: 767px){.nav-desktop{display:none!important}.navbar-hamburger{display:flex}.navbar-mobile-backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:98}.navbar-mobile-menu{display:flex;flex-direction:column;position:fixed;top:60px;left:0;right:0;background:#1a1a2e;border-bottom:1px solid rgba(255,255,255,.12);box-shadow:0 6px 20px #00000080;z-index:99;padding:8px 12px 12px;gap:2px}.navbar-mobile-menu a,.navbar-mobile-menu button{display:block;width:100%;text-align:left;color:#fff;opacity:.9;font-size:15px;font-weight:500;padding:13px 14px;border-radius:var(--radius-sm);background:transparent;border:none;cursor:pointer;text-decoration:none;min-height:var(--touch-target);transition:background .15s}.navbar-mobile-menu a:hover,.navbar-mobile-menu button:hover{background:#ffffff1a;opacity:1}.navbar-mobile-menu .navbar-link-active{background:#ffffff26;opacity:1;font-weight:700}.navbar-mobile-logout{margin-top:6px;border-top:1px solid rgba(255,255,255,.1);padding-top:13px!important;color:#fca5a5!important;opacity:1!important}}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:18px;margin-bottom:12px;box-shadow:var(--shadow-card);transition:box-shadow .15s}.card:hover{box-shadow:var(--shadow-card-hover)}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--touch-target);padding:0 22px;border-radius:var(--radius-sm);font-size:16px;font-weight:700;transition:background .15s,opacity .15s,transform .1s,box-shadow .15s;cursor:pointer;border:none;letter-spacing:-.01em}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff;box-shadow:0 2px 8px #1a56db40}.btn-primary:hover:not(:disabled){background:var(--color-primary-dark);box-shadow:0 4px 12px #1a56db59}.btn-success{background:var(--color-success);color:#fff;box-shadow:0 2px 8px #057a5540}.btn-success:hover:not(:disabled){background:#046a49;box-shadow:0 4px 12px #057a5559}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover:not(:disabled){background:#a81a1a}.btn-warning{background:var(--color-warning);color:#fff}.btn-warning:hover:not(:disabled){background:#a86700}.btn-outline{background:#fff;color:var(--color-primary);border:2px solid var(--color-primary)}.btn-outline:hover:not(:disabled){background:#eef2ff}.btn-ghost{background:transparent;color:var(--color-text-muted)}.btn-ghost:hover{background:#fff;box-shadow:var(--shadow-card)}.btn-secondary{background:transparent;color:var(--color-text-muted)}.btn-secondary:hover{background:#fff;box-shadow:var(--shadow-card)}.btn-full{width:100%}.btn-sm{min-height:40px;padding:0 14px;font-size:14px}.btn-add-primary{background:linear-gradient(135deg,#1a56db,#1e429f);color:#fff;min-height:64px;font-size:18px;font-weight:800;letter-spacing:-.02em;box-shadow:0 4px 16px #1a56db59;border-radius:var(--radius)}.btn-add-primary:hover:not(:disabled){background:linear-gradient(135deg,#1e429f,#163179);box-shadow:0 6px 20px #1a56db73;transform:translateY(-1px)}.btn-add-primary:active:not(:disabled){transform:scale(.99)}.form-group{margin-bottom:18px}.form-label{display:block;font-weight:700;margin-bottom:7px;font-size:13px;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.form-input,.form-textarea,.form-select{width:100%;border:2px solid var(--color-border);border-radius:var(--radius-sm);padding:13px 15px;font-size:16px;outline:none;transition:border-color .15s,box-shadow .15s;background:#fff}.form-input:focus,.form-textarea:focus,.form-select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #1a56db1f}.form-textarea{min-height:80px;resize:vertical}.badge{display:inline-flex;align-items:center;padding:5px 14px;border-radius:999px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}.badge-draft{background:#f3f4f6;color:#374151}.badge-ready_for_load{background:#dbeafe;color:#1e40af}.badge-loading{background:#ffedd5;color:#9a3412}.badge-finalized{background:#e0e7ff;color:#3730a3}.badge-cancelled{background:#fee2e2;color:#991b1b}.badge-received{background:#ccfbf1;color:#134e4a}.badge-reconciled{background:#f3e8ff;color:#581c87}.badge-matched{background:#dcfce7;color:#166534}.badge-missing{background:#fee2e2;color:#991b1b}.badge-extra{background:#ffedd5;color:#9a3412}.badge-pendiente{background:#fef9c3;color:#854d0e}.badge-entregado{background:#dcfce7;color:#166534}.badge-no_entregado{background:#fee2e2;color:#991b1b}.badge-devuelto{background:#f3f4f6;color:#374151}.tabs{display:flex;gap:6px;margin-bottom:20px;flex-wrap:wrap}.tab{padding:9px 18px;border-radius:var(--radius-sm);font-size:14px;font-weight:600;cursor:pointer;border:2px solid transparent;color:var(--color-text-muted);background:#fff;min-height:42px;box-shadow:var(--shadow-card);transition:all .15s}.tab.active{border-color:var(--color-primary);color:var(--color-primary);background:#eef2ff}.tab:hover:not(.active){background:#fff;color:var(--color-text);box-shadow:var(--shadow-card-hover)}.list-row{background:var(--color-surface);border:1px solid var(--color-border);border-left:3px solid transparent;border-radius:var(--radius);padding:14px 16px;margin-bottom:10px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:border-color .15s,box-shadow .15s,transform .1s;min-height:var(--touch-target);box-shadow:var(--shadow-card)}.list-row:hover{border-color:var(--color-primary);border-left-color:var(--color-primary);box-shadow:var(--shadow-card-hover);transform:translateY(-1px)}.list-row:active{transform:scale(.99)}.list-row-info{flex:1}.list-row-title{font-weight:700;font-size:15px}.list-row-meta{font-size:13px;color:var(--color-text-muted);margin-top:3px}.list-row-chevron{color:var(--color-text-muted);font-size:18px;font-weight:300;margin-left:10px;flex-shrink:0;transition:transform .15s,color .15s}.list-row:hover .list-row-chevron{color:var(--color-primary);transform:translate(2px)}.fab{position:fixed;bottom:24px;right:24px;width:62px;height:62px;border-radius:50%;background:linear-gradient(135deg,var(--color-primary),var(--color-primary-dark));color:#fff;font-size:28px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px #1a56db66;cursor:pointer;z-index:50;border:none;transition:transform .15s,box-shadow .15s}.fab:hover{transform:scale(1.08);box-shadow:0 6px 24px #1a56db80}.fab:active{transform:scale(.96)}.page-header{margin-bottom:24px;padding:20px;background:linear-gradient(135deg,rgba(26,86,219,.05) 0%,transparent 70%);border-radius:var(--radius)}.page-header h1{font-size:var(--font-size-xl);font-weight:800;letter-spacing:-.03em}.page-header p{color:var(--color-text-muted);margin-top:4px;font-size:14px}.page-header-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-title{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);margin-bottom:12px;margin-top:4px}.prefix-pad{display:flex;gap:10px}.prefix-btn{flex:1;min-height:72px;border-radius:var(--radius-sm);font-size:28px;font-weight:800;border:2px solid var(--color-primary);background:#fff;color:var(--color-primary);cursor:pointer;transition:background .12s,color .12s,transform .1s,box-shadow .12s;box-shadow:var(--shadow-card);letter-spacing:-.02em}.prefix-btn:hover:not(.selected){background:#eef2ff;box-shadow:var(--shadow-card-hover)}.prefix-btn.selected{background:var(--color-primary);color:#fff;box-shadow:0 4px 12px #1a56db66}.prefix-btn:active{transform:scale(.96)}.item-type-pad{display:grid;grid-template-columns:1fr 1fr;gap:10px}.item-type-btn{min-height:68px;border-radius:var(--radius-sm);font-size:15px;font-weight:700;border:2px solid var(--color-border);background:#fff;color:var(--color-text);cursor:pointer;transition:background .12s,color .12s,border-color .12s,transform .1s,box-shadow .12s;box-shadow:var(--shadow-card)}.item-type-btn.selected{background:var(--color-primary);color:#fff;border-color:var(--color-primary);box-shadow:0 4px 12px #1a56db59}.item-type-btn:hover:not(.selected){border-color:var(--color-primary);box-shadow:var(--shadow-card-hover);color:var(--color-primary)}.item-type-btn:active{transform:scale(.96)}.receipt-preview{font-size:20px;font-weight:800;color:var(--color-primary);margin-top:6px;min-height:30px;letter-spacing:-.02em}.item-group{margin-bottom:16px}.item-group-header{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:#eef2ff;border-radius:var(--radius-sm) var(--radius-sm) 0 0;font-weight:700;font-size:15px;border:1px solid #c7d2fe;border-left:3px solid var(--color-primary);border-bottom:none}.item-group-count{font-size:13px;color:var(--color-text-muted);font-weight:400}.item-row{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;border-left:1px solid var(--color-border);border-right:1px solid var(--color-border);border-bottom:1px solid var(--color-border);min-height:50px;background:#fff}.item-row:last-child{border-radius:0 0 var(--radius-sm) var(--radius-sm)}.item-row-label{display:flex;align-items:center;gap:8px}.item-row-actions{display:flex;gap:6px}.item-delete-btn{width:36px;height:36px;border-radius:50%;background:#fee2e2;color:var(--color-danger);font-size:16px;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;transition:background .1s,transform .1s}.item-delete-btn:hover{background:#fecaca;transform:scale(1.1)}.load-status-row{display:flex;flex-direction:column;padding:14px;border:1px solid var(--color-border);border-radius:var(--radius);margin-bottom:10px;background:#fff;box-shadow:var(--shadow-card);transition:box-shadow .15s}.load-status-row:hover{box-shadow:var(--shadow-card-hover)}.load-status-row.is-direct-add{border-left:3px solid var(--color-success)}.load-status-label{font-weight:700;margin-bottom:10px;font-size:15px}.load-status-buttons{display:flex;gap:8px;flex-wrap:wrap}.load-status-btn{min-height:48px;padding:0 16px;border-radius:var(--radius-sm);font-size:14px;font-weight:700;border:2px solid transparent;cursor:pointer;transition:all .12s}.load-status-btn.loaded{background:#d1fae5;color:#065f46;border-color:#059669}.load-status-btn.loaded.active{background:#065f46;color:#fff;box-shadow:0 2px 8px #057a554d}.load-status-btn.returned{background:#fef3c7;color:#92400e;border-color:#d97706}.load-status-btn.returned.active{background:#92400e;color:#fff;box-shadow:0 2px 8px #92400e4d}.load-status-btn:active{transform:scale(.95)}.toast-container{position:fixed;bottom:24px;left:50%;transform:translate(-50%);z-index:999;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}.toast{background:#111827;color:#fff;padding:13px 22px;border-radius:var(--radius);font-size:14px;font-weight:600;box-shadow:0 4px 20px #00000059;animation:toast-in .2s ease;white-space:nowrap}@keyframes toast-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;z-index:200;display:flex;align-items:center;justify-content:center;padding:16px;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal{background:#fff;border-radius:var(--radius);padding:26px;width:100%;max-width:480px;box-shadow:0 8px 40px #0003}.modal-title{font-size:18px;font-weight:800;margin-bottom:12px;letter-spacing:-.02em}.modal-body{color:var(--color-text-muted);margin-bottom:22px;line-height:1.6;font-size:15px}.modal-actions{display:flex;gap:10px;justify-content:flex-end}.summary-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin-bottom:20px}.summary-card{background:#fff;border:1px solid var(--color-border);border-top:4px solid var(--color-border);border-radius:var(--radius);padding:20px 14px 16px;text-align:center;box-shadow:var(--shadow-card);transition:transform .15s,box-shadow .15s}.summary-card-icon{font-size:26px;margin-bottom:8px;line-height:1}.summary-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-card-hover)}.summary-card--blue{border-top-color:var(--color-primary)}.summary-card--indigo{border-top-color:#4338ca}.summary-card--green{border-top-color:var(--color-success)}.summary-card--orange{border-top-color:var(--color-warning)}.summary-card-value{font-size:48px;font-weight:800;letter-spacing:-.04em;line-height:1}.summary-card-label{font-size:11px;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.07em;margin-top:5px;font-weight:700}.summary-card.matched .summary-card-value{color:var(--color-success)}.summary-card.missing .summary-card-value{color:var(--color-danger)}.summary-card.extra .summary-card-value{color:var(--color-warning)}.recon-table{width:100%;border-collapse:collapse;font-size:14px}.recon-table th{text-align:left;padding:10px 14px;background:#f3f4f6;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);font-weight:700}.recon-table th:first-child{border-radius:var(--radius-sm) 0 0 0}.recon-table th:last-child{border-radius:0 var(--radius-sm) 0 0}.recon-table td{padding:11px 14px;border-bottom:1px solid var(--color-border)}.recon-table tr.matched td{background:#f0fdf4}.recon-table tr.missing td{background:#fff5f5}.recon-table tr.extra td{background:#fffbeb}.progress-bar{height:12px;background:var(--color-border);border-radius:6px;overflow:hidden;margin-bottom:6px}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--color-primary),#3b82f6);border-radius:6px;transition:width .3s ease}.progress-bar-fill--done{background:linear-gradient(90deg,#059669,#10b981)}.spinner{border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;width:36px;height:36px;animation:spin .7s linear infinite;margin:48px auto}@keyframes spin{to{transform:rotate(360deg)}}.error-msg{background:#fee2e2;color:#991b1b;padding:13px 16px;border-radius:var(--radius-sm);margin-bottom:14px;font-size:14px;font-weight:600;border-left:3px solid #dc2626}.empty-state{text-align:center;padding:56px 16px;color:var(--color-text-muted);font-size:15px;line-height:1.6}.empty-state-icon{font-size:40px;margin-bottom:12px;opacity:.4}.empty-state-title{font-weight:700;font-size:17px;color:var(--color-text);margin-bottom:6px}.input-with-clear{position:relative}.input-with-clear .form-input{padding-right:46px}.input-clear-btn{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;background:#e5e7eb;color:#6b7280;font-size:16px;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;transition:background .1s}.input-clear-btn:hover{background:#d1d5db}.quick-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:24px}.shipment-select-card{background:#fff;border:2px solid var(--color-border);border-radius:var(--radius);padding:16px;margin-bottom:10px;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .1s;box-shadow:var(--shadow-card)}.shipment-select-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-card-hover);transform:translateY(-1px)}.shipment-select-card.selected{border-color:var(--color-primary);background:#eef2ff;box-shadow:0 0 0 3px #1a56db1f}.shipment-select-card:active{transform:scale(.99)}.inline-add-form{background:#f8faff;border:2px solid var(--color-primary);border-radius:var(--radius);padding:18px;margin-bottom:16px;box-shadow:0 0 0 4px #1a56db14}.search-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;z-index:1100;display:flex;align-items:flex-start;justify-content:center;padding-top:64px}.search-panel{background:var(--color-surface);border-radius:var(--radius);width:100%;max-width:480px;box-shadow:0 8px 32px #00000040;overflow:hidden;max-height:calc(100vh - 100px);overflow-y:auto}.search-input-row{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--color-border);position:sticky;top:0;background:var(--color-surface);z-index:1}.search-input{flex:1;border:none;outline:none;font-size:16px;background:transparent;color:var(--color-text)}.search-close-btn{background:none;border:none;color:var(--color-text-muted);font-size:18px;cursor:pointer;padding:2px 6px;border-radius:4px}.search-close-btn:hover{background:#f1f5f9}.search-group-label{padding:8px 16px 4px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);background:#f8fafc;border-top:1px solid var(--color-border)}.search-result-row{display:flex;align-items:center;justify-content:space-between;width:100%;padding:11px 16px;background:none;border:none;border-bottom:1px solid #f1f5f9;cursor:pointer;text-align:left;gap:8px}.search-result-row:hover{background:#f0f9ff}.search-result-title{font-size:14px;font-weight:600;color:var(--color-text)}.search-result-meta{font-size:11px;color:var(--color-text-muted);background:#f1f5f9;padding:2px 8px;border-radius:10px;white-space:nowrap}@media (max-width: 480px){.page-content{padding:12px 12px 90px}.page-header{padding:14px;margin-bottom:18px}.modal{margin:0;border-radius:var(--radius) var(--radius) 0 0;position:fixed;bottom:0}.modal-overlay{align-items:flex-end}.load-status-buttons{gap:6px}.load-status-btn{padding:0 12px}.prefix-btn{min-height:64px;font-size:24px}.item-type-btn{min-height:60px;font-size:14px}.navbar-actions a,.navbar-actions button{padding:5px 8px;font-size:13px}.summary-grid{grid-template-columns:repeat(2,1fr)}.summary-card-value{font-size:38px}.search-panel{max-width:100%;border-radius:var(--radius) var(--radius) 0 0}.search-overlay{padding-top:0;align-items:flex-end}}
