.mp-features-carousel {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 15px;
    padding-bottom: 10px;
}
.mp-features-carousel::-webkit-scrollbar {
    height: 6px;
}
.mp-features-carousel::-webkit-scrollbar-thumb {
    background: var(--border2);
    border-radius: 4px;
}
.mp-features-carousel > li {
    scroll-snap-align: start;
    flex: 0 0 85%;
    list-style: none;
    background: var(--bg2);
    padding: 15px;
    border-radius: 12px;
    border: 1px solid var(--border2);
}



.carousel-wrapper {
    position: relative;
    width: 100%;
}
.carousel-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: var(--color-purple-primary);
    color: white;
    border: none;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    font-size: 18px;
    cursor: pointer;
    z-index: 10;
}
.carousel-btn.prev { left: -10px; }
.carousel-btn.next { right: -10px; }
@media(max-width: 768px) {
    .mp-features {
        display: flex !important;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        flex-wrap: nowrap !important;
        scroll-behavior: smooth;
    }
    .mp-features::-webkit-scrollbar { display: none; }
    .mp-features > li {
        min-width: 100%;
        scroll-snap-align: center;
        flex: 0 0 100%;
    }
}



  html, body {
    width: 100%; height: 100%; margin: 0; padding: 0;
    overflow: hidden !important; /* Block all scrolling on root */
    background-color: var(--bg);
  }
  #app-wrapper, #lock-screen, .screen {
    width: 100%; height: 100%;
    overflow: hidden !important;
    position: absolute; top: 0; left: 0;
  }
  
  /* Permite scroll vertical nos conteudos principais */
  .dash-main, .crm-content, .view-body, .scrollable-y {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
  }

  /* Planilha é a unica com scroll horizontal */
  .ag-table-wrapper, .planilha-container {
    overflow-x: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  
  /* Bloquear scroll horizontal absoluto em tudo o resto */
  * {
    max-width: 100vw;
  }
  .ag-table-wrapper *, .planilha-container * {
    max-width: none; /* allow spreadsheet cells to exceed 100vw */
  }



      .mp-carousel-btn { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--mp-border, #ddd); background: var(--mp-surface, #fff); color: var(--mp-text, #333); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s; }
      .mp-carousel-btn:hover { background: var(--mp-primary, #6b21a8); color: #fff; border-color: var(--mp-primary, #6b21a8); }
      #cap-carousel { display: flex !important; overflow-x: auto !important; scroll-behavior: smooth !important; scroll-snap-type: x mandatory !important; gap: 20px !important; padding-bottom: 10px !important; scrollbar-width: none !important; -webkit-overflow-scrolling: touch !important; flex-wrap: nowrap !important; }
      #cap-carousel::-webkit-scrollbar { display: none !important; }
      #cap-carousel .mp-card { scroll-snap-align: center !important; flex: 0 0 auto !important; margin: 0 !important; }
      @media(max-width: 820px) {
        #cap-carousel .mp-card { min-width: 85vw !important; max-width: 85vw !important; margin: 0 auto !important; }
      }
      @media(min-width: 821px) {
        #cap-carousel .mp-card { min-width: calc(33.333% - 14px) !important; }
      }
    


    /* ============ DASHBOARD — Merk · bento redesign ============ */
    #dash-view{
      padding:28px 22px 140px;
      color:#e7e3f4;
      font-family:'Jost',system-ui,sans-serif;
      height:100%;max-height:100vh;
      overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;
      background:
        radial-gradient(900px 500px at 85% -10%, rgba(124,58,237,.10), transparent 60%),
        radial-gradient(700px 420px at -10% 110%, rgba(167,139,250,.08), transparent 60%),
        #0a0a0f;
    }
    #dash-view *{box-sizing:border-box}
    #dash-view::-webkit-scrollbar{width:6px}
    #dash-view::-webkit-scrollbar-thumb{background:rgba(124,58,237,.25);border-radius:99px}

    /* ----- HEAD ----- */
    .mdash-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}
    .mdash-titles h1{margin:0;font-size:30px;font-weight:300;letter-spacing:-.8px;color:#fff;line-height:1.05}
    .mdash-titles p{margin:6px 0 0;font-size:12px;color:#9b96b8;font-weight:300;letter-spacing:.2px}
    .mdash-pct-btn{
      width:40px;height:40px;border-radius:999px;
      border:1px solid rgba(255,255,255,.08);
      background:rgba(255,255,255,.02);color:#c4b5fd;
      font-size:14px;font-weight:500;cursor:pointer;
      display:grid;place-items:center;transition:.25s;
      font-family:'JetBrains Mono',monospace;flex-shrink:0;
    }
    .mdash-pct-btn:hover{border-color:#7c3aed;color:#fff;box-shadow:0 0 0 4px rgba(124,58,237,.12)}
    .mdash-pct-btn.on{background:linear-gradient(135deg,#7c3aed,#a78bfa);color:#fff;border-color:transparent;box-shadow:0 6px 22px -8px rgba(124,58,237,.7)}

    /* ----- PERIOD PILL TABS ----- */
    .mdash-period{
      display:inline-flex;gap:4px;margin-bottom:26px;
      padding:5px;border-radius:999px;
      background:rgba(255,255,255,.03);
      border:1px solid rgba(255,255,255,.05);
      position:relative;width:100%;max-width:420px;
    }
    .mdash-period-btn{
      flex:1;padding:10px 14px;font-size:12.5px;font-weight:400;letter-spacing:.3px;
      border:0;background:transparent;color:#6b6388;cursor:pointer;
      transition:color .25s;position:relative;z-index:2;
      font-family:inherit;border-radius:999px;
    }
    .mdash-period-btn:hover{color:#e9e4ff}
    .mdash-period-btn.active{color:#fff}
    .mdash-period-slider{
      position:absolute;top:5px;bottom:5px;height:auto;
      background:linear-gradient(135deg,#7c3aed,#5b21b6);
      border-radius:999px;z-index:1;
      transition:left .35s cubic-bezier(.65,.05,.36,1),width .35s cubic-bezier(.65,.05,.36,1);
      box-shadow:0 4px 14px -4px rgba(124,58,237,.55);
    }

    /* ----- BENTO GRID ----- */
    .mdash-bento{
      display:grid;
      grid-template-columns:1.7fr 1fr;
      grid-auto-rows:auto;
      gap:18px;margin-bottom:18px;
      animation:mdashFade .45s ease both;
    }
    @keyframes mdashFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

    .mdash-sec-head{display:flex;align-items:center;gap:10px;margin-bottom:18px}
    .mdash-sec-head h2{margin:0;font-size:10.5px;font-weight:500;letter-spacing:2.2px;color:#9b96b8;text-transform:uppercase}
    .mdash-sec-head .mdash-sec-sub{margin-left:auto;font-size:10.5px;color:#6b6388;letter-spacing:.8px;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.05)}

    /* ----- CARDS (sidebar of bento) ----- */
    .mdash-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
    .mdash-card{
      position:relative;overflow:hidden;
      background:linear-gradient(160deg,#16121f 0%,#100d18 100%);
      padding:14px 14px 16px;border-radius:14px;
      border:1px solid rgba(255,255,255,.05);
      transition:transform .25s, box-shadow .25s, border-color .25s;
      box-shadow:0 4px 14px rgba(0,0,0,.25);
    }
    .mdash-card::after{
      content:'';position:absolute;inset:0;border-radius:14px;pointer-events:none;
      background:radial-gradient(120px 80px at 100% 0%, var(--c) 0%, transparent 70%);
      opacity:.10;transition:opacity .25s;
    }
    .mdash-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.10);box-shadow:0 10px 28px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.02)}
    .mdash-card:hover::after{opacity:.22}
    .mdash-card:hover .mdash-card-val{text-shadow:0 0 14px var(--c)}
    .mdash-card-label{font-size:9.5px;font-weight:500;letter-spacing:1.4px;text-transform:uppercase;color:#9b96b8;margin-bottom:10px;display:flex;align-items:center;gap:7px}
    .mdash-card-label::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--c,#7c3aed);box-shadow:0 0 8px var(--c,#7c3aed)}
    .mdash-card-val{font-size:28px;font-weight:300;color:#fff;letter-spacing:-1px;font-family:'JetBrains Mono',monospace;line-height:1;transition:text-shadow .25s}
    .mdash-card-sub{margin-top:6px;font-size:10.5px;color:#6b6388;letter-spacing:.3px}

    /* ----- CHART BOX (hero of bento) ----- */
    .mdash-chart-box{
      position:relative;overflow:hidden;
      background:linear-gradient(160deg,#16121f 0%,#0f0c18 100%);
      padding:24px;border-radius:18px;
      border:1px solid rgba(255,255,255,.05);
      box-shadow:0 8px 28px rgba(0,0,0,.30);
      min-height:340px;display:flex;flex-direction:column;
    }
    .mdash-chart-box::before{
      content:'';position:absolute;inset:0;pointer-events:none;
      background:radial-gradient(400px 200px at 100% 0%, rgba(124,58,237,.12), transparent 60%);
    }
    .mdash-chart-wrap{position:relative;padding:6px 0 0;flex:1;min-height:260px}
    .mdash-chart-wrap canvas{max-height:100%}
    .mdash-empty{padding:36px 18px;text-align:center;color:#6b6388;font-size:12.5px;font-weight:300;letter-spacing:.4px}

    /* ----- RECENTS TABLE ----- */
    .mdash-recents{
      grid-column:1 / -1;
      background:linear-gradient(160deg,#16121f 0%,#0f0c18 100%);
      padding:24px;border-radius:18px;
      border:1px solid rgba(255,255,255,.05);
      box-shadow:0 8px 28px rgba(0,0,0,.30);
    }
    .mdash-rec-row{
      display:flex;align-items:center;gap:14px;
      padding:14px 12px;border-radius:12px;
      transition:background .2s;
    }
    .mdash-rec-row + .mdash-rec-row{border-top:1px solid rgba(255,255,255,.04)}
    .mdash-rec-row:hover{background:rgba(255,255,255,.025)}
    .mdash-rec-avatar{
      width:38px;height:38px;border-radius:50%;
      background:linear-gradient(135deg, color-mix(in srgb, var(--c) 20%, #1a1626), #1a1626);
      display:grid;place-items:center;
      font-size:14px;font-weight:600;color:var(--c);
      border:1px solid rgba(255,255,255,.06);flex-shrink:0;
    }
    .mdash-rec-info{flex:1;min-width:0}
    .mdash-rec-name{font-size:14px;font-weight:400;color:#e7e3f4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .mdash-rec-time{font-size:11px;color:#6b6388;margin-top:3px;font-family:'JetBrains Mono',monospace;letter-spacing:.2px}
    .mdash-rec-pill{
      padding:5px 12px;border-radius:999px;font-size:10px;font-weight:500;
      text-transform:uppercase;letter-spacing:1.1px;
      background:var(--bg);color:var(--tc);white-space:nowrap;
      border:1px solid color-mix(in srgb, var(--tc) 20%, transparent);
    }
    .mdash-rec-action .mp-btn-outline{
      padding:6px 14px;font-size:11px;border-radius:999px;
      background:transparent;color:#c4b5fd;
      border:1px solid rgba(255,255,255,.10);
      cursor:pointer;font-family:inherit;transition:.2s;
    }
    .mdash-rec-action .mp-btn-outline:hover{background:#7c3aed;color:#fff;border-color:#7c3aed}

    /* ----- CONVERSION (% SCREEN) ----- */
    .mdash-pct-screen{display:none;animation:mdashFade .4s ease both}
    .mdash-pct-screen.on{display:block}
    .mdash-main-screen{display:block}
    .mdash-main-screen.off{display:none}
    .mdash-pct-block{
      padding:48px 24px 40px;margin-bottom:8px;text-align:center;
      background:linear-gradient(160deg,#16121f 0%,#0f0c18 100%);
      border-radius:18px;border:1px solid rgba(255,255,255,.05);
      box-shadow:0 8px 28px rgba(0,0,0,.30);
    }
    .mdash-pct-block-label{font-size:10.5px;font-weight:500;letter-spacing:2.2px;text-transform:uppercase;color:#9b96b8;margin-bottom:22px}
    .mdash-pct-big{font-size:72px;font-weight:300;letter-spacing:-3px;font-family:'JetBrains Mono',monospace;line-height:1;background:linear-gradient(135deg,#fff 30%,#a78bfa);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
    .mdash-pct-small{margin-top:16px;font-size:11.5px;color:#6b6388;letter-spacing:.4px;font-family:'JetBrains Mono',monospace}
    .mdash-pct-bar{margin:24px auto 0;max-width:320px;height:2px;border-radius:99px;background:rgba(255,255,255,.05);overflow:hidden}
    .mdash-pct-bar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#7c3aed,#a78bfa);transition:width 1s cubic-bezier(.65,.05,.36,1);box-shadow:0 0 12px rgba(167,139,250,.6)}

    /* ----- RESPONSIVE ----- */
    @media(max-width:760px){
      .mdash-bento{grid-template-columns:1fr;gap:14px}
    }
    @media(max-width:520px){
      #dash-view{padding:22px 16px 140px}
      .mdash-titles h1{font-size:24px}
      .mdash-card-val{font-size:22px}
      .mdash-pct-big{font-size:52px}
      .mdash-period-btn{padding:9px 6px;font-size:11.5px}
      .mdash-recents,.mdash-chart-box{padding:16px}
      .mdash-cards{grid-template-columns:1fr 1fr}
    }
   


   .sidebar--v2 {
      display: none; /* Ativado adicionando class 'show-sidebar-v2' ao body */
      position: fixed; top: 0; left: 0; bottom: 0; width: 260px;
      background: rgba(15,12,23,0.95); backdrop-filter: blur(20px);
      border-right: 1px solid rgba(255,255,255,0.05);
      z-index: 100; flex-direction: column; padding: 24px 16px;
      font-family: 'Jost', sans-serif; color: #e7e3f4;
   }
   .sidebar--v2-user { display:flex; align-items:center; gap:12px; margin-bottom:40px; padding:0 8px; }
   .sidebar--v2-avatar { width:40px; height:40px; border-radius:50%; background:#7c3aed; display:grid; place-items:center; font-weight:600; font-size:16px; }
   .sidebar--v2-uname { font-size:14px; font-weight:500; color:#fff; line-height:1.2; }
   .sidebar--v2-urole { font-size:11px; color:#9b96b8; }
   .sidebar--v2-section { font-size:10px; text-transform:uppercase; letter-spacing:2px; color:#6b6388; margin:24px 8px 12px; font-weight:600; }
   .sidebar--v2-nav { display:flex; flex-direction:column; gap:4px; }
   .sidebar--v2-item { display:flex; align-items:center; justify-content:space-between; padding:10px 14px; border-radius:10px; cursor:pointer; color:#9b96b8; font-size:14px; transition:all .2s; }
   .sidebar--v2-item:hover { background:rgba(255,255,255,.03); color:#fff; }
   .sidebar--v2-item.active { background:rgba(124,58,237,.15); color:#c4b5fd; font-weight:500; }
   .sidebar--v2-badge { background:#7c3aed; color:#fff; font-size:10px; font-weight:600; padding:2px 8px; border-radius:99px; }
   .sidebar--v2-promo { margin-top:auto; padding:20px; border-radius:16px; background:linear-gradient(135deg, rgba(124,58,237,.1) 0%, rgba(0,0,0,0) 100%); border:1px solid rgba(124,58,237,.2); text-align:center; }
   .sidebar--v2-promo-icon { width:32px; height:32px; border-radius:8px; background:var(--c,#7c3aed); margin:0 auto 12px; display:grid; place-items:center; font-size:14px; }
   .sidebar--v2-promo h4 { margin:0 0 4px; font-size:13px; font-weight:500; color:#fff; }
   .sidebar--v2-promo p { margin:0; font-size:11px; color:#9b96b8; line-height:1.4; }
   
   /* Para testar a sidebar, adicione a classe 'show-sidebar-v2' ao body via devtools */
   body.show-sidebar-v2 .sidebar--v2 { display: flex; }
   body.show-sidebar-v2 .bottom-nav { display: none !important; }
   @media(min-width: 900px) {
      body.show-sidebar-v2 .screen { margin-left: 260px; max-width: calc(100% - 260px); }
      body.show-sidebar-v2 .app-header { display: none; }
   }