/* Diseño compartido: basado en el listado de herramientas. */
body.app-ui{
  --brand:#e74c3c;--brand-700:#c0392b;--ink:#0f172a;--muted:#6b7280;
  --bg:#f6f7fb;--card:#fff;--stroke:#e5e7eb;--thead:#f3f4f6;
  --in-bg:#d1e7dd;--in-ink:#0f5132;--out-bg:#fff3cd;--out-ink:#664d03;
  --rep-bg:#f8d7da;--rep-ink:#842029;
  background:var(--bg);color:var(--ink);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,sans-serif;
}
body.app-ui *{box-sizing:border-box}
body.app-ui .ui-icon{display:inline-block;width:1.18em;height:1.18em;flex:none;vertical-align:-.2em;margin-right:.25em;color:var(--brand);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body.app-ui :is(.btn,.button,.submit,.app-btn,.menu a,.view-tab,.tab,.asset-tab,.status-chip,.alert,.notice,.done,.alert-ok,.alert-err) .ui-icon{color:inherit}
body.app-ui .menu a .ui-icon{width:1.4em;height:1.4em;color:var(--brand);vertical-align:-.33em;margin-right:.55em}
body.app-ui .icon .ui-icon{width:1.8rem;height:1.8rem;margin:0;color:var(--brand)}
body.app-ui .status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:middle;background:#94a3b8}
body.app-ui .status-dot.available{background:#178453}body.app-ui .status-dot.in-use{background:#d49a15}body.app-ui .status-dot.broken{background:#cf3535}body.app-ui .status-dot.inactive{background:#94a3b8}
.notification-page,.transfer-page{max-width:1050px;margin:0 auto;padding:82px 12px 42px}
.notification-page .page-head,.transfer-page .page-head{text-align:left;margin-bottom:18px}
.notification-page .card,.transfer-page .card{margin-bottom:13px}
.notification-settings p{line-height:1.5}
.notification-list-head,.transfer-list-head,.transfer-submit{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:18px 0 12px}
.notification-list-head h2,.transfer-list-head h2{margin:0}
.notification-item{border-left:4px solid #e5e7eb!important}
.notification-item.unread{border-left-color:#e74c3c!important;background:#fffaf9!important}
.notification-item>div:first-child{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.notification-item p{margin:9px 0 13px;line-height:1.4}
.notification-recipients{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}
.notification-recipients label{display:flex;align-items:center;gap:10px;margin:0;padding:10px 12px;border:1px solid #e5e7eb;border-radius:10px;background:#fff}
.notification-recipients label input{width:auto;min-height:auto;accent-color:#e74c3c}
.notification-recipients small{display:block;color:#6b7280}
.transfer-source{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.transfer-source .app-field{flex:1 1 240px}
.transfer-list-head p{margin:5px 0 0}.transfer-count{font-weight:800;color:#c0392b}
.transfer-controls{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.transfer-controls input[type=search]{flex:2 1 240px}
.transfer-tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:8px;max-height:440px;overflow:auto}
.transfer-tool{display:flex;align-items:center;gap:12px;margin:0;padding:12px;border:1px solid #e5e7eb;border-radius:10px;background:#fff;cursor:pointer}
.transfer-tool:has(input:checked){background:#fff4f2;border-color:#e74c3c}.transfer-tool[hidden]{display:none}
.transfer-tool input{width:19px;height:19px;flex:none;accent-color:#e74c3c}.transfer-tool span{min-width:0}.transfer-tool strong{color:#c0392b}.transfer-tool small{display:block;color:#6b7280}
.work-actions{display:flex;gap:5px;justify-content:flex-end;flex-wrap:wrap;margin-top:5px}.work-actions .btn{padding:6px 9px}
@media(max-width:650px){.notification-page,.transfer-page{padding:70px 8px 30px}.transfer-controls input[type=search]{flex-basis:100%}.transfer-tools{grid-template-columns:1fr}.transfer-submit .app-btn{width:100%}}
body.app-ui :is(.container,.wrap,.page-wrap,.shell){max-width:min(1200px,100%);margin-left:auto;margin-right:auto}
body.app-ui :is(h1,h2,h3){letter-spacing:-.015em;color:var(--ink)}
body.app-ui h1{font-size:clamp(1.3rem,2.4vw,1.75rem);line-height:1.2}
body.app-ui h2{font-size:1.13rem;line-height:1.3}
body.app-ui :is(.sub,.subtitle,.muted,.hint,.help,.small){color:var(--muted)}
body.app-ui :is(.card,.table-card,.panel-card,.work-card){background:var(--card);border:1px solid var(--stroke);border-radius:14px;box-shadow:0 2px 10px rgba(15,23,42,.035)}
body.app-ui :is(.card,.panel-card){padding:18px}
body.app-ui :is(.table-card,.table-wrap){overflow-x:auto}
body.app-ui table{width:100%;border-collapse:separate;border-spacing:0}
body.app-ui :is(th,td){text-align:left;padding:11px 14px;border-bottom:1px solid var(--stroke);vertical-align:middle}
body.app-ui thead th{background:var(--thead);color:var(--ink);font-size:.85rem;font-weight:750;white-space:nowrap}
body.app-ui tbody tr:hover td{background:#fafafa}
body.app-ui tbody tr:last-child td{border-bottom:0}
body.app-ui td.code,body.app-ui .code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-weight:750}
body.app-ui :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){
  background:#fff;color:var(--ink);border:1px solid #cbd5e1;border-radius:10px;
  padding:10px 12px;font:inherit;max-width:100%;min-height:44px;
}
body.app-ui textarea{min-height:88px;resize:vertical}
body.app-ui :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus-visible,
body.app-ui :is(a,button):focus-visible{outline:3px solid rgba(231,76,60,.23);outline-offset:2px;border-color:var(--brand)}
body.app-ui input::placeholder{color:#8793a2}
body.app-ui label{color:#334155}
body.app-ui :is(button,.btn,.button,.submit,.link.primary,.menu a):not(.tab):not(.view-tab):not(.view-btn):not(.mini-btn):not(.app-btn):not(.mobile-row-toggle):not(.btn-ghost):not(.secondary):not(.ghost):not(.green):not(.manual-submit):not(.grey):not(.remove){
  background:var(--brand);color:#fff;border-radius:10px;border-color:var(--brand);font-weight:750;
}
body.app-ui :is(button,.btn,.button,.submit):hover:not(:disabled){filter:brightness(.96)}
body.app-ui :is(button,.btn,.button,.submit):disabled{opacity:.55;cursor:not-allowed}
body.app-ui :is(.filters,.toolbar,.filter-row){gap:10px}
body.app-ui :is(.view-tabs,.tabs,.asset-tabs){display:flex;flex-wrap:wrap;gap:5px;padding:4px;background:#e9ecf2;border-radius:12px;width:fit-content}
body.app-ui :is(.view-tab,.tab,.asset-tab){border:0;background:transparent;color:#374151;border-radius:9px;padding:9px 13px;text-decoration:none;font-weight:750;cursor:pointer}
body.app-ui :is(.view-tab.active,.tab.active,.asset-tab.active){background:#fff;color:var(--brand-700);box-shadow:0 1px 3px rgba(15,23,42,.08)}
body.app-ui :is(.badge,.pill,.status-chip){border-radius:999px;padding:4px 9px;font-weight:750;font-size:.8rem;white-space:nowrap}
body.app-ui .status-chip.is-on{background:var(--in-bg);color:var(--in-ink)}
body.app-ui .status-chip.is-off{background:#e5e7eb;color:#475569}
body.app-ui .code-pill{display:inline-flex;padding:5px 9px;border-radius:8px;background:#fef2f2;color:var(--brand-700);font:750 .9rem ui-monospace,SFMono-Regular,Consolas,monospace}
body.app-ui .app-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:14px 0}
body.app-ui .app-toolbar input[type=search]{min-width:min(300px,100%)}
body.app-ui .app-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:13px}
body.app-ui .app-field{display:grid;gap:6px;font-weight:650}
body.app-ui .app-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
body.app-ui .app-actions form{display:inline}
body.app-ui .app-btn{display:inline-flex;align-items:center;justify-content:center;padding:9px 12px;min-height:38px;border-radius:9px;text-decoration:none;border:1px solid var(--stroke);font:750 .88rem system-ui;cursor:pointer;background:#fff;color:var(--ink)}
body.app-ui .app-btn.primary{background:var(--brand);color:#fff;border-color:var(--brand)}
body.app-ui .app-btn.danger{background:#fff;color:#991b1b;border-color:#fecaca}
body.app-ui .app-empty{text-align:center;padding:30px 16px;color:var(--muted)}
body.app-ui .app-notice{padding:12px 15px;background:#eefbf3;border:1px solid #bbebce;border-radius:11px;color:#0f5132;margin:14px 0}
/* Campo de búsqueda progresivo: el select nativo sigue enviando el ID al servidor. */
body.app-ui .select-search{display:grid;gap:6px;width:100%;max-width:100%}
body.app-ui .select-search input[type=search],body.app-ui input.filtro{width:100%;min-height:42px;background:#f8fafc;border-color:#cbd5e1;font-size:.94rem}
body.app-ui .select-search select{width:100%}
body.app-ui .select-search .select-count{font-size:.76rem;color:var(--muted);min-height:1em}
@media(max-width:680px){
  body.app-ui{padding-left:10px;padding-right:10px}
  body.app-ui :is(.card,.panel-card){padding:15px}
  body.app-ui :is(th,td){padding:10px 11px;font-size:.87rem}
  body.app-ui :is(.view-tabs,.tabs,.asset-tabs){width:100%}
  body.app-ui .app-toolbar input[type=search]{width:100%}
}

body.app-ui .menu a{background:#fff!important;color:var(--ink)!important;border:1px solid var(--stroke)!important;text-align:left;box-shadow:0 2px 10px rgba(15,23,42,.05)!important;padding:16px 18px!important}
body.app-ui .menu a:hover{border-color:var(--brand)!important;color:var(--brand-700)!important}
body.app-ui tr[hidden],body.app-ui section[hidden],body.app-ui .card[hidden]{display:none!important}
body.app-ui.manual-page .manual-submit{background:#167547;color:#fff;border-color:#167547;box-shadow:0 4px 0 #0c5a34;border-radius:17px}
body.app-ui.manual-page .manual-submit:active{transform:translateY(3px);box-shadow:0 1px 0 #0c5a34}
body.app-ui.manual-page .manual-combo{position:relative}
body.app-ui.manual-page .manual-combo input{width:100%;padding-right:44px}
body.app-ui.manual-page .manual-combo::after{content:'⌄';position:absolute;right:16px;top:15px;font-size:1.4rem;color:#64748b;pointer-events:none}
body.app-ui.manual-page .manual-combo select[hidden]{display:none!important}
body.app-ui.manual-page .combo-options{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:20;max-height:265px;overflow-y:auto;background:#fff;border:2px solid #cbd5e1;border-radius:14px;box-shadow:0 14px 30px rgba(15,23,42,.17)}
body.app-ui.manual-page .combo-options[hidden]{display:none!important}
body.app-ui.manual-page .combo-option{display:block;width:100%;margin:0;padding:13px 14px;text-align:left;background:#fff!important;color:#111827!important;border:0!important;border-radius:0!important;box-shadow:none;font-size:1rem;font-weight:650;min-height:48px}
body.app-ui.manual-page .combo-option:hover,body.app-ui.manual-page .combo-option:focus{background:#fff0ef!important}
body.app-ui.manual-page .combo-empty{padding:15px;color:#626b78}
/* Un buscador visible y filtros secundarios plegables en móvil. */
body.app-ui .mobile-filter-form{align-items:center;gap:9px}
body.app-ui .mobile-filter-main{position:relative;flex:2 1 220px;min-width:0}
body.app-ui .mobile-filter-main::before{content:'⌕';position:absolute;left:12px;bottom:7px;color:#64748b;font-size:24px;line-height:1;pointer-events:none}
body.app-ui .mobile-filter-main input{width:100%;padding-left:39px!important}
body.app-ui .mobile-filter-advanced{display:contents}
body.app-ui .mobile-filter-toggle{display:none}
body.app-ui .works-filters{display:grid;grid-template-columns:2fr repeat(4,minmax(0,1fr))}
body.app-ui .works-filters .mobile-filter-main::before{bottom:7px}
@media(max-width:700px){
  body.app-ui .page-head{display:block}
  body.app-ui .page-head h1{margin-bottom:12px}
  body.app-ui .mobile-filter-form,body.app-ui .works-filters{display:grid;grid-template-columns:minmax(0,1fr);width:100%;gap:8px}
  body.app-ui .mobile-filter-main{width:100%;min-width:0}
  body.app-ui .mobile-filter-main input{width:100%;min-height:48px}
  body.app-ui .works-filters .mobile-filter-main label{display:none}
  body.app-ui .mobile-filter-toggle{display:flex;gap:5px;justify-content:center;width:100%;min-height:44px;background:#fff;border:1px solid #d4dbe5;color:#374151;border-radius:10px;font-size:.9rem}
  body.app-ui .mobile-filter-toggle[aria-expanded=true]{border-color:#e74c3c;color:#c0392b;background:#fff8f7}
  body.app-ui .mobile-filter-toggle [data-filter-count]:empty{display:none}
  body.app-ui .mobile-filter-toggle [data-filter-count]:not(:empty){color:#c0392b;font-weight:800}
  body.app-ui .mobile-filter-advanced{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:9px;padding:13px;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 3px 10px rgba(15,23,42,.04)}
  body.app-ui .mobile-filter-form.filters-ready .mobile-filter-advanced:not(.is-open){display:none}
  body.app-ui .mobile-filter-advanced :is(input,select,.filter-field){width:100%;min-width:0;grid-column:1/-1}
  body.app-ui .mobile-filter-advanced > :is(button,.btn){grid-column:auto;min-height:44px}
  body.app-ui .location-filters .mobile-filter-advanced{grid-template-columns:1fr}
  body.app-ui .select-search input[type=search],body.app-ui .select-search .select-count{display:none}
  body.app-ui .mobile-card-table,body.app-ui .mobile-card-table tbody{display:block;width:100%}
  body.app-ui .mobile-card-table thead{display:none}
  body.app-ui .mobile-card-table tbody{padding:10px;background:#f6f7fb}
  body.app-ui .mobile-card-table tbody tr{display:block;margin-bottom:10px;background:#fff;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px rgba(15,23,42,.04)}
  body.app-ui .mobile-card-table tbody tr:last-child{margin-bottom:0}
  body.app-ui .mobile-card-table tbody td{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-width:0;padding:10px 12px;white-space:normal;overflow-wrap:anywhere;text-align:right;font-size:.9rem}
  body.app-ui .mobile-card-table tbody td::before{content:attr(data-label);flex:0 0 39%;text-align:left;color:#64748b;font:750 .77rem system-ui;letter-spacing:.01em}
  body.app-ui .mobile-card-table tbody td:first-child{background:#fff8f7}
  body.app-ui .mobile-card-table tbody td:last-child{border-bottom:0}
  body.app-ui .mobile-card-table tbody td .asset-description{max-width:100%;word-break:break-word}
  body.app-ui .mobile-card-table tbody td .asset-actions{justify-content:flex-end}
  body.app-ui .mobile-card-table tbody td.app-empty{display:block;text-align:center}
  body.app-ui .mobile-card-table tbody td.app-empty::before{display:none}
}

/* Traslado: el mismo ancho de tarjetas y controles que el resto de la web. */
body.app-ui .transfer-source.is-auto > .app-btn{display:none}
body.app-ui .transfer-page .transfer-source .app-field{min-width:0}
body.app-ui .transfer-page .transfer-tool span{overflow-wrap:anywhere}
body.app-ui .transfer-page .transfer-tool[hidden]{display:none}
@media(max-width:680px){
  body.app-ui .transfer-page{width:100%;max-width:100%;padding:70px 0 36px}
  body.app-ui .transfer-page .page-head{margin:0 0 12px;padding:0 2px}
  body.app-ui .transfer-page .page-head h1{font-size:1.35rem;line-height:1.22;margin:0 0 5px}
  body.app-ui .transfer-page .page-head p{font-size:.88rem;line-height:1.45;margin:0}
  body.app-ui .transfer-page .card{padding:14px;margin-bottom:10px;border-radius:12px}
  body.app-ui .transfer-page .card h2{font-size:1.02rem;line-height:1.3;margin:0 0 12px}
  body.app-ui .transfer-page .transfer-source{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
  body.app-ui .transfer-page .transfer-source .app-field{width:100%;min-width:0}
  body.app-ui .transfer-page .transfer-source .app-btn{width:100%;min-height:44px}
  body.app-ui .transfer-page .app-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
  body.app-ui .transfer-page .app-field{width:100%;min-width:0;font-size:.9rem}
  body.app-ui .transfer-page :is(select,input[type=date],input[type=search]){display:block;width:100%;min-width:0;min-height:46px;font-size:16px}
  body.app-ui .transfer-page .transfer-list-head{display:block;margin:0 0 12px}
  body.app-ui .transfer-page .transfer-list-head p{font-size:.83rem;line-height:1.4;overflow-wrap:anywhere}
  body.app-ui .transfer-page .transfer-count{display:inline-flex;margin-top:8px;background:#fef2f2;border-radius:999px;padding:5px 9px;font-size:.78rem}
  body.app-ui .transfer-page .transfer-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0}
  body.app-ui .transfer-page .transfer-controls input[type=search]{grid-column:1/-1;width:100%}
  body.app-ui .transfer-page .transfer-controls .app-btn{width:100%;min-width:0;min-height:44px;padding:8px 6px;line-height:1.2;font-size:.8rem}
  body.app-ui .transfer-page .transfer-tools{display:block;max-height:min(52vh,450px);overflow-y:auto;overflow-x:hidden;border:1px solid #e5e7eb;border-radius:12px;background:#fff;-webkit-overflow-scrolling:touch}
  body.app-ui .transfer-page .transfer-tool{display:grid;grid-template-columns:minmax(0,1fr) 22px;align-items:center;gap:8px;min-width:0;margin:0;padding:11px 12px;border:0;border-bottom:1px solid #e5e7eb;border-radius:0;box-shadow:none}
  body.app-ui .transfer-page .transfer-tool:last-child{border-bottom:0}
  body.app-ui .transfer-page .transfer-tool input{grid-column:2;grid-row:1;width:20px;height:20px}
  body.app-ui .transfer-page .transfer-tool span{grid-column:1;grid-row:1;min-width:0;font-size:.9rem;line-height:1.35}
  body.app-ui .transfer-page .transfer-tool strong{display:block;font-size:.85rem;margin-bottom:2px}
  body.app-ui .transfer-page .transfer-tool small{margin-top:3px;font-size:.78rem}
  body.app-ui .transfer-page .transfer-submit{display:grid;gap:9px;margin:10px 0 0;padding:12px;background:#fff;border:1px solid #e5e7eb;border-radius:12px}
  body.app-ui .transfer-page .transfer-submit .muted{font-size:.8rem}
  body.app-ui .transfer-page .transfer-submit .app-btn{width:100%;min-height:50px;font-size:.95rem}
}

/* En tablets con teclado virtual, la lista se posiciona mediante visualViewport. */
body.app-ui.manual-page .combo-options{overscroll-behavior:contain;touch-action:pan-y;z-index:9999}
