/* ============================================================
   PROFINANCE HUB V55.98 — MOBILE APP SHELL + CENTRAL OPERAÇÕES
   Escopo: telas <= 760px. Desktop permanece inalterado.
   Identidade: mesmos tons, gradientes, cards e ícones do Hub.
   ============================================================ */

.pf-mobile-appbar-v5596,
.pf-mobile-drawer-v5596,
.pf-mobile-backdrop-v5596,
.pf-ops-mobile-view{display:none}

@media (max-width:760px){
  html,body{max-width:100%;overflow-x:hidden}

  /* App bar mobile: substitui apenas o cabeçalho visual no celular. */
  body[data-module="portal"] .topbar .topbar-inner,
  body[data-module="operacoes"] .top .topin{display:none!important}

  .pf-mobile-appbar-v5596{
    display:block;width:100%;padding:12px 14px 13px;
    background:linear-gradient(180deg,rgba(20,13,49,.985),rgba(15,10,36,.985));
    border-bottom:1px solid rgba(255,255,255,.065);backdrop-filter:blur(16px)
  }
  .pf-mobile-appbar-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
  .pf-mobile-appbar-brand{display:flex;align-items:center;gap:11px;min-width:0}
  .pf-mobile-appbar-mark{
    width:44px;height:44px;flex:0 0 44px;border-radius:15px;object-fit:contain;padding:7px;
    background:linear-gradient(145deg,rgba(245,121,42,.96),rgba(155,91,245,.92));
    border:1px solid rgba(255,255,255,.13);box-shadow:0 9px 24px rgba(245,121,42,.18)
  }
  .pf-mobile-appbar-copy{min-width:0}
  .pf-mobile-appbar-kicker{font:800 9px/1.2 JetBrains Mono,monospace;letter-spacing:.15em;text-transform:uppercase;color:#f5792a}
  .pf-mobile-appbar-title{font:700 17px/1.2 Sora,Arial,sans-serif;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}
  .pf-mobile-appbar-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
  .pf-mobile-app-avatar{
    width:44px;height:44px;display:block;border-radius:50%;object-fit:cover;
    border:2px solid #f5792a;box-shadow:0 0 0 3px rgba(245,121,42,.08);background:#2b1d58
  }
  .pf-mobile-appbar-sub{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;min-width:0}
  .pf-mobile-appbar-user{min-width:0}
  .pf-mobile-appbar-user strong{display:block;font-size:11.5px;line-height:1.3;color:var(--text);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pf-mobile-appbar-status{display:block;margin-top:3px;font-size:10px;line-height:1.2;color:#78e3aa;font-weight:700}
  .pf-app-menu-btn{
    min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:0 0 auto;
    padding:0 13px;border:1px solid rgba(255,255,255,.09);border-radius:14px;
    background:rgba(255,255,255,.045);color:var(--text);font-size:11px;font-weight:800;cursor:pointer
  }
  .pf-app-menu-btn svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

  /* Drawer compartilhado pelas telas mobile. */
  .pf-mobile-backdrop-v5596{
    display:block;position:fixed;inset:0;z-index:100;background:rgba(5,3,18,.74);
    opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease
  }
  .pf-mobile-drawer-v5596{
    display:flex;position:fixed;z-index:101;left:0;top:0;bottom:0;width:min(86vw,330px);
    flex-direction:column;padding:16px 14px calc(18px + env(safe-area-inset-bottom));
    background:linear-gradient(165deg,rgba(29,20,65,.998),rgba(13,9,32,.999));
    border-right:1px solid #372b69;box-shadow:26px 0 70px rgba(0,0,0,.44);
    transform:translateX(-104%);transition:transform .2s ease;overflow-y:auto
  }
  .pf-mobile-drawer-v5596.open{transform:translateX(0)}
  .pf-mobile-backdrop-v5596.open{opacity:1;visibility:visible;pointer-events:auto}
  .pf-mobile-drawer-v5596 .pf-mobile-drawer-head{display:flex;align-items:center;gap:11px;padding:2px 2px 15px;border-bottom:1px solid rgba(155,123,255,.14)}
  .pf-mobile-drawer-v5596 .pf-mobile-drawer-brand{display:flex;align-items:center;gap:10px;min-width:0}
  .pf-mobile-drawer-v5596 .pf-mobile-drawer-brand img{width:39px;height:39px;object-fit:contain;border-radius:12px;padding:6px;background:linear-gradient(145deg,#f5792a,#9b5cff)}
  .pf-mobile-drawer-v5596 .pf-mobile-drawer-brand b{display:block;font:800 9px JetBrains Mono;color:#f5792a;letter-spacing:.14em}
  .pf-mobile-drawer-v5596 .pf-mobile-drawer-brand span{display:block;font:700 14px Sora;margin-top:2px;color:#f8f5ff}
  .pf-mobile-drawer-v5596 .pf-mobile-drawer-close{margin-left:auto;width:44px;height:44px;flex:0 0 44px;border-radius:13px;border:1px solid #372b69;background:#241950;color:#f8f5ff;font-size:22px;cursor:pointer}
  .pf-mobile-drawer-v5596 .pf-mobile-nav{display:grid;gap:8px;padding-top:14px}
  .pf-mobile-drawer-v5596 .pf-mobile-nav a,
  .pf-mobile-drawer-v5596 .pf-mobile-nav button{
    min-height:48px;width:100%;display:flex;align-items:center;gap:11px;padding:10px 12px;
    border:1px solid rgba(155,123,255,.17);border-radius:14px;
    background:linear-gradient(155deg,rgba(36,25,80,.88),rgba(17,11,43,.90));
    color:#f8f5ff;text-decoration:none;text-align:left;font-weight:700;font-size:12px;cursor:pointer
  }
  .pf-mobile-drawer-v5596 .pf-mobile-nav svg{width:20px;height:20px;flex:0 0 20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;color:#9b7bff}
  .pf-mobile-drawer-v5596 .pf-mobile-nav .active{border-color:rgba(245,121,42,.28);background:rgba(245,121,42,.09);color:#ffd1ad}
  .pf-mobile-drawer-v5596 .pf-mobile-nav .danger{color:#ff9cab}
  body.pf-mobile-menu-open-v5596{overflow:hidden}



  /* Evita que o cabeçalho sticky cubra o drawer ao rolar o menu no mobile. */
  body[data-module="portal"],
  body[data-module="operacoes"]{--pf-mobile-appbar-offset:118px}
  body[data-module="portal"] .pf-mobile-backdrop-v5596,
  body[data-module="operacoes"] .pf-mobile-backdrop-v5596{top:var(--pf-mobile-appbar-offset);inset-inline:0;bottom:0}
  body[data-module="portal"] .pf-mobile-drawer-v5596,
  body[data-module="operacoes"] .pf-mobile-drawer-v5596{
    top:var(--pf-mobile-appbar-offset);
    bottom:0;
    height:calc(100dvh - var(--pf-mobile-appbar-offset));
    padding-top:14px;
  }

  /* HOME: usa o novo app bar e reaproveita o drawer já existente. */
  body[data-module="portal"] .pf-mobile-backdrop,
  body[data-module="portal"] .pf-mobile-drawer{display:none!important}
  body[data-module="portal"] .pf-mobile-appbar-v5596{display:block}

  /* CENTRAL DE OPERAÇÕES — composição mobile aprovada. */
  body[data-module="operacoes"] .top{position:sticky;top:0;z-index:40}
  body[data-module="operacoes"] .wrap{width:100%;max-width:none;padding:16px 14px 56px;overflow:visible}
  body[data-module="operacoes"] .wrap>.hero,
  body[data-module="operacoes"] .wrap>.ops-hierarchy{display:none!important}
  .pf-ops-mobile-view{display:block}
  .pf-ops-mobile-hero{
    display:flex;align-items:center;gap:12px;padding:15px;border-radius:22px;
    border:1px solid #3b2e68;background:linear-gradient(155deg,rgba(33,23,70,.97),rgba(15,10,36,.97));
    box-shadow:0 20px 52px rgba(4,3,16,.22)
  }
  .pf-ops-mobile-hero-logo{width:64px;height:64px;flex:0 0 64px;border-radius:18px;padding:7px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.10)}
  .pf-ops-mobile-hero-logo img{width:100%;height:100%;object-fit:contain}
  .pf-ops-mobile-eyebrow{font:800 9px JetBrains Mono;color:#79d6ff;letter-spacing:.13em;text-transform:uppercase}
  .pf-ops-mobile-hero h1{font:800 17px Sora;margin:4px 0 5px;line-height:1.25}
  .pf-ops-mobile-hero p{margin:0;color:#bcb4cf;font-size:10.5px;line-height:1.5}

  .pf-ops-step-head{display:flex;align-items:center;gap:9px;margin:17px 0 9px}
  .pf-ops-step-number{width:26px;height:26px;flex:0 0 26px;display:grid;place-items:center;border-radius:50%;font:800 9px JetBrains Mono}
  .pf-ops-step-head small{display:block;color:#8f84aa;font:700 8.5px JetBrains Mono;letter-spacing:.11em;text-transform:uppercase}
  .pf-ops-step-head b{display:block;font:700 13px Sora;margin-top:2px}
  .pf-ops-step-1 .pf-ops-step-number{background:rgba(0,207,255,.12);border:1px solid rgba(0,207,255,.25);color:#7cecff}
  .pf-ops-step-2 .pf-ops-step-number{background:rgba(155,92,255,.13);border:1px solid rgba(155,92,255,.25);color:#c5a9ff}
  .pf-ops-step-3 .pf-ops-step-number{background:rgba(32,208,164,.13);border:1px solid rgba(32,208,164,.25);color:#8fe9ce}

  .pf-ops-mobile-card{--c:#00cfff;--glow:rgba(0,207,255,.17);display:flex;flex-direction:column;width:100%;min-width:0;padding:16px;border-radius:22px;text-decoration:none;color:#f8f5ff;border:1px solid color-mix(in srgb,var(--c) 42%,#3b2e68);background:radial-gradient(circle at 94% 0,var(--glow),transparent 43%),linear-gradient(155deg,rgba(31,22,67,.96),rgba(14,10,35,.97));box-shadow:inset 0 3px 0 var(--c),0 18px 42px rgba(0,0,0,.18)}
  .pf-ops-mobile-card.billing{--c:#9b5cff;--glow:rgba(155,92,255,.18)}
  .pf-ops-mobile-card.guard{--c:#20d0a4;--glow:rgba(32,208,164,.17)}
  .pf-ops-mobile-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
  .pf-ops-mobile-card-logo{width:66px;height:66px;flex:0 0 66px;border-radius:18px;padding:7px;display:grid;place-items:center;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.10)}
  .pf-ops-mobile-card-logo img{width:52px;height:52px;object-fit:contain}
  .pf-ops-mobile-state{padding:6px 8px;border-radius:999px;border:1px solid color-mix(in srgb,var(--c) 35%,transparent);background:color-mix(in srgb,var(--c) 9%,transparent);color:color-mix(in srgb,var(--c) 58%,white);font:800 7.8px JetBrains Mono;white-space:nowrap}
  .pf-ops-mobile-card h2{font:800 18px Sora;margin:14px 0 6px;line-height:1.25}
  .pf-ops-mobile-card p{margin:0;color:#bcb4cf;font-size:10.8px;line-height:1.55}
  .pf-ops-mobile-tags{display:flex;flex-wrap:wrap;gap:5px;margin:12px 0 14px}
  .pf-ops-mobile-tags span{padding:5px 7px;border-radius:999px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.075);font-size:8px;font-weight:800;color:#d5cce9}
  .pf-ops-mobile-cta{min-height:44px;margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding:10px 11px;border-radius:11px;background:color-mix(in srgb,var(--c) 16%,rgba(255,255,255,.02));border:1px solid color-mix(in srgb,var(--c) 34%,transparent);font:800 8.7px JetBrains Mono;color:color-mix(in srgb,var(--c) 56%,white)}
  .pf-ops-mobile-connector{width:2px;height:22px;margin:0 auto;background:linear-gradient(#00cfff,rgba(155,92,255,.45))}
  .pf-ops-mobile-destinations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .pf-ops-mobile-destinations .pf-ops-mobile-card{padding:13px;border-radius:20px;min-height:230px}
  .pf-ops-mobile-destinations .pf-ops-mobile-card-logo{width:50px;height:50px;flex-basis:50px;border-radius:14px;padding:5px}
  .pf-ops-mobile-destinations .pf-ops-mobile-card-logo img{width:39px;height:39px}
  .pf-ops-mobile-destinations .pf-ops-mobile-state{display:none}
  .pf-ops-mobile-destinations .pf-ops-mobile-card h2{font-size:13.5px;margin-top:11px}
  .pf-ops-mobile-destinations .pf-ops-mobile-card p{font-size:9.6px;line-height:1.48}
  .pf-ops-mobile-destinations .pf-ops-mobile-tags{display:none}
  .pf-ops-mobile-destinations .pf-ops-mobile-cta{margin-top:auto;padding:8px 0 0;min-height:0;border:0;background:none;font-size:8.2px}
  .pf-ops-mobile-result{padding:15px;border-radius:20px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.075)}
  .pf-ops-mobile-result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));text-align:center}
  .pf-ops-mobile-result-item{padding:2px 5px;min-width:0}
  .pf-ops-mobile-result-item+ .pf-ops-mobile-result-item{border-left:1px solid rgba(255,255,255,.06)}
  .pf-ops-mobile-result-item svg{width:20px;height:20px;fill:none;stroke:#f8f5ff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .pf-ops-mobile-result-item span{display:block;color:#bcb4cf;font-size:8.5px;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  html[data-theme='light'] .pf-mobile-appbar-v5596{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(246,248,252,.98));border-bottom-color:#dde3ef}
  html[data-theme='light'] .pf-mobile-appbar-title,
  html[data-theme='light'] .pf-mobile-appbar-user strong{color:#20253a}
  html[data-theme='light'] .pf-app-menu-btn{background:#f5f7fb;border-color:#dbe2ee;color:#20253a}
  html[data-theme='light'] .pf-ops-mobile-hero,
  html[data-theme='light'] .pf-ops-mobile-card{background:linear-gradient(155deg,#fff,#f7f8ff);color:#20253a}
  html[data-theme='light'] .pf-ops-mobile-hero p,
  html[data-theme='light'] .pf-ops-mobile-card p{color:#667087}
  html[data-theme='light'] .pf-ops-mobile-result{background:#fff;border-color:#dbe2ee}
  html[data-theme='light'] .pf-ops-mobile-result-item svg{stroke:#20253a}
  html[data-theme='light'] .pf-ops-mobile-result-item span{color:#667087}
}

@media (max-width:355px){

  body[data-module="portal"],
  body[data-module="operacoes"]{--pf-mobile-appbar-offset:108px}
  .pf-mobile-appbar-title{font-size:15px}
  .pf-mobile-appbar-mark,.pf-mobile-app-avatar{width:42px;height:42px;flex-basis:42px}
  .pf-app-menu-btn{padding:0 10px}
  .pf-ops-mobile-destinations{grid-template-columns:1fr}
  .pf-ops-mobile-destinations .pf-ops-mobile-card{min-height:0}
}