:root{--blue:#2d8cff;--sidebar:#f7f8fb;--text:#2d3436;--muted:#8b95a1;--card:#fff;--bg:#f1f2f5}*{box-sizing:border-box}body{background:var(--bg);font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--text)}.app{display:flex;min-height:100vh}.sidebar{width:230px;background:#fff;border-right:1px solid #e9edf3;position:fixed;top:0;bottom:0;left:0;padding:18px 14px}.brand{display:flex;align-items:center;gap:9px;font-weight:700;margin-bottom:24px}.brand-badge{width:24px;height:24px;border-radius:8px;background:linear-gradient(135deg,#ffb020,#ff6b35)}.nav-link{color:#7c8794;border-radius:9px;padding:11px 13px;margin-bottom:4px;font-size:14px}.nav-link.active,.nav-link:hover{background:#eef6ff;color:var(--blue)}.main{margin-left:230px;width:calc(100% - 230px)}.topbar{height:64px;background:#fff;border-bottom:1px solid #e9edf3;display:flex;align-items:center;justify-content:space-between;padding:0 24px}.content{padding:28px}.stat-card{background:#fff;border:0;border-radius:3px;padding:22px;min-height:112px;box-shadow:0 1px 2px rgba(0,0,0,.03)}.stat-card .label{font-size:12px;color:#7d8792}.stat-card .value{font-size:26px;font-weight:700;margin-top:12px}.stat-card .trend{font-size:12px;margin-top:6px}.trend.good{color:#12b886}.trend.bad{color:#ff6b35}.blue-panel{background:var(--blue);color:white;border-radius:3px;padding:28px;margin:24px 0}.blue-panel .metric{border-right:1px solid rgba(255,255,255,.2)}.blue-panel .metric:last-child{border-right:0}.panel-card{background:#fff;border-radius:3px;padding:24px;box-shadow:0 1px 2px rgba(0,0,0,.03)}.btn-orange{background:#ffa53a;color:#fff;border:0}.btn-orange:hover{background:#f09322;color:#fff}.table{font-size:14px}.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#f1f2f5}.login-card{width:100%;max-width:420px;background:#fff;padding:30px;border-radius:6px;box-shadow:0 10px 25px rgba(0,0,0,.06)}@media(max-width:768px){.sidebar{position:relative;width:100%;height:auto}.app{display:block}.main{margin-left:0;width:100%}.topbar{padding:0 14px}.content{padding:16px}.blue-panel .metric{border-right:0;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:16px;margin-bottom:16px}}
/* v1.6 experiencia */
.top-actions{flex-wrap:wrap}.fab-quick{position:fixed;right:22px;bottom:22px;width:58px;height:58px;border-radius:50%;background:#ffa53a;color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 12px 24px rgba(0,0,0,.22);z-index:1050;text-decoration:none}.fab-quick:hover{color:#fff;background:#f09322}.template-card{border:1px solid #edf0f4;border-radius:10px;padding:12px;margin-bottom:10px;background:#fbfcfe}.mobile-filter{position:sticky;top:0;z-index:10;background:var(--bg);padding-top:8px}.quick-chip{display:inline-flex;gap:6px;align-items:center;border:1px solid #e9edf3;border-radius:999px;padding:6px 10px;background:#fff;font-size:13px;margin:3px}.metric-mini{background:#f8fafc;border:1px solid #edf0f4;border-radius:12px;padding:12px}.modal-content{border:0;border-radius:16px}.form-control-lg{font-size:28px;font-weight:700}
@media(max-width:768px){.topbar{height:auto;min-height:64px;align-items:flex-start;gap:10px;flex-direction:column;padding:12px 14px}.top-actions{width:100%;display:grid!important;grid-template-columns:1fr 1fr}.top-actions .btn{width:100%;font-size:12px}.content h3{font-size:22px}.stat-card{min-height:auto;padding:16px;border-radius:12px}.panel-card{padding:16px;border-radius:12px}.sidebar .nav{display:grid;grid-template-columns:1fr 1fr;gap:2px}.sidebar{padding:12px}.nav-link{font-size:13px;padding:9px}.brand{margin-bottom:10px}.table{font-size:13px}.fab-quick{right:16px;bottom:16px}}

/* v1.7 PWA / mobile app */
.pwa-install-banner{display:none;position:fixed;left:16px;right:16px;bottom:18px;z-index:1050;background:#111827;color:#fff;border-radius:18px;padding:14px 16px;box-shadow:0 18px 45px rgba(15,23,42,.25);align-items:center;justify-content:space-between;gap:12px}
.pwa-install-banner.show{display:flex}
.pwa-install-banner .title{font-weight:700;font-size:.95rem}.pwa-install-banner .sub{font-size:.78rem;opacity:.78}.pwa-install-banner .btn{white-space:nowrap;border-radius:999px}
.pwa-status-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:#eef2ff;color:#3730a3;font-size:.78rem;font-weight:600}.pwa-status-pill.offline{background:#fff7ed;color:#c2410c}.pwa-status-pill.online{background:#ecfdf5;color:#047857}
@media (max-width: 768px){
  body{background:#f7f8fb}.app{display:block}.sidebar{position:sticky;top:0;width:100%;height:auto;z-index:100;background:#fff;border-right:0;border-bottom:1px solid #eef0f5;overflow-x:auto;white-space:nowrap;padding:10px 8px}.sidebar .brand{display:inline-flex;margin-right:8px}.sidebar nav{display:inline-flex;flex-direction:row!important;gap:3px}.sidebar .nav-link{display:inline-flex;align-items:center;padding:9px 10px;border-radius:12px;font-size:.85rem}.sidebar .nav-link i{margin-right:5px!important}.main{width:100%;margin:0}.topbar{position:sticky;top:58px;z-index:99;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);padding:12px 14px;border-bottom:1px solid #eef0f5}.top-actions{width:100%;overflow-x:auto;padding-bottom:2px}.top-actions .btn{white-space:nowrap}.content{padding:16px 12px 92px}.stat-card,.panel-card{border-radius:18px}.fab-quick{bottom:22px;right:18px;width:60px;height:60px;font-size:1.15rem;box-shadow:0 16px 35px rgba(37,99,235,.35)}.table-responsive{border-radius:14px}.form-control,.form-select,.btn{min-height:42px}.modal-dialog{margin:10px}.modal-content{border-radius:20px}.pwa-install-banner{bottom:82px}}
@media (display-mode: standalone){.pwa-install-banner{display:none!important}.topbar{padding-top:max(12px, env(safe-area-inset-top))}}
.avatar-sm{width:38px;height:38px;border-radius:50%;object-fit:cover;border:2px solid rgba(37,99,235,.18)}
.avatar-initial{display:inline-flex;align-items:center;justify-content:center;background:#2563eb;color:#fff;font-weight:800}
.scope-pill{display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .7rem;border-radius:999px;background:#f1f5f9;color:#334155;font-size:.85rem;text-decoration:none}
.scope-pill.active{background:#2563eb;color:#fff}
.member-card{border:1px solid #e5e7eb;border-radius:18px;padding:16px;background:#fff;box-shadow:0 10px 24px rgba(15,23,42,.05)}
.balance-positive{color:#16a34a;font-weight:800}.balance-negative{color:#dc2626;font-weight:800}

/* v1.7.3 mobile menu dropdown */
.mobile-menu-select-wrap{display:none}
.mobile-menu-label{font-size:.78rem;font-weight:700;color:#64748b;margin-bottom:6px;display:block}
.mobile-menu-select{border-radius:14px;border:1px solid #dbe3ef;min-height:46px;font-weight:700;background-color:#fff;box-shadow:0 8px 20px rgba(15,23,42,.05)}
@media(max-width:768px){
  .sidebar{position:sticky;top:0;width:100%;z-index:120;padding:12px 14px;background:#fff;border-bottom:1px solid #edf0f4;box-shadow:0 8px 18px rgba(15,23,42,.04)}
  .sidebar .brand{margin-bottom:10px;display:flex!important;white-space:normal}
  .mobile-menu-select-wrap{display:block}
  .desktop-sidebar-nav{display:none!important}
  .main{margin-left:0;width:100%}
  .topbar{top:92px;position:sticky;z-index:110}
  .top-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important;width:100%;overflow:visible}
  .top-actions .btn{border-radius:10px;min-height:42px;display:flex;align-items:center;justify-content:center}
  .top-actions .btn:nth-child(5){grid-column:1 / span 2}
}
@media(max-width:420px){
  .top-actions{grid-template-columns:1fr!important}
  .top-actions .btn:nth-child(5){grid-column:auto}
}


/* v1.7.3.1 Mobile PRO: desktop normal, mobile dropdown */
@media (min-width: 769px){
  .mobile-menu-select-wrap,
  #ccMobileMenuWrap{
    display:none!important;
    visibility:hidden!important;
    height:0!important;
    overflow:hidden!important;
    margin:0!important;
    padding:0!important;
  }
  .desktop-sidebar-nav{
    display:flex!important;
  }
  .sidebar{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:0!important;
    width:230px!important;
    height:auto!important;
    overflow-y:auto!important;
    padding:18px 14px!important;
    border-right:1px solid #e9edf3!important;
    border-bottom:0!important;
    box-shadow:none!important;
  }
  .sidebar .brand{
    margin-bottom:24px!important;
  }
  .main{
    margin-left:230px!important;
    width:calc(100% - 230px)!important;
  }
  .topbar{
    top:0!important;
    position:relative!important;
  }
}

@media (max-width: 768px){
  body{font-size:15px;}
  .app{display:block!important;}
  .sidebar{
    position:sticky!important;
    top:0!important;
    width:100%!important;
    height:auto!important;
    padding:12px 14px!important;
    z-index:1200!important;
    border-right:0!important;
    border-bottom:1px solid #edf0f4!important;
    box-shadow:0 8px 20px rgba(15,23,42,.06)!important;
  }
  .sidebar .brand{
    display:flex!important;
    margin-bottom:10px!important;
  }
  .mobile-menu-select-wrap,
  #ccMobileMenuWrap{
    display:block!important;
    visibility:visible!important;
    height:auto!important;
    overflow:visible!important;
  }
  .desktop-sidebar-nav{
    display:none!important;
  }
  .main{
    margin-left:0!important;
    width:100%!important;
  }
  .topbar{
    position:sticky!important;
    top:92px!important;
    z-index:1100!important;
    height:auto!important;
    min-height:auto!important;
    padding:12px 14px!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:10px!important;
  }
  .topbar > .d-flex:first-child{
    width:100%;
  }
  .top-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    width:100%!important;
    overflow:visible!important;
  }
  .top-actions .btn{
    width:100%!important;
    min-height:44px!important;
    border-radius:12px!important;
    font-size:14px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .top-actions .btn:nth-child(5){grid-column:1 / span 2;}
  .content{padding:18px 14px 96px!important;}
  .content .row{--bs-gutter-y: .85rem;}
  .stat-card,.panel-card,.blue-panel{border-radius:18px!important;}
  .table-responsive{border-radius:16px;background:#fff;}
  .fab-quick{bottom:18px!important;right:18px!important;}
}

@media (max-width: 420px){
  .top-actions{grid-template-columns:1fr!important;}
  .top-actions .btn:nth-child(5){grid-column:auto!important;}
}


/* v1.7.3.2 FIX: el selector/dropdown de menú SOLO debe verse en móvil */
.mobile-menu-select-wrap,
#ccMobileMenuWrap {
  display: none !important;
}
.desktop-sidebar-nav {
  display: flex !important;
}

@media (max-width: 767.98px) {
  .mobile-menu-select-wrap,
  #ccMobileMenuWrap {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
  }
  .desktop-sidebar-nav {
    display: none !important;
  }
}

@media (min-width: 768px) {
  .mobile-menu-select-wrap,
  #ccMobileMenuWrap,
  .mobile-menu-label,
  .mobile-menu-select {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }
  .desktop-sidebar-nav {
    display: flex !important;
  }
}
