/* ========================================= CARTÕES — RESUMO GERAL ========================================= */ .nf-cards-summary{ display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:14px; } .nf-cards-summary__item{ background:#ffffff; border-radius:16px; padding:14px 16px; box-shadow: 0 10px 30px rgba(0,0,0,.04); display:flex; flex-direction:column; gap:6px; } .nf-cards-summary__item small{ font-size:12px; color:#8e8577; font-weight:600; } .nf-cards-summary__item strong{ font-size:18px; color:#211404; font-weight:800; } #nfRegisterCartoesPanel .nf-cartoes-grid:not( .nf-cartoes-select-mode ) .nf-credit-card, #nfCategoriesPage .nf-cartoes-grid:not( .nf-cartoes-select-mode ) .nf-credit-card{ cursor:grab; } /* ========================================= CARTÕES — GRID ========================================= */ #nfRegisterCartoesPanel .nf-cartoes-grid, #nfCategoriesPage .nf-cartoes-grid{ display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap:14px; } .nf-cartoes-empty{ grid-column:1 / -1; margin:0; padding:48px 20px; text-align:center; font-size:15px; line-height:1.5; color:#6b7280; } /* ========================================= BARRA DE AÇÕES ========================================= */ #nfCategoriesPage .nf-cartoes-actions-bar{ display:flex; align-items:center; justify-content:flex-start; gap:16px; flex-wrap:wrap; } #nfCategoriesPage .nf-cartoes-actions-start{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; } #nfCategoriesPage .nf-cartoes-actions-bar .nf-secondary-btn{ height:44px; min-height:44px; padding:0 18px; font-size:14px; font-family:'Inter',sans-serif; } #nfCategoriesPage .nf-cartoes-actions-bar .nf-primary-btn{ height:44px; min-height:44px; padding:0 22px; font-size:14px; font-weight:600; white-space:nowrap; } #nfCategoriesPage .nf-cartoes-actions-bar .nf-secondary-btn.is-active, #nfCategoriesPage .nf-cartoes-actions-bar .nf-secondary-btn.is-confirm{ box-shadow:0 0 0 2px rgba(243,211,138,.45); } #nfCategoriesPage .nf-cartoes-actions-bar .nf-secondary-btn.is-confirm{ background:#efe7d7; color:#211404; } /* ========================================= CARTÃO DE CRÉDITO — BASE (HORIZONTAL) ========================================= */ #nfRegisterCartoesPanel .nf-credit-card, #nfCategoriesPage .nf-credit-card{ position:relative; display:block; width:100%; aspect-ratio:1.72 / 1; max-height:168px; padding:0; border-radius:16px; color:#ffffff; overflow:hidden; box-shadow: 0 12px 28px rgba(18,11,2,.2); transition: transform .22s ease, box-shadow .22s ease; } #nfRegisterCartoesPanel .nf-credit-card::before, #nfCategoriesPage .nf-credit-card::before{ content:""; position:absolute; inset:0; background:linear-gradient( 145deg, rgba(255,255,255,.18) 0%, transparent 42%, rgba(0,0,0,.12) 100% ); pointer-events:none; } #nfCategoriesPage .nf-credit-card:hover{ transform:translateY(-3px); box-shadow: 0 16px 34px rgba(18,11,2,.26); } #nfCategoriesPage .nf-cartoes-grid.nf-cartoes-select-mode .nf-credit-card{ cursor:pointer; } #nfCategoriesPage .nf-cartoes-grid.nf-cartoes-select-mode--edit .nf-credit-card:hover{ box-shadow: 0 0 0 2px rgba(255,255,255,.55), 0 16px 34px rgba(18,11,2,.26); } #nfCategoriesPage .nf-credit-card.is-selected{ box-shadow: 0 0 0 2px #f3d38a, 0 8px 26px rgba(243,211,138,.42), 0 16px 34px rgba(18,11,2,.28); transform:translateY(-1px); } #nfRegisterCartoesPanel .nf-credit-card.is-dragging-source, #nfCategoriesPage .nf-credit-card.is-dragging-source{ opacity:.34; cursor:grabbing; } body.nf-card-dragging-active{ user-select:none; cursor:grabbing; } .nf-credit-card--drag-ghost{ position:fixed; z-index:10050; margin:0; pointer-events:none; opacity:.97; transform:rotate(-1deg) scale(1.02); box-shadow: 0 22px 44px rgba(18,11,2,.3); transition:none; touch-action:none; } #nfRegisterCartoesPanel .nf-credit-card__body, #nfCategoriesPage .nf-credit-card__body{ position:relative; z-index:1; display:flex; flex-direction:column; justify-content:space-between; gap:6px; height:100%; padding:12px 14px 10px; box-sizing:border-box; border-radius:inherit; overflow:hidden; } #nfCategoriesPage .nf-credit-card__row{ display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0; } #nfCategoriesPage .nf-credit-card__row--head{ align-items:flex-start; } #nfCategoriesPage .nf-credit-card__row--head .nf-switch{ flex-shrink:0; margin-left:auto; } #nfCategoriesPage .nf-credit-card__bank{ display:flex; align-items:center; gap:8px; min-width:0; flex:1; } #nfCategoriesPage .nf-credit-card__logo{ display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:10px; background:rgba(255,255,255,.22); font-size:11px; font-weight:800; letter-spacing:.04em; flex:0 0 auto; } #nfCategoriesPage .nf-credit-card__bank-name{ font-size:12px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; } #nfCategoriesPage .nf-credit-card__brand{ display:flex; align-items:center; justify-content:flex-end; flex:0 0 auto; min-width:49px; } #nfCategoriesPage .nf-credit-card__brand-img{ display:block; width:auto; max-width:58px; max-height:31px; height:auto; object-fit:contain; object-position:right center; filter:drop-shadow(0 1px 2px rgba(0,0,0,.15)); } #nfCategoriesPage .nf-credit-card__number{ font-size:13px; font-weight:600; letter-spacing:.12em; opacity:.94; line-height:1.2; } #nfCategoriesPage .nf-credit-card__row--stats{ align-items:flex-end; } #nfCategoriesPage .nf-credit-card__stat{ font-size:10px; line-height:1.2; } #nfCategoriesPage .nf-credit-card__stat span{ display:block; opacity:.8; margin-bottom:1px; } #nfCategoriesPage .nf-credit-card__stat strong{ font-size:11px; font-weight:700; } #nfCategoriesPage .nf-credit-card__usage{ width:100%; } #nfCategoriesPage .nf-credit-card__progress{ width:100%; height:6px; border-radius:999px; background:rgba(255,255,255,.22); overflow:hidden; } #nfCategoriesPage .nf-credit-card__progress span{ display:block; height:100%; border-radius:999px; background:rgba(255,255,255,.92); transition:width .3s ease; } #nfCategoriesPage .nf-credit-card__row--foot{ font-size:10px; font-weight:600; opacity:.9; } #nfCategoriesPage .nf-credit-card__usage-label{ flex:0 0 auto; } #nfCategoriesPage .nf-credit-card__dates{ text-align:right; white-space:nowrap; } /* ========================================= SELEÇÃO — CHECKBOX ========================================= */ #nfRegisterCartoesPanel .nf-credit-card__select, #nfCategoriesPage .nf-credit-card__select{ position:absolute; top:10px; left:10px; z-index:2; display:none; margin:0; cursor:pointer; } #nfRegisterCartoesPanel .nf-cartoes-grid.nf-cartoes-select-mode .nf-credit-card__select, #nfCategoriesPage .nf-cartoes-grid.nf-cartoes-select-mode .nf-credit-card__select{ display:block; } #nfCategoriesPage .nf-credit-card__select input{ position:absolute; opacity:0; width:0; height:0; } #nfCategoriesPage .nf-credit-card__select span{ display:flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:5px; border:2px solid rgba(255,255,255,.65); background:rgba(0,0,0,.15); transition: background .15s ease, border-color .15s ease; } #nfCategoriesPage .nf-credit-card__select input:checked + span{ border-color:#f6d58a; background:#2b1600; } #nfCategoriesPage .nf-credit-card__select input:checked + span::after{ content:""; width:4px; height:8px; border-right:2px solid #f6d58a; border-bottom:2px solid #f6d58a; transform:rotate(45deg) translateY(-1px); } #nfCardDeleteConfirm .nf-card-delete-modal{ max-width:480px; width:min(480px,calc(100% - 32px)); } #nfCardDeleteConfirm .nf-card-delete-warning{ margin:0; padding:14px 16px; border-radius:12px; background:#fef2f2; border:1px solid rgba(220,38,38,.15); font-size:14px; line-height:1.5; color:#991b1b; } /* ========================================= CORES DOS CARTÕES ========================================= */ #nfCategoriesPage .nf-credit-card--purple{ background:linear-gradient( 135deg, #5b21b6 0%, #820ad1 55%, #a855f7 100% ); } #nfCategoriesPage .nf-credit-card--blue{ background:linear-gradient( 135deg, #1e3a8a 0%, #2563eb 55%, #60a5fa 100% ); } #nfCategoriesPage .nf-credit-card--black{ background:linear-gradient( 135deg, #0f0f0f 0%, #262626 55%, #404040 100% ); } #nfCategoriesPage .nf-credit-card--green{ background:linear-gradient( 135deg, #14532d 0%, #16a34a 55%, #4ade80 100% ); } #nfCategoriesPage .nf-credit-card--red{ background:linear-gradient( 135deg, #7f1d1d 0%, #dc2626 55%, #f87171 100% ); } #nfCategoriesPage .nf-credit-card--gold{ background:linear-gradient( 135deg, #78350f 0%, #b45309 45%, #fbbf24 100% ); } #nfCategoriesPage .nf-credit-card--gray{ background:linear-gradient( 135deg, #374151 0%, #6b7280 55%, #9ca3af 100% ); } #nfCategoriesPage .nf-credit-card--custom{ background:var( --nf-card-custom-color, #5b21b6 ); } /* ========================================= MODAL — CARTÃO (scroll + altura) ========================================= */ #nfCardModal, #nfCardDeleteConfirm, #nfCardDetailModal, #nfPayInvoiceModal, #nfCancelInvoicePaymentModal{ align-items:center; justify-content:center; padding:16px; } #nfCardModal .nf-modal-content, #nfCardDeleteConfirm .nf-modal-content, #nfCardDetailModal .nf-modal-content{ display:flex; flex-direction:column; max-height:90vh; width:min(640px,calc(100% - 32px)); max-width:640px; overflow:hidden; border:1px solid rgba(139,94,0,.14); box-shadow: 0 24px 64px rgba(18,11,2,.16); } #nfCardModal .nf-modal-header, #nfCardDeleteConfirm .nf-modal-header, #nfCardDetailModal .nf-modal-header{ flex-shrink:0; } #nfCardModal .nf-card-modal-body, #nfCardDeleteConfirm .nf-modal-body, #nfCardDetailModal .nf-card-detail-body{ flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; } #nfCardModal .nf-modal-footer, #nfCardDeleteConfirm .nf-modal-footer, #nfCategoryModal .nf-modal-footer, #nfCategoryDetailModal .nf-modal-footer, #nfCardDetailModal .nf-modal-footer, #nfPayInvoiceModal .nf-modal-footer, #nfCategoryDeleteConfirm .nf-modal-footer{ flex-shrink:0; margin-top:0; padding-top:16px; border-top:1px solid rgba(139,94,0,.10); display:flex; align-items:stretch; gap:10px; } #nfCardModal .nf-modal-footer .nf-primary-btn, #nfCardModal .nf-modal-footer .nf-secondary-btn, #nfCategoryModal .nf-modal-footer .nf-primary-btn, #nfCategoryModal .nf-modal-footer .nf-secondary-btn, #nfCategoryDetailModal .nf-modal-footer .nf-primary-btn, #nfCategoryDetailModal .nf-modal-footer .nf-secondary-btn, #nfCardDetailModal .nf-modal-footer .nf-primary-btn, #nfCardDetailModal .nf-modal-footer .nf-secondary-btn, #nfPayInvoiceModal .nf-modal-footer .nf-primary-btn, #nfPayInvoiceModal .nf-modal-footer .nf-secondary-btn, #nfPayInvoiceModal #nfConfirmPayInvoiceModal, #nfPayInvoiceModal #nfCancelPayInvoiceModal, #nfPayInvoiceModal #nfConfirmPayInvoiceInstallment, #nfPayInvoiceModal #nfPayInvoiceInstallmentBack, #nfPayInvoiceModal #nfPayInvoiceZeroInterestContinue, #nfPayInvoiceModal #nfPayInvoiceZeroInterestBack, #nfCancelInvoicePaymentModal #nfConfirmCancelInvoicePaymentModal, #nfCancelInvoicePaymentModal #nfDismissCancelInvoicePaymentModal{ flex:1 1 0; min-width:0; width:auto; height:44px; min-height:44px; padding:0 18px; } #nfCardModal .nf-card-modal-body{ display:flex; flex-direction:column; gap:20px; } #nfCardModal .nf-card-modal-field{ display:flex; flex-direction:column; gap:8px; } #nfCardModal .nf-card-modal-field .nf-label{ margin:0; } #nfCardModal .nf-bank-search{ width:100%; height:44px; padding:0 14px; border:1px solid rgba(139,94,0,.18); border-radius:12px; font-size:14px; font-family:'Inter',sans-serif; color:#211404; background:#fffdf8; } #nfCardModal .nf-bank-search:focus{ outline:none; border-color:#8b5e00; box-shadow:0 0 0 3px rgba(139,94,0,.12); } #nfCardModal .nf-bank-grid{ display:grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap:8px; } #nfCardModal .nf-custom-bank-tiles{ display:contents; } #nfCardModal .nf-bank-tile{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-height:72px; padding:8px 6px; border:2px solid rgba(139,94,0,.12); border-radius:14px; background:#fffdf8; cursor:pointer; transition: border-color .2s ease, background .2s ease, transform .15s ease; font-family:'Inter',sans-serif; } #nfCardModal .nf-bank-tile:hover{ border-color:rgba(139,94,0,.28); background:#f8f3e8; transform:translateY(-1px); } #nfCardModal .nf-bank-tile.selected{ border-color:#2b1600; background:#f8f3e8; box-shadow:0 0 0 1px #2b1600; } #nfCardModal .nf-bank-tile__logo{ display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:10px; font-size:11px; font-weight:800; letter-spacing:.03em; color:#ffffff; } #nfCardModal .nf-bank-tile__name{ font-size:11px; font-weight:700; color:#211404; text-align:center; line-height:1.2; } #nfCardModal .nf-bank-tile[data-bank="nubank"] .nf-bank-tile__logo{ background:#820ad1; } #nfCardModal .nf-bank-tile[data-bank="itau"] .nf-bank-tile__logo{ background:#d35400; } #nfCardModal .nf-bank-tile--outro{ background:transparent; border:2px solid rgba(139,94,0,.22); } #nfCardModal .nf-bank-tile--outro:hover{ background:rgba(248,243,232,.65); border-color:rgba(139,94,0,.35); } #nfCardModal .nf-bank-tile--outro.selected{ background:#f8f3e8; border-color:#2b1600; } #nfCardModal .nf-bank-tile--outro .nf-bank-tile__logo--plus{ width:36px; height:36px; border-radius:10px; border:2px dashed rgba(139,94,0,.28); background:transparent; color:#8b5e00; font-size:22px; font-weight:300; line-height:1; } #nfCardModal .nf-bank-tile[data-bank="bradesco"] .nf-bank-tile__logo{ background:#cc092f; } #nfCardModal .nf-bank-tile[data-bank="santander"] .nf-bank-tile__logo{ background:#ec0000; } #nfCardModal .nf-bank-tile[data-bank="caixa"] .nf-bank-tile__logo{ background:#005ca9; } #nfCardModal .nf-bank-tile[data-bank="bb"] .nf-bank-tile__logo{ background:#fcfc30; color:#005aa5; } #nfCardModal .nf-bank-tile[data-bank="inter"] .nf-bank-tile__logo{ background:#ff7a00; } #nfCardModal .nf-bank-tile[data-bank="c6"] .nf-bank-tile__logo{ background:#1a1a1a; } #nfCardModal .nf-brand-grid, #nfCardModal .nf-color-grid{ display:flex; flex-wrap:wrap; gap:8px; } #nfCardModal .nf-brand-pill{ min-height:38px; padding:0 14px; border:2px solid rgba(139,94,0,.12); border-radius:999px; background:#fffdf8; font-size:13px; font-weight:700; color:#6b5840; cursor:pointer; transition: border-color .2s ease, background .2s ease; } #nfCardModal .nf-brand-pill:hover{ border-color:rgba(139,94,0,.28); background:#f8f3e8; } #nfCardModal .nf-brand-pill.selected{ border-color:#2b1600; background:#2b1600; color:#f6d58a; } #nfCardModal .nf-color-picker-row{ display:flex; align-items:center; gap:10px; flex-wrap:nowrap; } #nfCardModal .nf-card-modal-preview-inline{ display:flex; align-items:center; gap:8px; flex:1 1 auto; min-width:0; max-width:200px; height:34px; padding:0 10px; border-radius:10px; border:1px solid rgba(33,20,4,.12); background:var( --nf-card-preview-color, #820ad1 ); color:#ffffff; } #nfCardModal .nf-card-modal-preview-inline__logo{ display:inline-flex; align-items:center; justify-content:center; min-width:26px; height:22px; padding:0 5px; border-radius:6px; background:rgba(255,255,255,.18); font-size:9px; font-weight:800; letter-spacing:.04em; flex-shrink:0; } #nfCardModal .nf-card-modal-preview-inline__bank{ font-size:12px; font-weight:700; letter-spacing:.02em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } #nfCategoriesPage .nf-credit-card__brand-text{ font-size:11px; font-weight:800; letter-spacing:.08em; line-height:1.1; text-align:right; color:rgba(255,255,255,.95); max-width:58px; overflow:hidden; text-overflow:ellipsis; } #nfCardModal .nf-color-swatch--active{ display:inline-block; flex-shrink:0; width:40px; height:40px; border:2px solid rgba(33,20,4,.22); border-radius:50%; box-shadow:0 0 0 1px rgba(246,213,138,.65); background-color:#820ad1; background-image:none !important; } #nfCardModal .nf-color-swatch--active.selected{ border-color:#211404; box-shadow:0 0 0 2px #f6d58a; } #nfCardModal .nf-color-swatch--custom{ width:auto; min-width:88px; height:36px; padding:0 12px; border-radius:999px; border:2px solid rgba(139,94,0,.18); background:#fffdf8 !important; font-size:11px; font-weight:700; color:#6b5840; line-height:1; } #nfCardModal .nf-color-swatch--custom.selected{ border-color:#2b1600; background:#f8f3e8 !important; color:#211404; } #nfCardModal .nf-card-color-custom{ display:flex; align-items:center; gap:12px; margin-top:4px; } #nfCardModal .nf-card-color-picker{ width:52px; height:40px; padding:2px; border:2px solid rgba(139,94,0,.18); border-radius:10px; background:#fffdf8; cursor:pointer; } #nfCardModal .nf-card-color-picker::-webkit-color-swatch-wrapper{ padding:0; } #nfCardModal .nf-card-color-picker::-webkit-color-swatch{ border:none; border-radius:6px; } #nfCardModal .nf-card-modal-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; } #nfCardModal .nf-card-modal-row .nf-input{ width:100%; height:44px; padding:0 14px; border:1px solid rgba(139,94,0,.18); border-radius:12px; font-size:14px; font-family:'Inter',sans-serif; color:#211404; background:#fffdf8; } #nfCardModal .nf-card-modal-footer{ display:flex; justify-content:flex-end; gap:10px; padding-top:8px; } /* ========================================= RESPONSIVO — CARTÕES ========================================= */ @media(max-width:1024px){ #nfCategoriesPage .nf-cartoes-grid{ grid-template-columns: repeat(2,minmax(0,1fr)); } #nfCategoriesPage .nf-credit-card{ max-height:156px; } } @media(max-width:768px){ #nfCategoriesPage .nf-cartoes-grid{ grid-template-columns:1fr; } #nfCategoriesPage .nf-cartoes-actions-bar{ flex-direction:column; align-items:stretch; } #nfCategoriesPage .nf-cartoes-actions-start{ width:100%; } #nfCategoriesPage .nf-cartoes-actions-bar .nf-secondary-btn, #nfCategoriesPage .nf-cartoes-actions-bar .nf-primary-btn{ flex:1; } #nfCategoriesPage .nf-credit-card{ max-height:none; } #nfCardModal .nf-bank-grid{ grid-template-columns: repeat(3,minmax(0,1fr)); } #nfCardModal .nf-card-modal-row{ grid-template-columns:1fr; } #nfCardModal .nf-modal-content, #nfCardDeleteConfirm .nf-modal-content{ max-height:90vh; width:100%; max-width:100%; } #nfCardModal .nf-modal-footer, #nfCardDeleteConfirm .nf-modal-footer{ flex-direction:column-reverse; gap:10px; } #nfCardModal .nf-modal-footer .nf-primary-btn, #nfCardModal .nf-modal-footer .nf-secondary-btn, #nfCardDeleteConfirm .nf-modal-footer .nf-danger-btn, #nfCardDeleteConfirm .nf-modal-footer .nf-secondary-btn{ width:100%; } } /* ========================================= BOTÕES — PADRÃO NEXDEN (CARTÕES) ========================================= */ #nfRegisterCartoesPanel button, #nfRegisterCategoriasPanel button, #nfCardModal button, #nfCardDeleteConfirm button, #nfCategoryModal button, #nfCategoryDeleteConfirm button{ background-image:none !important; -webkit-tap-highlight-color: transparent !important; } #nfRegisterCartoesPanel .nf-cartoes-actions-bar .nf-primary-btn, #nfRegisterCategoriasPanel .nf-cartoes-actions-bar .nf-primary-btn, #nfRegisterCartoesPanel .nf-primary-btn, #nfRegisterCategoriasPanel .nf-primary-btn, #nfCardModal .nf-primary-btn, #nfCardModal #nfSaveCardModal, #nfCategoryModal .nf-primary-btn, #nfCategoryModal #nfSaveCategoryModal, #nfCategoryDetailModal .nf-primary-btn, #nfCategoryDetailModal #nfEditCategoryFromDetail, #nfCardDetailModal .nf-primary-btn, #nfCardDetailModal #nfEditCardFromDetail{ height:44px; min-height:44px; padding:0 22px; font-size:14px; font-family:'Inter',sans-serif; background:#211404 !important; color:#f3d38a !important; border:none !important; border-radius:14px !important; font-weight:800 !important; box-shadow: 0 10px 24px rgba(18,11,2,.14) !important; } #nfRegisterCartoesPanel .nf-cartoes-actions-bar .nf-primary-btn:hover, #nfRegisterCategoriasPanel .nf-cartoes-actions-bar .nf-primary-btn:hover, #nfRegisterCartoesPanel .nf-primary-btn:hover, #nfRegisterCategoriasPanel .nf-primary-btn:hover, #nfCardModal .nf-primary-btn:hover, #nfCardModal #nfSaveCardModal:hover, #nfCategoryModal .nf-primary-btn:hover, #nfCategoryModal #nfSaveCategoryModal:hover, #nfCategoryDetailModal .nf-primary-btn:hover, #nfCategoryDetailModal #nfEditCategoryFromDetail:hover, #nfCardDetailModal .nf-primary-btn:hover, #nfCardDetailModal #nfEditCardFromDetail:hover{ background:#f3d38a !important; color:#211404 !important; transform:translateY(-2px); } #nfRegisterCartoesPanel .nf-primary-btn:focus, #nfRegisterCartoesPanel .nf-primary-btn:focus-visible, #nfRegisterCartoesPanel .nf-primary-btn:active, #nfRegisterCategoriasPanel .nf-primary-btn:focus, #nfRegisterCategoriasPanel .nf-primary-btn:focus-visible, #nfRegisterCategoriasPanel .nf-primary-btn:active, #nfCardModal .nf-primary-btn:focus, #nfCardModal .nf-primary-btn:focus-visible, #nfCardModal .nf-primary-btn:active, #nfCardModal #nfSaveCardModal:focus, #nfCardModal #nfSaveCardModal:focus-visible, #nfCardModal #nfSaveCardModal:active, #nfCategoryModal .nf-primary-btn:focus, #nfCategoryModal .nf-primary-btn:focus-visible, #nfCategoryModal .nf-primary-btn:active, #nfCategoryModal #nfSaveCategoryModal:focus, #nfCategoryModal #nfSaveCategoryModal:focus-visible, #nfCategoryModal #nfSaveCategoryModal:active{ background:#211404 !important; color:#f3d38a !important; outline:none !important; box-shadow: 0 10px 24px rgba(18,11,2,.14) !important; } #nfRegisterCategoriasPanel .nf-cartoes-actions-start .nf-secondary-btn.is-active, #nfRegisterCategoriasPanel .nf-cartoes-actions-start .nf-secondary-btn.is-confirm{ box-shadow:0 0 0 2px rgba(243,211,138,.45); } #nfRegisterCategoriasPanel .nf-cartoes-actions-start .nf-secondary-btn.is-confirm{ background:#efe7d7 !important; color:#211404 !important; } #nfRegisterCartoesPanel .nf-secondary-btn, #nfRegisterCategoriasPanel .nf-secondary-btn, #nfRegisterCategoriasPanel .nf-cartoes-actions-start .nf-secondary-btn, #nfCardModal .nf-secondary-btn, #nfCardModal #nfCancelCardModal, #nfCardDeleteConfirm .nf-secondary-btn, #nfCardDeleteConfirm #nfCancelCardDelete, #nfCategoryModal .nf-secondary-btn, #nfCategoryModal #nfCancelCategoryModal, #nfCategoryDetailModal .nf-secondary-btn, #nfCategoryDetailModal #nfCancelCategoryDetailModal, #nfCardDetailModal .nf-secondary-btn, #nfCardDetailModal #nfCancelCardDetailModal, #nfCategoryDeleteConfirm .nf-secondary-btn, #nfCategoryDeleteConfirm #nfCancelCategoryDelete{ background:#efe7d7 !important; color:#8b5e00 !important; border:none !important; border-radius:14px !important; font-weight:700 !important; } #nfRegisterCartoesPanel .nf-secondary-btn:hover, #nfRegisterCategoriasPanel .nf-secondary-btn:hover, #nfRegisterCategoriasPanel .nf-secondary-btn.is-active, #nfRegisterCategoriasPanel .nf-secondary-btn.is-confirm, #nfCardModal .nf-secondary-btn:hover, #nfCardModal #nfCancelCardModal:hover, #nfCardDeleteConfirm .nf-secondary-btn:hover, #nfCardDeleteConfirm #nfCancelCardDelete:hover, #nfCategoryModal .nf-secondary-btn:hover, #nfCategoryModal #nfCancelCategoryModal:hover, #nfCategoryDetailModal .nf-secondary-btn:hover, #nfCategoryDetailModal #nfCancelCategoryDetailModal:hover, #nfCardDetailModal .nf-secondary-btn:hover, #nfCardDetailModal #nfCancelCardDetailModal:hover{ background:#e8d8b7 !important; color:#211404 !important; transform:translateY(-2px); } #nfRegisterCartoesPanel .nf-secondary-btn:focus, #nfRegisterCartoesPanel .nf-secondary-btn:focus-visible, #nfRegisterCartoesPanel .nf-secondary-btn:active, #nfRegisterCategoriasPanel .nf-secondary-btn:focus, #nfRegisterCategoriasPanel .nf-secondary-btn:focus-visible, #nfRegisterCategoriasPanel .nf-secondary-btn:active, #nfCardModal .nf-secondary-btn:focus, #nfCardModal .nf-secondary-btn:focus-visible, #nfCardModal .nf-secondary-btn:active, #nfCardModal #nfCancelCardModal:focus, #nfCardModal #nfCancelCardModal:focus-visible, #nfCardDeleteConfirm .nf-secondary-btn:focus, #nfCardDeleteConfirm .nf-secondary-btn:focus-visible, #nfCardDeleteConfirm #nfCancelCardDelete:focus, #nfCardDeleteConfirm #nfCancelCardDelete:focus-visible{ background:#efe7d7 !important; color:#8b5e00 !important; outline:none !important; box-shadow:none !important; } #nfRegisterCartoesPanel .nf-danger-btn, #nfRegisterCategoriasPanel .nf-danger-btn, #nfCategoryConfirmDelete, #nfCardConfirmDelete, #nfCardDeleteConfirm .nf-danger-btn, #nfCardDeleteConfirm #nfConfirmCardDelete, #nfCategoryDeleteConfirm .nf-danger-btn, #nfCategoryDeleteConfirm #nfConfirmCategoryDelete{ height:44px; min-height:44px; padding:0 18px; font-size:14px; font-family:'Inter',sans-serif; background:#dc2626 !important; color:#ffffff !important; border:none !important; border-radius:14px !important; font-weight:700 !important; } #nfRegisterCartoesPanel .nf-danger-btn:hover, #nfRegisterCategoriasPanel .nf-danger-btn:hover, #nfCategoryConfirmDelete:hover, #nfCardConfirmDelete:hover, #nfCardDeleteConfirm .nf-danger-btn:hover, #nfCardDeleteConfirm #nfConfirmCardDelete:hover{ background:#b91c1c !important; color:#ffffff !important; transform:translateY(-2px); } #nfRegisterCartoesPanel .nf-danger-btn.is-confirm, #nfRegisterCartoesPanel .nf-danger-btn.is-confirm:hover, #nfRegisterCartoesPanel .nf-danger-btn.is-confirm:focus, #nfRegisterCartoesPanel .nf-danger-btn.is-confirm:focus-visible, #nfRegisterCartoesPanel .nf-danger-btn.is-confirm:active{ background:#991b1b !important; color:#ffffff !important; outline:none !important; box-shadow:none !important; } #nfRegisterCartoesPanel .nf-danger-btn:focus, #nfRegisterCartoesPanel .nf-danger-btn:focus-visible, #nfRegisterCartoesPanel .nf-danger-btn:active, #nfCardDeleteConfirm .nf-danger-btn:focus, #nfCardDeleteConfirm .nf-danger-btn:focus-visible, #nfCardDeleteConfirm #nfConfirmCardDelete:focus, #nfCardDeleteConfirm #nfConfirmCardDelete:focus-visible, #nfCardDeleteConfirm #nfConfirmCardDelete:active{ background:#dc2626 !important; color:#ffffff !important; outline:none !important; box-shadow:none !important; } #nfCardModal .nf-bank-tile, #nfCardModal .nf-brand-pill, #nfCardModal .nf-color-swatch--custom{ background-image:none !important; outline:none !important; } #nfCardModal .nf-bank-tile:focus, #nfCardModal .nf-bank-tile:focus-visible, #nfCardModal .nf-brand-pill:focus, #nfCardModal .nf-brand-pill:focus-visible, #nfCardModal .nf-color-swatch--custom:focus, #nfCardModal .nf-color-swatch--custom:focus-visible{ outline:none !important; box-shadow:none !important; } #nfCardModal .nf-bank-tile.selected{ border-color:#2b1600 !important; background:#f8f3e8 !important; box-shadow:0 0 0 1px #2b1600 !important; } #nfCardModal .nf-brand-pill.selected{ background:#2b1600 !important; color:#f6d58a !important; border-color:#2b1600 !important; } #nfCardModal .nf-color-swatch--active.selected{ border-color:#211404 !important; box-shadow:0 0 0 2px #f6d58a !important; } #nfCardModal .nf-color-swatch--custom.selected{ border-color:#211404 !important; background:#f8f3e8 !important; color:#211404 !important; box-shadow:0 0 0 2px #f6d58a !important; } #nfCardModal .nf-bank-search:focus, #nfCardModal .nf-input:focus{ outline:none !important; border-color:#c89b2b !important; box-shadow: 0 0 0 4px rgba(200,155,43,.12) !important; } /* ========================================= MODAL DETALHE DO CARTÃO ========================================= */ .nf-card-detail-modal{ max-width:680px; } #nfCardDetailModal .nf-modal-content{ width:min(680px,calc(100% - 32px)); max-width:680px; } #nfCardDetailModal .nf-card-detail-header-wrap{ align-items:center; justify-content:flex-start; flex-wrap:nowrap; gap:10px; } .nf-card-detail-header{ display:flex; align-items:center; flex:1; min-width:0; } .nf-card-detail-identity{ display:flex; align-items:center; gap:10px; min-width:0; flex:1 1 auto; } .nf-card-detail-logo{ display:flex; align-items:center; justify-content:center; flex-shrink:0; width:32px; height:32px; min-width:32px; border-radius:10px; font-size:11px; font-weight:800; letter-spacing:.04em; line-height:1; text-align:center; } .nf-card-detail-header-text{ flex:1; min-width:0; } .nf-card-detail-title-row{ display:flex; align-items:baseline; flex-wrap:nowrap; gap:12px; margin:0; min-width:0; } .nf-card-detail-name{ font-size:20px; font-weight:800; color:#211404; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; } .nf-card-detail-digits{ font-size:14px; font-weight:600; color:#8e8577; line-height:1.2; letter-spacing:.04em; white-space:nowrap; flex-shrink:0; } #nfCardDetailModal .nf-card-detail-meta{ margin:0 0 0 auto; flex-shrink:0; font-size:12px; font-weight:600; color:#7c6f60; text-align:right; line-height:1.35; white-space:nowrap; } .nf-card-detail-body{ display:flex; flex-direction:column; gap:16px; } #nfCardDetailModal .nf-card-detail-metrics{ display:grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap:10px 14px; padding:0; text-align:center; } #nfCardDetailModal .nf-card-detail-metrics > div{ display:flex; flex-direction:column; align-items:center; justify-content:center; } #nfCardDetailModal .nf-card-detail-metrics small{ display:block; font-size:12px; color:#8e8577; font-weight:600; margin-bottom:4px; text-align:center; } #nfCardDetailModal .nf-card-detail-metrics strong{ font-size:16px; font-weight:800; color:#211404; text-align:center; } .nf-card-detail-usage{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px; border-radius:12px; background:#faf7f2; border:1px solid rgba(139,94,0,.10); } .nf-card-detail-usage__label{ font-size:13px; font-weight:700; color:#8e8577; } .nf-card-detail-usage__value{ font-size:18px; font-weight:800; color:#8b5e00; line-height:1; } .nf-card-detail-section{ display:flex; flex-direction:column; gap:10px; } .nf-card-detail-section h3{ margin:0; font-size:15px; font-weight:800; color:#211404; } .nf-card-detail-invoices-scroll{ overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; padding-bottom:2px; } .nf-card-detail-invoices-track{ display:flex; gap:8px; min-width:min-content; } .nf-card-detail-invoice-col{ flex:0 0 118px; display:flex; flex-direction:column; align-items:center; gap:7px; padding:12px 10px; border-radius:16px; background:#faf7f2; border:1px solid rgba(139,94,0,.10); text-align:center; cursor:pointer; font-family:'Inter',sans-serif; transition: border-color .22s ease, background .22s ease, box-shadow .22s ease, transform .22s ease; } #nfCardDetailModal button.nf-card-detail-invoice-col{ border-radius:16px !important; appearance:none !important; -webkit-appearance:none !important; color:#211404 !important; } #nfCardDetailModal button.nf-card-detail-invoice-col:hover, #nfCardDetailModal button.nf-card-detail-invoice-col:focus, #nfCardDetailModal button.nf-card-detail-invoice-col:focus-visible, #nfCardDetailModal button.nf-card-detail-invoice-col:active{ background-image:none !important; } .nf-card-detail-invoice-col:hover:not(.is-selected){ border-color:rgba(139,94,0,.24); background:#fffdf8 !important; box-shadow:0 2px 10px rgba(18,11,2,.06) !important; transform:translateY(-1px); color:#211404 !important; } #nfCardDetailModal button.nf-card-detail-invoice-col.is-status-future:hover:not(.is-selected){ border-color:rgba(100,100,100,.22) !important; background:#fafafa !important; box-shadow:0 2px 10px rgba(18,11,2,.06) !important; color:#211404 !important; } #nfCardDetailModal button.nf-card-detail-invoice-col.is-status-paid:hover:not(.is-selected){ border-color:rgba(139,94,0,.20) !important; background:#fffdf8 !important; box-shadow:0 2px 10px rgba(18,11,2,.06) !important; color:#211404 !important; } #nfCardDetailModal button.nf-card-detail-invoice-col.is-selected:hover, #nfCardDetailModal button.nf-card-detail-invoice-col.is-selected:focus, #nfCardDetailModal button.nf-card-detail-invoice-col.is-selected:focus-visible{ background:#f8f3e8 !important; border-color:#8b5e00 !important; color:#211404 !important; } .nf-card-detail-invoice-col.is-selected, .nf-card-detail-invoice-col.is-selected.is-status-overdue, .nf-card-detail-invoice-col.is-selected.is-status-open, .nf-card-detail-invoice-col.is-selected.is-vigente{ background:#f8f3e8; border:2px solid #8b5e00; box-shadow:0 4px 14px rgba(18,11,2,.08) !important; } .nf-card-detail-invoice-col.is-selected:hover{ transform:none; } .nf-card-detail-invoice-col.is-status-paid{ background:#f8f3e8; } .nf-card-detail-invoice-col.is-status-open:not(.is-selected){ background:#faf7f2; } .nf-card-detail-invoice-col.is-vigente:not(.is-selected):not(:hover){ border-color:rgba(139,94,0,.22); background:#faf7f2; } .nf-card-detail-invoice-col.is-status-future{ background:#f7f7f7; border-color:rgba(100,100,100,.12); } .nf-card-detail-invoice-col.is-status-overdue:not(.is-selected){ background:#faf7f2; border-color:rgba(139,94,0,.24); } .nf-card-detail-invoice-col__status.is-status-paid, .nf-card-detail-invoice-col.is-status-paid .nf-card-detail-invoice-col__status{ background:#efe7d7; color:#5c4d38; } .nf-card-detail-invoice-col.is-status-open .nf-card-detail-invoice-col__status{ background:#efe7d7; color:#8b5e00; } .nf-card-detail-invoice-col.is-status-overdue .nf-card-detail-invoice-col__status{ background:#efe7d7; color:#7c4a03; } .nf-card-detail-invoice-col.is-status-future .nf-card-detail-invoice-col__status{ background:#ececec; color:#6b7280; } .nf-card-detail-purchases-head{ display:flex; align-items:stretch; gap:8px; border-radius:14px; overflow:hidden; background:var( --nf-card-detail-accent, #211404 ); } .nf-card-detail-purchases-block.is-expanded .nf-card-detail-purchases-head{ border-radius:14px 14px 0 0; } #nfCardDetailModal .nf-card-detail-purchases-head .nf-primary-btn, #nfCardDetailModal .nf-card-detail-purchases-head .nf-secondary-btn{ flex:0 0 auto; flex-shrink:0; align-self:center; width:auto; margin:6px 8px 6px 0; white-space:nowrap; } .nf-card-detail-invoice-col__period{ font-size:12px; font-weight:800; color:#211404; } .nf-card-detail-invoice-col__amount{ font-size:13px; font-weight:800; color:#211404; line-height:1.2; } .nf-card-detail-invoice-col__status{ display:inline-flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; padding:3px 8px; border-radius:999px; background:#efe7d7; color:#8b5e00; white-space:nowrap; } .nf-card-detail-invoice-col__paid{ font-size:10px; color:#8e8577; line-height:1.3; min-height:26px; } .nf-card-detail-purchases-block{ border-radius:14px; overflow:hidden; border:1px solid rgba(139,94,0,.10); margin-top:0; } .nf-card-detail-purchases-block.is-expanded{ border-color:rgba(139,94,0,.14); } #nfCardDetailModal .nf-card-detail-expand{ display:flex; align-items:center; gap:10px; flex:1; width:auto; min-height:44px; padding:10px 14px; border:none; border-radius:0; background:transparent; cursor:pointer; font-family:'Inter',sans-serif; text-align:left; transition:filter .2s ease; } #nfCardDetailModal[data-card-detail-tone="light"] .nf-card-detail-expand{ color:#fff; } #nfCardDetailModal[data-card-detail-tone="dark"] .nf-card-detail-expand{ color:#211404; } #nfCardDetailModal .nf-card-detail-expand:hover, #nfCardDetailModal .nf-card-detail-expand:focus, #nfCardDetailModal .nf-card-detail-expand:focus-visible{ background:transparent !important; border:none !important; filter:brightness(1.05); } #nfCardDetailModal[data-card-detail-tone="light"] .nf-card-detail-expand:hover, #nfCardDetailModal[data-card-detail-tone="light"] .nf-card-detail-expand:focus, #nfCardDetailModal[data-card-detail-tone="light"] .nf-card-detail-expand:focus-visible{ color:#fffaf2 !important; } #nfCardDetailModal[data-card-detail-tone="dark"] .nf-card-detail-expand:hover, #nfCardDetailModal[data-card-detail-tone="dark"] .nf-card-detail-expand:focus, #nfCardDetailModal[data-card-detail-tone="dark"] .nf-card-detail-expand:focus-visible{ color:#211404 !important; } #nfCardDetailModal .nf-card-detail-expand__icon{ display:inline-flex; align-items:center; justify-content:center; width:14px; min-width:14px; font-size:12px; font-weight:800; line-height:1; flex-shrink:0; opacity:.92; } #nfCardDetailModal .nf-card-detail-expand__label{ font-size:14px; font-weight:700; } .nf-card-detail-collapsible__panel{ margin-top:0; padding-top:0; background:#fffdf8; border-top:1px solid rgba(139,94,0,.08); } #nfCardDetailModal .nf-card-detail-purchases-block.is-expanded .nf-card-detail-collapsible__panel{ border-top:1px solid rgba(0,0,0,.06); } .nf-card-detail-tx-list{ display:flex; flex-direction:column; gap:0; max-height:240px; overflow-y:auto; -webkit-overflow-scrolling:touch; } .nf-card-detail-tx-item{ display:grid; grid-template-columns: 72px minmax(0,1fr) auto auto; align-items:center; gap:10px; padding:10px 12px; border:none; border-radius:0; background:var( --nf-card-detail-accent-line-odd, #faf7f2 ); } .nf-card-detail-tx-item:nth-child(even){ background:var( --nf-card-detail-accent-line-even, #f5f0e8 ); } .nf-card-detail-tx-date{ font-size:12px; color:#8e8577; white-space:nowrap; } .nf-card-detail-tx-desc{ font-size:13px; color:#211404; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .nf-card-detail-tx-installment{ font-size:12px; color:#8e8577; white-space:nowrap; } .nf-card-detail-tx-amount{ font-size:13px; color:#211404; white-space:nowrap; } .nf-card-detail-empty{ margin:0; padding:12px; font-size:13px; color:#8e8577; text-align:center; border-radius:10px; background:#faf7f2; } @media(max-width:768px){ .nf-cards-summary{ grid-template-columns: repeat(2,minmax(0,1fr)); } #nfCardDetailModal .nf-card-detail-header-wrap{ flex-wrap:wrap; align-items:flex-start; gap:8px; } #nfCardDetailModal .nf-card-detail-meta{ order:3; width:100%; font-size:11px; text-align:left; white-space:normal; } #nfCardDetailModal .nf-modal-close{ order:2; margin-left:auto; } .nf-card-detail-name{ font-size:17px; } .nf-card-detail-digits{ font-size:13px; } .nf-card-detail-logo{ width:30px; height:30px; min-width:30px; font-size:10px; } #nfCardDetailModal .nf-card-detail-purchases-head .nf-primary-btn, #nfCardDetailModal .nf-card-detail-purchases-head .nf-secondary-btn{ margin:6px 6px 6px 0; padding:0 12px; font-size:12px; } #nfCardDetailModal .nf-card-detail-metrics{ grid-template-columns:1fr; } .nf-card-detail-invoice-col{ flex-basis:108px; } .nf-card-detail-tx-item{ grid-template-columns: 1fr auto; grid-template-areas: "desc amount" "date installment"; } .nf-card-detail-tx-date{ grid-area:date; } .nf-card-detail-tx-desc{ grid-area:desc; } .nf-card-detail-tx-installment{ grid-area:installment; } .nf-card-detail-tx-amount{ grid-area:amount; } } /* ========================================= METAS — BOTÕES (PADRÃO CARTÕES/CATEGORIAS) ========================================= */ .nf-metas-page .nf-metas-toolbar .nf-primary-btn, .nf-metas-page #goalModal .nf-primary-btn, .nf-metas-page #createGoalBtn, .nf-metas-page #depositModal .nf-primary-btn, .nf-metas-page #nextDepositStep, .nf-metas-page #distributionModal .nf-primary-btn, .nf-metas-page #confirmDistribution{ height:44px; min-height:44px; padding:0 22px; font-size:14px; font-family:'Inter',sans-serif; background:#211404 !important; color:#f3d38a !important; border:none !important; border-radius:14px !important; font-weight:800 !important; box-shadow: 0 10px 24px rgba(18,11,2,.14) !important; } .nf-metas-page .nf-metas-toolbar .nf-primary-btn:hover, .nf-metas-page #goalModal .nf-primary-btn:hover, .nf-metas-page #createGoalBtn:hover, .nf-metas-page #depositModal .nf-primary-btn:hover, .nf-metas-page #nextDepositStep:hover, .nf-metas-page #distributionModal .nf-primary-btn:hover:not(.nf-btn-disabled), .nf-metas-page #confirmDistribution:hover:not(.nf-btn-disabled){ background:#f3d38a !important; color:#211404 !important; transform:translateY(-2px); } .nf-metas-page .nf-metas-toolbar .nf-primary-btn:focus, .nf-metas-page .nf-metas-toolbar .nf-primary-btn:focus-visible, .nf-metas-page .nf-metas-toolbar .nf-primary-btn:active, .nf-metas-page #goalModal .nf-primary-btn:focus, .nf-metas-page #goalModal .nf-primary-btn:focus-visible, .nf-metas-page #goalModal .nf-primary-btn:active, .nf-metas-page #createGoalBtn:focus, .nf-metas-page #createGoalBtn:focus-visible, .nf-metas-page #createGoalBtn:active, .nf-metas-page #depositModal .nf-primary-btn:focus, .nf-metas-page #nextDepositStep:focus, .nf-metas-page #nextDepositStep:focus-visible, .nf-metas-page #distributionModal .nf-primary-btn:focus, .nf-metas-page #confirmDistribution:focus, .nf-metas-page #confirmDistribution:focus-visible{ background:#211404 !important; color:#f3d38a !important; outline:none !important; box-shadow: 0 10px 24px rgba(18,11,2,.14) !important; } .nf-metas-page .nf-metas-toolbar #openDepositModal{ background:#f3d38a !important; color:#211404 !important; } .nf-metas-page .nf-metas-toolbar #openDepositModal:hover{ background:#211404 !important; color:#f3d38a !important; transform:translateY(-2px); } .nf-metas-page .nf-metas-toolbar #openDepositModal:focus, .nf-metas-page .nf-metas-toolbar #openDepositModal:focus-visible, .nf-metas-page .nf-metas-toolbar #openDepositModal:active{ background:#f3d38a !important; color:#211404 !important; outline:none !important; box-shadow: 0 10px 24px rgba(18,11,2,.14) !important; } .nf-metas-page .nf-metas-toolbar .nf-secondary-btn, .nf-metas-page .nf-metas-toolbar #nfGoalCancelSelect{ height:44px !important; min-height:44px !important; padding:0 18px !important; font-size:14px !important; font-family:'Inter',sans-serif; border:1px solid rgba(139,94,0,.14) !important; background:#efe7d7 !important; color:#211404 !important; border-radius:14px !important; font-weight:700 !important; box-shadow:none !important; } .nf-metas-page .nf-metas-toolbar .nf-secondary-btn:hover, .nf-metas-page .nf-metas-toolbar #nfGoalCancelSelect:hover{ background:#e8d8b7 !important; color:#211404 !important; transform:translateY(-2px); } .nf-metas-page .nf-metas-toolbar .nf-secondary-btn:focus, .nf-metas-page .nf-metas-toolbar .nf-secondary-btn:focus-visible, .nf-metas-page .nf-metas-toolbar .nf-secondary-btn:active, .nf-metas-page .nf-metas-toolbar #nfGoalCancelSelect:focus, .nf-metas-page .nf-metas-toolbar #nfGoalCancelSelect:focus-visible, .nf-metas-page .nf-metas-toolbar #nfGoalCancelSelect:active{ background:#efe7d7 !important; color:#211404 !important; outline:none !important; box-shadow:none !important; } .nf-metas-page #goalModal .nf-secondary-btn, .nf-metas-page #closeGoalModal, .nf-metas-page #depositModal .nf-secondary-btn, .nf-metas-page #closeDepositModal, .nf-metas-page #distributionModal .nf-secondary-btn, .nf-metas-page #backDistribution, .nf-metas-page #clearDistribution, .nf-metas-page .nf-goal-card__complete{ height:44px !important; min-height:44px !important; padding:0 18px !important; font-size:14px !important; background:#efe7d7 !important; color:#8b5e00 !important; border:none !important; border-radius:14px !important; font-weight:700 !important; font-family:'Inter',sans-serif; } .nf-metas-page #goalModal .nf-secondary-btn:hover, .nf-metas-page #closeGoalModal:hover, .nf-metas-page #depositModal .nf-secondary-btn:hover, .nf-metas-page #closeDepositModal:hover, .nf-metas-page #distributionModal .nf-secondary-btn:hover, .nf-metas-page #backDistribution:hover, .nf-metas-page #clearDistribution:hover, .nf-metas-page .nf-goal-card__complete:hover{ background:#e8d8b7 !important; color:#211404 !important; transform:translateY(-2px); } .nf-metas-page #goalModal .nf-secondary-btn:focus, .nf-metas-page #closeGoalModal:focus, .nf-metas-page #closeGoalModal:focus-visible, .nf-metas-page #distributionModal .nf-secondary-btn:focus, .nf-metas-page #backDistribution:focus, .nf-metas-page #clearDistribution:focus, .nf-metas-page .nf-goal-card__complete:focus, .nf-metas-page .nf-goal-card__complete:focus-visible{ background:#efe7d7 !important; color:#8b5e00 !important; outline:none !important; box-shadow:none !important; } .nf-metas-page #historyModal .nf-goal-history-toggle, .nf-metas-page .nf-goal-history-toggle.nf-secondary-btn{ height:26px !important; min-height:26px !important; padding:2px 8px !important; font-size:11px !important; background:#efe7d7 !important; color:#8b5e00 !important; border:none !important; border-radius:8px !important; font-weight:600 !important; font-family:'Inter',sans-serif; box-shadow:none !important; } .nf-metas-page #historyModal .nf-goal-history-toggle:hover, .nf-metas-page .nf-goal-history-toggle.nf-secondary-btn:hover{ background:#e8d8b7 !important; color:#211404 !important; transform:none; } .nf-metas-page #historyModal .nf-goal-history-toggle:focus, .nf-metas-page #historyModal .nf-goal-history-toggle:focus-visible, .nf-metas-page #historyModal .nf-goal-history-toggle:active, .nf-metas-page .nf-goal-history-toggle.nf-secondary-btn:focus, .nf-metas-page .nf-goal-history-toggle.nf-secondary-btn:focus-visible, .nf-metas-page .nf-goal-history-toggle.nf-secondary-btn:active{ background:#efe7d7 !important; color:#8b5e00 !important; outline:none !important; box-shadow:none !important; } .nf-metas-page .nf-metas-toolbar .nf-danger-btn, .nf-metas-page #nfGoalConfirmDelete{ height:44px; min-height:44px; padding:0 18px; font-size:14px; font-family:'Inter',sans-serif; background:#dc2626 !important; color:#ffffff !important; border:none !important; border-radius:14px !important; font-weight:700 !important; } .nf-metas-page .nf-metas-toolbar .nf-danger-btn:hover, .nf-metas-page #nfGoalConfirmDelete:hover{ background:#b91c1c !important; color:#ffffff !important; transform:translateY(-2px); } .nf-metas-page .nf-metas-toolbar .nf-danger-btn:focus, .nf-metas-page .nf-metas-toolbar .nf-danger-btn:focus-visible, .nf-metas-page .nf-metas-toolbar .nf-danger-btn:active, .nf-metas-page #nfGoalConfirmDelete:focus, .nf-metas-page #nfGoalConfirmDelete:focus-visible, .nf-metas-page #nfGoalConfirmDelete:active{ background:#dc2626 !important; color:#ffffff !important; outline:none !important; box-shadow:none !important; }