/* Interaction and readability layer for the operational app. */
.app-workspace { --ux-ink:#183b4b; --ux-muted:#526676; --ux-line:#d9e3e9; background:#f5f7f9; line-height:1.65; }
.app-workspace .main-content { padding:24px 32px 56px; }
.ux-scope { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; color:#526676; font-size:.75rem; margin-bottom:24px; }
.ux-scope > :first-child { font-weight:700; letter-spacing:.035em; }
.ux-scope > :last-child { display:flex; align-items:center; gap:7px; }
.app-workspace .app-topbar { box-shadow:0 1px 0 #dce5eb; border:0; background:#fff; }
.app-workspace .master-search-input { min-height:44px; background:#f5f7f9; border:1px solid #dce5eb; font-size:.875rem; }
.app-workspace .app-topbar .form-select { min-height:40px; font-size:.82rem; }
.app-workspace .rail-link, .app-workspace .rail-group > summary { min-height:46px; font-size:.875rem; }
.app-workspace .rail-caption { color:#bbcfda; font-size:.7rem; letter-spacing:.06em; }
.app-workspace .rail-link.is-active { background:#244b5c; }
.app-workspace .rail-navigation {
 min-height:0;
 overscroll-behavior-y:contain;
 scrollbar-gutter:stable;
 scrollbar-width:thin;
 scrollbar-color:#688996 #112c3d;
}
.app-workspace .rail-navigation:hover, .app-workspace .rail-navigation:focus-within { scrollbar-color:#9eb9c8 #112c3d; }
.app-workspace .rail-navigation::-webkit-scrollbar { width:8px; }
.app-workspace .rail-navigation::-webkit-scrollbar-track { background:#112c3d; }
.app-workspace .rail-navigation::-webkit-scrollbar-thumb { background:#688996; border:2px solid #112c3d; border-radius:8px; }
.app-workspace .rail-navigation::-webkit-scrollbar-thumb:hover { background:#9eb9c8; }
.app-workspace .rail-navigation::-webkit-scrollbar-button { display:none; }
.app-workspace .page-hero { padding-bottom:22px; margin-bottom:24px; }
.app-workspace .page-hero-title { font-size:clamp(1.5rem,2.1vw,2rem); line-height:1.4; }
.app-workspace .page-hero-subtitle { font-size:.875rem; line-height:1.8; }
.app-workspace :is(.btn,.form-control,.form-select) { min-height:42px; }
.app-workspace .btn-sm { min-height:36px; padding:7px 12px; font-size:.8rem; }
.app-workspace .btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; line-height:1.4; }
.app-workspace .form-control, .app-workspace .form-select { font-size:.9rem; padding-block:9px; background-color:#fff; }
.app-workspace :is(.form-label,.form-label-custom) { color:#344e60; font-weight:600; font-size:.82rem; }
.app-workspace .form-control[readonly] { background:#f4f7f9; color:#536778; }
.app-workspace .form-control:focus, .app-workspace .form-select:focus { border-color:#237a91; box-shadow:0 0 0 3px #237a911c; }
.app-workspace .text-muted { color:#576b7b !important; }
.app-workspace .alert { border-radius:10px; font-size:.875rem; line-height:1.8; border-inline-start-width:4px; }
.app-workspace .alert-success { color:#17523e; background:#edf7f2; border-color:#badbce; }
.app-workspace .alert-info { color:#214f6d; background:#edf5fb; border-color:#bed7e8; }
.app-workspace .alert-warning { color:#6e4b0c; background:#fff7e7; border-color:#e6ce97; }
.app-workspace .alert-danger { color:#842e32; background:#fff0ef; border-color:#eabfc0; }
.app-workspace :is(.card-custom,.panel-card,.work-card,.shipment-panel) { box-shadow:0 2px 6px #17344704; border-color:var(--ux-line); border-radius:14px; }
.app-workspace .panel-card-title, .app-workspace .shipment-panel h2 { font-size:1rem; }
.app-workspace .panel-card-header { padding:20px 22px; }
.app-workspace .table-custom thead th { font-size:.77rem; color:#40586a; background:#f2f6f8; text-transform:none; letter-spacing:0; padding:13px 14px; }
.app-workspace .table-custom tbody td { font-size:.875rem; padding:14px; line-height:1.65; }
.app-workspace .table-custom td strong { color:#183b4b; font-weight:650; }
.app-workspace .table-custom tbody tr:focus-within { background:#eef7fa; }
.app-workspace .table-responsive { overscroll-behavior-inline:contain; scrollbar-width:thin; scrollbar-color:#9cafbc #f1f5f8; }
.ux-table-hint { display:flex; align-items:center; gap:8px; margin:0; padding:9px 14px; color:#4e6474; background:#f7fafc; font-size:.75rem; border-bottom:1px solid #e1e9ee; }
.ux-table-hint[hidden], .work-card[hidden] { display:none !important; }
.app-workspace .badge-status { display:inline-flex; align-items:center; gap:6px; font-size:.75rem; line-height:1.4; padding:5px 9px; border-radius:6px; }
.badge-status::before { content:''; width:5px; height:5px; border-radius:50%; background:currentColor; flex:none; }
.app-workspace .kpi-card { min-height:100px; align-items:flex-start; gap:14px; }
.app-workspace .kpi-card-value { font-size:1.65rem; font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.app-workspace .kpi-card-label { font-size:.78rem; margin-top:4px; }
.app-workspace .ux-welcome { padding:30px; border:1px solid #cedfe4; border-radius:16px; background:linear-gradient(110deg,#eaf2f4,#fff 75%); align-items:flex-start; }
.ux-eyebrow { display:block; font-size:.8rem; color:#466270; margin-bottom:10px; }
.app-workspace .ux-welcome h1 { font-size:clamp(1.6rem,2.7vw,2.4rem); line-height:1.45; margin:0 0 10px; letter-spacing:-.025em; }
.app-workspace .ux-welcome p { max-width:65ch; font-size:.9rem; line-height:1.8; }
.app-workspace .work-shortcuts { border:0; padding:0; margin-bottom:32px; gap:10px; }
.app-workspace .work-shortcuts .btn { padding:11px 16px; font-size:.84rem; }
.work-section-heading { flex-wrap:wrap; }
.ux-queue-controls { display:flex; flex-wrap:wrap; padding:4px; border:1px solid #d2dfe6; border-radius:9px; background:#eaf0f4; }
.ux-queue-controls button { padding:8px 12px; border:0; color:#435e70; background:transparent; border-radius:6px; font-size:.8rem; min-height:36px; }
.ux-queue-controls button.is-selected { background:#fff; color:#17475a; box-shadow:0 1px 4px #1b3b4d16; font-weight:700; }
.app-workspace .work-card h3 { font-size:.95rem; }
.app-workspace .work-card small { font-size:.75rem; }
.app-workspace .work-item-heading strong { font-size:.9rem; }
.app-workspace .work-list p { font-size:.8rem; line-height:1.7; }
.app-workspace .work-item-meta, .app-workspace .work-more { font-size:.75rem; }
.app-workspace .work-empty { color:#557162; background:#fbfdfc; font-size:.84rem; margin:0; padding:22px; }
.app-workspace .work-count { background:#e7f1f3; font-size:1.15rem; min-width:40px; height:40px; }
.app-workspace .work-card[data-count='0'] .work-count { background:#f1f5f4; color:#687d74; }
.app-workspace .voyage-hub-title { font-size:clamp(1.3rem,2vw,1.8rem); }
.app-workspace .voyage-hub-link { padding:12px 16px; font-size:.85rem; }
.app-workspace .workflow-strip { gap:8px; padding:10px; border:1px solid #dce5eb; background:#fff; border-radius:12px; }
.app-workspace .workflow-step { border-radius:7px; font-size:.84rem; padding:10px 14px; }
.app-workspace .workflow-step.is-active { background:#17475a; color:#fff; }
.app-workspace .workflow-step.is-done { background:#eaf5ef; color:#206448; }
.ux-import-tools { margin-top:24px; padding:16px 20px; border:1px solid #dde5eb; border-radius:12px; background:#fff; }
.ux-import-tools > summary { color:#506574; font-size:.85rem; font-weight:600; cursor:pointer; }
.ux-import-tools[open] > summary { margin-bottom:18px; }
.app-workspace .mr-actions { background:#fff; border:1px solid #d5e1e8; border-radius:12px; box-shadow:0 -4px 18px #183b4b08; padding:16px; }
.app-workspace .mr-panel-title { color:#233f50; font-size:1rem; }
.app-workspace .tw-panel-label { color:#4b6272; }
.ux-inline-error { color:#842e32; background:#fff0ef; padding:12px; border-radius:8px; font-size:.84rem; }
.ux-form-summary { padding:12px 16px; border:1px solid #e9bfc1; background:#fff0ef; color:#842e32; border-radius:8px; margin-bottom:16px; }
.ux-invalid { border-color:#b73b47 !important; }
.ux-draft-state { display:block; margin-bottom:12px; color:#805d16; font-size:.8rem; }
.app-workspace .finance-subnav > div { gap:4px !important; padding:5px; border:1px solid #dce5eb; border-radius:10px; background:#fff; }
.app-workspace .finance-subnav .btn-outline-secondary { border-color:transparent; }
.app-workspace .nav-tabs { gap:4px; }
.app-workspace .nav-tabs .nav-link { padding:12px 15px; font-size:.85rem; color:#526879; border:0; border-radius:7px; }
.app-workspace .nav-tabs .nav-link.active { color:#17475a; background:#eaf3f5; box-shadow:inset 0 -3px #237a91; }
.app-workspace #containerMovementTable :is(th,td) { font-size:.8rem; padding:9px 10px; border-color:#dce5eb; }
.app-workspace .cm-filter-btn, .app-workspace .cm-expand-btn { min-width:32px; min-height:32px; }
.app-workspace .cm-control-bar { gap:14px; }
.redesigned-login .login-card { width:min(460px,calc(100% - 32px)); margin:24px auto; padding:36px; }
.ux-login-heading h1 { font-size:1.65rem; font-weight:700; color:#173d50; margin:24px 0 8px; }
.ux-login-heading p { font-size:.9rem; line-height:1.8; color:#526879; margin-bottom:24px; }
.ux-password { display:flex; border:1px solid #c9d6df; border-radius:8px; overflow:hidden; }
.ux-password .form-control { border:0; min-width:0; border-radius:0; }
.ux-password button { background:#f4f7f9; border:0; padding:8px 12px; color:#285365; font-size:.75rem; flex-shrink:0; }
.ux-password:focus-within { outline:3px solid #237a9133; }
.redesigned-login :is(input,.btn-login) { min-height:48px; }
[dir=rtl] .ux-welcome h1, [dir=rtl] .ux-eyebrow { letter-spacing:0; }
@media(max-width:767px) {
 .app-workspace .main-content { padding:20px 16px 40px; }
 .ux-scope { gap:5px; font-size:.7rem; margin-bottom:18px; }
 .app-workspace .ux-welcome { padding:22px; flex-wrap:wrap; gap:16px; }
 .app-workspace .ux-welcome time { padding:5px 10px; }
 .app-workspace .work-grid { grid-template-columns:minmax(0,1fr); }
 .app-workspace .btn-sm { min-height:42px; }
 .app-workspace .nav-tabs { flex-wrap:nowrap !important; overflow-x:auto; max-width:100%; padding-bottom:5px; }
 .app-workspace .nav-tabs .nav-link { white-space:nowrap; }
 .app-workspace .panel-card-header--tabs { padding:12px; display:block; }
 .app-workspace .page-hero-actions { width:100%; }
 .app-workspace .mr-actions { position:static; }
 .app-workspace .kpi-card { padding:14px; flex-wrap:wrap; }
 .app-workspace .table-custom tbody td { font-size:.85rem; }
 .redesigned-login .login-card { padding:26px; }
}
@media(prefers-reduced-motion:reduce) {
 *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}
@media print { .ux-scope,.ux-table-hint,.ux-queue-controls,.ux-draft-state,#uxOffline { display:none !important; } }
