@import url('fonts/inter.css');
/* Centro de control: composición fluida. La cabecera pertenece al shell compartido. */
body:has(#page-dashboard.active) .content{padding:21px 23px 24px 24px;background:#fafbff}
#page-dashboard{--control-ink:#111b3b;--control-muted:#7482a5;--control-line:#e5e9f5;--control-violet:#5e32fa;container-type:inline-size;container-name:control;color:var(--control-ink);font-family:Inter,"Segoe UI",sans-serif}
#page-dashboard [hidden]{display:none!important}
#page-dashboard button,#page-dashboard input,#page-dashboard select{font-family:inherit}
#page-dashboard :is(button,summary,input):focus-visible{outline:2px solid #8769f3;outline-offset:3px}
#page-dashboard .dashboard-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:62px;height:auto;margin:0 0 18px}
#page-dashboard .dashboard-heading h1{margin:0 0 5px;font-size:33px;font-weight:700;line-height:1.2;letter-spacing:-.04em;color:var(--control-ink)}
#page-dashboard .dashboard-reference-subtitle{margin:0;color:var(--control-muted);font-size:14px;line-height:1.5}
.dashboard-reference-search{display:flex;align-items:center;gap:10px;flex:0 1 260px;max-width:100%;height:43px;padding:0 12px;border:1px solid #dce2f1;border-radius:8px;background:#fff;color:#60719a;transform:translateY(-3px)}
.dashboard-reference-search>i{font-size:19px}
.dashboard-reference-search input{width:100%;min-width:0;height:100%;padding:0;border:0;outline:0;background:transparent;color:var(--control-ink);font-size:12px}
.dashboard-reference-search input::-webkit-search-cancel-button{display:none}
.dashboard-reference-search:focus-within{border-color:var(--control-violet)}
.dashboard-reference-search button{padding:3px;border:0;background:none;color:#6e7994;cursor:pointer}
#page-dashboard .control-period-operations{display:flex;align-items:center;flex-wrap:wrap;gap:19px;min-height:105px;height:auto;margin:0 0 16px;padding:18px 18px;border:1px solid #e1dcff;border-radius:10px;background:linear-gradient(100deg,#f6f3ff,#f9f7ff);box-shadow:none}
.control-period-operations-icon{display:grid;place-items:center;align-self:flex-start;flex:0 0 44px;width:44px;height:44px;color:var(--control-violet);font-size:36px;transform:translateX(-2px)}
.control-period-operations-copy{min-width:0;flex:1 1 280px}
.control-period-operations-copy h2{margin:0;color:var(--control-violet);font-size:19px;line-height:1.3;font-weight:600;letter-spacing:-.03em}
#controlWorkingPeriod{text-transform:lowercase}
.control-period-operations-copy p{margin:7px 0 0;color:var(--control-muted);font-size:12px;line-height:1.4}
.dashboard-period-disclosure{position:relative;z-index:5;width:max-content;max-width:100%}
.dashboard-period-disclosure summary{cursor:pointer;list-style:none;border-radius:4px}
.dashboard-period-disclosure summary::-webkit-details-marker{display:none}
.dashboard-period-disclosure .dashboard-period-control{position:absolute;top:34px;left:0;z-index:20;width:max-content;box-shadow:0 8px 25px #202a4d20}
.control-period-operations-actions{display:flex;align-items:flex-start;flex-wrap:wrap;gap:16px;flex:1 1 420px;max-width:540px;height:auto;padding-top:0}
.control-period-operations-actions>.btn,.control-xml-action>.btn{display:inline-flex;align-items:center;justify-content:center;height:46px;min-height:46px;width:225px;padding:0 16px;border-radius:7px;font-size:13px;font-weight:600;gap:12px}
.control-period-operations-actions>.btn{background:linear-gradient(105deg,#6031f4,#5631e9);border:1px solid #7751ff}
.control-period-operations-actions>.btn .ti,.control-xml-action>.btn .ti{font-size:23px;margin:0}
.control-period-operations-actions>.btn:hover:not(:disabled){background:#4825d5}
.control-xml-action{position:relative;display:grid;justify-items:center;gap:7px;flex:0 0 250px;width:250px;padding-left:22px}
.control-xml-action:before{content:"";position:absolute;left:0;top:0;width:1px;height:46px;background:#cec5f5}
.control-xml-action>.btn{width:228px}
.control-xml-action>.btn.ghost{border:1px solid #8053ff;color:var(--control-violet);background:#fff}
.control-xml-action>.btn.ghost:hover:not(:disabled){background:#f0ebff}
.control-xml-action small{width:228px;color:#6e7ba0;font-size:8.5px;white-space:nowrap;text-align:center}
#page-dashboard .control-grid{display:grid;grid-template-columns:minmax(0,1fr) 38%;gap:16px;margin-bottom:15px}
#page-dashboard .control-panel{min-width:0;min-height:383px;margin:0;padding:0;overflow:hidden;border:1px solid var(--control-line);border-radius:10px!important;background:#fff}
#page-dashboard .control-panel-head,#page-dashboard .control-reconciliation-head{min-height:70px;height:auto;display:flex;align-items:center;gap:14px;padding:12px 15px;border:0}
#page-dashboard .control-heading-icon{flex:0 0 38px;width:38px;height:40px;display:grid;place-items:center;border-radius:11px;background:#f0ecff;color:var(--control-violet);font-size:23px;transform:translateY(-4px)}
#page-dashboard .control-heading-copy{flex:1;min-width:0}
#page-dashboard .control-heading-icon svg{width:23px;height:23px}
#page-dashboard .control-heading-copy h3,#page-dashboard .sync-panel-heading h3{margin:0;color:var(--control-ink);font-size:16px!important;line-height:1.35;font-weight:650;letter-spacing:-.035em}
.control-heading-copy p,.sync-panel-heading p{margin:3px 0 0;color:var(--control-muted);font-size:12px;line-height:1.4}
#page-dashboard .text-action{white-space:nowrap;color:var(--control-violet);font-size:12px;font-weight:500}
.control-queue-filters{display:flex;gap:9px;flex-wrap:wrap;padding:2px 16px 13px}
.control-queue-filter{display:flex;align-items:center;gap:8px;min-height:34px;padding:0 14px;border:1px solid #e9ecf6;border-radius:9px;background:#fff;color:#5f6d90;font-size:12px;cursor:pointer}
.control-queue-filter span{display:inline-grid;place-items:center;min-width:21px;height:21px;padding:0 3px;border-radius:50%;background:#f4f5f9;font-size:11px;font-weight:500}
.control-queue-filter:hover{border-color:#b9aff7;color:var(--control-violet)}
.control-queue-filter.is-active{border-color:#7147ff;background:linear-gradient(110deg,#6940fa,#512beb);color:#fff;box-shadow:0 4px 10px #6638ec25}
.control-queue-filter.is-active span{background:#ffffff38;color:#fff}
#page-dashboard .priority-columns,#page-dashboard .priority-row{display:grid;grid-template-columns:82px 80px minmax(100px,1fr) 102px 116px 53px!important;align-items:center;gap:5px!important;padding:0 12px!important}
#page-dashboard .priority-columns{height:33px;margin:0 16px;border:1px solid var(--control-line);border-radius:6px 6px 0 0;background:#f7f8fc;color:#526489;font-size:9px;text-transform:uppercase}
#page-dashboard .priority-columns button{display:flex;align-items:center;gap:5px;padding:0;border:0;background:transparent;color:inherit;font:inherit;text-transform:inherit;cursor:pointer}
#page-dashboard .priority-list{min-height:203px;margin:0 16px 26px;border:1px solid var(--control-line);border-top:0;border-radius:0 0 6px 6px;overflow:hidden}
#page-dashboard .priority-row{min-height:40px;border-bottom:1px solid #e8ecf6;font-size:12px;color:#3d5079}
#page-dashboard .priority-row:last-child{border-bottom:0}
.priority-doc-type{display:flex;align-items:center;gap:6px;color:#3d5079;white-space:nowrap}
.priority-doc-type i{color:#087bfa;font-size:20px}.priority-doc-type.sale i{color:#00a15f}
.priority-description{min-width:0}.priority-description strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:400}.priority-description small{display:none}
.priority-amount{font-size:12px;font-weight:400;white-space:nowrap}
#page-dashboard .priority-state{display:flex;align-items:center;gap:7px;justify-self:start;min-height:26px;padding:3px 9px;border-radius:6px;font-size:11px;font-weight:400}
#page-dashboard .priority-state:before{content:"";flex:0 0 10px;width:10px;height:10px;border-radius:50%;background:currentColor}
#page-dashboard .priority-state.warn{background:#fff2dc;color:#d28300}.priority-state.neutral{background:#e3f6ec;color:#188553}
.priority-row-action{width:30px;height:30px;justify-self:center;border:0;border-radius:5px;background:transparent;color:#51618a;font-size:18px;cursor:pointer}.priority-row-action:hover{background:#f0edff}
#page-dashboard .priority-empty{display:grid;place-items:center;min-height:201px;padding:20px;color:var(--control-muted);font-size:12px;text-align:center}
#page-dashboard .priority-footer{display:none}
#page-dashboard .sync-panel{min-height:383px}
#page-dashboard .sync-panel-head{display:grid;grid-template-columns:39px minmax(0,1fr) auto;align-items:start;column-gap:14px;min-height:77px;height:auto;margin:0 17px;padding:13px 0 0;border-bottom:1px solid var(--control-line)}
.sync-panel-heading{min-width:0;padding-top:3px}
#page-dashboard .sync-panel-heading h3{white-space:normal}
.sync-panel-heading p{white-space:normal;font-size:11px;margin-top:7px}
.sync-panel-heading p strong{font-weight:400;color:#657497}
.sync-panel-head .sync-cloud{width:39px;height:40px;border-radius:11px;background:#e7f7ef;color:#099b60;font-size:23px;transform:translateY(-3px)}
#page-dashboard .sync-connected-pill{display:inline-flex;align-items:center;justify-content:center;min-height:28px;margin-top:1px;padding:4px 10px;border:0;border-radius:7px;background:#f0f1f6;color:#66728c;box-shadow:none;letter-spacing:0;font-size:11px;font-weight:500!important;white-space:nowrap}
#page-dashboard .sync-connected-pill.is-verified{background:#e1f5eb;color:#078553}
#page-dashboard .sync-connected-pill.is-loading{background:#fff1dc;color:#b36800}
#page-dashboard .sync-connected-pill.is-error{background:#ffe7e9;color:#b72e3c}
#page-dashboard .sync-stats{display:block;margin:0 17px}
#page-dashboard .sync-stat{display:grid;grid-template-columns:39% minmax(0,1fr);gap:0;align-items:center;min-height:39px;height:auto;padding:8px 2px;border-bottom:1px solid var(--control-line);font-size:12px;color:#53648c}
#page-dashboard .sync-stat strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:normal;overflow-wrap:anywhere;text-align:left;font-size:12px;font-weight:400;color:#111d48}
#page-dashboard .sync-stat:first-child strong:before{content:"";display:inline-block;width:10px;height:10px;margin-right:9px;border-radius:50%;background:#99a3b8}
#page-dashboard .sync-stat:nth-child(4) strong{color:#00924d}#page-dashboard .sync-stat:nth-child(5) strong{color:#ed263c}
#page-dashboard .sync-period-row{border-bottom:0}
#page-dashboard .sync-control-progress,#page-dashboard .sync-history-link{display:none}
#page-dashboard .sync-control-progress.is-active{display:block;margin:8px 17px}
#page-dashboard .sync-integrity-compact{display:grid;margin:9px 17px 14px;padding:8px 10px;min-height:49px;background:#f7f8ff}
#page-dashboard .sync-integrity-copy span{font-size:11px}
#page-dashboard .sync-integrity-copy strong{font-size:10px}
#page-dashboard .sync-integrity-badge{font-size:10px}
#page-dashboard .sync-reference-info{display:none}
.sync-reference-info{display:flex;align-items:center;gap:10px;min-height:50px;margin:4px 17px 16px;padding:10px 16px;border:1px solid #d7d5ff;border-radius:7px;background:#f2f2ff;color:#5e6b91;font-size:11px;line-height:1.35}
.sync-reference-info i{flex:0 0 auto;color:var(--control-violet);font-size:21px}
#page-dashboard .control-reconciliation{padding:0;border:1px solid var(--control-line);border-radius:10px!important;background:#fff}
#page-dashboard .control-reconciliation-head{min-height:71px;height:auto;padding:12px 14px}
#page-dashboard .control-reconciliation-head .btn{min-height:40px;height:40px;width:107px;min-width:107px;margin:0;padding:0 9px;border:1px solid #e0e4f4;border-radius:7px;background:#fff;color:var(--control-violet);font-size:12px;font-weight:500;white-space:nowrap;transform:translateY(-3px)}
.control-recon-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.09fr);gap:14px;padding:0 13px 12px}
.control-recon-card{min-width:0;min-height:158px;height:auto;padding:11px 12px;border:1px solid var(--control-line);border-radius:8px;background:#fff}
.control-recon-card-head{display:flex;align-items:flex-start;gap:18px;min-height:60px;height:auto}
.control-recon-card-head>div{padding-top:5px}
.control-recon-icon{flex:0 0 50px;width:50px;height:50px;display:grid;place-items:center;border-radius:50%;background:#f0ecff;color:var(--control-violet);font-size:24px}.control-recon-icon.sales{background:#e4f6ed;color:#0a9a5e}
.control-recon-card h4{margin:0;color:var(--control-ink);font-size:12px;line-height:1.35;font-weight:600;letter-spacing:-.025em}
.control-recon-card-head strong{display:block;margin-top:9px;color:var(--control-ink);font-size:24px;line-height:1;font-weight:700}
.control-recon-data{display:flex;justify-content:space-between;gap:6px;margin-top:7px;color:#59698f;font-size:12px;line-height:1.4}
.control-recon-data strong{max-width:55%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#3f5078;font-size:12px;font-weight:400;text-align:right}
.control-recon-state{display:flex;align-items:center;gap:7px;min-height:27px;margin-top:9px;padding:0 9px;border-radius:6px;background:#eef1f7;color:#647392;font-size:11px}
.control-recon-state i{font-size:14px}.control-recon-state.verified{background:#dff4eb;color:#008856}
.control-recon-state.is-warn{background:#fff0dd;color:#ad6500}
.control-recon-progress{height:14px;margin:11px 2px 10px;border-radius:99px;background:#dddfea}
.control-recon-progress span{display:block;width:0;height:100%;border-radius:inherit;background:#6438ef}
.control-recon-footnote{display:flex;gap:9px;margin:13px 0 0;color:#8290ad;font-size:10px;line-height:1.4}
.control-recon-footnote i{font-size:16px}
.control-recon-tip{display:flex;align-items:center;gap:18px;min-height:62px;margin:0 13px 18px;padding:9px 18px;border:1px solid #dddfff;border-radius:7px;background:#f2f1ff;color:var(--control-violet)}
.control-recon-tip>i{font-size:28px}.control-recon-tip>div{flex:1;min-width:0}
.control-recon-tip strong,.control-recon-tip span{display:block}.control-recon-tip strong{font-size:12px;font-weight:600}
.control-recon-tip span{margin-top:5px;color:#7582a6;font-size:11px}
.control-recon-tip button{width:24px;height:24px;padding:0;border:0;background:transparent;color:#7482aa;font-size:17px;cursor:pointer}
#page-dashboard #reconDetail{border-top:1px solid var(--control-line);margin-bottom:14px;overflow-x:auto}
#page-dashboard .control-integrity-detail{padding:15px 17px 3px;border-top:1px solid var(--control-line);color:#3f5078}
.control-integrity-detail-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.control-integrity-detail-head h4{margin:0;color:var(--control-ink);font-size:14px}
.control-integrity-detail-head span,.control-integrity-detail>p,.control-integrity-caveat{color:#7380a1;font-size:11px}
.control-integrity-detail .verif-tabla{min-width:540px;margin:10px 0 0;font-size:11px}
.control-integrity-detail .verif-tabla td{padding:7px 8px;border-bottom:1px solid var(--control-line)}
.control-integrity-detail #verifResumen{margin:11px 0 4px;font-size:11px;font-weight:600}
/* En Full HD la cola muestra siete documentos sin dejar un vacío bajo la tabla. */
@media(min-width:1101px){
 #page-dashboard .control-panel{min-height:429px}
 #page-dashboard .priority-row{min-height:37px}
 #page-dashboard .priority-list{margin-bottom:13px}
}
@media(max-width:1350px){
 .control-period-operations-actions>.btn,.control-xml-action>.btn{width:180px}.control-xml-action{width:202px;flex-basis:202px}.control-xml-action small{width:180px;white-space:normal}
 #page-dashboard .priority-columns,#page-dashboard .priority-row{grid-template-columns:72px 78px minmax(90px,1fr) 75px 94px 30px!important;gap:3px!important}
 #page-dashboard .sync-panel-head{column-gap:9px}#page-dashboard .sync-panel-heading h3{white-space:normal;font-size:14px!important}
 #page-dashboard .sync-panel-heading p{white-space:normal}
 .control-recon-card-head{gap:9px}.control-recon-icon{flex-basis:42px;width:42px;height:42px}
}
@media(max-width:1100px){
 #page-dashboard .dashboard-heading{height:auto;align-items:stretch;flex-direction:column;gap:15px}
 .dashboard-reference-search{flex-basis:auto;width:100%;height:43px;transform:none}
 #page-dashboard .control-grid{grid-template-columns:1fr}
 #page-dashboard .control-panel{min-height:0}
 #page-dashboard .control-period-operations{height:auto;min-height:105px;flex-wrap:wrap}
 .control-period-operations-actions{width:100%;height:auto;padding-left:63px}
 .control-recon-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 #page-dashboard .control-reconciliation{overflow:visible}
 #page-dashboard .control-reconciliation-head{min-width:0}
}
@media(max-width:700px){
 body:has(#page-dashboard.active) .content{padding:20px 16px}
 #page-dashboard .dashboard-heading{height:auto;align-items:stretch;flex-direction:column;gap:15px}
 #page-dashboard .dashboard-heading h1{font-size:27px}.dashboard-reference-search{flex-basis:auto;width:100%}
 #page-dashboard .control-period-operations{gap:10px;padding:16px;align-items:flex-start}
 .control-period-operations-icon{flex-basis:34px;width:34px;height:34px;font-size:28px}
 .control-period-operations-copy h2{font-size:17px}
 .control-period-operations-copy p{font-size:12px}
 .dashboard-period-disclosure .dashboard-period-control{left:-44px;flex-wrap:wrap;max-width:calc(calc(100*var(--ux-vw)) - 110px);white-space:normal}
 .dashboard-period-control-title{width:100%}
 .control-period-operations-actions{display:grid;grid-template-columns:1fr;gap:10px;padding:0}
 .control-period-operations-actions>.btn,.control-xml-action>.btn{width:100%;height:44px;min-height:44px}
 .control-xml-action{width:100%;padding:0;border:0}.control-xml-action:before{display:none}.control-xml-action small{width:auto;white-space:normal;text-align:center}
 #page-dashboard .control-panel-head{height:auto;display:grid;grid-template-columns:38px minmax(0,1fr);column-gap:12px}
 #page-dashboard .control-panel-head .text-action{grid-column:2;justify-self:start;padding:3px 0}
 .control-queue-filters{gap:5px}.control-queue-filter{padding:0 8px;font-size:11px}
 #page-dashboard .priority-columns{display:none}
 #page-dashboard .priority-list{border-top:1px solid var(--control-line);border-radius:6px}
 #page-dashboard .priority-row{grid-template-columns:66px minmax(0,1fr) 30px!important;min-height:66px}
 #page-dashboard .priority-row .priority-doc-type,#page-dashboard .priority-row .priority-amount,#page-dashboard .priority-row .priority-state{display:none}
 .priority-description small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px;color:var(--control-muted)}
 #page-dashboard .sync-panel-head{height:auto;min-height:95px;grid-template-columns:39px minmax(0,1fr)}
 #page-dashboard .sync-connected-pill{grid-column:2;justify-self:start;margin:5px 0 9px}
 #page-dashboard .sync-stat{grid-template-columns:45% minmax(0,1fr);font-size:11px}#page-dashboard .sync-stat strong{font-size:11px}
 .control-recon-cards{grid-template-columns:1fr}
 #page-dashboard .control-reconciliation-head{height:auto;min-height:71px;flex-wrap:wrap}
 .control-recon-tip{gap:10px;padding:10px}
}

/* Distribución según el ancho útil, incluso al plegar el menú. */
#page-dashboard .control-period-operations-actions>.btn{flex:1 1 180px;width:auto}
#page-dashboard .control-xml-action{flex:1 1 180px;width:auto;min-width:0;padding-left:16px}
#page-dashboard .control-xml-action>.btn,#page-dashboard .control-xml-action small{width:100%;white-space:normal}
@container control (max-width:1000px){
 #page-dashboard .control-grid{grid-template-columns:minmax(0,1fr)}
 #page-dashboard .control-panel{min-height:0}
 .control-recon-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 #page-dashboard .control-reconciliation-head{min-width:0}
}
@container control (max-width:600px){
 .control-recon-cards{grid-template-columns:minmax(0,1fr)}
 #page-dashboard .dashboard-heading{flex-direction:column;align-items:stretch}
 .dashboard-reference-search{flex-basis:auto;width:100%;transform:none}
 #page-dashboard .control-period-operations-actions{max-width:none;padding-left:0}
 #page-dashboard .control-period-operations-copy{flex-basis:180px}
 #page-dashboard .control-xml-action{padding-left:0}
 #page-dashboard .control-xml-action:before{display:none}
}