:root { --spx-navy: #162b3b; --spx-navy-deep: #0f202d; --spx-orange: #f28c28; --spx-blue: #2584e8; --spx-green: #16a56f; --spx-purple: #7555d9; --spx-ink: #1b2934; --spx-muted: #6f7d88; --spx-line: #dfe6eb; --spx-canvas: #f3f6f8; --spx-white: #fff; --spx-radius: 16px; --spx-shadow: 0 10px 32px rgba(19, 42, 58, .08); } body { color: var(--spx-ink); background: var(--spx-canvas) !important; font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif; } .app-main { background: var(--spx-canvas); } .content-wrapper { background: transparent !important; } .content-header { padding: 22px 24px 6px; } .content { padding: 0 24px 28px !important; } /* Navegação */ #jazzy-navbar { min-height: 64px; border: 0 !important; border-bottom: 1px solid rgba(22, 43, 59, .08) !important; box-shadow: 0 4px 18px rgba(17, 38, 53, .05); } #jazzy-navbar .nav-link { color: #4e5f6c; font-weight: 600; border-radius: 9px; } #jazzy-navbar .nav-link:hover { color: var(--spx-orange); background: #fff6eb; } .app-sidebar { background: linear-gradient(180deg, var(--spx-navy) 0%, var(--spx-navy-deep) 100%) !important; } .brand-link { min-height: 64px; display: flex; align-items: center; border-bottom: 1px solid rgba(255,255,255,.09) !important; } .brand-text { color: #fff !important; font-weight: 800 !important; letter-spacing: .07em; } .nav-sidebar .nav-header { color: #8298a7; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; } .nav-sidebar .nav-link { border-radius: 10px; margin: 2px 9px; width: auto !important; color: #d7e2e9 !important; } .nav-sidebar .nav-link:hover { background: rgba(255,255,255,.08) !important; color: #fff !important; } .nav-sidebar .nav-link.active { background: linear-gradient(135deg, var(--spx-orange), #e87815) !important; color: #fff !important; box-shadow: 0 7px 18px rgba(242, 140, 40, .27); } .app-footer .float-end { display:none !important; } /* Menu lateral Smartpex */ #jazzy-sidebar { border-right:1px solid rgba(255,255,255,.055); box-shadow:10px 0 35px rgba(9,27,39,.12) !important; } #jazzy-sidebar .sidebar-brand { min-height:70px; padding:0 10px; background:rgba(5,20,30,.2); border-bottom:1px solid rgba(255,255,255,.075); } #jazzy-sidebar #jazzy-logo { gap:11px; min-height:70px; padding:10px 12px; border:0 !important; text-decoration:none; } #jazzy-sidebar #jazzy-logo .brand-image { display:none; } #jazzy-sidebar #jazzy-logo::before { content:"SP"; display:grid; place-items:center; flex:0 0 auto; width:38px; height:38px; color:#fff; background:linear-gradient(145deg,#f5a044,#e87513); border:1px solid rgba(255,255,255,.16); border-radius:11px; box-shadow:0 7px 17px rgba(242,140,40,.25); font-size:.72rem; font-weight:900; letter-spacing:-.03em; } #jazzy-sidebar .brand-text { font-size:.96rem; font-weight:850 !important; letter-spacing:.11em; } #jazzy-sidebar .sidebar-wrapper { padding:0 7px 18px; overflow-x:hidden; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.2) transparent; } #jazzy-sidebar .user-panel { align-items:center; gap:10px; margin:12px 7px 11px !important; padding:10px 11px !important; background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.07) !important; border-radius:12px; } #jazzy-sidebar .user-panel .image { display:grid; place-items:center; width:32px; height:32px; padding:0; color:#ffd19d; background:rgba(242,140,40,.13); border-radius:9px; } #jazzy-sidebar .user-panel .user-profile { font-size:1.08rem; } #jazzy-sidebar .user-panel .info { min-width:0; padding:0; } #jazzy-sidebar .user-panel .info a, #jazzy-sidebar .user-panel .info span { overflow:hidden; color:#dce7ed; font-size:.75rem; font-weight:750; text-overflow:ellipsis; white-space:nowrap; } #jazzy-sidebar nav { margin-top:0 !important; } #jazzy-sidebar .sidebar-menu > .nav-item:first-child { margin-bottom:9px; padding-bottom:9px; border-bottom:1px solid rgba(255,255,255,.07); } #jazzy-sidebar .nav-header { margin:16px 11px 7px; padding:0; color:#8da3b0; font-size:.7rem; font-weight:850; letter-spacing:.12em; } #jazzy-sidebar .nav-link { position:relative; min-height:48px; padding:12px 11px; border:1px solid transparent; border-radius:11px; transition:background .18s ease,color .18s ease,transform .18s ease,border-color .18s ease; } #jazzy-sidebar .nav-link .nav-icon { width:26px; margin:0 8px 0 0; color:#8da4b2; font-size:.85rem; text-align:center; transition:color .18s ease,transform .18s ease; } #jazzy-sidebar .nav-link p { font-size:.88rem; font-weight:720; line-height:1.25; } #jazzy-sidebar .nav-link:hover { transform:translateX(2px); border-color:rgba(255,255,255,.06); } #jazzy-sidebar .nav-link:hover .nav-icon { color:#ffb86c; transform:scale(1.06); } #jazzy-sidebar .nav-link.active .nav-icon { color:#fff; } #jazzy-sidebar .nav-link.active::after { content:""; position:absolute; top:50%; right:8px; width:5px; height:5px; background:#fff; border-radius:50%; transform:translateY(-50%); box-shadow:0 0 0 4px rgba(255,255,255,.12); } #jazzy-sidebar .has-treeview > .nav-link { color:#edf4f8 !important; background:rgba(255,255,255,.035); } #jazzy-sidebar .has-treeview.menu-open > .nav-link { color:#fff !important; background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.07); } #jazzy-sidebar .nav-arrow { right:11px; color:#7791a1; font-size:.62rem; } #jazzy-sidebar .menu-open > .nav-link .nav-arrow { color:#ffb96f; } #jazzy-sidebar .nav-treeview { margin:4px 0 7px 15px; padding:3px 0 3px 7px; border-left:1px solid rgba(255,255,255,.09); } #jazzy-sidebar .nav-treeview .nav-link { min-height:43px; margin:2px 5px; padding-top:10px; padding-bottom:10px; color:#c5d3db !important; border-radius:9px; } #jazzy-sidebar .nav-treeview .nav-link .nav-icon { width:23px; font-size:.72rem; } #jazzy-sidebar .nav-treeview .nav-link.active { color:#fff !important; background:linear-gradient(135deg,#f28c28,#df7617) !important; } .sidebar-collapse #jazzy-sidebar #jazzy-logo { justify-content:center; padding-right:0; padding-left:0; } .sidebar-collapse #jazzy-sidebar #jazzy-logo::before { width:35px; height:35px; } /* Componentes administrativos gerais */ .breadcrumb { background: transparent; padding-left: 0; } .card { border: 1px solid var(--spx-line); border-radius: 14px; box-shadow: var(--spx-shadow); overflow: hidden; } .card-header { border-bottom-color: var(--spx-line); background: #fff; } .btn { border-radius: 9px; font-weight: 700; } .btn-primary { background: var(--spx-blue); border-color: var(--spx-blue); } .btn-success { background: var(--spx-green); border-color: var(--spx-green); } .form-control, .form-select, .select2-container--default .select2-selection--single { border-radius: 9px !important; border-color: #d7e0e6 !important; } .form-control:focus, .form-select:focus { border-color: var(--spx-blue) !important; box-shadow: 0 0 0 3px rgba(37,132,232,.12) !important; } .table thead th { color: #667783; font-size: .73rem; letter-spacing: .04em; text-transform: uppercase; border-bottom-width: 1px; } .table td { vertical-align: middle; } /* Dashboard */ .smartpex-admin-dashboard .content-header { display: none; } .smartpex-admin-dashboard .content { padding-top: 26px !important; } .spx-dashboard { max-width: 1540px; margin: 0 auto; } .spx-hero { position: relative; overflow: hidden; display: flex; justify-content: space-between; align-items: center; min-height: 208px; padding: 36px 42px; border-radius: 22px; color: #fff; background: linear-gradient(125deg, #132c3d 0%, #20445a 62%, #2a5268 100%); box-shadow: 0 18px 44px rgba(18, 44, 61, .20); } .spx-hero::before { content: ""; position: absolute; inset: auto -55px -110px auto; width: 330px; height: 330px; border: 65px solid rgba(255,255,255,.045); border-radius: 50%; } .spx-hero-copy { position: relative; z-index: 1; } .spx-eyebrow { display: inline-flex; gap: 8px; align-items: center; color: #ffc27d; font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; } .spx-hero h1 { margin: 14px 0 8px; color: #fff; font-size: clamp(1.85rem, 3vw, 2.65rem); font-weight: 800; letter-spacing: -.035em; } .spx-hero p { max-width: 650px; margin: 0; color: #cadae4; font-size: 1.02rem; } .spx-hero-mark { position: relative; z-index: 1; display: flex; align-items: flex-end; gap: 9px; margin-right: 32px; transform: skewX(-10deg); } .spx-hero-mark span { display: block; width: 16px; border-radius: 5px 5px 2px 2px; background: var(--spx-orange); box-shadow: 0 5px 18px rgba(242,140,40,.25); } .spx-hero-mark span:nth-child(1) { height: 42px; opacity: .55; } .spx-hero-mark span:nth-child(2) { height: 70px; opacity: .78; } .spx-hero-mark span:nth-child(3) { height: 100px; } .spx-quick-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 15px; margin: -28px 24px 28px; position: relative; z-index: 2; } .spx-quick-card { display: grid; grid-template-columns: 48px 1fr auto; gap: 13px; align-items: center; min-height: 94px; padding: 17px; color: var(--spx-ink) !important; background: #fff; border: 1px solid rgba(221,230,235,.9); border-radius: 15px; box-shadow: var(--spx-shadow); transition: transform .2s, box-shadow .2s, border-color .2s; } .spx-quick-card:hover { transform: translateY(-4px); text-decoration: none; box-shadow: 0 16px 38px rgba(19,42,58,.14); } .spx-quick-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 13px; font-size: 1.15rem; } .spx-quick-card strong, .spx-quick-card small { display: block; } .spx-quick-card strong { margin-bottom: 4px; font-size: .94rem; } .spx-quick-card small { color: var(--spx-muted); font-size: .76rem; line-height: 1.35; } .spx-arrow { color: #9aa8b2; font-size: .8rem; } .spx-quick-orange .spx-quick-icon { color: #d96e0d; background: #fff1df; }.spx-quick-orange:hover { border-color: #f4b36f; } .spx-quick-blue .spx-quick-icon { color: #1c72ca; background: #e8f3ff; }.spx-quick-blue:hover { border-color: #80b9ef; } .spx-quick-green .spx-quick-icon { color: #0b8a5a; background: #e3f8ef; }.spx-quick-green:hover { border-color: #74d3af; } .spx-quick-purple .spx-quick-icon { color: #6748c8; background: #f0ebff; }.spx-quick-purple:hover { border-color: #a895e7; } .spx-dashboard-columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 330px); gap: 24px; } .spx-main-column, .spx-activity-column { min-width: 0; } .spx-section-heading { display: flex; justify-content: space-between; align-items: end; min-height: 55px; margin-bottom: 13px; } .spx-section-kicker { color: var(--spx-orange); font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; } .spx-section-heading h2 { margin: 3px 0 0; font-size: 1.22rem; font-weight: 800; letter-spacing: -.02em; } .spx-section-badge { padding: 7px 10px; color: #667784; background: #e8edf1; border-radius: 20px; font-size: .72rem; font-weight: 700; } .spx-module-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; } .spx-module-card { background: #fff; border: 1px solid var(--spx-line); border-radius: var(--spx-radius); box-shadow: 0 7px 24px rgba(20,43,58,.055); overflow: hidden; } .spx-module-card header { display: flex; align-items: center; gap: 12px; padding: 17px 18px; background: linear-gradient(180deg,#fff,#fafcfd); border-bottom: 1px solid #e8edf0; } .spx-module-icon { display: grid; place-items: center; width: 39px; height: 39px; color: var(--spx-blue); background: #eaf4ff; border-radius: 11px; } .spx-module-card header small { display: block; color: #8a99a3; font-size: .63rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; } .spx-module-card h3 { margin: 1px 0 0; font-size: 1rem; font-weight: 800; } .spx-model-list { padding: 5px 10px 10px; } .spx-model-row { display: flex; align-items: center; justify-content: space-between; min-height: 43px; padding: 6px 7px; border-bottom: 1px solid #eef2f4; } .spx-model-row:last-child { border-bottom: 0; } .spx-model-name { display: flex; align-items: center; gap: 9px; min-width: 0; color: #334854; font-size: .83rem; font-weight: 650; } .spx-model-name:hover { color: var(--spx-blue); text-decoration: none; } .spx-model-name i { width: 18px; color: #91a1ab; font-size: .72rem; text-align: center; } .spx-model-actions { display: flex; gap: 5px; } .spx-model-actions a { display: grid; place-items: center; width: 28px; height: 28px; color: #71818c; background: #f2f5f7; border-radius: 8px; font-size: .7rem; } .spx-model-actions a:hover { color: #fff; background: var(--spx-blue); text-decoration: none; } .spx-activity-card { width: 100%; max-width: 100%; padding: 7px 16px; background: #fff; border: 1px solid var(--spx-line); border-radius: var(--spx-radius); box-shadow: 0 7px 24px rgba(20,43,58,.055); overflow: hidden; } .spx-activity-item { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 11px; max-width: 100%; padding: 15px 0; border-bottom: 1px solid #e9eef1; overflow: hidden; } .spx-activity-item > div { min-width: 0; max-width: 100%; overflow: hidden; } .spx-activity-item:last-child { border-bottom: 0; } .spx-activity-icon { display: grid; place-items: center; width: 34px; height: 34px; color: #1b72c5; background: #e9f4ff; border-radius: 10px; font-size: .7rem; } .spx-activity-icon.is-add { color: #098253; background: #e4f8ef; }.spx-activity-icon.is-delete { color: #d84a4a; background: #ffebeb; } .spx-activity-item strong, .spx-activity-item a { display: block; overflow: hidden; color: #293d49; font-size: .82rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; } .spx-activity-item p { max-width: 100%; margin: 3px 0; color: #7b8992; font-size: .72rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .spx-activity-item time { color: #99a4ab; font-size: .68rem; } .spx-empty { grid-column: 1/-1; padding: 45px 20px; text-align: center; color: var(--spx-muted); background: #fff; border: 1px dashed #cbd6dc; border-radius: var(--spx-radius); } .spx-empty i { display: block; margin-bottom: 10px; font-size: 1.5rem; }.spx-empty p { margin: 0; } .spx-empty-activity { border: 0; padding: 35px 10px; } @media (max-width: 1199px) { .spx-quick-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } .spx-dashboard-columns { grid-template-columns: 1fr; } .spx-activity-column { max-width: none; } } @media (max-width: 767px) { .content { padding: 0 12px 22px !important; } .smartpex-admin-dashboard .content { padding-top: 12px !important; } .spx-hero { min-height: 185px; padding: 28px 22px 58px; border-radius: 16px; } .spx-hero-mark { display: none; } .spx-quick-grid { grid-template-columns: 1fr; margin: -38px 10px 24px; gap: 10px; } .spx-quick-card { min-height: 82px; } .spx-module-grid { grid-template-columns: 1fr; } .spx-section-badge { display: none; } } /* Listagem de Clientes RBX */ .model-clienterbx.change-list .app-content-header { display:none; } .model-clienterbx.change-list .app-content { padding-top:10px; } .spx-primary-client-search { margin:0 0 12px; padding:11px 13px; background:#fff; border:1px solid #dce5ea; border-radius:13px; box-shadow:0 5px 17px rgba(20,43,58,.05); } .spx-primary-client-search #changelist-search { margin:0 !important; } .spx-client-list-hero { position:relative; isolation:isolate; display:flex; align-items:center; justify-content:space-between; gap:22px; min-height:156px; margin-bottom:18px; padding:26px 30px; overflow:hidden; color:#fff; background:linear-gradient(125deg,#142d3d,#214b62 68%,#2b6077); border-radius:18px; box-shadow:0 15px 38px rgba(18,43,59,.17); animation:spxClientHeroIn .4s cubic-bezier(.2,.8,.2,1) both; } .spx-client-list-hero::after { content:""; position:absolute; z-index:-1; right:-45px; bottom:-115px; width:260px; height:260px; border:48px solid rgba(255,255,255,.045); border-radius:50%; } .spx-client-list-eyebrow { color:#ffc37f; font-size:.68rem; font-weight:850; letter-spacing:.1em; text-transform:uppercase; } .spx-client-list-hero h1 { margin:7px 0 5px; color:#fff; font-size:clamp(1.55rem,2.7vw,2.15rem); font-weight:850; letter-spacing:-.035em; } .spx-client-list-hero p { max-width:680px; margin:0; color:#c5d6df; font-size:.83rem; } .spx-client-list-count { display:grid; place-items:center; flex:0 0 auto; min-width:145px; min-height:94px; padding:13px; background:rgba(7,24,34,.24); border:1px solid rgba(255,255,255,.1); border-radius:14px; } .spx-client-list-count span { color:#fff; font-size:2rem; font-weight:880; line-height:1; } .spx-client-list-count small { margin-top:5px; color:#bfd0da; font-size:.65rem; font-weight:700; } .spx-recent-clients { margin:0 0 16px; padding:12px; background:#fff; border:1px solid #dce5ea; border-radius:14px; box-shadow:0 6px 20px rgba(20,43,58,.055); } .spx-recent-clients > header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:9px; color:#355260; font-size:.7rem; font-weight:850; }.spx-recent-clients > header i { margin-right:5px; color:#2678a0; }.spx-recent-clients > header small { color:#8a989f; font-size:.61rem; font-weight:650; } .spx-recent-clients-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }.spx-recent-clients-list > a { display:grid; grid-template-columns:34px minmax(0,1fr) 10px; align-items:center; gap:8px; min-width:0; padding:8px; color:#2d4755 !important; background:#f7f9fa; border:1px solid #e3eaee; border-radius:10px; text-decoration:none !important; }.spx-recent-clients-list > a:hover { background:#edf6fa; border-color:#bad5e2; }.spx-recent-clients-list strong,.spx-recent-clients-list small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.spx-recent-clients-list strong { font-size:.7rem; }.spx-recent-clients-list small { margin-top:2px; color:#7e8d96; font-size:.59rem; }.spx-recent-clients-list > a > i { color:#a1afb7; font-size:.55rem; } .spx-recent-avatar { display:grid; place-items:center; width:34px; height:34px; color:#fff; background:#2678a0; border-radius:9px; font-size:.72rem; font-weight:850; } .spx-multicode-filter { margin:0 0 16px; padding:14px; background:#fff; border:1px solid #dce5ea; border-radius:14px; box-shadow:0 7px 23px rgba(20,43,58,.055); } .spx-multicode-form { display:grid; grid-template-columns:minmax(210px,.8fr) minmax(300px,1.5fr) auto auto; align-items:center; gap:12px; } .spx-multicode-copy label,.spx-multicode-copy small { display:block; }.spx-multicode-copy label { margin:0; color:#294b5e; font-size:.76rem; font-weight:850; }.spx-multicode-copy label i { margin-right:6px; color:#2678a0; }.spx-multicode-copy small { margin-top:3px; color:#7a8c96; font-size:.62rem; } .spx-multicode-filter textarea { width:100%; min-height:48px; max-height:105px; margin:0; padding:10px 12px; resize:vertical; color:#294b5e; background:#f7f9fa; border:1px solid #d6e0e6; border-radius:10px; font-size:.75rem; line-height:1.35; } .spx-multicode-filter textarea:focus { background:#fff; border-color:#4c9bc2; box-shadow:0 0 0 3px rgba(38,120,160,.12); outline:0; } .spx-multicode-filter button,.spx-multicode-clear { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:44px; padding:9px 15px; border-radius:10px; font-size:.68rem; font-weight:800; white-space:nowrap; } .spx-multicode-filter button { color:#fff; background:#2678a0; border:0; box-shadow:0 6px 15px rgba(38,120,160,.2); cursor:pointer; }.spx-multicode-filter button:hover { background:#1f688a; } .spx-multicode-clear { color:#6d7c84 !important; background:#eef2f4; text-decoration:none !important; } .spx-status-refresh-form { display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-top:11px; padding-top:11px; border-top:1px solid #e7edf0; }.spx-status-refresh-form button { background:#16805a; box-shadow:0 6px 15px rgba(22,128,90,.18); }.spx-status-refresh-form button:hover { background:#116b4b; }.spx-status-refresh-form small { color:#7a8c96; font-size:.62rem; } .model-clienterbx.change-list #change-list-filters { padding-bottom:16px !important; } .model-clienterbx.change-list #change-list-filters > div { align-items:stretch !important; padding:14px; background:#fff; border:1px solid var(--spx-line); border-radius:14px; box-shadow:0 7px 23px rgba(20,43,58,.055); } .model-clienterbx.change-list #changelist-search { min-width:300px; } .model-clienterbx.change-list #searchbar { flex:1 1 300px; min-width:210px !important; min-height:46px; padding-left:40px; background-color:#f7f9fa; background-image:linear-gradient(45deg,transparent,transparent); border-radius:11px !important; } .model-clienterbx.change-list #changelist-search { position:relative; } .model-clienterbx.change-list #changelist-search::before { content:"\f002"; position:absolute; z-index:2; top:14px; left:14px; color:#81909a; font-family:"Font Awesome 5 Free"; font-size:.8rem; font-weight:900; pointer-events:none; } .model-clienterbx.change-list #changelist-search > .btn { min-height:46px; padding:9px 18px; border:0; border-radius:11px; box-shadow:0 6px 15px rgba(37,132,232,.18); } .spx-client-list-tools { display:flex; gap:8px; } .spx-list-tool { display:grid; grid-template-columns:34px 1fr; align-items:center; gap:9px; min-width:154px; min-height:46px; padding:6px 11px; color:#fff !important; border-radius:11px; box-shadow:0 6px 16px rgba(20,43,58,.13); text-decoration:none !important; transition:transform .18s ease,box-shadow .18s ease,filter .18s ease; } .spx-list-tool:hover { transform:translateY(-2px); color:#fff !important; box-shadow:0 10px 20px rgba(20,43,58,.17); filter:saturate(1.08); } .spx-list-tool-primary { background:linear-gradient(130deg,#1879ca,#2797e7); }.spx-list-tool-secondary { background:linear-gradient(130deg,#167b59,#22a876); } .spx-list-tool-icon { display:grid; place-items:center; width:32px; height:32px; background:rgba(255,255,255,.15); border-radius:9px; font-size:.74rem; } .spx-list-tool strong,.spx-list-tool small { display:block; }.spx-list-tool strong { font-size:.7rem; font-weight:820; }.spx-list-tool small { color:rgba(255,255,255,.72); font-size:.58rem; } .model-clienterbx.change-list .change-list-actions { margin:0; padding:0 0 12px !important; } .model-clienterbx.change-list .actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:11px 13px; background:#eef3f6; border:1px solid #dfe7ec; border-radius:12px; } .model-clienterbx.change-list .actions label { margin:0; color:#647681; font-size:.7rem; font-weight:800; } .model-clienterbx.change-list .actions select { min-height:38px; border-color:#d2dce3; border-radius:9px; } .model-clienterbx.change-list #changelist > .row > .col-12 > .card { border-radius:15px; box-shadow:0 9px 28px rgba(20,43,58,.075); } .model-clienterbx.change-list #changelist .table-responsive { padding:0; } .model-clienterbx.change-list #result_list { min-width:1450px; margin:0; } .model-clienterbx.change-list #result_list thead th { padding:13px 14px; color:#6c7e89; background:#eef3f6; border:0; } .model-clienterbx.change-list #result_list thead a { color:#526671; text-decoration:none; } .model-clienterbx.change-list #result_list tbody tr { background:#fff; transition:background .18s ease,transform .18s ease,box-shadow .18s ease; } .model-clienterbx.change-list #result_list tbody tr:nth-child(even) { background:#fafcfd; } .model-clienterbx.change-list #result_list tbody tr:hover { position:relative; z-index:1; background:#f1f7fb; box-shadow:inset 4px 0 0 var(--spx-orange); } .model-clienterbx.change-list #result_list td,.model-clienterbx.change-list #result_list th { padding:16px 17px; border-color:#e8edf0; font-size:.91rem; line-height:1.4; vertical-align:middle; } .model-clienterbx.change-list #result_list .column-nome, .model-clienterbx.change-list #result_list .field-nome { width:28%; min-width:280px; } .model-clienterbx.change-list #result_list .column-documento, .model-clienterbx.change-list #result_list .field-documento { min-width:180px; } .model-clienterbx.change-list #result_list .column-cidade, .model-clienterbx.change-list #result_list .field-cidade { min-width:180px; } .model-clienterbx.change-list #result_list .column-total_equipamentos, .model-clienterbx.change-list #result_list .field-total_equipamentos { min-width:110px; text-align:center; } .model-clienterbx.change-list #result_list .column-atualizacao_lista, .model-clienterbx.change-list #result_list .field-atualizacao_lista { min-width:150px; white-space:nowrap; } .model-clienterbx.change-list #result_list .column-complemento, .model-clienterbx.change-list #result_list .field-complemento { min-width:260px; white-space:normal; line-height:1.4; } .model-clienterbx.change-list #result_list .column-endereco_lista, .model-clienterbx.change-list #result_list .field-endereco_lista { min-width:260px; white-space:normal; } .model-clienterbx.change-list #result_list .column-bairro, .model-clienterbx.change-list #result_list .field-bairro { min-width:155px; white-space:normal; } .model-clienterbx.change-list #result_list .column-situacao_lista, .model-clienterbx.change-list #result_list .field-situacao_lista { min-width:125px; white-space:nowrap; } .model-clienterbx.change-list #result_list .field-nome { color:#17384d; font-size:.94rem; font-weight:820; line-height:1.35; white-space:normal; } .model-clienterbx.change-list #result_list .field-nome a { color:#173f58; font-weight:850; text-decoration:none; } .model-clienterbx.change-list #result_list .field-nome a:hover { color:var(--spx-orange); } .model-clienterbx.change-list #result_list tbody th a { color:#1e668f; font-weight:820; text-decoration:none; } .model-clienterbx.change-list #result_list tbody th a:hover { color:var(--spx-orange); } .spx-freshness { display:inline-flex; align-items:center; gap:5px; padding:5px 8px; border-radius:999px; font-size:.65rem; font-weight:820; }.spx-freshness::before { content:""; width:6px; height:6px; border-radius:50%; }.spx-freshness.is-fresh { color:#14704c; background:#e5f6ee; }.spx-freshness.is-fresh::before { background:#1fa36d; }.spx-freshness.is-recent { color:#866018; background:#fff3d9; }.spx-freshness.is-recent::before { background:#d89a24; }.spx-freshness.is-stale { color:#9b4242; background:#fdeaea; }.spx-freshness.is-stale::before { background:#d85a5a; } .spx-client-state { display:inline-flex; align-items:center; gap:6px; padding:5px 9px; border-radius:999px; font-size:.66rem; font-weight:850; }.spx-client-state::before { content:""; width:7px; height:7px; border-radius:50%; }.spx-client-state.is-active { color:#11704a; background:#e2f6ec; }.spx-client-state.is-active::before { background:#1ca66c; }.spx-client-state.is-blocked { color:#9a5719; background:#fff0d7; }.spx-client-state.is-blocked::before { background:#e18627; }.spx-client-state.is-cancelled { color:#9c3d49; background:#fde7ea; }.spx-client-state.is-cancelled::before { background:#dc5364; }.spx-client-state.is-awaiting { color:#245d91; background:#e6f1fb; }.spx-client-state.is-awaiting::before { background:#378bc9; }.spx-client-state.is-inactive,.spx-client-state.is-unknown { color:#687882; background:#edf1f3; }.spx-client-state.is-inactive::before,.spx-client-state.is-unknown::before { background:#8b9aa3; } .spx-client-actions { display:flex; align-items:center; min-width:34px; }.spx-client-action { display:grid !important; place-items:center; width:32px; height:32px; margin:0; padding:0; color:#516b79 !important; background:#eef3f6; border:1px solid #dce5ea; border-radius:8px; font-size:.68rem; text-decoration:none !important; cursor:pointer; transition:transform .14s ease,background .14s ease,color .14s ease; }.spx-client-action:hover { color:#fff !important; background:#2678a0; transform:translateY(-1px); } .model-clienterbx.change-list .spx-list-row-enter { animation:spxListRowIn .3s ease var(--spx-row-delay,0ms) both; } .model-clienterbx.change-list .paginator { margin-top:14px; padding:12px 14px; background:#fff; border:1px solid var(--spx-line); border-radius:12px; } @keyframes spxListRowIn { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } } @media (max-width: 767px) { #jazzy-sidebar .user-panel { margin-right:5px !important; margin-left:5px !important; } .model-clienterbx.change-list .app-content { padding-top:12px; } .model-clienterbx.change-list .app-content > .container-fluid { padding-right:10px; padding-left:10px; } .spx-client-list-hero { align-items:flex-start; flex-direction:column; min-height:0; padding:20px 18px; border-radius:14px; } .spx-client-list-hero p { font-size:.76rem; line-height:1.45; } .spx-client-list-count { display:flex; justify-content:flex-start; gap:8px; width:100%; min-width:0; min-height:0; padding:10px 12px; } .spx-client-list-count span { font-size:1.35rem; }.spx-client-list-count small { margin:0; } .spx-recent-clients-list { display:flex; overflow-x:auto; }.spx-recent-clients-list > a { flex:0 0 235px; } .spx-multicode-form { grid-template-columns:1fr 1fr; }.spx-multicode-copy,.spx-multicode-filter textarea { grid-column:1/-1; }.spx-multicode-form button,.spx-multicode-clear { width:100%; }.spx-status-refresh-form { align-items:stretch; flex-direction:column; }.spx-status-refresh-form button { width:100%; } .model-clienterbx.change-list #change-list-filters > div { padding:10px; } .model-clienterbx.change-list #changelist-search { width:100%; min-width:0; } .model-clienterbx.change-list #searchbar { flex-basis:100%; width:100% !important; } .model-clienterbx.change-list #changelist-search > .btn { flex:1; } .model-clienterbx.change-list #changelist-search .quiet { width:100%; margin:1px 2px !important; } .spx-client-list-tools { display:grid; grid-template-columns:1fr 1fr; width:100%; } .spx-list-tool { min-width:0; } .model-clienterbx.change-list #changelist .table-responsive::after { content:"Deslize para o lado para consultar todos os dados"; position:sticky; left:0; display:block; width:max-content; max-width:100vw; padding:9px 13px; color:#73838d; background:#f5f8fa; font-size:.65rem; } } @media (max-width: 430px) { .spx-client-list-tools { grid-template-columns:1fr; } } /* Detalhe do cliente RBX */ .model-clienterbx.change-form .content-header { padding-bottom: 2px; } .model-clienterbx.change-form #content-main, .model-clienterbx.change-form #clienterbx_form, .model-clienterbx.change-form #clienterbx_form > .row, .model-clienterbx.change-form #clienterbx_form > .row > [class*="col-"] { min-width: 0; max-width: 100%; } .model-clienterbx.change-form #clienterbx_form > .row { align-items: start; } .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-9 > .card { overflow: visible; border: 0; background: transparent; box-shadow: none; } .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-9 > .card > .card-body { padding: 0; } .spx-ops-switcher { display:grid; grid-template-columns:repeat(2,minmax(180px,250px)); gap:9px; width:fit-content; max-width:100%; margin:0 0 14px; } .spx-ops-switcher a { display:flex; align-items:center; gap:10px; min-height:58px; padding:9px 12px; color:#375363 !important; background:#fff; border:1px solid #dbe5e9; border-radius:12px; box-shadow:0 4px 12px rgba(20,43,58,.05); text-decoration:none !important; transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease; } .spx-ops-switcher a:hover { border-color:#91b9c8; box-shadow:0 7px 16px rgba(20,43,58,.09); transform:translateY(-1px); } .spx-ops-switcher a.is-active { color:#194c63 !important; background:linear-gradient(120deg,#eaf6f8,#f6fbfc); border-color:#83bdc8; box-shadow:inset 0 0 0 1px rgba(39,129,151,.08); } .spx-ops-switcher-icon { display:grid; place-items:center; flex:0 0 auto; width:36px; height:36px; color:#2678a0; background:#eaf4f8; border-radius:10px; font-size:1rem; } .spx-ops-switcher a.is-active .spx-ops-switcher-icon { color:#fff; background:#267f91; } .spx-ops-switcher-copy strong,.spx-ops-switcher-copy small { display:block; } .spx-ops-switcher-copy strong { font-size:.76rem; font-weight:850; line-height:1.2; } .spx-ops-switcher-copy small { margin-top:3px; color:#788b96; font-size:.61rem; line-height:1.2; } .spx-client-backbar { display:flex; align-items:center; width:100%; margin:0 0 10px; } .spx-client-back { display:inline-flex; align-items:center; gap:10px; min-height:44px; padding:6px 13px 6px 7px; color:#29495a !important; background:#fff; border:1px solid #d8e3e9; border-radius:11px; box-shadow:0 4px 13px rgba(20,43,58,.07); text-decoration:none !important; transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease; } .spx-client-back:hover { color:#1f6689 !important; border-color:#a9cad9; box-shadow:0 7px 17px rgba(20,43,58,.11); transform:translateX(-2px); } .spx-client-back-icon { display:grid; place-items:center; flex:0 0 auto; width:32px; height:32px; color:#fff; background:#2678a0; border-radius:8px; font-size:.7rem; } .spx-client-back strong,.spx-client-back small { display:block; }.spx-client-back strong { font-size:.75rem; font-weight:850; line-height:1.2; }.spx-client-back small { margin-top:2px; color:#7b8c96; font-size:.61rem; line-height:1.2; } .spx-client-sequence { display:flex; align-items:center; gap:7px; margin-left:auto; }.spx-client-sequence > a,.spx-client-sequence > span { display:inline-flex; align-items:center; gap:6px; min-height:38px; padding:7px 10px; color:#315568; background:#fff; border:1px solid #d8e3e9; border-radius:9px; font-size:.66rem; font-weight:820; text-decoration:none !important; }.spx-client-sequence > a:hover { color:#fff; background:#2678a0; border-color:#2678a0; }.spx-client-sequence > .is-disabled { color:#a7b2b8; background:#f3f5f6; }.spx-client-sequence > small { color:#778993; font-size:.62rem; font-weight:750; } .spx-client-hero { position: relative; isolation: isolate; display: flex; align-items: center; justify-content: space-between; gap: 24px; width: 100%; margin: 0 0 20px; padding: 25px 28px; overflow: hidden; color: #fff; background: linear-gradient(125deg, #132b3b 0%, #21485f 65%, #2a5b72 100%); border: 1px solid rgba(255,255,255,.08); border-radius: 18px; box-shadow: 0 16px 38px rgba(18,43,59,.18); animation: spxClientHeroIn .42s cubic-bezier(.2,.8,.2,1) both; } .spx-client-hero::after { content:""; position:absolute; z-index:-1; right:-60px; bottom:-120px; width:280px; height:280px; border:54px solid rgba(255,255,255,.045); border-radius:50%; } .spx-client-identity { display:flex; align-items:center; gap:16px; min-width:0; } .spx-client-avatar { display:grid; place-items:center; flex:0 0 auto; width:58px; height:58px; color:#fff; background:linear-gradient(145deg,#f5a045,#e87916); border:1px solid rgba(255,255,255,.18); border-radius:16px; box-shadow:0 8px 20px rgba(242,140,40,.26); font-size:1.35rem; font-weight:850; } .spx-client-eyebrow { color:#ffc481; font-size:.68rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; } .spx-client-hero h1 { max-width:820px; margin:6px 0 9px; color:#fff; font-size:clamp(1.55rem,2.5vw,2.15rem); font-weight:850; line-height:1.15; letter-spacing:-.025em; overflow-wrap:anywhere; } .spx-client-meta { display:flex; flex-wrap:wrap; gap:8px 16px; color:#d2e0e7; font-size:.86rem; } .spx-client-meta span { display:inline-flex; align-items:center; gap:6px; } .spx-client-status { position:relative; z-index:1; flex:0 0 auto; min-width:190px; padding:12px 15px; background:rgba(8,25,36,.23); border:1px solid rgba(255,255,255,.1); border-radius:12px; } .spx-client-status small, .spx-client-status time { display:block; color:#aebfca; font-size:.66rem; } .spx-client-status strong { display:flex; align-items:center; gap:7px; margin:4px 0; color:#fff; font-size:.88rem; } .spx-client-sync { display:flex; align-items:center; justify-content:center; gap:7px; width:100%; margin-top:10px; padding:8px 10px; color:#fff; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2); border-radius:8px; font-size:.68rem; font-weight:800; cursor:pointer; transition:background .15s ease; } .spx-client-sync:hover { background:rgba(255,255,255,.2); }.spx-client-sync:disabled { cursor:wait; opacity:.68; }.spx-client-sync.is-loading i { animation:spxStatusPulse .8s ease-in-out infinite; } .spx-client-sync-result { min-height:14px; margin-top:5px; line-height:1.3; }.spx-client-sync-result.is-success { color:#a7f3cf; }.spx-client-sync-result.is-error { color:#fecaca; }.spx-client-sync-result.is-loading { color:#dce8ee; } .spx-client-connection-dot { flex:0 0 auto; width:8px; height:8px; border-radius:50%; } .spx-client-connection.is-loading .spx-client-connection-dot { background:#f5b942; box-shadow:0 0 0 4px rgba(245,185,66,.13); animation:spxStatusPulse 1.1s ease-in-out infinite; } .spx-client-connection.is-online .spx-client-connection-dot { background:#45d993; box-shadow:0 0 0 4px rgba(69,217,147,.13); } .spx-client-connection.is-offline .spx-client-connection-dot { background:#ff6b6b; box-shadow:0 0 0 4px rgba(255,107,107,.13); } .spx-client-connection.is-error .spx-client-connection-dot { background:#f5b942; box-shadow:0 0 0 4px rgba(245,185,66,.13); } .spx-client-ip { display:block; max-width:310px; margin:0 0 5px; color:#fff; font-family:monospace; font-size:.72rem; line-height:1.4; overflow-wrap:anywhere; } .spx-equipment-access { display:flex; align-items:center; justify-content:center; gap:7px; width:100%; margin:9px 0 8px; padding:8px 10px; color:#173b4c !important; background:#fff; border:1px solid rgba(255,255,255,.45); border-radius:8px; box-shadow:0 5px 12px rgba(5,23,34,.14); font-size:.69rem; font-weight:850; text-decoration:none !important; transition:transform .18s ease,box-shadow .18s ease; } .spx-equipment-access[hidden] { display:none; } .spx-equipment-access:hover { color:#173b4c !important; transform:translateY(-1px); box-shadow:0 7px 16px rgba(5,23,34,.2); } .spx-equipment-access em { margin-left:auto; padding:2px 5px; color:#b35e10; background:#fff0dc; border-radius:999px; font-size:.55rem; font-style:normal; font-weight:850; white-space:nowrap; } .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-9 { flex:1 1 auto; max-width:calc(100% - 230px); } .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-3 { flex:0 0 230px; max-width:230px; } .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-9 > .card > .card-body { display:grid; grid-template-columns:270px minmax(0,1fr); align-items:start; gap:20px; } .spx-client-section-nav,.model-clienterbx.change-form #jazzy-tabs.spx-client-section-tabs { position:sticky; z-index:30; top:76px; display:flex; flex-direction:column; gap:8px; width:100%; margin:0; padding:11px; overflow:visible; background:rgba(247,250,252,.97); border:1px solid #d9e3e9 !important; border-radius:15px; box-shadow:0 9px 24px rgba(20,43,58,.1); backdrop-filter:blur(8px); } .model-clienterbx.change-form #jazzy-tabs.spx-client-section-tabs + .tab-content { min-width:0; } .model-clienterbx.change-form #jazzy-tabs.spx-client-section-tabs .nav-item { min-width:0; margin:0; } .spx-section-nav-link { --spx-nav-color:#647d8b; position:relative; display:grid !important; grid-template-columns:40px minmax(0,1fr) 12px; align-items:center; gap:10px; width:100%; min-width:0; min-height:70px; padding:10px 11px !important; overflow:hidden; color:#334b58 !important; background:#fff !important; border:1px solid #dce5ea !important; border-radius:11px !important; box-shadow:0 3px 9px rgba(20,43,58,.05); text-decoration:none !important; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; } .spx-section-nav-link::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--spx-nav-color); } .spx-section-nav-link > i { display:grid; place-items:center; width:40px; height:40px; color:var(--spx-nav-color); background:color-mix(in srgb,var(--spx-nav-color) 11%,#fff); border-radius:10px; font-size:.9rem; } .spx-section-nav-link > span,.spx-section-nav-link strong,.spx-section-nav-link small { display:block; min-width:0; } .spx-section-nav-link strong { color:#243f4e; font-size:.88rem; font-weight:850; line-height:1.2; } .spx-section-nav-link small { margin-top:4px; color:#71848f; font-size:.68rem; font-weight:650; line-height:1.3; white-space:normal; } .spx-section-nav-link > em { color:#a6b2b9; font-size:.55rem; transition:transform .18s ease,color .18s ease; } .spx-section-nav-link:hover,.spx-section-nav-link.is-current,.model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link.active { color:#263e4b !important; background:color-mix(in srgb,var(--spx-nav-color) 7%,#fff) !important; border-color:color-mix(in srgb,var(--spx-nav-color) 45%,#dce5ea) !important; box-shadow:0 8px 18px rgba(20,43,58,.11); transform:translateY(-2px); } .spx-section-nav-link:hover > em,.spx-section-nav-link.is-current > em,.spx-section-nav-link.active > em { color:var(--spx-nav-color); transform:translateX(2px); } .spx-section-nav-link.is-current,.spx-section-nav-link.active { background:color-mix(in srgb,var(--spx-nav-color) 7%,#fff) !important; } .spx-section-nav-link.is-summary { --spx-nav-color:#176f8e; }.spx-section-nav-link.is-attendance { --spx-nav-color:#d34f69; }.spx-section-nav-link.is-provision { --spx-nav-color:#df7417; }.spx-section-nav-link.is-ticket { --spx-nav-color:#d34f69; }.spx-section-nav-link.is-profile { --spx-nav-color:#2678a0; }.spx-section-nav-link.is-billing { --spx-nav-color:#238b67; }.spx-section-nav-link.is-finance { --spx-nav-color:#168b91; }.spx-section-nav-link.is-timeline { --spx-nav-color:#5270ad; }.spx-section-nav-link.is-contracts { --spx-nav-color:#7655ba; }.spx-section-nav-link.is-auth { --spx-nav-color:#bd8415; }.spx-section-nav-link.is-equipment { --spx-nav-color:#34749b; }.spx-section-nav-link.is-other { --spx-nav-color:#72828c; } .model-clienterbx.change-form .spx-client-section { --spx-section-color:#718694; scroll-margin-top:128px; overflow:hidden; border:1px solid #dce5ea !important; border-top:4px solid var(--spx-section-color) !important; border-radius:15px !important; box-shadow:0 8px 24px rgba(20,43,58,.075) !important; } .model-clienterbx.change-form .spx-section-header { display:flex !important; align-items:center; gap:12px; min-height:68px; margin:0 !important; padding:12px 16px !important; color:#29424f !important; background:linear-gradient(105deg,color-mix(in srgb,var(--spx-section-color) 10%,#fff),#fff 72%) !important; border:0 !important; border-bottom:1px solid color-mix(in srgb,var(--spx-section-color) 19%,#e5ebef) !important; border-radius:0 !important; box-shadow:none !important; } .spx-section-heading-icon { display:inline-grid; place-items:center; flex:0 0 auto; width:42px; height:42px; margin:0; color:#fff; background:linear-gradient(145deg,var(--spx-section-color),color-mix(in srgb,var(--spx-section-color) 78%,#1d3442)); border-radius:11px; box-shadow:0 6px 14px color-mix(in srgb,var(--spx-section-color) 24%,transparent); font-size:.9rem; } .spx-section-heading-copy,.spx-section-heading-copy strong,.spx-section-heading-copy small { display:block; min-width:0; } .spx-section-heading-copy strong { color:#243e4c; font-size:1.08rem; font-weight:880; letter-spacing:-.01em; line-height:1.2; } .spx-section-heading-copy small { margin-top:5px; color:#687d89; font-size:.76rem; font-weight:650; line-height:1.35; } .model-clienterbx.change-form .spx-section-profile > .spx-profile-body { padding:17px 18px 20px !important; background:#fbfcfd; } .spx-profile-subsection { display:flex; align-items:center; gap:8px; margin:19px 0 11px; padding:0 0 8px; color:#2c5266; border-bottom:1px solid #dfe8ed; } .spx-profile-subsection:first-child { margin-top:0; } .spx-profile-subsection i { display:grid; place-items:center; width:27px; height:27px; color:#fff; background:#28799f; border-radius:8px; font-size:.63rem; } .spx-profile-subsection strong { font-size:.72rem; font-weight:880; letter-spacing:.025em; text-transform:uppercase; } .spx-section-profile .form-group { margin:0 0 10px; } .spx-profile-form-row { display:grid !important; grid-template-columns:repeat(var(--spx-profile-columns,1),minmax(0,1fr)); gap:10px; margin:0 !important; } .spx-profile-field { min-width:0; padding:0; } .spx-profile-field > label { display:block; width:auto; max-width:none; margin:0 0 6px; padding:0; color:#536c7a; font-size:.72rem; font-weight:850; letter-spacing:.045em; text-transform:uppercase; } .spx-profile-field > .fieldBox,.spx-profile-field > [class*="col-"] { flex:none; width:100%; max-width:100%; padding:0; } .spx-profile-field .form-control,.spx-profile-field select,.spx-profile-field textarea { width:100%; min-height:46px; font-size:.92rem; } .spx-profile-field .readonly { min-height:46px; padding:11px 13px !important; background:#fff !important; font-size:.92rem; } .spx-call-customer { display:grid; grid-template-columns:30px minmax(0,1fr); align-items:center; gap:0 8px; width:100%; margin-top:7px; padding:7px 9px; color:#176247 !important; background:#e9f8f1; border:1px solid #bfe6d3; border-radius:9px; text-decoration:none !important; transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease; } .spx-call-customer > i { grid-row:1/3; display:grid; place-items:center; width:30px; height:30px; color:#fff; background:#159363; border-radius:8px; font-size:.68rem; } .spx-call-customer > span { font-size:.65rem; font-weight:880; line-height:1.15; }.spx-call-customer > small { margin-top:2px; color:#5d7d6f; font-family:monospace; font-size:.56rem; line-height:1.15; } .spx-call-customer:hover { color:#12543d !important; border-color:#79c5a2; box-shadow:0 6px 14px rgba(21,147,99,.13); transform:translateY(-1px); } .spx-call-customer.is-disabled { cursor:not-allowed; filter:grayscale(.7); opacity:.55; transform:none; } .spx-section-summary { --spx-section-color:#176f8e !important; }.spx-section-provision,.spx-section-ticket { --spx-section-color:#de791e !important; }.spx-section-profile { --spx-section-color:#28799f !important; }.spx-section-billing,.spx-section-finance { --spx-section-color:#19845c !important; }.spx-section-timeline { --spx-section-color:#5270ad !important; }.spx-section-contracts { --spx-section-color:#7660a9 !important; }.spx-section-auth { --spx-section-color:#c38b1c !important; }.spx-section-equipment { --spx-section-color:#317590 !important; }.spx-section-other { --spx-section-color:#7d8c95 !important; } .spx-ticket-launcher { display:flex; align-items:center; justify-content:space-between; gap:22px; padding:4px 0 10px; } .model-clienterbx.change-form .field-painel_chamado_rbx .readonly { padding:0; background:transparent; border:0; } .spx-ticket-launcher-copy { flex:0 0 210px; } .spx-ticket-launcher-copy strong,.spx-ticket-launcher-copy small { display:block; } .spx-ticket-launcher-copy strong { margin:4px 0; color:#203846; font-size:.94rem; } .spx-ticket-launcher-copy small { color:#7d8d97; font-size:.7rem; } .spx-ticket-eyebrow,.spx-ticket-modal-eyebrow { color:#df7417; font-size:.62rem; font-weight:850; letter-spacing:.09em; text-transform:uppercase; } .spx-ticket-type-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; flex:1; } .spx-ticket-type { display:flex; align-items:center; gap:10px; min-height:66px; padding:11px 12px; text-align:left; background:#fff; border:1px solid #dce6eb; border-radius:11px; box-shadow:0 5px 14px rgba(20,43,58,.055); cursor:pointer; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; } .spx-ticket-type:hover { transform:translateY(-2px); border-color:#e9ad71; box-shadow:0 9px 20px rgba(20,43,58,.1); } .spx-ticket-type > i { display:grid; place-items:center; flex:0 0 auto; width:35px; height:35px; color:#fff; border-radius:9px; } .spx-ticket-type.support > i { background:#db7218; }.spx-ticket-type.installation > i { background:#16865b; }.spx-ticket-type.change > i { background:#2e6f98; }.spx-ticket-type.other > i { background:#6e5aa2; } .spx-ticket-type strong,.spx-ticket-type small { display:block; } .spx-ticket-type strong { color:#29414f; font-size:.72rem; }.spx-ticket-type small { margin-top:2px; color:#86949d; font-size:.6rem; } .spx-open-tickets { margin:18px 0 4px; overflow:hidden; background:#f8fafb; border:1px solid #dce5ea; border-radius:13px; } .spx-open-tickets-header { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px 17px; background:#fff; border-bottom:1px solid #e2e9ed; } .spx-open-tickets-header > div:first-child > strong,.spx-open-tickets-header > div:first-child > small { display:block; } .spx-open-tickets-header > div:first-child > strong { margin:4px 0; color:#203c4b; font-size:1rem; } .spx-open-tickets-header > div:first-child > small { color:#71838e; font-size:.7rem; } .spx-open-tickets-actions { display:flex; align-items:center; gap:8px; flex:0 0 auto; } .spx-open-tickets-count { display:grid; place-items:center; min-width:38px; height:38px; padding:0 9px; color:#fff; background:#d66f18; border-radius:10px; font-size:.9rem; font-weight:900; } .spx-open-tickets-refresh { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:38px; padding:8px 11px; color:#31566a; background:#edf4f7; border:1px solid #d4e1e7; border-radius:9px; font-size:.68rem; font-weight:850; cursor:pointer; } .spx-open-tickets-refresh:hover { color:#174b65; background:#e3eef3; border-color:#b8ccd6; } .spx-open-tickets-refresh:disabled { cursor:wait; opacity:.65; } .spx-open-tickets-tabs { display:flex; gap:7px; padding:10px 12px 0; background:#f8fafb; } .spx-open-tickets-tabs button { display:inline-flex; align-items:center; gap:7px; min-height:38px; padding:8px 11px; color:#607582; background:#edf2f5; border:1px solid #dce5ea; border-radius:9px 9px 0 0; font-size:.68rem; font-weight:850; cursor:pointer; } .spx-open-tickets-tabs button span { display:grid; place-items:center; min-width:22px; height:20px; padding:0 5px; color:#687b87; background:#fff; border-radius:999px; font-size:.58rem; } .spx-open-tickets-tabs button.is-active { color:#fff; background:#255f7c; border-color:#255f7c; }.spx-open-tickets-tabs button.is-active span { color:#245c77; } .spx-open-tickets-body { padding:12px; } .spx-open-tickets-placeholder { display:flex; align-items:center; justify-content:center; gap:10px; min-height:92px; padding:18px; color:#657985; background:#fff; border:1px dashed #cfdbe2; border-radius:10px; font-size:.76rem; text-align:center; } .spx-open-tickets-placeholder > i { color:#6d8795; font-size:1rem; } .spx-open-tickets-placeholder.is-empty { color:#257051; background:#f1faf6; border-color:#b9dfce; }.spx-open-tickets-placeholder.is-empty > i { color:#1b9867; } .spx-open-tickets-placeholder.is-error { color:#9e3d43; background:#fff3f3; border-color:#e7bec1; }.spx-open-tickets-placeholder.is-error > i { color:#ca4d55; } .spx-open-tickets-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; } .spx-open-ticket-card { min-width:0; overflow:hidden; background:#fff; border:1px solid #dce5ea; border-left:4px solid #d97720; border-radius:11px; box-shadow:0 4px 13px rgba(20,43,58,.055); } .spx-open-ticket-card.is-closed { border-left-color:#23855f; } .spx-open-ticket-top { display:flex; align-items:center; justify-content:space-between; gap:9px; padding:12px 13px 0; } .spx-open-ticket-number { color:#245d7b; font-size:.78rem; font-weight:900; } .spx-open-ticket-state { max-width:55%; padding:4px 7px; overflow:hidden; border:1px solid; border-radius:999px; font-size:.58rem; font-weight:850; text-overflow:ellipsis; white-space:nowrap; } .spx-open-ticket-state.is-open { color:#9a5a13; background:#fff5e5; border-color:#edcf9e; }.spx-open-ticket-state.is-queue { color:#6243a0; background:#f2edff; border-color:#d7ccf2; }.spx-open-ticket-state.is-running { color:#136d50; background:#e8f8f1; border-color:#b7e1cf; }.spx-open-ticket-state.is-route { color:#176183; background:#e8f5fb; border-color:#b9dce9; }.spx-open-ticket-state.is-paused { color:#786117; background:#fff9dc; border-color:#e8db93; } .spx-open-ticket-state.is-closed { color:#126847; background:#e6f6ee; border-color:#b7dfcc; } .spx-open-ticket-card h3 { margin:8px 13px 11px; color:#233e4c; font-size:.82rem; font-weight:820; line-height:1.42; overflow-wrap:anywhere; } .spx-open-ticket-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; padding:0 13px 12px; } .spx-open-ticket-info { display:grid; grid-template-columns:19px minmax(0,1fr); gap:1px 5px; min-width:0; padding:7px 8px; background:#f4f7f9; border-radius:8px; } .spx-open-ticket-info > i { grid-row:1/3; align-self:center; color:#79909d; font-size:.65rem; } .spx-open-ticket-info small,.spx-open-ticket-info strong { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .spx-open-ticket-info small { color:#87969f; font-size:.52rem; font-weight:800; text-transform:uppercase; }.spx-open-ticket-info strong { color:#3b535f; font-size:.64rem; } .spx-open-ticket-resolution { margin:0 13px 12px; padding:9px 10px; color:#3d5b50; background:#edf8f3; border:1px solid #d1e9de; border-radius:8px; } .spx-open-ticket-resolution strong { display:block; font-size:.64rem; }.spx-open-ticket-resolution p { display:-webkit-box; margin:5px 0 0; overflow:hidden; color:#60766d; font-size:.63rem; line-height:1.4; -webkit-box-orient:vertical; -webkit-line-clamp:3; } .spx-open-ticket-footer { padding:9px 13px; background:#fafcfd; border-top:1px solid #ebf0f2; } .spx-open-ticket-agenda { display:inline-flex; align-items:center; gap:6px; color:#7b8991; font-size:.62rem; font-weight:750; text-decoration:none !important; }.spx-open-ticket-agenda.is-linked { color:#15734d; }.spx-open-ticket-agenda.is-linked:hover { color:#0d5939; } .spx-open-tickets-limit { margin:10px 2px 1px; color:#7d8d96; font-size:.63rem; text-align:center; } .spx-open-tickets-pagination { display:flex; align-items:center; justify-content:center; gap:10px; margin-top:12px; } .spx-open-tickets-pagination button { min-height:34px; padding:7px 10px; color:#315d73; background:#fff; border:1px solid #cfdee5; border-radius:8px; font-size:.65rem; font-weight:800; cursor:pointer; }.spx-open-tickets-pagination button:disabled { cursor:not-allowed; opacity:.42; }.spx-open-tickets-pagination span { color:#71828c; font-size:.65rem; font-weight:750; } .spx-ticket-modal { position:fixed; z-index:10550; inset:0; display:grid; place-items:center; padding:20px; background:rgba(10,28,39,.68); backdrop-filter:blur(3px); } .spx-ticket-modal[hidden] { display:none; } .spx-ticket-modal .select2-container { z-index:2; width:100% !important; } .select2-container--open { z-index:10650 !important; } .select2-container--open .select2-dropdown { z-index:10651 !important; } .spx-ticket-dialog { position:relative; width:min(650px,100%); max-height:calc(100vh - 32px); padding:25px; overflow-x:hidden; overflow-y:auto; box-sizing:border-box; background:#fff; border-radius:17px; box-shadow:0 24px 70px rgba(3,18,28,.32); animation:spxClientSectionIn .25s ease both; } .spx-ticket-dialog h2 { margin:5px 0 3px; color:#183442; font-size:1.25rem; }.spx-ticket-dialog > p { margin:0 0 19px; color:#71838e; font-size:.76rem; } .spx-ticket-close { position:absolute; top:13px; right:15px; width:32px; height:32px; color:#6c7d87; background:#f0f4f6; border:0; border-radius:50%; font-size:1.25rem; cursor:pointer; } .spx-ticket-grid-fields { display:grid; grid-template-columns:minmax(0,1fr); gap:11px; margin-bottom:14px; } .spx-ticket-select-field { display:block; min-width:0; max-width:100%; } .spx-ticket-select-field > span { display:block; margin-bottom:6px; color:#435966; font-size:.68rem; font-weight:820; text-transform:uppercase; } .spx-ticket-select-field select { width:100%; min-height:39px; padding:8px 9px; color:#294451; background:#fafcfd; border:1px solid #d8e2e7; border-radius:9px; font-size:.72rem; } .spx-ticket-select-field .select2-container,.spx-ticket-select-field .select2-selection { min-width:0; max-width:100%; } .spx-ticket-select-field .select2-selection__rendered { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .select2-container--open .select2-results__option { overflow-wrap:anywhere; white-space:normal; } .spx-ticket-select-field small { display:block; margin-top:4px; color:#85949d; font-size:.6rem; } .spx-ticket-field > span,.spx-ticket-schedule label { display:block; margin-bottom:6px; color:#435966; font-size:.68rem; font-weight:820; text-transform:uppercase; } .spx-ticket-field textarea { width:100%; min-height:102px; padding:11px 12px; resize:vertical; color:#273f4d; background:#fafcfd; border:1px solid #d8e2e7; border-radius:10px; font:inherit; font-size:.82rem; box-sizing:border-box; } .spx-ticket-field > small,.spx-ticket-schedule small { display:block; margin-top:5px; color:#85949d; font-size:.64rem; } .spx-ticket-agenda-toggle { display:flex; align-items:center; gap:10px; margin:17px 0 11px; padding:12px; background:#f4f8fa; border:1px solid #dfe8ed; border-radius:10px; cursor:pointer; } .spx-ticket-agenda-toggle input { width:18px; height:18px; margin:0; accent-color:#df7417; }.spx-ticket-agenda-toggle strong,.spx-ticket-agenda-toggle small { display:block; }.spx-ticket-agenda-toggle strong { color:#304956; font-size:.76rem; }.spx-ticket-agenda-toggle small { margin-top:2px; color:#7b8c96; font-size:.63rem; } .spx-ticket-schedule { padding:12px; background:#fff9f2; border:1px solid #f1d4b5; border-radius:10px; }.spx-ticket-schedule[hidden] { display:none; }.spx-ticket-schedule input { width:100%; padding:9px 10px; color:#2d4654; background:#fff; border:1px solid #dfc19f; border-radius:8px; box-sizing:border-box; } .spx-ticket-flow { display:flex; flex-wrap:wrap; gap:6px; margin:16px 0 10px; }.spx-ticket-flow span { padding:5px 8px; color:#54707f; background:#edf3f6; border-radius:999px; font-size:.61rem; font-weight:750; }.spx-ticket-flow i { margin-right:3px; color:#18845d; } .spx-ticket-result { min-height:18px; margin:5px 0 12px; font-size:.71rem; line-height:1.45; }.spx-ticket-result.is-loading { color:#557483; }.spx-ticket-result.is-success { color:#14764f; }.spx-ticket-result.is-warning { color:#9a621d; }.spx-ticket-result.is-error { color:#bd3d3d; } .spx-ticket-modal-actions { display:flex; justify-content:flex-end; gap:8px; }.spx-ticket-modal-actions .button { padding:8px 13px !important; border-radius:8px !important; }.spx-ticket-cancel { color:#657984 !important; background:#edf2f4 !important; border:0 !important; }.spx-ticket-submit,.spx-ticket-agenda-link { color:#fff !important; background:#db741d !important; border:0 !important; text-decoration:none !important; }.spx-ticket-copy-protocol { color:#fff !important; background:#28799f !important; border:0 !important; } .model-clienterbx.change-form .form-group > label { color:#637583; font-size:.69rem; font-weight:800; letter-spacing:.055em; text-transform:uppercase; } .model-clienterbx.change-form .form-group .readonly { min-height:39px; margin:0; padding:9px 11px; color:#2d424f; background:#f5f8fa; border:1px solid #e1e8ed; border-radius:9px; overflow-wrap:anywhere; } .model-clienterbx.change-form fieldset.module { min-width:0; margin-bottom:16px; padding:17px 18px 8px; background:#fff; border:1px solid var(--spx-line); border-radius:15px; box-shadow:0 7px 24px rgba(20,43,58,.055); } .model-clienterbx.change-form fieldset.module > h2, .model-clienterbx.change-form fieldset.module > legend { color:var(--spx-navy); font-size:1rem; font-weight:820; } .model-clienterbx.change-form fieldset.module .description { margin:3px 0 14px; color:#768691; font-size:.76rem; line-height:1.5; } .model-clienterbx.change-form .spx-client-reveal { animation:spxClientSectionIn .36s cubic-bezier(.2,.8,.2,1) var(--spx-delay, 0ms) both; } .model-clienterbx.change-form .field-painel_resumo_cliente .readonly,.model-clienterbx.change-form .field-painel_linha_tempo_cliente .readonly { padding:0; background:transparent; border:0; } .spx-client-summary { width:100%; }.spx-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; } .spx-summary-card { position:relative; min-width:0; min-height:116px; padding:14px 13px 12px 58px; overflow:hidden; background:#f8fafb; border:1px solid #e0e8ec; border-radius:12px; }.spx-summary-icon { position:absolute; top:14px; left:13px; display:grid; place-items:center; width:34px; height:34px; color:#2678a0; background:#e7f2f7; border-radius:9px; }.spx-summary-card small,.spx-summary-card strong,.spx-summary-card > span:not(.spx-summary-icon) { display:block; }.spx-summary-card small { color:#7e8e97; font-size:.59rem; font-weight:820; letter-spacing:.045em; text-transform:uppercase; }.spx-summary-card strong { margin:5px 0 4px; overflow:hidden; color:#294552; font-size:.78rem; font-weight:880; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }.spx-summary-card > span:not(.spx-summary-icon) { color:#7d8c95; font-size:.62rem; line-height:1.35; }.spx-summary-card.is-contract .spx-summary-icon { color:#7459b0; background:#eeeafb; }.spx-summary-card.is-equipment .spx-summary-icon { color:#2b728f; }.spx-summary-card.is-ticket .spx-summary-icon { color:#ca5268; background:#fbe9ed; }.spx-summary-card.is-finance .spx-summary-icon { color:#168b74; background:#e5f5ef; }.spx-summary-card.is-update .spx-summary-icon { color:#bd7c18; background:#fff1d9; } .spx-summary-card.is-connection .spx-summary-icon { color:#b47a1c; background:#fff2d9; }.spx-summary-card.is-connection.is-online .spx-summary-icon { color:#16805a; background:#e4f5ed; }.spx-summary-card.is-connection.is-offline .spx-summary-icon { color:#bd4545; background:#fdeaea; }.spx-summary-card.is-connection.is-error .spx-summary-icon { color:#9a6c21; background:#fff2d9; } .spx-summary-card.is-status.is-blocked { background:#fff8ec; border-color:#efcf9e; }.spx-summary-card.is-status.is-blocked .spx-summary-icon { color:#b45f16; background:#ffe7c4; }.spx-summary-card.is-status.is-blocked strong { color:#9a4f12; } .spx-summary-contact { display:grid; grid-template-columns:minmax(150px,.55fr) minmax(260px,1.35fr) auto; align-items:center; gap:14px; margin-top:11px; padding:12px 14px; background:#edf3f6; border:1px solid #dde6eb; border-radius:11px; }.spx-summary-contact small,.spx-summary-contact strong { display:block; }.spx-summary-contact small { color:#82919a; font-size:.58rem; font-weight:820; text-transform:uppercase; }.spx-summary-contact strong { margin-top:3px; color:#334e5c; font-size:.7rem; overflow-wrap:anywhere; }.spx-summary-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }.spx-summary-actions a,.spx-summary-actions button { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:34px; margin:0; padding:7px 9px; color:#fff !important; background:#2678a0; border:0; border-radius:8px; font-size:.63rem; font-weight:820; text-decoration:none !important; cursor:pointer; }.spx-summary-actions a:first-child { background:#16805a; }.spx-summary-actions a:last-child { background:#745ab2; } .spx-timeline-lazy { padding:14px; background:#f8fafb; border:1px solid #dfe7eb; border-radius:12px; }.spx-timeline-placeholder { display:flex; align-items:center; gap:9px; color:#687c88; font-size:.7rem; }.spx-timeline-placeholder i { color:#5270ad; }.spx-timeline-load { display:inline-flex; align-items:center; gap:6px; min-height:35px; margin-top:11px; padding:7px 11px; color:#fff; background:#5270ad; border:0; border-radius:8px; font-size:.67rem; font-weight:820; cursor:pointer; }.spx-timeline-lazy.is-loaded > .spx-timeline-placeholder,.spx-timeline-lazy.is-loaded > .spx-timeline-load { display:none; }.spx-timeline-content.is-error { margin-top:10px; color:#ac3b3b; font-size:.7rem; } .spx-client-timeline { position:relative; padding:3px 0 3px 5px; }.spx-client-timeline::before { content:""; position:absolute; top:15px; bottom:15px; left:20px; width:2px; background:#dce4e9; }.spx-timeline-event { position:relative; display:grid; grid-template-columns:34px minmax(0,1fr); gap:12px; padding:8px 0; }.spx-timeline-marker { z-index:1; display:grid; place-items:center; width:32px; height:32px; color:#5270ad; background:#edf0fa; border:3px solid #f8fafb; border-radius:50%; font-size:.63rem; }.spx-timeline-event.is-ticket .spx-timeline-marker { color:#ca5268; background:#fbe9ed; }.spx-timeline-event.is-success .spx-timeline-marker { color:#16805a; background:#e4f5ed; }.spx-timeline-event.is-network .spx-timeline-marker { color:#2678a0; background:#e7f2f7; }.spx-timeline-event.is-warning .spx-timeline-marker { color:#b76d19; background:#fff0dc; }.spx-timeline-event.is-contract .spx-timeline-marker { color:#745ab2; background:#eeeafb; }.spx-timeline-copy { min-width:0; padding:6px 9px 8px; background:#fff; border:1px solid #e5ebef; border-radius:9px; }.spx-timeline-copy time { float:right; margin-left:10px; color:#97a3aa; font-size:.57rem; }.spx-timeline-copy strong,.spx-timeline-copy strong a { color:#304b59; font-size:.7rem; font-weight:850; text-decoration:none; }.spx-timeline-copy p { margin:3px 0 0; color:#73848e; font-size:.63rem; line-height:1.4; }.spx-timeline-empty { padding:25px; color:#7c8b94; text-align:center; font-size:.7rem; }.spx-timeline-empty i { display:block; margin-bottom:7px; font-size:1.2rem; } .spx-provision-panel { display:grid; grid-template-columns:minmax(190px,.7fr) minmax(360px,1.3fr); gap:17px; align-items:center; width:100%; padding:5px 0 8px; } .spx-provision-copy { min-width:0; } .spx-provision-copy > strong, .spx-provision-copy > small { display:block; } .spx-provision-copy > strong { margin:4px 0 5px; color:#1c3342; font-size:.98rem; } .spx-provision-copy > small { max-width:330px; color:#7a8994; font-size:.73rem; line-height:1.45; } .spx-provision-eyebrow { color:#e27717; font-size:.65rem; font-weight:850; letter-spacing:.09em; text-transform:uppercase; } .spx-provision-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .spx-olt-button { position:relative; display:grid !important; grid-template-columns:42px minmax(0,1fr) 16px; gap:10px; align-items:center; min-height:72px; padding:11px 12px !important; overflow:hidden; color:#fff !important; border:0 !important; border-radius:12px !important; box-shadow:0 8px 20px rgba(22,43,59,.14); text-decoration:none !important; transition:transform .2s ease,box-shadow .2s ease,filter .2s ease; } .spx-olt-button::after { content:""; position:absolute; top:-70%; left:-35%; width:32%; height:230%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.17),transparent); transform:rotate(18deg); transition:left .5s ease; } .spx-olt-button:hover { transform:translateY(-3px); color:#fff !important; box-shadow:0 13px 26px rgba(22,43,59,.2); } .spx-olt-button:hover::after { left:115%; } .spx-olt-vila { background:linear-gradient(130deg,#118557,#18ad73) !important; }.spx-olt-sig { background:linear-gradient(130deg,#d96d0e,#f29332) !important; } .spx-olt-icon { display:grid; place-items:center; width:40px; height:40px; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.12); border-radius:10px; font-size:.95rem; } .spx-olt-button strong,.spx-olt-button small { display:block; position:relative; z-index:1; } .spx-olt-button strong { color:#fff; font-size:.78rem; font-weight:850; text-transform:none; }.spx-olt-button small { margin-top:2px; color:rgba(255,255,255,.75); font-size:.62rem; } .spx-olt-arrow { position:relative; z-index:1; color:rgba(255,255,255,.72); font-size:.68rem; } .model-clienterbx.change-form .inline-group { min-width:0; max-width:100%; margin:0 0 16px; overflow:hidden; background:#fff; border:1px solid var(--spx-line); border-radius:15px; box-shadow:0 7px 24px rgba(20,43,58,.055); } .model-clienterbx.change-form .inline-group .tabular { display:block; width:100%; max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-width:thin; scrollbar-color:#9dafba #eef2f4; } .model-clienterbx.change-form .inline-group fieldset.module { min-width:720px; margin:0; padding:0; border:0; border-radius:0; box-shadow:none; } .model-clienterbx.change-form .inline-group table { margin:0; } .model-clienterbx.change-form .inline-group th { padding:11px 12px; background:#eef3f6; } .model-clienterbx.change-form .inline-group td { padding:11px 12px; } .model-clienterbx.change-form .inline-group td p { margin:0; } .model-clienterbx.change-form .spx-contract-inline fieldset.module { min-width:0 !important; } .model-clienterbx.change-form .spx-contract-inline table { min-width:0 !important; table-layout:fixed; } .model-clienterbx.change-form .spx-contract-inline thead { display:none; } .model-clienterbx.change-form .spx-contract-inline td { width:100%; padding:10px; background:#f4f7f9; } .model-clienterbx.change-form .spx-contract-inline td.original { display:none; } .spx-contract-card { width:100%; overflow:hidden; background:#fff; border:1px solid #dfe7ec; border-radius:12px; box-shadow:0 4px 14px rgba(20,43,58,.05); } .spx-contract-card-header { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:12px 14px; background:#f8fafb; border-bottom:1px solid #e5ebef; } .spx-contract-card-header small,.spx-contract-card-header strong { display:block; } .spx-contract-card-header small { color:#7b8b95; font-size:.62rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; } .spx-contract-card-header strong { margin-top:2px; color:#203b4b; font-size:.8rem; } .spx-main-contract-label { display:inline-block; margin-left:5px; padding:2px 5px; color:#986018; background:#fff0d8; border:1px solid #f1d3a5; border-radius:999px; font-size:.52rem; font-style:normal; font-weight:850; letter-spacing:.03em; text-transform:uppercase; vertical-align:middle; } .spx-contract-state { flex:0 0 auto; padding:5px 8px; color:#176847; background:#e5f6ee; border:1px solid #c8eadb; border-radius:999px; font-size:.63rem; font-weight:850; } .spx-contract-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:11px 14px; border-bottom:1px solid #edf1f3; } .spx-contract-facts span { min-width:0; } .spx-contract-facts small,.spx-contract-facts strong { display:block; } .spx-contract-facts small { color:#81909a; font-size:.6rem; font-weight:800; text-transform:uppercase; } .spx-contract-facts strong { margin-top:2px; color:#334d5b; font-size:.72rem; overflow-wrap:anywhere; } .spx-contract-address { display:flex; align-items:flex-start; gap:10px; padding:11px 14px; color:#385b6c; background:#f2f8fa; border-bottom:1px solid #e1ecef; }.spx-contract-address > i { margin-top:3px; color:#168b91; }.spx-contract-address small,.spx-contract-address strong { display:block; }.spx-contract-address small { color:#738993; font-size:.6rem; font-weight:800; text-transform:uppercase; }.spx-contract-address strong { margin-top:3px; font-size:.73rem; line-height:1.4; } .spx-contract-actions { display:grid; grid-template-columns:minmax(190px,.7fr) minmax(290px,1.3fr); gap:8px 12px; align-items:end; padding:11px 14px 12px; } .spx-contract-date-field > label { display:block; margin:0 0 5px; color:#667985; font-size:.64rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; } .spx-contract-start-date { width:100%; min-height:36px; padding:6px 8px; color:#263e4c; background:#f7f9fa; border:1px solid #d7e0e5; border-radius:8px; font-size:.72rem; } .spx-contract-date-hint { display:block; margin-top:4px; color:#7d8d97; font-size:.6rem; line-height:1.3; } .spx-contract-buttons { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; } .spx-contract-buttons .button { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:34px; padding:6px 9px; border:0; border-radius:8px; font-size:.68rem; font-weight:800; white-space:nowrap; cursor:pointer; } .spx-contract-save { color:#fff !important; background:#2b78b8 !important; } .spx-contract-activate { color:#fff !important; background:#169665 !important; } .spx-contract-buttons .button:disabled { cursor:not-allowed; filter:grayscale(.55); opacity:.48; } .spx-contract-result { grid-column:1/-1; display:block; min-height:16px; font-size:.65rem; line-height:1.35; } .spx-contract-result.is-loading { color:#b86816; }.spx-contract-result.is-success { color:#168156; }.spx-contract-result.is-error { color:#bd3535; } .spx-contract-filters { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 12px; padding:9px; background:#fff; border:1px solid #dfe7ec; border-radius:11px; box-shadow:0 4px 14px rgba(20,43,58,.04); } .spx-contract-filter { display:inline-flex; align-items:center; gap:7px; min-height:34px; padding:6px 10px; color:#49606d; background:#f2f6f8; border:1px solid #dce5ea; border-radius:8px; font-size:.68rem; font-weight:800; cursor:pointer; transition:background .15s ease,border-color .15s ease,color .15s ease; } .spx-contract-filter strong { min-width:20px; padding:2px 6px; color:#637783; background:#fff; border-radius:999px; font-size:.61rem; text-align:center; } .spx-contract-filter:hover { color:#1e6387; border-color:#9fc5d8; } .spx-contract-filter[aria-pressed="true"] { color:#fff; background:#246783; border-color:#246783; } .spx-contract-filter[aria-pressed="true"] strong { color:#17516c; } .spx-contract-filter-empty { margin:0 0 12px; padding:18px; color:#6d7f89; background:#fff; border:1px dashed #cbd8df; border-radius:10px; font-size:.72rem; text-align:center; } .model-clienterbx.change-form #contratos-group fieldset.module { min-width:0 !important; padding:0; background:transparent; border:0; box-shadow:none; } .model-clienterbx.change-form #contratos-group > fieldset > .card-body { padding:10px; background:#f4f7f9; } .model-clienterbx.change-form #contratos-group .panel > .card { margin-bottom:10px; background:transparent; border:0; box-shadow:none; } .model-clienterbx.change-form #contratos-group .panel > .card > .card-header { display:none; } .model-clienterbx.change-form #contratos-group .panel > .card > .card-body { padding:0; } .model-clienterbx.change-form #contratos-group .field-painel_contrato { margin:0; } .model-clienterbx.change-form #contratos-group .field-painel_contrato > .row { display:block; margin:0; } .model-clienterbx.change-form #contratos-group .field-painel_contrato > .row > label { display:none; } .model-clienterbx.change-form #contratos-group .field-painel_contrato > .row > .field-painel_contrato { width:100%; max-width:100%; padding:0; } .model-clienterbx.change-form #contratos-group .field-painel_contrato .readonly { padding:0; background:transparent; border:0; } .spx-package-header { display:grid; grid-template-columns:minmax(170px,.8fr) minmax(410px,1.7fr) auto; align-items:center; gap:14px; margin:13px 0 8px; padding:14px; color:#294552; background:#fff; border:1px solid #d8e3e9; border-left:5px solid #4f6db5; border-radius:13px; box-shadow:0 8px 22px rgba(20,43,58,.09); transition:border-color .18s ease,box-shadow .18s ease; } .spx-package-header.is-expanded { border-color:#aabce1; border-left-color:#4f6db5; box-shadow:0 10px 26px rgba(20,43,58,.12); } .spx-package-header:first-of-type { margin-top:0; } .spx-package-identity small,.spx-package-identity strong { display:block; } .spx-package-identity small { color:#667ab0; font-size:.61rem; font-weight:880; letter-spacing:.09em; text-transform:uppercase; } .spx-package-identity strong { margin-top:4px; color:#223e4c; font-size:.86rem; line-height:1.25; } .spx-package-metrics { display:grid; grid-template-columns:.65fr repeat(3,1fr); gap:7px; } .spx-package-metrics > span { min-width:0; padding:8px 9px; background:#f3f6f8; border:1px solid #e3eaee; border-radius:9px; } .spx-package-metrics small,.spx-package-metrics strong { display:block; } .spx-package-metrics small { overflow:hidden; color:#7c8b94; font-size:.54rem; font-weight:820; letter-spacing:.035em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; } .spx-package-metrics strong { margin-top:3px; overflow:hidden; color:#263f4d; font-size:.78rem; font-weight:880; text-overflow:ellipsis; white-space:nowrap; } .spx-package-metrics .is-count strong { color:#4f6db5; font-size:1rem; } .spx-package-metrics .is-discount { background:#fff6e9; border-color:#f2d8b5; }.spx-package-metrics .is-discount strong { color:#b86316; } .spx-package-metrics .is-fidelity { background:#f0edff; border-color:#d8d0f3; }.spx-package-metrics .is-fidelity strong { color:#6549a6; } .spx-package-toggle { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-width:112px; min-height:40px; padding:8px 11px; color:#fff; background:#4f6db5; border:0; border-radius:9px; box-shadow:0 5px 12px rgba(79,109,181,.2); font-size:.65rem; font-weight:850; cursor:pointer; transition:transform .16s ease,background .16s ease,box-shadow .16s ease; } .spx-package-toggle:hover { background:#405ea6; box-shadow:0 7px 16px rgba(79,109,181,.28); transform:translateY(-1px); }.spx-package-toggle i { font-size:.58rem; } .model-clienterbx.change-form #jazzy-actions { position:sticky; top:78px; border-radius:14px; box-shadow:0 8px 25px rgba(20,43,58,.09); } .model-clienterbx.change-form .field-painel_financeiro_rbx .readonly { padding:0; background:transparent; border:0; } .spx-finance-lazy { padding:16px; background:#f7fafb; border:1px solid #dce6eb; border-radius:12px; } .spx-finance-lazy-state { display:flex; align-items:center; gap:11px; color:#48616e; }.spx-finance-lazy-state > i { display:grid; place-items:center; width:38px; height:38px; color:#168b91; background:#e3f4f4; border-radius:10px; }.spx-finance-lazy-state strong,.spx-finance-lazy-state small { display:block; }.spx-finance-lazy-state strong { font-size:.8rem; }.spx-finance-lazy-state small { margin-top:2px; color:#7d8d96; font-size:.68rem; } .spx-finance-load { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:35px; margin-top:12px; padding:7px 12px; color:#fff; background:#168b91; border:0; border-radius:8px; font-size:.69rem; font-weight:800; cursor:pointer; }.spx-finance-load:disabled { cursor:wait; opacity:.68; } .spx-finance-lazy-content:not(:empty) { margin-top:13px; }.spx-finance-lazy.is-loaded .spx-finance-lazy-state { display:none; }.spx-finance-lazy-error { padding:11px; color:#a93636; background:#fff0f0; border:1px solid #f2caca; border-radius:8px; font-size:.72rem; } .spx-finance-history-load { display:inline-flex; align-items:center; gap:6px; min-height:35px; margin:11px 0 0 7px; padding:7px 11px; color:#fff; background:#5270ad; border:0; border-radius:8px; font-size:.67rem; font-weight:820; cursor:pointer; }.spx-finance-history-load:disabled { opacity:.65; cursor:wait; }.spx-finance-history-content:not(:empty) { margin-top:13px; }.spx-paid-history { overflow:hidden; background:#fff; border:1px solid #dfe7ec; border-radius:11px; }.spx-paid-history > header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; background:#f3f6fb; border-bottom:1px solid #dfe7ec; }.spx-paid-history header small,.spx-paid-history header strong { display:block; }.spx-paid-history header small { color:#7b8b95; font-size:.6rem; font-weight:800; text-transform:uppercase; }.spx-paid-history header strong { margin-top:2px; color:#28455a; font-size:.82rem; }.spx-paid-history header > span { padding:5px 8px; color:#42609a; background:#e7edf9; border-radius:999px; font-size:.64rem; font-weight:850; }.spx-paid-history-table-wrap { overflow-x:auto; }.spx-paid-history table { width:100%; border-collapse:collapse; font-size:.69rem; }.spx-paid-history th { padding:9px 10px; color:#607582; background:#fafbfc; text-align:left; white-space:nowrap; }.spx-paid-history td { padding:9px 10px; color:#3e5663; border-top:1px solid #edf1f3; }.spx-paid-history td small { display:block; margin-top:2px; color:#86959d; }.spx-paid-badge { display:inline-flex; align-items:center; gap:5px; padding:4px 7px; color:#16724e; background:#e8f7f0; border-radius:999px; white-space:nowrap; font-weight:800; }.spx-paid-history-empty { display:flex; align-items:center; justify-content:center; gap:8px; min-height:90px; color:#71848f; }.spx-paid-history-limit { display:block; padding:8px 12px; color:#7c8b94; border-top:1px solid #edf1f3; } .spx-finance-history-load,.spx-nfcom-load { display:inline-flex; align-items:center; gap:6px; min-height:35px; margin:11px 0 0 7px; padding:7px 11px; color:#fff; background:#5270ad; border:0; border-radius:8px; font-size:.67rem; font-weight:820; cursor:pointer; }.spx-finance-history-load:disabled,.spx-nfcom-load:disabled { opacity:.65; cursor:wait; }.spx-nfcom-content:not(:empty) { margin-top:13px; } .spx-backup-panel { margin:0 0 22px; padding:20px; background:linear-gradient(135deg,#f5fbf8 0%,#fff 70%); border:1px solid #cfe7da; border-left:5px solid #198754; border-radius:16px; box-shadow:0 10px 26px rgba(25,80,58,.08); } .spx-backup-heading { display:flex; align-items:center; gap:14px; } .spx-backup-heading h2 { margin:2px 0 3px; color:#24453a; font-size:1.05rem; font-weight:850; } .spx-backup-heading p { margin:0; color:#667b73; font-size:.72rem; } .spx-backup-icon { display:grid; flex:0 0 48px; place-items:center; width:48px; height:48px; color:#fff; background:#198754; border-radius:13px; box-shadow:0 7px 15px rgba(25,135,84,.22); font-size:1.1rem; } .spx-backup-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:17px 0 14px; } .spx-backup-facts > div { padding:11px 12px; background:#fff; border:1px solid #dce9e2; border-radius:10px; } .spx-backup-facts small,.spx-backup-facts strong { display:block; } .spx-backup-facts small { color:#7b8d86; font-size:.59rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; } .spx-backup-facts strong { margin-top:4px; color:#2d4c41; font-size:.75rem; } .spx-backup-facts strong.is-sucesso { color:#198754; }.spx-backup-facts strong.is-erro { color:#bd3535; }.spx-backup-facts strong.is-executando { color:#b86816; } .spx-backup-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; } .spx-backup-actions .button { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:38px; padding:8px 13px; color:#fff !important; background:#198754; border:0; border-radius:9px; font-size:.7rem; font-weight:820; } .spx-backup-actions .button:disabled { cursor:wait; opacity:.6; } .spx-backup-actions .spx-backup-secondary { color:#315f4f !important; background:#e8f3ed; } #dashboard-system-backup-result { color:#526e64; font-size:.68rem; font-weight:700; } .spx-backup-note { margin:13px 0 0; padding-top:11px; color:#667a73; border-top:1px solid #dce9e2; font-size:.67rem; } .spx-backup-note i { margin-right:5px; color:#33423d; } /* Dashboard · Central de Operações ISP */ .smartpex-admin-dashboard .spx-dashboard { max-width:1580px; } .smartpex-admin-dashboard .spx-hero { align-items:stretch; min-height:250px; padding:35px 40px 56px; background:radial-gradient(circle at 78% 22%,rgba(31,172,187,.18),transparent 28%),linear-gradient(125deg,#0d2331 0%,#15394d 58%,#18566a 100%); } .smartpex-admin-dashboard .spx-hero::before { right:-72px; bottom:-145px; width:390px; height:390px; border-width:72px; } .smartpex-admin-dashboard .spx-hero-copy { display:flex; align-items:flex-start; flex-direction:column; justify-content:center; width:min(760px,72%); } .smartpex-admin-dashboard .spx-hero h1 { margin:10px 0 5px; font-size:clamp(1.7rem,2.5vw,2.4rem); } .smartpex-admin-dashboard .spx-hero p { color:#bcd0db; font-size:.9rem; } .spx-command-search { display:grid; grid-template-columns:20px minmax(0,1fr) auto; gap:9px; align-items:center; width:min(620px,100%); min-height:48px; margin-top:21px; padding:5px 6px 5px 15px; background:rgba(255,255,255,.96); border:1px solid rgba(255,255,255,.35); border-radius:12px; box-shadow:0 12px 28px rgba(2,15,23,.2); } .spx-command-search > i { color:#66808d; font-size:.78rem; } .spx-command-search input { min-width:0; height:36px; padding:0; color:#1d3644; background:transparent; border:0; outline:0; font-size:.78rem; } .spx-command-search input::placeholder { color:#8598a2; } .spx-command-search button { min-height:36px; padding:7px 15px; color:#fff; background:#ec861f; border:0; border-radius:8px; font-size:.68rem; font-weight:850; cursor:pointer; } .spx-command-search button:hover { background:#d97210; } .spx-hero-system { position:relative; z-index:1; display:flex; align-items:flex-end; align-self:center; flex-direction:column; justify-content:center; min-width:185px; color:#fff; } .spx-live-pill { display:inline-flex; align-items:center; gap:7px; margin-bottom:13px; padding:6px 10px; color:#bff3dc; background:rgba(6,25,34,.3); border:1px solid rgba(154,232,200,.2); border-radius:999px; font-size:.64rem; font-weight:800; letter-spacing:.03em; } .spx-live-pill i { width:7px; height:7px; background:#43d891; border-radius:50%; box-shadow:0 0 0 5px rgba(67,216,145,.1); animation:spxStatusPulse 1.8s ease-in-out infinite; } .spx-hero-system > strong { font-size:2.25rem; font-weight:850; letter-spacing:-.06em; line-height:1; } .spx-hero-system > small { margin-top:6px; color:#b8ced9; font-size:.65rem; font-weight:700; } .spx-signal { display:flex; align-items:flex-end; gap:4px; height:28px; margin-top:14px; } .spx-signal span { display:block; width:6px; background:#55d6cb; border-radius:4px; box-shadow:0 0 12px rgba(85,214,203,.22); } .spx-signal span:nth-child(1) { height:8px; opacity:.55; }.spx-signal span:nth-child(2) { height:14px; opacity:.7; }.spx-signal span:nth-child(3) { height:20px; opacity:.85; }.spx-signal span:nth-child(4) { height:27px; } .spx-operations-strip { position:relative; z-index:3; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; margin:-34px 22px 26px; } .spx-operation-card { display:grid; grid-template-columns:43px minmax(0,1fr); gap:11px; align-items:center; min-height:98px; padding:14px; color:#243c49 !important; background:rgba(255,255,255,.98); border:1px solid #dce6eb; border-radius:14px; box-shadow:0 11px 30px rgba(15,39,54,.11); text-decoration:none !important; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; } .spx-operation-card:hover { transform:translateY(-3px); border-color:#adcbd8; box-shadow:0 15px 34px rgba(15,39,54,.15); } .spx-operation-icon { display:grid; place-items:center; width:42px; height:42px; color:#267a9b; background:#e6f3f7; border-radius:11px; font-size:.92rem; } .spx-operation-card small,.spx-operation-card strong,.spx-operation-card em { display:block; } .spx-operation-card small { overflow:hidden; color:#72848e; font-size:.58rem; font-weight:850; letter-spacing:.055em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; } .spx-operation-card strong { margin:2px 0 1px; color:#193646; font-size:1.35rem; font-weight:880; line-height:1.05; } .spx-operation-card em { overflow:hidden; color:#7c8d96; font-size:.62rem; font-style:normal; text-overflow:ellipsis; white-space:nowrap; } .spx-operation-card.is-field .spx-operation-icon { color:#7a58be; background:#f0ebfb; }.spx-operation-card.is-clients .spx-operation-icon { color:#16805a; background:#e5f6ee; }.spx-operation-card.is-network .spx-operation-icon { color:#178b88; background:#e4f5f4; } .spx-operation-card.is-alert { border-color:#f0cfab; }.spx-operation-card.is-alert .spx-operation-icon { color:#bd6618; background:#fff0de; }.spx-operation-card.is-alert strong { color:#b35e14; } .spx-quick-heading { min-height:auto; margin:0 0 12px; } .spx-sync-state { display:inline-flex; align-items:center; gap:6px; padding:7px 10px; color:#58717e; background:#e8eef1; border-radius:999px; font-size:.63rem; font-weight:780; } .spx-sync-state.is-sucesso { color:#176c4a; background:#e2f4eb; }.spx-sync-state.is-erro { color:#a64040; background:#fae7e7; }.spx-sync-state.is-executando i { animation:fa-spin 1.2s linear infinite; } .smartpex-admin-dashboard .spx-quick-grid { grid-template-columns:repeat(auto-fit,minmax(225px,1fr)); margin:0 0 28px; gap:12px; } .smartpex-admin-dashboard .spx-quick-card { min-height:88px; padding:15px; border-radius:13px; box-shadow:0 6px 20px rgba(19,42,58,.065); } .smartpex-admin-dashboard .spx-quick-card:hover { transform:translateY(-2px); box-shadow:0 11px 26px rgba(19,42,58,.11); } .spx-quick-finance .spx-quick-icon { color:#168b91; background:#e3f4f4; }.spx-quick-finance:hover { border-color:#7ec9ca; } .smartpex-admin-dashboard .spx-backup-panel { margin:0 0 27px; } .smartpex-admin-dashboard .spx-module-card { box-shadow:0 5px 18px rgba(20,43,58,.045); } @media (max-width:1199px) { .spx-operations-strip { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:767px) { .smartpex-admin-dashboard .spx-hero { min-height:290px; padding:25px 20px 54px; } .smartpex-admin-dashboard .spx-hero-copy { width:100%; } .spx-hero-system { display:none; } .spx-command-search { grid-template-columns:18px minmax(0,1fr); padding-right:12px; } .spx-command-search button { grid-column:1/-1; width:100%; } .spx-operations-strip { grid-template-columns:1fr 1fr; gap:8px; margin:-31px 8px 23px; } .spx-operation-card { grid-template-columns:1fr; align-content:start; min-height:132px; padding:12px; } .spx-operation-icon { width:36px; height:36px; } .spx-operation-card strong { margin-top:5px; font-size:1.2rem; } .spx-operation-card em { white-space:normal; } .spx-sync-state { display:none; } .smartpex-admin-dashboard .spx-quick-grid { grid-template-columns:1fr; margin:0 0 24px; } } @keyframes spxClientHeroIn { from { opacity:0; transform:translateY(-10px) scale(.99); } to { opacity:1; transform:translateY(0) scale(1); } } @keyframes spxClientSectionIn { from { opacity:0; transform:translateY(9px); } to { opacity:1; transform:translateY(0); } } @keyframes spxStatusPulse { 50% { opacity:.4; transform:scale(.8); } } @media (max-width: 991px) { .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-9, .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-3 { max-width:100%; flex-basis:100%; } .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-9 > .card > .card-body { display:block; } .model-clienterbx.change-form #jazzy-actions { position:static; margin-top:4px; } .model-clienterbx.change-form #jazzy-tabs.spx-client-section-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:0 0 18px; } .spx-package-header { grid-template-columns:1fr; } .spx-package-toggle { width:100%; } .spx-provision-panel { grid-template-columns:1fr; } .spx-provision-copy > small { max-width:none; } .spx-ticket-launcher { align-items:stretch; flex-direction:column; } .spx-ticket-launcher-copy { flex:auto; } .spx-client-section-nav,.model-clienterbx.change-form #jazzy-tabs.spx-client-section-tabs { position:relative; top:auto; } } @media (min-width: 992px) and (max-width: 1199px) { .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-9 { max-width:100%; flex-basis:100%; } .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-3 { max-width:100%; flex-basis:100%; } .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-9 > .card > .card-body { display:block; } .model-clienterbx.change-form #jazzy-tabs.spx-client-section-tabs { position:relative; top:auto; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:0 0 18px; } } @media (max-width: 767px) { .spx-ops-switcher { grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; } .spx-ops-switcher a { min-width:0; padding:8px; } .spx-ops-switcher-copy small { display:none; } .spx-backup-heading { align-items:flex-start; } .spx-backup-facts { grid-template-columns:1fr; } .spx-backup-actions { align-items:stretch; flex-direction:column; } .spx-backup-actions .button { width:100%; } .model-clienterbx.change-form .content-header { padding:14px 12px 3px; } .model-clienterbx.change-form .content { padding-left:10px !important; padding-right:10px !important; } .model-clienterbx.change-form .breadcrumb { flex-wrap:nowrap; max-width:100%; overflow-x:auto; padding-bottom:7px; white-space:nowrap; } .spx-client-hero { align-items:flex-start; flex-direction:column; gap:15px; padding:19px 17px; border-radius:14px; } .spx-client-back { width:100%; } .spx-client-backbar { align-items:stretch; flex-direction:column; }.spx-client-sequence { justify-content:space-between; width:100%; margin-left:0; }.spx-client-sequence > small { text-align:center; }.spx-client-sequence > a,.spx-client-sequence > span { flex:1; justify-content:center; } .spx-client-identity { align-items:flex-start; width:100%; } .spx-client-avatar { width:48px; height:48px; border-radius:13px; } .spx-client-identity > div { min-width:0; } .spx-client-hero h1 { max-width:calc(100vw - 110px); font-size:1.18rem; } .model-clienterbx.change-form #jazzy-tabs.spx-client-section-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); } .spx-section-nav-link small { display:none; } .spx-profile-form-row { grid-template-columns:1fr; } .spx-summary-grid { grid-template-columns:1fr; }.spx-summary-contact { grid-template-columns:1fr; }.spx-summary-actions { display:grid; grid-template-columns:1fr; }.spx-summary-actions a,.spx-summary-actions button { width:100%; } .spx-client-meta { align-items:flex-start; flex-direction:column; gap:4px; } .spx-client-status { width:100%; min-width:0; } .model-clienterbx.change-form fieldset.module { padding:14px 13px 5px; border-radius:12px; } .model-clienterbx.change-form .form-row { margin-right:0; margin-left:0; } .model-clienterbx.change-form .form-group { min-width:0; padding-right:0; padding-left:0; } .spx-provision-actions { grid-template-columns:1fr; } .spx-ticket-type-actions { grid-template-columns:1fr; } .spx-open-tickets-header { align-items:flex-start; flex-direction:column; } .spx-open-tickets-actions { width:100%; }.spx-open-tickets-refresh { flex:1; } .spx-open-tickets-grid,.spx-open-ticket-details { grid-template-columns:1fr; } .spx-ticket-grid-fields { grid-template-columns:1fr; } .spx-ticket-dialog { padding:21px 16px; border-radius:14px; } .spx-ticket-modal-actions { flex-wrap:wrap; } .spx-ticket-modal-actions .spx-ticket-submit { flex:1; } .spx-olt-button { min-height:68px; } .model-clienterbx.change-form .inline-group { border-radius:12px; } .model-clienterbx.change-form .inline-group::after { content:"Deslize para o lado para ver todos os dados"; position:sticky; left:0; display:block; width:max-content; max-width:100%; padding:8px 12px; color:#7a8994; background:#f7f9fa; font-size:.65rem; } .model-clienterbx.change-form .spx-contract-inline::after { display:none; content:none; } .spx-contract-card-header { align-items:flex-start; flex-direction:column; gap:7px; } .spx-contract-filters { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); } .spx-contract-filter { justify-content:space-between; } .spx-package-header { grid-template-columns:1fr; gap:10px; } .spx-package-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } .spx-package-toggle { width:100%; } .spx-contract-facts { grid-template-columns:repeat(2,minmax(0,1fr)); } .spx-contract-actions { grid-template-columns:1fr; } .spx-contract-buttons { grid-template-columns:1fr; } .model-clienterbx.change-list .object-tools { align-items:stretch; flex-direction:column; width:100%; } .model-clienterbx.change-list .object-tools li, .model-clienterbx.change-list .object-tools a { width:100%; margin-left:0 !important; justify-content:center; } } /* Cliente RBX: central de acesso rápido, inspirada na dashboard em tons claros */ .model-clienterbx.change-form #clienterbx_form > .row > .col-lg-9 > .card > .card-body { display:block !important; } .model-clienterbx.change-form #jazzy-tabs.spx-client-section-tabs { position:relative; top:auto; display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:11px; width:100%; margin:0 0 20px; padding:14px; overflow:visible; background: radial-gradient(circle at 9% 10%,rgba(68,207,190,.14),transparent 24%), radial-gradient(circle at 91% 12%,rgba(74,169,215,.14),transparent 25%), linear-gradient(145deg,#f7fcfc,#f3f8fb); border:1px solid #d8e8eb; border-radius:18px; box-shadow:0 10px 28px rgba(34,92,108,.08); } .model-clienterbx.change-form #jazzy-tabs.spx-client-section-tabs::before { content:"ACESSO RÁPIDO DO CLIENTE"; grid-column:1/-1; margin:0 0 2px; color:#5a7b86; font-size:.61rem; font-weight:900; letter-spacing:.14em; text-align:center; } .model-clienterbx.change-form #jazzy-tabs .nav-item { margin:0 !important; } .model-clienterbx.change-form #jazzy-tabs .nav-item.spx-nav-primary { width:100%; min-width:0; } .model-clienterbx.change-form #jazzy-tabs .spx-nav-primary .spx-section-nav-link { grid-template-columns:42px minmax(0,1fr); gap:10px; min-height:72px; padding:10px 12px !important; background:rgba(255,255,255,.94) !important; border:1px solid color-mix(in srgb,var(--spx-nav-color) 23%,#dce9ed) !important; border-radius:14px !important; box-shadow:0 7px 18px rgba(37,94,111,.075); } .model-clienterbx.change-form #jazzy-tabs .spx-nav-primary .spx-section-nav-link::before { width:3px; opacity:.8; } .model-clienterbx.change-form #jazzy-tabs .spx-nav-primary .spx-section-nav-link > i { width:42px; height:42px; background:color-mix(in srgb,var(--spx-nav-color) 12%,#fff); border:1px solid color-mix(in srgb,var(--spx-nav-color) 15%,transparent); border-radius:13px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.7),0 7px 15px color-mix(in srgb,var(--spx-nav-color) 12%,transparent); font-size:1rem; } .model-clienterbx.change-form #jazzy-tabs .spx-nav-primary .spx-section-nav-link strong { color:#294956; font-size:.78rem; } .model-clienterbx.change-form #jazzy-tabs .spx-nav-primary .spx-section-nav-link small { margin-top:3px; color:#6e8790; font-size:.61rem; } .model-clienterbx.change-form #jazzy-tabs .spx-nav-primary .spx-section-nav-link > em { display:none; } .model-clienterbx.change-form #jazzy-tabs .spx-nav-primary .spx-section-nav-link:hover, .model-clienterbx.change-form #jazzy-tabs .spx-nav-primary .spx-section-nav-link.active, .model-clienterbx.change-form #jazzy-tabs .spx-nav-primary .spx-section-nav-link.is-current { background:color-mix(in srgb,var(--spx-nav-color) 7%,#fff) !important; border-color:color-mix(in srgb,var(--spx-nav-color) 46%,#c9dfe5) !important; box-shadow:0 12px 25px color-mix(in srgb,var(--spx-nav-color) 14%,transparent); } .spx-nav-break { display:none !important; } .model-clienterbx.change-form #jazzy-tabs .nav-item.spx-nav-secondary { width:100%; min-width:0; } .model-clienterbx.change-form #jazzy-tabs .spx-nav-secondary .spx-section-nav-link { grid-template-columns:42px minmax(0,1fr); gap:10px; width:100%; min-height:72px; padding:10px 12px !important; background:rgba(255,255,255,.94) !important; border:1px solid color-mix(in srgb,var(--spx-nav-color) 23%,#dce9ed) !important; border-radius:14px !important; box-shadow:0 7px 18px rgba(37,94,111,.075); } .model-clienterbx.change-form #jazzy-tabs .spx-nav-secondary .spx-section-nav-link > em { display:none; } .model-clienterbx.change-form #jazzy-tabs .spx-nav-secondary .spx-section-nav-link > i { width:42px; height:42px; border-radius:13px; font-size:1rem; } .model-clienterbx.change-form #jazzy-tabs .spx-nav-secondary .spx-section-nav-link strong { color:#294956; font-size:.78rem; white-space:normal; } .model-clienterbx.change-form #jazzy-tabs .spx-nav-secondary .spx-section-nav-link small { display:block; margin-top:3px; color:#6e8790; font-size:.61rem; } .model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link { grid-template-columns:42px minmax(0,1fr); gap:10px; min-height:72px; padding:10px 12px !important; background:rgba(255,255,255,.94) !important; border:1px solid color-mix(in srgb,var(--spx-nav-color) 23%,#dce9ed) !important; border-radius:14px !important; box-shadow:0 7px 18px rgba(37,94,111,.075); } .model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link::before { display:block; width:3px; opacity:.8; } .model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link > i { width:42px; height:42px; background:color-mix(in srgb,var(--spx-nav-color) 12%,#fff); border:1px solid color-mix(in srgb,var(--spx-nav-color) 15%,transparent); border-radius:13px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.7),0 7px 15px color-mix(in srgb,var(--spx-nav-color) 12%,transparent); font-size:1rem; } .model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link strong { color:#294956; font-size:.78rem; } .model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link small { display:block; margin-top:3px; color:#6e8790; font-size:.61rem; } .model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link > em { display:none; } .model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link:hover, .model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link.active, .model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link.is-current { background:color-mix(in srgb,var(--spx-nav-color) 7%,#fff) !important; border-color:color-mix(in srgb,var(--spx-nav-color) 46%,#c9dfe5) !important; box-shadow:0 12px 25px color-mix(in srgb,var(--spx-nav-color) 14%,transparent); } @media (max-width:991px) { .model-clienterbx.change-form #jazzy-tabs.spx-client-section-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:11px; border-radius:14px; } .model-clienterbx.change-form #jazzy-tabs .nav-item.spx-nav-primary { min-width:0; } .model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link { grid-template-columns:40px minmax(0,1fr); min-height:70px; padding:10px !important; } .model-clienterbx.change-form #jazzy-tabs .spx-section-nav-link > i { width:40px; height:40px; } } @media (max-width:430px) { .model-clienterbx.change-form #jazzy-tabs.spx-client-section-tabs { grid-template-columns:1fr; } }