:root{--dw-purple:#6f36e8;--dw-purple2:#8b4cff;--dw-bg:#f4f1ff;--dw-dark:#1f2530;--dw-border:#ded5fa;--dw-green:#179c69;--dw-red:#e53e55;--dw-orange:#f5a623}
*{box-sizing:border-box}body{margin:0;background:var(--dw-bg);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#202739}.cc-layout{display:grid;grid-template-columns:250px 1fr;min-height:100vh}.cc-sidebar{background:#1f2429;color:white;padding:18px 14px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.cc-brand{display:flex;gap:11px;align-items:center;padding:5px 8px 22px}.cc-brand strong{display:block;font-size:15px}.cc-brand small{display:block;color:#aeb5c0;font-size:11px}.cc-logo{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;flex:0 0 42px;overflow:hidden}.cc-logo img{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;display:block;object-fit:contain;border-radius:50%}.cc-nav{display:flex;flex-direction:column;gap:5px}.cc-nav a{color:#dce1e8;text-decoration:none;border-radius:10px;padding:10px 11px;display:flex;gap:10px;align-items:center;font-size:13px}.cc-nav a:hover,.cc-nav a.active{background:linear-gradient(90deg,rgba(111,54,232,.35),rgba(111,54,232,.09));color:white}.cc-nav i{width:18px}.cc-sidebar-footer{margin-top:auto;padding:14px 9px;border-top:1px solid #343b43;display:flex;flex-direction:column;gap:3px}.cc-sidebar-footer small{color:#aeb5c0}.cc-sidebar-footer a{color:#ffc8d1;text-decoration:none;margin-top:10px;font-size:13px}.cc-main{min-width:0}.cc-topbar{min-height:87px;background:linear-gradient(90deg,#6f36e8,#8645f4);color:white;display:flex;justify-content:space-between;align-items:center;padding:18px 28px;position:sticky;top:0;z-index:10;box-shadow:0 2px 12px rgba(56,31,100,.15)}.cc-topbar h1{font-size:23px;margin:2px 0 0}.cc-kicker{font-size:10px;font-weight:800;letter-spacing:1.2px;opacity:.78}.cc-env{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);border-radius:10px;padding:8px 11px;font-size:12px}.cc-content{padding:24px 28px;max-width:1600px}.metric-card,.panel-card{background:white;border:1px solid var(--dw-border);border-radius:16px;box-shadow:0 6px 20px rgba(68,46,117,.055)}.metric-card{padding:18px}.metric-label{font-size:11px;color:#727b8f;text-transform:uppercase;font-weight:800;letter-spacing:.5px}.metric-value{font-size:27px;font-weight:800;margin-top:6px}.metric-sub{font-size:11px;color:#838ca0}.metric-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#eee8ff;color:var(--dw-purple);font-size:20px}.panel-card .card-header{background:transparent;border:0;padding:18px 20px 8px}.panel-card .card-body{padding:14px 20px 20px}.table-modern{font-size:12px}.table-modern thead th{font-size:10px;text-transform:uppercase;color:#6f7789;background:#f8f6ff;border-bottom:1px solid var(--dw-border)}.table-modern td,.table-modern th{vertical-align:middle;padding:10px 9px}.badge-status{font-size:10px;border-radius:999px;padding:5px 9px}.btn-dw{background:var(--dw-purple);color:white;border:0}.btn-dw:hover{background:#5d29d4;color:white}.btn-soft{background:#f1edff;color:#6030c9;border:1px solid #dbd1ff}.plan-tile{border:1px solid var(--dw-border);border-radius:14px;padding:16px;background:#fff;height:100%}.plan-price{font-size:24px;font-weight:800}.plan-features{font-size:12px;color:#646c80;line-height:1.7}.mini-note{font-size:11px;color:#7b8496}.usage-bar{height:7px;background:#eeeaf9;border-radius:999px;overflow:hidden}.usage-bar>span{display:block;height:100%;background:linear-gradient(90deg,var(--dw-purple),#a052ff)}.section-title{font-size:16px;font-weight:800}.filter-bar{display:flex;gap:8px;flex-wrap:wrap}.filter-bar>*{min-width:150px}.action-box{border:1px dashed #cfc2f5;background:#faf8ff;border-radius:14px;padding:14px}.form-label{font-size:11px;font-weight:700;color:#616a7d}.form-control,.form-select{border-color:#d9d0f4}.login-body{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 20% 10%,#8e55ff 0,#6f36e8 30%,#151927 100%)}.login-card{width:min(430px,92vw);background:white;border-radius:20px;padding:28px;box-shadow:0 24px 70px rgba(0,0,0,.25)}.login-mark{width:68px;height:68px;border-radius:50%;display:grid;place-items:center;margin-bottom:20px}.login-mark img{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;display:block;object-fit:contain;border-radius:50%;filter:drop-shadow(0 8px 16px rgba(35,22,68,.18))}.empty-state{padding:36px;text-align:center;color:#7d8697}.mp-state{display:flex;align-items:center;gap:12px;padding:16px;border-radius:14px;background:#fff8e7;border:1px solid #f1d28a}.code-pill{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;background:#f2effa;border-radius:7px;padding:3px 6px}.audit-json{max-width:520px;white-space:pre-wrap;font-size:10px;color:#626b7f}.sticky-actions{position:sticky;bottom:0;background:rgba(244,241,255,.95);backdrop-filter:blur(10px);padding:12px 0}
.cc-mobile-account{display:none}
@media(max-width:900px){.cc-layout{grid-template-columns:minmax(0,1fr)}.cc-sidebar{position:relative;top:auto;height:auto;min-height:0;padding:12px 12px 10px}.cc-brand{padding:2px 4px 12px}.cc-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.cc-nav a{min-width:0;padding:9px 8px;font-size:12px}.cc-sidebar-footer{display:none}.cc-topbar{position:relative;min-height:72px;padding:14px 16px}.cc-topbar h1{font-size:20px}.cc-content{padding:14px 12px}.cc-env{display:none}.metric-card{padding:14px}.metric-value{font-size:23px}.panel-card .card-header{padding:15px 15px 7px}.panel-card .card-body{padding:12px 15px 16px}.table-modern{font-size:11px}.cc-mobile-account{display:block;margin:4px 12px 18px;padding:14px;border-radius:14px;background:#1f2429;color:#fff;border:1px solid #343b43}.cc-mobile-account .cc-mobile-session{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}.cc-mobile-account .cc-mobile-session .label{font-size:11px;color:#8f98a5}.cc-mobile-account .cc-mobile-session strong{font-size:14px}.cc-mobile-account .cc-mobile-session small{color:#aeb5c0;font-size:11px;word-break:break-word}.cc-mobile-account .cc-mobile-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.cc-mobile-account a{display:flex;justify-content:center;align-items:center;gap:7px;text-decoration:none;padding:10px 11px;border-radius:10px;background:#2a3036;color:#e8e2ff;border:1px solid #3a4149;font-size:13px}.cc-mobile-account a.cc-mobile-logout{background:#3a252b;color:#ffd4da;border-color:#56323a}}
@media(max-width:480px){.cc-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.cc-brand strong{font-size:14px}.cc-brand small{font-size:10px}.cc-logo{width:38px;height:38px;flex-basis:38px}.cc-content{padding:12px 10px}.metric-card{min-height:112px}.metric-icon{width:36px;height:36px;font-size:17px}}

.cc-session-info{display:flex;flex-direction:column;gap:3px}.cc-session-actions{display:flex;flex-direction:column;gap:6px;margin-top:8px}.cc-session-actions a{color:#ffc8d1;text-decoration:none;font-size:13px}.cc-session-actions .profile-link{color:#d8ccff}.cc-sidebar-footer .profile-link{color:#d8ccff}
.password-wrap{position:relative}.password-wrap .form-control{padding-right:46px}.password-eye{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:#667085;padding:6px 8px}
.company-actions{display:flex;gap:8px;flex-wrap:wrap}

/* ===== V2.4: sidebar plegable escritorio + hamburguesa móvil ===== */
.cc-brand-row{display:flex;align-items:flex-start;gap:8px;position:relative}
.cc-brand-row .cc-brand{flex:1;min-width:0}
.cc-sidebar-toggle{margin:7px 3px 0 0;width:34px;height:34px;flex:0 0 34px;border:1px solid #3b424b;background:#252b31;color:#f4f6f8;border-radius:9px;display:grid;place-items:center;cursor:pointer;transition:.18s ease;font-size:18px;line-height:1}
.cc-sidebar-toggle:hover{background:#30373f;border-color:#505964}
.cc-sidebar-toggle:focus-visible{outline:2px solid #9b74ff;outline-offset:2px}
.cc-nav-label,.cc-brand-text,.cc-session-info,.cc-session-actions span{transition:opacity .14s ease}
.cc-layout,.cc-sidebar,.cc-main{transition:grid-template-columns .2s ease,width .2s ease}

@media(min-width:901px){
  .cc-layout.cc-sidebar-collapsed{grid-template-columns:76px 1fr}
  .cc-layout.cc-sidebar-collapsed .cc-sidebar{padding-left:10px;padding-right:10px}
  .cc-layout.cc-sidebar-collapsed .cc-brand-row{display:block}
  .cc-layout.cc-sidebar-collapsed .cc-brand{justify-content:center;padding:5px 0 12px}
  .cc-layout.cc-sidebar-collapsed .cc-brand-text{display:none}
  .cc-layout.cc-sidebar-collapsed .cc-logo{width:38px;height:38px;flex-basis:38px}
  .cc-layout.cc-sidebar-collapsed .cc-sidebar-toggle{margin:0 auto 12px;width:38px}
  .cc-layout.cc-sidebar-collapsed .cc-nav a{justify-content:center;padding:11px 8px;gap:0;position:relative}
  .cc-layout.cc-sidebar-collapsed .cc-nav i{width:auto;font-size:17px}
  .cc-layout.cc-sidebar-collapsed .cc-nav-label{display:none}
  .cc-layout.cc-sidebar-collapsed .cc-nav a::after{content:attr(title);position:absolute;left:calc(100% + 9px);top:50%;transform:translateY(-50%);background:#15191d;color:#fff;padding:6px 8px;border-radius:7px;font-size:11px;white-space:nowrap;opacity:0;pointer-events:none;transition:.12s ease;box-shadow:0 5px 18px rgba(0,0,0,.22);z-index:50}
  .cc-layout.cc-sidebar-collapsed .cc-nav a:hover::after{opacity:1}
  .cc-layout.cc-sidebar-collapsed .cc-sidebar-footer{padding:12px 0;align-items:center}
  .cc-layout.cc-sidebar-collapsed .cc-session-info{display:none}
  .cc-layout.cc-sidebar-collapsed .cc-session-actions{margin-top:0;gap:8px;width:100%;align-items:center}
  .cc-layout.cc-sidebar-collapsed .cc-session-actions a{width:40px;height:38px;margin-top:0;border-radius:9px;display:flex;align-items:center;justify-content:center;background:#272d33;border:1px solid #343b43;font-size:16px}
  .cc-layout.cc-sidebar-collapsed .cc-session-actions span{display:none}
}

@media(max-width:900px){
  .cc-brand-row{align-items:center}
  .cc-brand-row .cc-brand{padding-bottom:2px}
  .cc-sidebar-toggle{display:grid;margin:0 2px 0 auto}
  .cc-nav{display:none!important;margin-top:10px}
  .cc-layout.cc-mobile-menu-open .cc-nav{display:grid!important}
  .cc-layout:not(.cc-mobile-menu-open) .cc-sidebar{padding-bottom:12px}
  .cc-layout:not(.cc-mobile-menu-open) .cc-brand{padding-bottom:2px}
}
