:root{
  --ink:#172635;
  --muted:#6f8191;
  --line:#dce5ec;
  --paper:#fff;
  --wash:#edf3f7;
  --dark:#14293c;
  --accent:#df4931;
  --accent-deep:#bd301e;
  --danger:#c73d35;
  --shadow:0 16px 42px rgba(23,54,78,.09);
}
html,body{background:var(--wash);color:var(--ink)}
.app-shell{grid-template-columns:112px 1fr;background:var(--wash)}
.sidebar{padding:22px 13px;background:linear-gradient(180deg,#172e43,#102538 72%,#0d2031);border-right:1px solid rgba(255,255,255,.07);box-shadow:12px 0 35px rgba(15,38,57,.08)}
.brand{height:72px;justify-content:center}
.brand-system-logo{display:block;width:88px;height:auto;filter:drop-shadow(0 7px 15px rgba(0,0,0,.14))}
.sidebar nav{gap:7px;margin-top:35px}
.nav-item{position:relative;color:#8fa5b8;border:1px solid transparent;border-radius:12px;padding:10px 5px;transition:.2s}
.nav-item:hover{background:rgba(255,255,255,.06);color:#fff;border-color:rgba(255,255,255,.07)}
.nav-item.active{background:linear-gradient(120deg,#c73520,#e65438);color:#fff;border-color:rgba(255,255,255,.15);box-shadow:0 10px 24px rgba(176,42,25,.28)}
.nav-icon{font-size:19px}.sidebar-foot{color:#7f98aa}.sidebar-foot b{color:#d4e0e8}.status-dot{background:#58c18a}
.main{background:linear-gradient(180deg,#f4f8fb,#edf3f7)}
.topbar{height:88px;padding:0 28px;background:rgba(246,250,252,.92);border-color:#dce6ed;box-shadow:0 5px 22px rgba(34,65,88,.04)}
.topbar h1,.section-head h2{color:#172a3d}.eyebrow{color:#cf412c}
.screen-picker{border-color:#d9e4eb;background:rgba(255,255,255,.9);box-shadow:0 5px 15px rgba(26,55,77,.04)}
.button{border-radius:10px}.button-primary{background:linear-gradient(120deg,#c73520,#e65438);color:#fff;box-shadow:0 9px 20px rgba(176,42,25,.22)}
.button-primary:hover{box-shadow:0 12px 26px rgba(176,42,25,.3)}
.button-secondary{border-color:#d7e2e9;color:#263b4d;background:#fff}.button-secondary:hover{border-color:#e36652;color:#bd301e}
.session-user b{color:#263b4d}.session-user small{color:#cf412c;font-weight:800}
.section-head{padding:28px 30px 24px}.section-head p:last-child{color:#778b9a}
.panel{background:#f9fbfc;border-color:#dce6ed}.workspace{background:#dfe8ee}
.workspace-toolbar,.workspace-status{border-color:#cbd8e1;background:#eaf0f4}.canvas-stage{background-color:#dfe8ee;background-image:radial-gradient(#b8c8d3 .75px,transparent .75px)}
.segmented{background:#d2dde4}.segmented button.active{background:linear-gradient(120deg,#c73520,#e65438);color:#fff;box-shadow:0 5px 13px rgba(176,42,25,.2)}
.zoom-control{background:#e2eaf0;border-color:#cad7df}.count,.selected-product{background:#e8eff3;color:#506575}
.search-wrap,.field input,.field select,.field textarea{border-color:#d8e3e9;background:#f6f9fb}.field input:focus,.field select:focus,.field textarea:focus{border-color:#df543d;box-shadow:0 0 0 3px rgba(223,84,61,.1)}
.product-card{border-color:#dde6ec;box-shadow:0 5px 14px rgba(32,62,84,.04)}.product-card:hover{border-color:#e25d48;background:#fff8f6}.add-product{background:#fbe7e2;color:#c83b25}
.canvas-element.selected{outline-color:#e34e35}.design-canvas{border-color:#f5f8fa;box-shadow:0 24px 60px rgba(21,45,63,.24)}
.campaign-card,.company-card,.screen-admin-card,.catalog-card,.user-card,.permission-role,.monitor-card,.category-admin{border-color:#dce6ed;box-shadow:var(--shadow)}
.company-card.selected{border-color:#e15b45;box-shadow:0 0 0 2px rgba(225,91,69,.11),var(--shadow)}
.company-status,.station-update-date{color:#cf412c!important}.company-card-logo.fallback,.product-thumb.fallback,.catalog-image-fallback,.user-avatar{background:#183047;color:#f26a52}
.badge-status.active{color:#28805a}.badge-status.inactive{color:#c54b43}
.screen-admin-preview{background:#173047;border-color:#29465c;color:#f0644d}
.campaign-media .media-fallback{color:#f0644d;background:#173047}.badge.live{background:#dff5e9;color:#237552}
.switch.on{background:linear-gradient(120deg,#c73520,#e65438)}
.metric{background:#edf3f6}.ad-alert{background:linear-gradient(135deg,#172e43,#203c52)}
.monitor-screen-ad{background:linear-gradient(135deg,#172e43,#203c52)}.monitor-screen-ad small{color:#ff806b}.monitor-live{color:#25805a!important}
.category-admin-chip{background:#eaf0f4}.edit-campaign{border-color:#d8e2e8;color:#40576a}.edit-campaign:hover{background:#fff1ee;color:#bf3521;border-color:#e26753}
dialog{border:1px solid #d9e4ea;background:#f9fbfc;box-shadow:0 32px 90px rgba(15,37,53,.32)}dialog::backdrop{background:rgba(11,28,42,.7)}
.dialog-head{padding-bottom:16px;border-bottom:1px solid #dce5eb}.dialog-head h2{color:#172d40}.icon-button{background:#e7eef2;color:#344c5f}.icon-button:hover{background:#fbe6e1;color:#bf3420}
.toast{background:#172e43}.toast.error{background:#a9342c}
.dashboard-shell{padding:28px 30px 40px;display:grid;gap:20px}
.dashboard-hero{position:relative;overflow:hidden;min-height:190px;padding:34px 36px;display:flex;align-items:center;justify-content:space-between;gap:30px;border-radius:22px;background:linear-gradient(125deg,#10283d 0%,#183b54 58%,#214b63 100%);color:#fff;box-shadow:0 22px 55px rgba(20,48,70,.18)}
.dashboard-hero:after{content:"";position:absolute;width:300px;height:300px;right:-75px;top:-130px;border:48px solid rgba(255,255,255,.055);border-radius:50%}
.dashboard-hero .eyebrow{color:#ff7660}.dashboard-hero h2{position:relative;margin:0 0 8px;font-size:34px;letter-spacing:-.04em}.dashboard-hero p:last-child{position:relative;margin:0;color:#b8cbd8;font-size:13px}
.dashboard-context{position:relative;z-index:1;min-width:220px;padding:18px 20px;border:1px solid rgba(255,255,255,.13);border-radius:15px;background:rgba(255,255,255,.07);backdrop-filter:blur(8px)}
.dashboard-context span,.dashboard-context b{display:block}.dashboard-context span{margin-bottom:7px;color:#ff806a;font-size:9px;font-weight:900;letter-spacing:.13em}.dashboard-context b{font-size:14px}
.dashboard-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.dashboard-metric{position:relative;overflow:hidden;min-height:142px;padding:22px;border:1px solid #dce6ed;border-radius:17px;background:#fff;box-shadow:var(--shadow)}
.dashboard-metric span,.dashboard-metric small{display:block}.dashboard-metric span{color:#718595;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.dashboard-metric b{display:block;margin:11px 0 5px;color:#172d40;font-size:31px;line-height:1}.dashboard-metric small{color:#8b9aa6;font-size:10px}.dashboard-metric-index{position:absolute;right:13px;bottom:4px;color:#edf2f5;font-size:38px;font-style:normal;font-weight:900}
.dashboard-license{padding:22px 24px;border:1px solid #dce6ed;border-radius:18px;background:#fff;box-shadow:var(--shadow)}.dashboard-license.safe{border-color:#bde3cf;background:#f2fbf6}.dashboard-license.warning{border-color:#efd89c;background:#fffaf0}.dashboard-license.danger{border-color:#efb7ae;background:#fff5f3}.dashboard-license-summary{display:flex;align-items:center;justify-content:space-between;gap:24px}.dashboard-license-summary h3{margin:2px 0 6px;color:#172d40;font-size:22px}.dashboard-license-summary>div>span{color:#718595;font-size:11px}.dashboard-license-counts{display:flex;gap:10px}.dashboard-license-counts>b{min-width:92px;padding:12px 15px;border-radius:12px;background:rgba(255,255,255,.78);color:#172d40;font-size:25px;text-align:center}.dashboard-license-counts small{display:block;margin-top:5px;color:#7a8c99;font-size:9px;text-transform:uppercase}.dashboard-license-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:17px;padding-top:15px;border-top:1px solid rgba(79,105,123,.14)}.dashboard-license-list>div{display:grid;grid-template-columns:8px minmax(0,1fr);gap:2px 10px;padding:9px 11px;border-radius:10px;background:rgba(255,255,255,.72)}.dashboard-license-list b{font-size:11px}.dashboard-license-list small{grid-column:2;color:#788b99;font-size:9px}.license-state{grid-row:1/3;align-self:center;width:8px;height:8px;border-radius:50%}.license-state.expired{background:#dd4b38;box-shadow:0 0 0 4px rgba(221,75,56,.12)}.license-state.soon{background:#d9a52f;box-shadow:0 0 0 4px rgba(217,165,47,.13)}.dashboard-license-date{min-width:255px;padding:15px 18px;border-radius:13px;background:rgba(255,255,255,.75);text-align:right}.dashboard-license-date small,.dashboard-license-date b{display:block}.dashboard-license-date small{margin-bottom:7px;color:#7e909d;font-size:8px;font-weight:900;letter-spacing:.11em}.dashboard-license-date b{color:#172d40;font-size:15px}
.dashboard-android-download{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 24px;border:1px solid #dce6ed;border-radius:18px;background:linear-gradient(120deg,#fff 0%,#fff8f5 100%);box-shadow:var(--shadow)}.dashboard-android-brand{display:flex;align-items:center;gap:18px;min-width:0}.dashboard-android-brand img{width:74px;height:74px;object-fit:contain;border-radius:16px;background:#fff}.dashboard-android-brand h3{margin:2px 0 6px;color:#172d40;font-size:20px}.dashboard-android-brand span{color:#718595;font-size:11px}.dashboard-android-action{display:flex;align-items:center;gap:16px;flex-shrink:0}.dashboard-android-action small{color:#718595;font-size:10px;font-weight:700}.dashboard-android-action .button{min-width:142px;text-decoration:none;text-align:center}
.dashboard-columns{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:16px}
.dashboard-panel{padding:22px;border:1px solid #dce6ed;border-radius:18px;background:#fff;box-shadow:var(--shadow)}
.dashboard-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.dashboard-panel-head h3{margin:0;color:#172d40;font-size:18px}.dashboard-live{display:flex;align-items:center;gap:6px;color:#28805a;font-size:9px;font-weight:900}.dashboard-live i{width:7px;height:7px;border-radius:50%;background:#45b97c;box-shadow:0 0 0 4px rgba(69,185,124,.12)}
.dashboard-focus-list,.dashboard-action-list{display:grid;gap:8px}.dashboard-focus-item{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:11px;padding:12px 13px;border-radius:11px;background:#f3f7f9}.dashboard-focus-dot{width:8px;height:8px;border-radius:50%;background:#bdc8cf}.dashboard-focus-dot.ok{background:#45b97c}.dashboard-focus-item b,.dashboard-focus-item small{display:block}.dashboard-focus-item b{font-size:12px}.dashboard-focus-item small{margin-top:3px;color:#7b8d9b;font-size:9px}.dashboard-focus-item em{color:#8193a0;font-size:8px;font-style:normal;font-weight:900;letter-spacing:.08em}
.dashboard-action-list button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:13px;padding:14px;border:1px solid #e0e8ed;border-radius:12px;background:#f8fafb;color:#20384a;text-align:left;transition:.18s}.dashboard-action-list button:hover{border-color:#e46450;background:#fff5f2;transform:translateX(2px)}.dashboard-action-list b,.dashboard-action-list small{display:block}.dashboard-action-list b{font-size:12px}.dashboard-action-list small{margin-top:4px;color:#788b99;font-size:9px;line-height:1.4}.dashboard-action-list strong{display:grid;place-items:center;min-width:28px;height:28px;border-radius:8px;background:linear-gradient(120deg,#c73520,#e65438);color:#fff}
@media(max-width:1050px){.dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-columns{grid-template-columns:1fr}.dashboard-license-list{grid-template-columns:1fr}}
@media(max-width:720px){
  .dashboard-license-summary{align-items:stretch;flex-direction:column}.dashboard-license-counts{width:100%}.dashboard-license-counts>b{flex:1}.dashboard-license-date{min-width:0;width:100%;text-align:left}
  .dashboard-android-download,.dashboard-android-action{align-items:stretch;flex-direction:column}.dashboard-android-action{width:100%;gap:10px}.dashboard-android-action .button{width:100%}.dashboard-android-brand{align-items:flex-start}.dashboard-android-brand img{width:58px;height:58px}
  .app-shell{grid-template-columns:1fr;padding-bottom:78px}
  .topbar{
    height:auto;
    min-height:112px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"heading session" "actions actions";
    align-items:center;
    gap:11px 12px;
    padding:13px 16px
  }
  .topbar>div:first-child{grid-area:heading;min-width:0}
  .topbar h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .top-actions{
    grid-area:actions;
    width:100%;
    min-width:0;
    display:flex;
    align-items:stretch;
    gap:8px;
    overflow-x:auto;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch
  }
  .top-actions::-webkit-scrollbar{display:none}
  .top-actions>.screen-picker{flex:1 0 150px;min-width:150px;max-width:100%}
  .top-actions>.button{flex:0 0 auto;white-space:nowrap}
  .session-user{
    grid-area:session;
    position:static;
    right:auto;
    bottom:auto;
    z-index:auto
  }
  .session-user>span{display:none}
  .session-user .button{min-width:64px;padding:9px 12px;white-space:nowrap}
  .sidebar{
    background:linear-gradient(100deg,#12283b,#19364c);
    height:calc(78px + env(safe-area-inset-bottom));
    padding:7px 8px max(7px,env(safe-area-inset-bottom));
    overflow:hidden;
    box-shadow:0 -8px 28px rgba(11,31,47,.2)
  }
  .sidebar nav{
    display:flex;
    justify-content:flex-start;
    gap:7px;
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    overscroll-behavior-x:contain;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    margin:0;
    align-items:center
  }
  .sidebar nav::-webkit-scrollbar{display:none}
  .nav-item{
    flex:0 0 68px;
    min-width:68px;
    height:58px;
    min-height:58px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:5px 3px;
    line-height:1.05;
    scroll-snap-align:start;
    overflow:visible
  }
  .nav-item>span:last-child{display:block;font-size:10px;white-space:nowrap}
  .nav-item.active{box-shadow:0 6px 16px rgba(176,42,25,.25)}
  .nav-icon{font-size:17px}
  .brand-system-logo{width:62px}
  .dashboard-shell{padding:18px 16px 100px;gap:14px}
  .dashboard-hero{min-height:auto;padding:24px 22px;display:grid;gap:20px;border-radius:17px}
  .dashboard-hero h2{font-size:27px}.dashboard-context{min-width:0;width:100%}
  .dashboard-metrics{grid-template-columns:1fr 1fr;gap:10px}
  .dashboard-metric{min-height:126px;padding:18px 15px}.dashboard-metric b{font-size:26px}.dashboard-metric-index{font-size:31px}
  .dashboard-columns{grid-template-columns:1fr}.dashboard-panel{padding:17px}.dashboard-focus-item{grid-template-columns:9px 1fr}.dashboard-focus-item em{grid-column:2;margin-top:-5px}
}
.security-suspension{display:block!important;margin-top:7px!important;padding:7px 9px;border-radius:8px;background:#fff0ed;color:#b63b2d!important;font-weight:700}
/* Módulo de correos */
.mail-head-actions{display:flex;gap:10px}.mail-columns{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(480px,1.4fr);gap:20px}.mail-panel{background:#fff;border:1px solid #dce6ec;border-radius:18px;padding:20px;min-width:0}.mail-panel>h3{margin:0 0 16px}.mail-template-list{display:grid;gap:12px}.mail-template-card{display:flex;justify-content:space-between;gap:14px;padding:16px;border:1px solid #e1e8ed;border-radius:14px}.mail-template-card h4{margin:8px 0 4px}.mail-template-card p,.mail-template-card small{margin:0;color:#667b8a}.mail-template-card>div:last-child{display:flex;gap:6px;align-items:center}.mail-table{overflow:auto}.mail-table table{width:100%;border-collapse:collapse;font-size:13px}.mail-table th,.mail-table td{padding:11px 9px;text-align:left;border-bottom:1px solid #e7edf1;white-space:nowrap}.mail-status{display:inline-block;padding:4px 8px;border-radius:999px;font-weight:700;text-transform:uppercase;font-size:10px}.mail-status.enviado{background:#e5f8ee;color:#18734a}.mail-status.fallido{background:#ffe9e5;color:#b93625}.mail-status.omitido{background:#fff2d8;color:#8a5a00}
@media(max-width:900px){.mail-columns{grid-template-columns:1fr}.mail-head-actions{width:100%;flex-wrap:wrap}.mail-template-card{flex-direction:column}.mail-template-card>div:last-child{align-items:stretch}.mail-template-card button{flex:1}}

#mail-template-dialog{width:min(760px,calc(100vw - 32px));max-width:760px}#mail-template-dialog form{display:grid;gap:18px}.mail-editor-field{display:grid;gap:8px}.mail-editor-toolbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px;background:#f2f6f8;border:1px solid #d8e3e9;border-bottom:0;border-radius:11px 11px 0 0}.mail-editor-toolbar button{min-height:34px;padding:6px 11px;border:1px solid #cedbe2;border-radius:7px;background:#fff;color:#183247;cursor:pointer}.mail-editor-toolbar button:hover,.mail-editor-toolbar button:focus{border-color:#df4936;color:#c93624}.mail-visual-editor{min-height:280px;max-height:48vh;overflow:auto;padding:24px;background:#fff;border:1px solid #d8e3e9;border-radius:0 0 11px 11px;color:#172d40;line-height:1.6;outline:none}.mail-visual-editor:focus{border-color:#df4936;box-shadow:0 0 0 3px rgba(223,73,54,.12)}.mail-visual-editor:empty:before{content:attr(data-placeholder);color:#91a1ad}.mail-visual-editor h1,.mail-visual-editor h2,.mail-visual-editor h3{margin:0 0 14px;line-height:1.25}.mail-visual-editor p{margin:0 0 14px}.mail-visual-editor ul{margin:0 0 14px;padding-left:24px}.mail-columns{align-items:start}.mail-template-card{align-items:center}.mail-template-card>div:first-child{min-width:0}.mail-template-card h4,.mail-template-card p{overflow-wrap:anywhere}.mail-history-list .empty{min-height:78px;display:grid;place-items:center}

/* Espaciado uniforme de plantillas e historial */
#view-correos .section-head{margin-bottom:18px}#view-correos .mail-columns{grid-template-columns:minmax(420px,42%) minmax(520px,58%);gap:16px}#view-correos .mail-panel{padding:20px;border-radius:16px}#view-correos .mail-panel>h3{margin:0 0 18px;padding:0;font-size:20px;line-height:1.2}#view-correos .mail-template-list{gap:10px}#view-correos .mail-template-card{padding:16px;gap:18px;min-height:96px}#view-correos .mail-template-card>div:first-child{display:grid;gap:5px;align-content:center}#view-correos .mail-template-card .badge-status{justify-self:start;margin:0 0 2px}#view-correos .mail-template-card h4,#view-correos .mail-template-card p,#view-correos .mail-template-card small{margin:0;line-height:1.35}#view-correos .mail-template-card>div:last-child{flex:0 0 auto;gap:8px}#view-correos .mail-history-list>.empty{margin:0;min-height:96px;padding:16px;border-radius:12px}#view-correos .mail-table th,#view-correos .mail-table td{padding:12px 10px}
@media(max-width:1100px){#view-correos .mail-columns{grid-template-columns:1fr}#view-correos .mail-template-card{min-height:0}}@media(max-width:600px){#view-correos .mail-panel{padding:16px}#view-correos .mail-template-card{padding:14px;gap:12px}#view-correos .mail-template-card>div:last-child{width:100%}}

#view-correos .mail-columns{margin:0 30px 30px;grid-template-columns:minmax(420px,2fr) minmax(520px,3fr)}
@media(max-width:1100px){#view-correos .mail-columns{grid-template-columns:1fr}}
@media(max-width:720px){#view-correos .mail-columns{margin:0 16px 90px}}

.monitor-station{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:10px;margin:14px 0;padding:13px;border:1px solid #dce7ed;border-left:4px solid #9aabb6;border-radius:11px;background:#f6f9fb}.monitor-station.online{border-left-color:#2db875;background:#f0fbf6}.monitor-station>div{display:grid;gap:4px;min-width:0}.monitor-station small{font-size:9px;font-weight:800;letter-spacing:.09em;color:#7b8e9b}.monitor-station b{font-size:12px;color:#183247;overflow-wrap:anywhere}.monitor-station.online>div:first-child b{color:#198657}.monitor-screen-head .badge-status.inactive{background:#edf1f4;color:#687d8b}.monitor-update{display:flex;justify-content:flex-end;color:#788c99;font-size:11px;margin-top:14px}
@media(max-width:720px){.monitor-station{grid-template-columns:1fr}.monitor-update{padding-bottom:70px}}

#view-monitor .monitor-screen-grid{grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:18px}#view-monitor .monitor-screen-card{padding:22px;border-radius:16px;min-height:310px}#view-monitor .monitor-screen-head{margin-bottom:18px}#view-monitor .monitor-screen-head b{font-size:17px}#view-monitor .monitor-screen-metrics{gap:12px}#view-monitor .monitor-screen-metrics span{padding:13px 14px;font-size:14px}#view-monitor .monitor-station{gap:18px;margin:18px 0;padding:17px 18px}#view-monitor .monitor-station small{font-size:10px}#view-monitor .monitor-station b{font-size:13px;line-height:1.35}#view-monitor .monitor-screen-normal,#view-monitor .monitor-screen-message{padding:13px;font-size:12px}
@media(max-width:620px){#view-monitor .monitor-screen-grid{grid-template-columns:1fr}#view-monitor .monitor-screen-card{min-height:0;padding:17px}}
