Plugin Directory

Changeset 3463192


Ignore:
Timestamp:
02/17/2026 07:56:53 AM (4 days ago)
Author:
shoaibzain
Message:

Release 0.8.0 - Numbered Cards widget (Grid/Steps/Carousel), carousel enhancements, admin UI redesign, FAQ WYSIWYG editor

Location:
nebula-forge-addons-for-elementor/trunk
Files:
1 added
13 edited

Legend:

Unmodified
Added
Removed
  • nebula-forge-addons-for-elementor/trunk/assets/css/admin.css

    r3462607 r3463192  
    11/**
    2  * Nebula Forge Addons for Elementor — Admin Styles (Pro)
     2 * Nebula Forge Addons for Elementor — Admin Styles (Premium)
    33 *
    44 * @package NebulaForgeAddon
    5  * @since   0.3.0
     5 * @since   0.8.0
    66 */
    77
     
    1111
    1212:root {
    13     /* Brand */
     13    /* ── Brand Palette ── */
    1414    --nf-brand-1: #6366f1;
    1515    --nf-brand-2: #8b5cf6;
    1616    --nf-brand-3: #a78bfa;
     17    --nf-brand-4: #c4b5fd;
    1718    --nf-accent:  #f97316;
    18 
    19     /* Surfaces */
    20     --nf-dark:     #0f172a;
    21     --nf-dark-2:   #1e293b;
     19    --nf-accent-2:#fb923c;
     20
     21    /* ── Surfaces ── */
     22    --nf-dark:     #0c111d;
     23    --nf-dark-2:   #151b2b;
     24    --nf-dark-3:   #1e2640;
    2225    --nf-surface:  #ffffff;
    23     --nf-surface-2:#f8fafc;
    24     --nf-surface-3:#f1f5f9;
    25 
    26     /* Text */
    27     --nf-text:       #0f172a;
    28     --nf-text-2:     #475569;
    29     --nf-text-3:     #94a3b8;
     26    --nf-surface-2:#f9fafb;
     27    --nf-surface-3:#f3f4f6;
     28    --nf-surface-4:#e5e7eb;
     29
     30    /* ── Text ── */
     31    --nf-text:       #111827;
     32    --nf-text-2:     #4b5563;
     33    --nf-text-3:     #9ca3af;
    3034    --nf-text-inv:   #ffffff;
    3135
    32     /* Borders */
    33     --nf-border:   #e2e8f0;
    34     --nf-border-2: #cbd5e1;
    35 
    36     /* Feedback */
     36    /* ── Borders ── */
     37    --nf-border:   #e5e7eb;
     38    --nf-border-2: #d1d5db;
     39    --nf-border-3: rgba(99,102,241,.18);
     40
     41    /* ── Feedback ── */
    3742    --nf-success:    #10b981;
    3843    --nf-success-bg: #ecfdf5;
     
    4045    --nf-error:      #ef4444;
    4146
    42     /* Radius */
     47    /* ── Radius ── */
    4348    --nf-r-xs: 6px;
    4449    --nf-r-sm: 8px;
     
    4651    --nf-r-lg: 16px;
    4752    --nf-r-xl: 20px;
     53    --nf-r-2xl: 24px;
    4854    --nf-r-full: 999px;
    4955
    50     /* Shadow */
    51     --nf-shadow-xs: 0 1px 2px rgba(0,0,0,.05);
    52     --nf-shadow-sm: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
    53     --nf-shadow-md: 0 4px 6px -1px rgba(0,0,0,.07), 0 2px 4px -2px rgba(0,0,0,.05);
    54     --nf-shadow-lg: 0 10px 25px -3px rgba(0,0,0,.08), 0 4px 10px -4px rgba(0,0,0,.04);
    55     --nf-shadow-xl: 0 20px 50px -5px rgba(0,0,0,.1), 0 8px 20px -6px rgba(0,0,0,.05);
    56 
    57     /* Motion */
    58     --nf-ease:    cubic-bezier(.4,0,.2,1);
     56    /* ── Shadow ── */
     57    --nf-shadow-xs: 0 1px 2px rgba(0,0,0,.04);
     58    --nf-shadow-sm: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
     59    --nf-shadow-md: 0 4px 6px -1px rgba(0,0,0,.06), 0 2px 4px -2px rgba(0,0,0,.04);
     60    --nf-shadow-lg: 0 10px 15px -3px rgba(0,0,0,.07), 0 4px 6px -4px rgba(0,0,0,.04);
     61    --nf-shadow-xl: 0 20px 40px -4px rgba(0,0,0,.08), 0 8px 16px -6px rgba(0,0,0,.04);
     62    --nf-shadow-2xl: 0 25px 50px -6px rgba(0,0,0,.12);
     63    --nf-shadow-inner: inset 0 2px 4px rgba(0,0,0,.04);
     64    --nf-shadow-glow: 0 0 20px rgba(99,102,241,.15);
     65    --nf-shadow-card-hover: 0 12px 28px -6px rgba(99,102,241,.12), 0 4px 12px -4px rgba(0,0,0,.06);
     66
     67    /* ── Motion ── */
     68    --nf-ease:     cubic-bezier(.4,0,.2,1);
     69    --nf-ease-out: cubic-bezier(.0,0,.2,1);
     70    --nf-ease-spring: cubic-bezier(.175,.885,.32,1.275);
    5971    --nf-dur:     .2s;
    60     --nf-dur-lg:  .3s;
    61 
    62     /* Gradient */
     72    --nf-dur-md:  .3s;
     73    --nf-dur-lg:  .45s;
     74
     75    /* ── Gradients ── */
    6376    --nf-grad: linear-gradient(135deg, var(--nf-brand-1) 0%, var(--nf-brand-2) 50%, var(--nf-brand-3) 100%);
    64     --nf-grad-dark: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    65 }
     77    --nf-grad-dark: linear-gradient(135deg, #0c111d 0%, #151b2b 40%, #1e2640 100%);
     78    --nf-grad-subtle: linear-gradient(135deg, rgba(99,102,241,.04) 0%, rgba(139,92,246,.04) 100%);
     79    --nf-grad-glass: linear-gradient(135deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,.05) 100%);
     80}
     81
     82/* Inter font loaded via wp_enqueue_style in Admin_Manager */
    6683
    6784/* ==========================================================================
    68    Base
     85   Base & Reset
    6986   ========================================================================== */
    7087
    7188.nf-admin-wrap {
    72     max-width: 1280px;
    73     margin: 20px 20px 40px 0;
    74     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    75     color: var(--nf-text);
    76     line-height: 1.5;
     89    max-width: 1340px;
     90    margin: 20px 20px 60px 0;
     91    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
     92    color: var(--nf-text);
     93    line-height: 1.6;
     94    -webkit-font-smoothing: antialiased;
     95    -moz-osx-font-smoothing: grayscale;
     96    scroll-behavior: smooth;
    7797}
    7898
     
    83103}
    84104
     105.nf-admin-wrap ::selection {
     106    background: rgba(99,102,241,.15);
     107    color: var(--nf-text);
     108}
     109
     110.nf-admin-wrap :focus-visible {
     111    outline: 2px solid var(--nf-brand-1);
     112    outline-offset: 2px;
     113    border-radius: var(--nf-r-xs);
     114}
     115
    85116.nf-admin-content {
    86     margin-top: 24px;
     117    margin-top: 28px;
    87118}
    88119
    89120.nf-admin-row {
    90121    display: grid;
    91     grid-template-columns: 1fr 340px;
    92     gap: 28px;
     122    grid-template-columns: 1fr 360px;
     123    gap: 32px;
    93124    align-items: start;
    94125}
     
    106137.nf-admin-header {
    107138    background: var(--nf-grad-dark);
    108     padding: 48px 40px 40px;
    109     border-radius: var(--nf-r-xl);
     139    padding: 52px 48px 48px;
     140    border-radius: var(--nf-r-2xl);
    110141    color: var(--nf-text-inv);
    111142    position: relative;
    112143    overflow: hidden;
    113 }
    114 
    115 /* Decorative orbs */
     144    border: 1px solid rgba(255,255,255,.06);
     145}
     146
     147/* Animated mesh gradient overlay */
    116148.nf-admin-header::before {
    117149    content: '';
    118150    position: absolute;
    119     top: -80px;
    120     right: -60px;
    121     width: 340px;
    122     height: 340px;
    123     background: radial-gradient(circle, rgba(99,102,241,.35) 0%, transparent 70%);
     151    top: -120px;
     152    right: -80px;
     153    width: 450px;
     154    height: 450px;
     155    background: radial-gradient(circle, rgba(99,102,241,.4) 0%, rgba(99,102,241,.08) 40%, transparent 70%);
    124156    border-radius: 50%;
    125157    pointer-events: none;
     158    animation: nf-orb-float 8s ease-in-out infinite alternate;
    126159}
    127160
     
    129162    content: '';
    130163    position: absolute;
    131     bottom: -100px;
    132     left: 30%;
    133     width: 260px;
    134     height: 260px;
    135     background: radial-gradient(circle, rgba(139,92,246,.25) 0%, transparent 70%);
     164    bottom: -130px;
     165    left: 20%;
     166    width: 380px;
     167    height: 380px;
     168    background: radial-gradient(circle, rgba(139,92,246,.3) 0%, rgba(167,139,250,.06) 40%, transparent 70%);
    136169    border-radius: 50%;
    137170    pointer-events: none;
     171    animation: nf-orb-float 10s ease-in-out infinite alternate-reverse;
     172}
     173
     174@keyframes nf-orb-float {
     175    0% { transform: translate(0, 0) scale(1); }
     176    100% { transform: translate(-30px, 20px) scale(1.1); }
    138177}
    139178
     
    154193    display: inline-flex;
    155194    align-items: center;
    156     background: rgba(255,255,255,.15);
    157     backdrop-filter: blur(8px);
    158     -webkit-backdrop-filter: blur(8px);
    159     padding: 4px 14px;
     195    gap: 6px;
     196    background: rgba(255,255,255,.1);
     197    backdrop-filter: blur(12px);
     198    -webkit-backdrop-filter: blur(12px);
     199    padding: 5px 16px;
    160200    border-radius: var(--nf-r-full);
    161201    font-size: 12px;
    162     font-weight: 600;
    163     letter-spacing: .5px;
    164     margin-bottom: 12px;
    165     border: 1px solid rgba(255,255,255,.2);
     202    font-weight: 700;
     203    letter-spacing: .6px;
     204    margin-bottom: 16px;
     205    border: 1px solid rgba(255,255,255,.15);
     206    text-transform: uppercase;
     207}
     208
     209.nf-admin-header__badge::before {
     210    content: '';
     211    width: 6px;
     212    height: 6px;
     213    border-radius: 50%;
     214    background: var(--nf-success);
     215    box-shadow: 0 0 6px rgba(16,185,129,.6);
    166216}
    167217
    168218.nf-admin-header h1 {
    169     margin: 0 0 8px;
    170     font-size: 34px;
     219    margin: 0 0 10px;
     220    font-size: 36px;
    171221    font-weight: 800;
    172222    color: var(--nf-text-inv);
    173223    line-height: 1.15;
    174     letter-spacing: -.5px;
     224    letter-spacing: -.75px;
    175225}
    176226
     
    178228    margin: 0;
    179229    font-size: 15px;
    180     opacity: .85;
    181     max-width: 520px;
    182     line-height: 1.6;
    183 }
    184 
    185 /* Header stats */
     230    opacity: .75;
     231    max-width: 540px;
     232    line-height: 1.7;
     233    font-weight: 400;
     234}
     235
     236/* Header Stats */
    186237.nf-header-stats {
    187238    display: flex;
    188     gap: 16px;
     239    gap: 12px;
    189240}
    190241
    191242.nf-header-stat {
    192     background: rgba(255,255,255,.1);
    193     backdrop-filter: blur(8px);
    194     -webkit-backdrop-filter: blur(8px);
    195     border: 1px solid rgba(255,255,255,.15);
    196     border-radius: var(--nf-r-md);
    197     padding: 16px 22px;
     243    background: rgba(255,255,255,.07);
     244    backdrop-filter: blur(16px);
     245    -webkit-backdrop-filter: blur(16px);
     246    border: 1px solid rgba(255,255,255,.1);
     247    border-radius: var(--nf-r-lg);
     248    padding: 18px 24px;
    198249    text-align: center;
    199     min-width: 90px;
     250    min-width: 100px;
     251    transition: all var(--nf-dur-md) var(--nf-ease);
     252}
     253
     254.nf-header-stat:hover {
     255    background: rgba(255,255,255,.12);
     256    border-color: rgba(255,255,255,.2);
     257    transform: translateY(-2px);
    200258}
    201259
    202260.nf-header-stat__value {
    203261    display: block;
    204     font-size: 28px;
     262    font-size: 30px;
    205263    font-weight: 800;
    206264    line-height: 1;
    207265    color: var(--nf-text-inv);
     266    letter-spacing: -.5px;
    208267}
    209268
     
    213272    font-weight: 600;
    214273    text-transform: uppercase;
    215     letter-spacing: .8px;
    216     opacity: .7;
    217     margin-top: 4px;
    218 }
    219 
    220 /* Header — Compact (Settings & Changelog) */
     274    letter-spacing: 1px;
     275    opacity: .6;
     276    margin-top: 6px;
     277}
     278
     279/* ── Header — Compact ── */
    221280.nf-admin-header--compact {
    222     padding: 32px 36px;
     281    padding: 36px 40px;
    223282    display: flex;
    224283    justify-content: space-between;
     
    229288
    230289.nf-admin-header--compact h1 {
    231     font-size: 26px;
    232     display: flex;
    233     align-items: center;
    234     gap: 10px;
     290    font-size: 28px;
     291    margin-bottom: 0;
     292    display: flex;
     293    align-items: center;
     294    gap: 12px;
    235295}
    236296
     
    239299    width: 24px;
    240300    height: 24px;
    241     opacity: .8;
     301    opacity: .7;
    242302}
    243303
    244304.nf-header-stats--compact {
    245     gap: 12px;
     305    gap: 10px;
    246306}
    247307
    248308.nf-header-stats--compact .nf-header-stat {
    249     padding: 12px 18px;
    250     min-width: 70px;
     309    padding: 14px 20px;
     310    min-width: 80px;
    251311}
    252312
    253313.nf-header-stats--compact .nf-header-stat__value {
    254     font-size: 22px;
     314    font-size: 24px;
    255315}
    256316
     
    262322    display: inline-flex;
    263323    gap: 4px;
    264     margin-top: 20px;
     324    margin-top: 24px;
    265325    padding: 5px;
    266326    background: var(--nf-surface);
    267327    border: 1px solid var(--nf-border);
    268     border-radius: var(--nf-r-lg);
    269     box-shadow: var(--nf-shadow-xs);
     328    border-radius: var(--nf-r-xl);
     329    box-shadow: var(--nf-shadow-sm);
    270330}
    271331
     
    273333    display: inline-flex;
    274334    align-items: center;
    275     gap: 7px;
    276     padding: 10px 18px;
    277     border-radius: var(--nf-r-sm);
     335    gap: 8px;
     336    padding: 11px 20px;
     337    border-radius: var(--nf-r-md);
    278338    color: var(--nf-text-2);
    279339    font-size: 13px;
    280340    font-weight: 600;
    281341    text-decoration: none;
    282     transition: all var(--nf-dur) var(--nf-ease);
     342    transition: all var(--nf-dur-md) var(--nf-ease);
    283343    border: 1px solid transparent;
     344    position: relative;
    284345}
    285346
     
    288349    width: 16px;
    289350    height: 16px;
     351    transition: transform var(--nf-dur-md) var(--nf-ease);
    290352}
    291353
     
    293355    background: var(--nf-surface-3);
    294356    color: var(--nf-text);
     357}
     358
     359.nf-tab:hover .dashicons {
     360    transform: scale(1.1);
    295361}
    296362
     
    298364    background: var(--nf-brand-1);
    299365    color: var(--nf-text-inv);
    300     box-shadow: 0 2px 8px rgba(99,102,241,.3);
     366    box-shadow: 0 4px 12px rgba(99,102,241,.3), 0 1px 3px rgba(99,102,241,.2);
    301367}
    302368
     
    304370    background: var(--nf-brand-1);
    305371    color: var(--nf-text-inv);
     372    box-shadow: 0 6px 16px rgba(99,102,241,.35);
    306373}
    307374
     
    312379
    313380/* ==========================================================================
    314    Onboarding Steps (Welcome)
     381   Onboarding Steps
    315382   ========================================================================== */
    316383
    317384.nf-onboarding {
    318     margin-top: 24px;
    319     padding: 28px 32px;
     385    margin-top: 28px;
     386    padding: 32px 36px;
    320387    background: var(--nf-surface);
    321388    border: 1px solid var(--nf-border);
    322     border-radius: var(--nf-r-lg);
    323     box-shadow: var(--nf-shadow-xs);
     389    border-radius: var(--nf-r-xl);
     390    box-shadow: var(--nf-shadow-sm);
     391    position: relative;
     392    overflow: hidden;
     393}
     394
     395.nf-onboarding::after {
     396    content: '';
     397    position: absolute;
     398    top: 0;
     399    right: 0;
     400    width: 200px;
     401    height: 100%;
     402    background: var(--nf-grad-subtle);
     403    pointer-events: none;
    324404}
    325405
     
    327407    display: flex;
    328408    align-items: center;
    329     gap: 10px;
    330     margin: 0 0 20px;
    331     font-size: 17px;
    332     font-weight: 700;
    333     color: var(--nf-text);
     409    gap: 12px;
     410    margin: 0 0 24px;
     411    font-size: 18px;
     412    font-weight: 800;
     413    color: var(--nf-text);
     414    letter-spacing: -.3px;
    334415}
    335416
    336417.nf-onboarding__title .dashicons {
    337418    color: var(--nf-brand-1);
    338     font-size: 20px;
    339     width: 20px;
    340     height: 20px;
     419    font-size: 22px;
     420    width: 22px;
     421    height: 22px;
    341422}
    342423
     
    345426    grid-template-columns: repeat(3, 1fr);
    346427    gap: 20px;
     428    position: relative;
     429    z-index: 1;
    347430}
    348431
     
    355438.nf-onboard-step {
    356439    position: relative;
    357     padding: 20px;
    358     background: var(--nf-surface-2);
     440    padding: 24px;
     441    background: var(--nf-surface);
    359442    border: 1px solid var(--nf-border);
    360     border-radius: var(--nf-r-md);
    361     transition: all var(--nf-dur) var(--nf-ease);
     443    border-radius: var(--nf-r-lg);
     444    transition: all var(--nf-dur-md) var(--nf-ease);
     445    overflow: hidden;
     446}
     447
     448.nf-onboard-step::before {
     449    content: '';
     450    position: absolute;
     451    top: 0;
     452    left: 0;
     453    right: 0;
     454    height: 3px;
     455    background: var(--nf-grad);
     456    opacity: 0;
     457    transition: opacity var(--nf-dur-md) var(--nf-ease);
    362458}
    363459
    364460.nf-onboard-step:hover {
    365     border-color: var(--nf-brand-3);
    366     box-shadow: var(--nf-shadow-sm);
    367     transform: translateY(-2px);
     461    border-color: var(--nf-border-3);
     462    box-shadow: var(--nf-shadow-card-hover);
     463    transform: translateY(-3px);
     464}
     465
     466.nf-onboard-step:hover::before {
     467    opacity: 1;
    368468}
    369469
     
    372472    align-items: center;
    373473    justify-content: center;
    374     width: 32px;
    375     height: 32px;
     474    width: 36px;
     475    height: 36px;
    376476    background: var(--nf-grad);
    377     border-radius: var(--nf-r-full);
     477    border-radius: var(--nf-r-sm);
    378478    color: var(--nf-text-inv);
    379     font-size: 14px;
    380     font-weight: 700;
    381     margin-bottom: 12px;
     479    font-size: 15px;
     480    font-weight: 800;
     481    margin-bottom: 14px;
     482    box-shadow: 0 4px 8px rgba(99,102,241,.2);
    382483}
    383484
    384485.nf-onboard-step h3 {
    385     margin: 0 0 6px;
     486    margin: 0 0 8px;
    386487    font-size: 15px;
    387488    font-weight: 700;
    388489    color: var(--nf-text);
     490    letter-spacing: -.2px;
    389491}
    390492
     
    393495    font-size: 13px;
    394496    color: var(--nf-text-2);
    395     line-height: 1.5;
     497    line-height: 1.6;
    396498}
    397499
    398500/* ==========================================================================
    399    Category Sections (Welcome)
     501   Category Sections
    400502   ========================================================================== */
    401503
    402504.nf-category-section {
    403     margin-bottom: 28px;
     505    margin-bottom: 32px;
    404506}
    405507
     
    412514    align-items: center;
    413515    gap: 10px;
    414     margin: 0 0 16px;
    415     font-size: 16px;
    416     font-weight: 700;
    417     color: var(--nf-text);
     516    margin: 0 0 18px;
     517    font-size: 17px;
     518    font-weight: 800;
     519    color: var(--nf-text);
     520    letter-spacing: -.3px;
    418521}
    419522
     
    429532    align-items: center;
    430533    justify-content: center;
    431     min-width: 22px;
    432     height: 22px;
    433     padding: 0 6px;
    434     background: var(--nf-surface-3);
     534    min-width: 24px;
     535    height: 24px;
     536    padding: 0 8px;
     537    background: var(--nf-grad-subtle);
     538    border: 1px solid var(--nf-border-3);
    435539    border-radius: var(--nf-r-full);
    436540    font-size: 11px;
    437     font-weight: 700;
    438     color: var(--nf-text-2);
     541    font-weight: 800;
     542    color: var(--nf-brand-1);
    439543}
    440544
     
    442546.nf-widget-showcase {
    443547    display: grid;
    444     grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
     548    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
    445549    gap: 16px;
    446550}
     
    449553    background: var(--nf-surface);
    450554    border: 1px solid var(--nf-border);
    451     border-radius: var(--nf-r-md);
    452     padding: 20px;
    453     transition: all var(--nf-dur-lg) var(--nf-ease);
     555    border-radius: var(--nf-r-lg);
     556    padding: 22px;
     557    transition: all var(--nf-dur-md) var(--nf-ease);
    454558    position: relative;
     559    overflow: hidden;
     560}
     561
     562.nf-showcase-card::after {
     563    content: '';
     564    position: absolute;
     565    inset: 0;
     566    border-radius: inherit;
     567    background: var(--nf-grad-subtle);
     568    opacity: 0;
     569    transition: opacity var(--nf-dur-md) var(--nf-ease);
     570    pointer-events: none;
    455571}
    456572
    457573.nf-showcase-card:hover {
    458     border-color: var(--nf-brand-3);
    459     box-shadow: var(--nf-shadow-md);
     574    border-color: var(--nf-border-3);
     575    box-shadow: var(--nf-shadow-card-hover);
    460576    transform: translateY(-3px);
    461577}
    462578
     579.nf-showcase-card:hover::after {
     580    opacity: 1;
     581}
     582
    463583.nf-showcase-card--inactive {
    464     opacity: .55;
     584    opacity: .45;
     585}
     586
     587.nf-showcase-card--inactive:hover {
     588    opacity: .6;
    465589}
    466590
     
    469593    align-items: center;
    470594    gap: 10px;
    471     margin-bottom: 12px;
     595    margin-bottom: 14px;
     596    position: relative;
     597    z-index: 1;
    472598}
    473599
    474600.nf-showcase-card__icon {
    475     width: 42px;
    476     height: 42px;
     601    width: 44px;
     602    height: 44px;
    477603    background: var(--nf-badge-color, var(--nf-brand-1));
    478604    border-radius: var(--nf-r-sm);
     
    481607    justify-content: center;
    482608    flex-shrink: 0;
    483     opacity: .9;
     609    box-shadow: 0 3px 8px rgba(0,0,0,.1);
     610    transition: transform var(--nf-dur-md) var(--nf-ease-spring);
     611}
     612
     613.nf-showcase-card:hover .nf-showcase-card__icon {
     614    transform: scale(1.08) rotate(-2deg);
    484615}
    485616
     
    490621
    491622.nf-status-dot {
    492     width: 8px;
    493     height: 8px;
     623    width: 9px;
     624    height: 9px;
    494625    border-radius: 50%;
    495626    margin-left: auto;
     
    499630.nf-status-dot--active {
    500631    background: var(--nf-success);
    501     box-shadow: 0 0 0 3px rgba(16,185,129,.2);
     632    box-shadow: 0 0 0 3px rgba(16,185,129,.15), 0 0 8px rgba(16,185,129,.3);
     633    animation: nf-pulse 2.5s ease-in-out infinite;
     634}
     635
     636@keyframes nf-pulse {
     637    0%, 100% { box-shadow: 0 0 0 3px rgba(16,185,129,.15), 0 0 8px rgba(16,185,129,.3); }
     638    50% { box-shadow: 0 0 0 5px rgba(16,185,129,.1), 0 0 12px rgba(16,185,129,.2); }
    502639}
    503640
     
    511648    gap: 6px;
    512649    flex-wrap: wrap;
     650    position: relative;
     651    z-index: 1;
     652    letter-spacing: -.2px;
    513653}
    514654
     
    517657    font-size: 13px;
    518658    color: var(--nf-text-2);
    519     line-height: 1.5;
     659    line-height: 1.55;
     660    position: relative;
     661    z-index: 1;
    520662}
    521663
     
    527669    background: var(--nf-surface);
    528670    border: 1px solid var(--nf-border);
    529     border-radius: var(--nf-r-lg);
    530     padding: 24px;
    531     margin-bottom: 16px;
    532     box-shadow: var(--nf-shadow-xs);
     671    border-radius: var(--nf-r-xl);
     672    padding: 28px;
     673    margin-bottom: 18px;
     674    box-shadow: var(--nf-shadow-sm);
     675    transition: box-shadow var(--nf-dur-md) var(--nf-ease);
    533676}
    534677
     
    537680}
    538681
     682.nf-card:hover {
     683    box-shadow: var(--nf-shadow-md);
     684}
     685
    539686.nf-card__title {
    540687    display: flex;
    541688    align-items: center;
    542689    gap: 10px;
    543     margin: 0 0 18px;
     690    margin: 0 0 20px;
    544691    font-size: 16px;
    545     font-weight: 700;
    546     color: var(--nf-text);
     692    font-weight: 800;
     693    color: var(--nf-text);
     694    letter-spacing: -.2px;
    547695}
    548696
     
    554702}
    555703
    556 /* Status Card */
     704/* ── Status Card ── */
    557705.nf-card--status {
    558     border-left: 3px solid var(--nf-brand-1);
     706    border-left: 3px solid transparent;
     707    border-image: var(--nf-grad) 1;
     708    border-image-slice: 1;
     709    border-top-left-radius: 0;
     710    border-bottom-left-radius: 0;
    559711}
    560712
     
    568720    display: flex;
    569721    align-items: center;
    570     gap: 10px;
    571     padding: 10px 0;
     722    gap: 12px;
     723    padding: 12px 0;
    572724    border-bottom: 1px solid var(--nf-border);
    573725    font-size: 13px;
     726    transition: background var(--nf-dur) var(--nf-ease);
    574727}
    575728
     
    605758.nf-status-list__value {
    606759    font-size: 12px;
    607     font-weight: 600;
     760    font-weight: 700;
    608761    color: var(--nf-text-2);
    609762    background: var(--nf-surface-3);
    610     padding: 2px 10px;
     763    padding: 3px 12px;
    611764    border-radius: var(--nf-r-full);
    612 }
    613 
    614 /* Tip Card */
     765    border: 1px solid var(--nf-border);
     766}
     767
     768/* ── Tip Card ── */
    615769.nf-card--tip {
    616     background: linear-gradient(135deg, #fef3c7 0%, #fffbeb 100%);
     770    background: linear-gradient(135deg, #fef9ee 0%, #fffdf7 50%, #fef3c7 100%);
    617771    border-color: #fde68a;
    618772    text-align: center;
     773    position: relative;
     774    overflow: hidden;
     775}
     776
     777.nf-card--tip::before {
     778    content: '';
     779    position: absolute;
     780    top: -40px;
     781    right: -40px;
     782    width: 120px;
     783    height: 120px;
     784    background: radial-gradient(circle, rgba(245,158,11,.15) 0%, transparent 60%);
     785    border-radius: 50%;
     786    pointer-events: none;
    619787}
    620788
     
    627795    align-items: center;
    628796    justify-content: center;
    629     width: 48px;
    630     height: 48px;
     797    width: 52px;
     798    height: 52px;
    631799    background: linear-gradient(135deg, #f59e0b, #d97706);
    632     border-radius: var(--nf-r-full);
    633     margin: 0 auto 12px;
     800    border-radius: var(--nf-r-lg);
     801    margin: 0 auto 14px;
     802    box-shadow: 0 4px 12px rgba(245,158,11,.25);
    634803}
    635804
     
    642811
    643812.nf-card--tip p {
    644     font-size: 13px;
    645     color: var(--nf-text-2);
    646     margin: 0 0 16px;
    647     line-height: 1.6;
     813    font-size: 13.5px;
     814    color: #92400e;
     815    margin: 0 0 18px;
     816    line-height: 1.65;
    648817}
    649818
     
    669838    display: flex;
    670839    align-items: center;
    671     gap: 10px;
    672     padding: 11px 14px;
     840    gap: 12px;
     841    padding: 12px 16px;
    673842    background: var(--nf-surface-2);
    674843    border: 1px solid transparent;
    675     border-radius: var(--nf-r-sm);
     844    border-radius: var(--nf-r-md);
    676845    color: var(--nf-text);
    677846    text-decoration: none;
    678847    font-size: 13px;
    679848    font-weight: 600;
    680     transition: all var(--nf-dur) var(--nf-ease);
     849    transition: all var(--nf-dur-md) var(--nf-ease);
    681850}
    682851
     
    684853    background: var(--nf-brand-1);
    685854    color: var(--nf-text-inv);
    686     box-shadow: var(--nf-shadow-sm);
     855    box-shadow: 0 4px 12px rgba(99,102,241,.2);
     856    transform: translateX(3px);
    687857}
    688858
     
    691861    width: 16px;
    692862    height: 16px;
     863    transition: transform var(--nf-dur-md) var(--nf-ease);
     864}
     865
     866.nf-links-list a:hover .dashicons {
     867    transform: scale(1.1);
    693868}
    694869
     
    698873    width: 14px !important;
    699874    height: 14px !important;
    700     opacity: .5;
     875    opacity: .4;
     876    transition: all var(--nf-dur-md) var(--nf-ease) !important;
    701877}
    702878
    703879.nf-links-list a:hover .nf-links-list__arrow {
    704880    opacity: 1;
     881    transform: translateX(2px) !important;
    705882}
    706883
     
    713890    align-items: center;
    714891    justify-content: center;
    715     padding: 2px 8px;
     892    padding: 2px 9px;
    716893    border-radius: var(--nf-r-full);
    717894    background: var(--nf-badge-color, var(--nf-brand-1));
     
    719896    font-size: 9px;
    720897    font-weight: 800;
    721     letter-spacing: .7px;
     898    letter-spacing: .8px;
    722899    text-transform: uppercase;
    723     line-height: 1.4;
     900    line-height: 1.5;
     901    box-shadow: 0 1px 3px rgba(0,0,0,.1);
    724902}
    725903
     
    741919    width: 15px;
    742920    height: 15px;
     921    transition: color var(--nf-dur) var(--nf-ease);
     922}
     923
     924.nf-tooltip:hover .dashicons {
     925    color: var(--nf-brand-1);
    743926}
    744927
     
    754937    bottom: 130%;
    755938    left: 50%;
    756     transform: translateX(-50%) translateY(4px);
     939    transform: translateX(-50%) translateY(6px);
    757940    background: var(--nf-dark);
    758941    color: var(--nf-text-inv);
    759     padding: 8px 12px;
     942    padding: 10px 14px;
    760943    border-radius: var(--nf-r-sm);
    761944    font-size: 12px;
    762     line-height: 1.4;
    763     width: 220px;
     945    line-height: 1.5;
     946    width: 230px;
    764947    opacity: 0;
    765948    pointer-events: none;
    766     transition: opacity var(--nf-dur) var(--nf-ease), transform var(--nf-dur) var(--nf-ease);
    767     box-shadow: var(--nf-shadow-xl);
     949    transition: opacity var(--nf-dur-md) var(--nf-ease), transform var(--nf-dur-md) var(--nf-ease);
     950    box-shadow: var(--nf-shadow-2xl);
    768951    z-index: 10;
    769952    font-weight: 400;
     
    780963    border-color: var(--nf-dark) transparent transparent transparent;
    781964    opacity: 0;
    782     transition: opacity var(--nf-dur) var(--nf-ease);
     965    transition: opacity var(--nf-dur-md) var(--nf-ease);
    783966    z-index: 10;
    784967}
     
    803986    display: inline-flex;
    804987    align-items: center;
    805     gap: 6px;
    806     padding: 10px 20px;
     988    gap: 7px;
     989    padding: 11px 22px;
    807990    border: none;
    808991    border-radius: var(--nf-r-sm);
     
    810993    font-weight: 700;
    811994    cursor: pointer;
    812     transition: all var(--nf-dur) var(--nf-ease);
     995    transition: all var(--nf-dur-md) var(--nf-ease);
    813996    text-decoration: none;
    814997    line-height: 1.4;
     998    letter-spacing: -.1px;
     999    font-family: inherit;
    8151000}
    8161001
     
    8251010    color: var(--nf-text-inv);
    8261011    border: none;
    827     box-shadow: 0 2px 8px rgba(99,102,241,.25);
     1012    box-shadow: 0 4px 14px rgba(99,102,241,.25);
     1013    position: relative;
     1014    overflow: hidden;
     1015}
     1016
     1017.nf-button--primary::before {
     1018    content: '';
     1019    position: absolute;
     1020    inset: 0;
     1021    background: linear-gradient(135deg, rgba(255,255,255,.15) 0%, transparent 50%);
     1022    opacity: 0;
     1023    transition: opacity var(--nf-dur-md) var(--nf-ease);
    8281024}
    8291025
    8301026.nf-button--primary:hover {
    8311027    transform: translateY(-2px);
    832     box-shadow: 0 6px 20px rgba(99,102,241,.35);
     1028    box-shadow: 0 8px 24px rgba(99,102,241,.35);
     1029    color: var(--nf-text-inv);
     1030}
     1031
     1032.nf-button--primary:hover::before {
     1033    opacity: 1;
    8331034}
    8341035
    8351036.nf-button--primary:active {
    8361037    transform: translateY(0);
     1038    box-shadow: 0 2px 8px rgba(99,102,241,.2);
    8371039}
    8381040
     
    8471049    color: var(--nf-brand-1);
    8481050    background: rgba(99,102,241,.04);
     1051    box-shadow: 0 2px 8px rgba(99,102,241,.08);
    8491052}
    8501053
    8511054.nf-button--sm {
    852     padding: 7px 14px;
     1055    padding: 8px 16px;
    8531056    font-size: 12px;
    8541057}
     
    8691072    align-items: center;
    8701073    gap: 16px;
    871     padding: 16px 20px;
    872     margin-bottom: 20px;
     1074    padding: 16px 22px;
     1075    margin-bottom: 22px;
    8731076    background: var(--nf-surface);
    8741077    border: 1px solid var(--nf-border);
    875     border-radius: var(--nf-r-md);
    876     box-shadow: var(--nf-shadow-xs);
     1078    border-radius: var(--nf-r-lg);
     1079    box-shadow: var(--nf-shadow-sm);
    8771080    flex-wrap: wrap;
    8781081}
     
    8871090    font-weight: 700;
    8881091    color: var(--nf-text-2);
     1092    display: flex;
     1093    align-items: center;
     1094    gap: 4px;
    8891095}
    8901096
    8911097.nf-toolbar__counter span {
    8921098    color: var(--nf-brand-1);
    893     font-size: 16px;
     1099    font-size: 17px;
     1100    font-weight: 800;
    8941101}
    8951102
    8961103.nf-widget-grid {
    8971104    display: grid;
    898     grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    899     gap: 16px;
     1105    grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
     1106    gap: 18px;
    9001107}
    9011108
     
    9091116    background: var(--nf-surface);
    9101117    border: 1px solid var(--nf-border);
    911     border-radius: var(--nf-r-md);
     1118    border-radius: var(--nf-r-lg);
    9121119    padding: 0;
    9131120    display: flex;
    9141121    flex-direction: column;
    915     transition: all var(--nf-dur-lg) var(--nf-ease);
     1122    transition: all var(--nf-dur-md) var(--nf-ease);
    9161123    overflow: hidden;
     1124    position: relative;
     1125}
     1126
     1127.nf-widget-card::before {
     1128    content: '';
     1129    position: absolute;
     1130    top: 0;
     1131    left: 0;
     1132    right: 0;
     1133    height: 3px;
     1134    background: var(--nf-grad);
     1135    opacity: 0;
     1136    transition: opacity var(--nf-dur-md) var(--nf-ease);
     1137    z-index: 1;
    9171138}
    9181139
    9191140.nf-widget-card:hover {
    920     border-color: var(--nf-brand-3);
    921     box-shadow: var(--nf-shadow-md);
    922     transform: translateY(-2px);
     1141    border-color: var(--nf-border-3);
     1142    box-shadow: var(--nf-shadow-card-hover);
     1143    transform: translateY(-3px);
     1144}
     1145
     1146.nf-widget-card:hover::before {
     1147    opacity: 1;
    9231148}
    9241149
    9251150.nf-widget-card--disabled {
    926     opacity: .45;
     1151    opacity: .4;
    9271152}
    9281153
    9291154.nf-widget-card--disabled:hover {
    930     opacity: .6;
     1155    opacity: .55;
     1156}
     1157
     1158.nf-widget-card--disabled::before {
     1159    background: var(--nf-border-2);
    9311160}
    9321161
     
    9351164    align-items: center;
    9361165    justify-content: space-between;
    937     padding: 16px 20px;
     1166    padding: 18px 22px;
    9381167    border-bottom: 1px solid var(--nf-border);
    9391168    background: var(--nf-surface-2);
     
    9411170
    9421171.nf-widget-card__icon {
    943     width: 40px;
    944     height: 40px;
     1172    width: 42px;
     1173    height: 42px;
    9451174    background: var(--nf-badge-color, var(--nf-brand-1));
    9461175    border-radius: var(--nf-r-sm);
     
    9491178    justify-content: center;
    9501179    flex-shrink: 0;
     1180    box-shadow: 0 2px 6px rgba(0,0,0,.1);
     1181    transition: transform var(--nf-dur-md) var(--nf-ease-spring);
     1182}
     1183
     1184.nf-widget-card:hover .nf-widget-card__icon {
     1185    transform: scale(1.08) rotate(-2deg);
    9511186}
    9521187
     
    9571192
    9581193.nf-widget-card__content {
    959     padding: 16px 20px;
     1194    padding: 18px 22px;
    9601195    flex: 1;
    9611196}
    9621197
    9631198.nf-widget-card__content h3 {
    964     margin: 0 0 6px;
     1199    margin: 0 0 8px;
    9651200    font-size: 15px;
    9661201    font-weight: 700;
     
    9681203    display: flex;
    9691204    align-items: center;
    970     gap: 6px;
     1205    gap: 8px;
    9711206    flex-wrap: wrap;
     1207    letter-spacing: -.2px;
    9721208}
    9731209
     
    9761212    font-size: 13px;
    9771213    color: var(--nf-text-2);
    978     line-height: 1.5;
     1214    line-height: 1.55;
    9791215}
    9801216
     
    9821218    display: flex;
    9831219    align-items: flex-start;
    984     gap: 6px;
    985     padding: 12px 20px;
     1220    gap: 8px;
     1221    padding: 14px 22px;
    9861222    background: var(--nf-surface-2);
    9871223    border-top: 1px solid var(--nf-border);
     
    9961232    margin-top: 1px;
    9971233    flex-shrink: 0;
     1234    color: var(--nf-brand-3);
    9981235}
    9991236
    10001237.nf-widget-card__tip {
    1001     line-height: 1.4;
     1238    line-height: 1.5;
    10021239}
    10031240
     
    10221259.nf-toggle__slider {
    10231260    position: relative;
    1024     width: 44px;
    1025     height: 24px;
    1026     background: #cbd5e1;
    1027     border-radius: 24px;
    1028     transition: all var(--nf-dur) var(--nf-ease);
     1261    width: 48px;
     1262    height: 26px;
     1263    background: #d1d5db;
     1264    border-radius: 26px;
     1265    transition: all var(--nf-dur-md) var(--nf-ease);
     1266    box-shadow: var(--nf-shadow-inner);
    10291267}
    10301268
     
    10321270    content: '';
    10331271    position: absolute;
    1034     height: 18px;
    1035     width: 18px;
     1272    height: 20px;
     1273    width: 20px;
    10361274    left: 3px;
    10371275    bottom: 3px;
    10381276    background: var(--nf-surface);
    10391277    border-radius: 50%;
    1040     transition: all var(--nf-dur) var(--nf-ease);
    1041     box-shadow: 0 1px 3px rgba(0,0,0,.15);
     1278    transition: all var(--nf-dur-md) var(--nf-ease-spring);
     1279    box-shadow: 0 1px 4px rgba(0,0,0,.15);
    10421280}
    10431281
    10441282.nf-toggle input:checked + .nf-toggle__slider {
    10451283    background: var(--nf-brand-1);
     1284    box-shadow: var(--nf-shadow-inner), 0 0 12px rgba(99,102,241,.2);
    10461285}
    10471286
    10481287.nf-toggle input:checked + .nf-toggle__slider::before {
    1049     transform: translateX(20px);
     1288    transform: translateX(22px);
     1289    box-shadow: 0 2px 6px rgba(99,102,241,.3);
    10501290}
    10511291
    10521292.nf-toggle input:focus-visible + .nf-toggle__slider {
    1053     box-shadow: 0 0 0 3px rgba(99,102,241,.3);
     1293    box-shadow: 0 0 0 3px rgba(99,102,241,.25);
    10541294}
    10551295
     
    10591299
    10601300.nf-settings-footer {
    1061     margin-top: 28px;
    1062     padding: 20px 24px;
     1301    margin-top: 30px;
     1302    padding: 22px 28px;
    10631303    background: var(--nf-surface);
    10641304    border: 1px solid var(--nf-border);
    1065     border-radius: var(--nf-r-md);
    1066     display: flex;
    1067     align-items: center;
    1068     gap: 16px;
     1305    border-radius: var(--nf-r-lg);
     1306    display: flex;
     1307    align-items: center;
     1308    gap: 18px;
    10691309    flex-wrap: wrap;
    1070     box-shadow: var(--nf-shadow-xs);
     1310    box-shadow: var(--nf-shadow-sm);
    10711311}
    10721312
     
    10841324    display: flex;
    10851325    align-items: center;
    1086     gap: 10px;
    1087     padding: 14px 18px;
    1088     border-radius: var(--nf-r-sm);
    1089     margin-bottom: 20px;
     1326    gap: 12px;
     1327    padding: 16px 20px;
     1328    border-radius: var(--nf-r-md);
     1329    margin-bottom: 22px;
    10901330    font-size: 14px;
    10911331    font-weight: 600;
     
    10931333
    10941334.nf-notice--success {
    1095     background: var(--nf-success-bg);
     1335    background: linear-gradient(135deg, #ecfdf5 0%, #f0fdf4 100%);
    10961336    color: #065f46;
    10971337    border: 1px solid #a7f3d0;
    1098 }
    1099 
    1100 .nf-notice .dashicons {
    1101     font-size: 18px;
    1102     width: 18px;
    1103     height: 18px;
     1338    box-shadow: 0 2px 8px rgba(16,185,129,.08);
     1339}
     1340
     1341.nf-notice--success .dashicons {
     1342    font-size: 20px;
     1343    width: 20px;
     1344    height: 20px;
    11041345    color: var(--nf-success);
    11051346}
     
    11101351
    11111352.nf-changelog-timeline {
    1112     max-width: 780px;
     1353    max-width: 820px;
    11131354    position: relative;
    1114     padding-left: 36px;
    1115 }
    1116 
    1117 /* Vertical line */
     1355    padding-left: 40px;
     1356}
     1357
    11181358.nf-changelog-timeline::before {
    11191359    content: '';
    11201360    position: absolute;
    1121     left: 11px;
     1361    left: 12px;
    11221362    top: 0;
    11231363    bottom: 0;
    11241364    width: 2px;
    1125     background: var(--nf-border);
     1365    background: linear-gradient(180deg, var(--nf-brand-1) 0%, var(--nf-border) 30%);
    11261366    border-radius: 2px;
    11271367}
     
    11291369.nf-timeline-entry {
    11301370    position: relative;
    1131     margin-bottom: 24px;
     1371    margin-bottom: 28px;
    11321372}
    11331373
     
    11381378.nf-timeline-entry__marker {
    11391379    position: absolute;
    1140     left: -36px;
    1141     top: 22px;
     1380    left: -40px;
     1381    top: 24px;
    11421382}
    11431383
     
    11501390    border-radius: 50%;
    11511391    position: relative;
    1152     left: 5px;
    1153     transition: all var(--nf-dur) var(--nf-ease);
     1392    left: 6px;
     1393    transition: all var(--nf-dur-md) var(--nf-ease);
    11541394}
    11551395
     
    11571397    background: var(--nf-brand-1);
    11581398    border-color: var(--nf-brand-1);
    1159     box-shadow: 0 0 0 4px rgba(99,102,241,.2);
     1399    box-shadow: 0 0 0 5px rgba(99,102,241,.15), 0 0 12px rgba(99,102,241,.2);
    11601400}
    11611401
     
    11631403    background: var(--nf-surface);
    11641404    border: 1px solid var(--nf-border);
    1165     border-radius: var(--nf-r-md);
    1166     padding: 20px 24px;
    1167     box-shadow: var(--nf-shadow-xs);
    1168     transition: all var(--nf-dur) var(--nf-ease);
     1405    border-radius: var(--nf-r-lg);
     1406    padding: 24px 28px;
     1407    box-shadow: var(--nf-shadow-sm);
     1408    transition: all var(--nf-dur-md) var(--nf-ease);
    11691409}
    11701410
    11711411.nf-timeline-entry:hover .nf-timeline-entry__card {
    1172     box-shadow: var(--nf-shadow-sm);
     1412    box-shadow: var(--nf-shadow-card-hover);
     1413    border-color: var(--nf-border-3);
     1414    transform: translateX(4px);
     1415}
     1416
     1417.nf-timeline-entry:hover .nf-timeline-entry__dot {
    11731418    border-color: var(--nf-brand-3);
     1419    background: var(--nf-brand-4);
    11741420}
    11751421
     
    11811427    display: flex;
    11821428    align-items: center;
    1183     gap: 10px;
    1184     margin-bottom: 14px;
     1429    gap: 12px;
     1430    margin-bottom: 16px;
    11851431}
    11861432
    11871433.nf-timeline-entry__version {
    1188     font-size: 18px;
     1434    font-size: 20px;
    11891435    font-weight: 800;
    11901436    color: var(--nf-text);
     1437    letter-spacing: -.3px;
    11911438}
    11921439
    11931440.nf-badge {
    11941441    display: inline-flex;
    1195     padding: 3px 10px;
     1442    padding: 3px 12px;
    11961443    border-radius: var(--nf-r-full);
    11971444    font-size: 10px;
    1198     font-weight: 700;
     1445    font-weight: 800;
    11991446    text-transform: uppercase;
    1200     letter-spacing: .5px;
     1447    letter-spacing: .6px;
    12011448}
    12021449
     
    12041451    background: var(--nf-grad);
    12051452    color: var(--nf-text-inv);
     1453    box-shadow: 0 2px 6px rgba(99,102,241,.2);
    12061454}
    12071455
     
    12151463    display: flex;
    12161464    align-items: flex-start;
    1217     gap: 8px;
    1218     padding: 8px 0;
     1465    gap: 10px;
     1466    padding: 10px 0;
    12191467    border-bottom: 1px solid var(--nf-border);
    12201468    font-size: 13px;
    12211469    color: var(--nf-text-2);
    1222     line-height: 1.5;
     1470    line-height: 1.55;
     1471    transition: all var(--nf-dur) var(--nf-ease);
    12231472}
    12241473
     
    12261475    border-bottom: none;
    12271476    padding-bottom: 0;
     1477}
     1478
     1479.nf-timeline-entry__changes li:hover {
     1480    background: var(--nf-surface-2);
     1481    margin: 0 -12px;
     1482    padding-left: 12px;
     1483    padding-right: 12px;
     1484    border-radius: var(--nf-r-xs);
    12281485}
    12291486
     
    12321489    width: 14px;
    12331490    height: 14px;
    1234     margin-top: 2px;
     1491    margin-top: 3px;
    12351492    flex-shrink: 0;
    12361493}
    12371494
    1238 /* Change type colors */
    12391495.nf-change--add .dashicons {
    12401496    color: var(--nf-success);
     
    12511507.nf-change--default .dashicons {
    12521508    color: var(--nf-text-3);
    1253 }
    1254 
    1255 /* ==========================================================================
    1256    Responsive
    1257    ========================================================================== */
    1258 
    1259 @media (max-width: 600px) {
    1260     .nf-admin-wrap {
    1261         margin: 10px 10px 20px 0;
    1262     }
    1263 
    1264     .nf-admin-header {
    1265         padding: 28px 20px;
    1266     }
    1267 
    1268     .nf-admin-header h1 {
    1269         font-size: 24px;
    1270     }
    1271 
    1272     .nf-header-stats {
    1273         flex-wrap: wrap;
    1274     }
    1275 
    1276     .nf-onboarding {
    1277         padding: 20px;
    1278     }
    1279 
    1280     .nf-card {
    1281         padding: 18px;
    1282     }
    1283 
    1284     .nf-changelog-timeline {
    1285         padding-left: 28px;
    1286     }
    1287 
    1288     .nf-changelog-timeline::before {
    1289         left: 7px;
    1290     }
    1291 
    1292     .nf-timeline-entry__marker {
    1293         left: -28px;
    1294     }
    1295 
    1296     .nf-timeline-entry__dot {
    1297         left: 1px;
    1298     }
    12991509}
    13001510
     
    13061516    display: flex;
    13071517    flex-direction: column;
    1308     gap: 20px;
    1309 }
    1310 
    1311 /* Family name row */
     1518    gap: 22px;
     1519}
     1520
    13121521.nf-font-form__row {
    13131522    display: flex;
    13141523    align-items: center;
    1315     gap: 12px;
     1524    gap: 14px;
    13161525}
    13171526
    13181527.nf-font-form__row label {
    1319     font-weight: 600;
     1528    font-weight: 700;
    13201529    font-size: 13px;
    13211530    color: var(--nf-text);
     
    13241533
    13251534.nf-font-form__row input[type="text"] {
    1326     max-width: 400px;
     1535    max-width: 420px;
    13271536    width: 100%;
    1328     padding: 9px 14px;
     1537    padding: 10px 16px;
    13291538    border: 1px solid var(--nf-border-2);
    13301539    border-radius: var(--nf-r-sm);
     
    13331542    color: var(--nf-text);
    13341543    background: var(--nf-surface);
    1335     transition: border-color var(--nf-dur) var(--nf-ease), box-shadow var(--nf-dur) var(--nf-ease);
     1544    transition: all var(--nf-dur-md) var(--nf-ease);
     1545    font-family: inherit;
    13361546}
    13371547
     
    13391549    border-color: var(--nf-brand-1);
    13401550    outline: none;
    1341     box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12);
    1342 }
    1343 
    1344 /* Variants container */
     1551    box-shadow: 0 0 0 3px rgba(99,102,241,.1);
     1552}
     1553
    13451554.nf-font-variants h4 {
    1346     font-weight: 600;
     1555    font-weight: 700;
    13471556    font-size: 13px;
    13481557    color: var(--nf-text);
    1349     margin: 0 0 10px;
    1350 }
    1351 
    1352 /* Single variant card */
     1558    margin: 0 0 12px;
     1559}
     1560
    13531561.nf-font-variant {
    13541562    background: var(--nf-surface-2);
    13551563    border: 1px solid var(--nf-border);
    1356     border-radius: var(--nf-r-sm);
    1357     padding: 16px 18px;
    1358     margin-bottom: 10px;
     1564    border-radius: var(--nf-r-md);
     1565    padding: 18px 20px;
     1566    margin-bottom: 12px;
    13591567    position: relative;
     1568    transition: all var(--nf-dur-md) var(--nf-ease);
     1569}
     1570
     1571.nf-font-variant:hover {
     1572    border-color: var(--nf-border-3);
     1573    box-shadow: var(--nf-shadow-sm);
    13601574}
    13611575
     
    13701584    display: flex;
    13711585    flex-direction: column;
    1372     gap: 5px;
    1373     min-width: 120px;
     1586    gap: 6px;
     1587    min-width: 130px;
    13741588}
    13751589
    13761590.nf-font-variant__field label {
    1377     font-weight: 500;
    1378     font-size: 12px;
    1379     color: var(--nf-text-2);
     1591    font-weight: 600;
     1592    font-size: 11px;
     1593    color: var(--nf-text-3);
    13801594    text-transform: uppercase;
    1381     letter-spacing: 0.03em;
     1595    letter-spacing: .06em;
    13821596}
    13831597
    13841598.nf-font-variant__field select {
    1385     padding: 7px 10px;
     1599    padding: 8px 12px;
    13861600    border: 1px solid var(--nf-border-2);
    13871601    border-radius: var(--nf-r-xs);
     
    13891603    background: var(--nf-surface);
    13901604    color: var(--nf-text);
    1391     min-width: 140px;
     1605    min-width: 150px;
    13921606    cursor: pointer;
    1393     transition: border-color var(--nf-dur) var(--nf-ease);
     1607    transition: all var(--nf-dur-md) var(--nf-ease);
     1608    font-family: inherit;
    13941609}
    13951610
     
    13971612    border-color: var(--nf-brand-1);
    13981613    outline: none;
    1399     box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.1);
     1614    box-shadow: 0 0 0 3px rgba(99,102,241,.1);
    14001615}
    14011616
     
    14201635    font-size: 12px;
    14211636    color: var(--nf-brand-1);
    1422     font-style: italic;
     1637    font-weight: 600;
    14231638    overflow: hidden;
    14241639    text-overflow: ellipsis;
     
    14281643
    14291644.nfa-remove-variant {
    1430     width: 28px;
    1431     height: 28px;
     1645    width: 30px;
     1646    height: 30px;
    14321647    display: flex;
    14331648    align-items: center;
     
    14411656    border-radius: var(--nf-r-xs);
    14421657    cursor: pointer;
    1443     transition: color var(--nf-dur) var(--nf-ease), border-color var(--nf-dur) var(--nf-ease), background var(--nf-dur) var(--nf-ease);
     1658    transition: all var(--nf-dur-md) var(--nf-ease);
    14441659    padding: 0;
    14451660    align-self: flex-end;
     
    14511666    border-color: #fecaca !important;
    14521667    background: #fef2f2;
    1453 }
    1454 
    1455 /* Form actions bar */
     1668    transform: scale(1.05);
     1669}
     1670
    14561671.nf-font-form__actions {
    14571672    display: flex;
    1458     gap: 10px;
    1459     margin-top: 4px;
     1673    gap: 12px;
     1674    margin-top: 6px;
    14601675    align-items: center;
    14611676}
     
    14641679    display: inline-flex;
    14651680    align-items: center;
    1466     gap: 4px;
     1681    gap: 5px;
    14671682}
    14681683
     
    14781693    border-color: var(--nf-brand-1);
    14791694    color: #fff;
     1695    transition: all var(--nf-dur-md) var(--nf-ease);
    14801696}
    14811697
     
    14831699    background: var(--nf-brand-2);
    14841700    border-color: var(--nf-brand-2);
     1701    box-shadow: 0 4px 12px rgba(99,102,241,.2);
     1702    transform: translateY(-1px);
    14851703}
    14861704
    14871705/* Saved Font Items */
    14881706.nf-card--font-list {
    1489     margin-top: 24px;
     1707    margin-top: 28px;
    14901708}
    14911709
     
    14931711    display: flex;
    14941712    align-items: center;
    1495     gap: 16px;
    1496     padding: 18px 20px;
     1713    gap: 18px;
     1714    padding: 20px 22px;
    14971715    background: var(--nf-surface);
    14981716    border: 1px solid var(--nf-border);
    1499     border-radius: var(--nf-r-md);
    1500     margin-bottom: 12px;
    1501     transition: border-color var(--nf-dur) var(--nf-ease), box-shadow var(--nf-dur) var(--nf-ease);
     1717    border-radius: var(--nf-r-lg);
     1718    margin-bottom: 14px;
     1719    transition: all var(--nf-dur-md) var(--nf-ease);
    15021720}
    15031721
    15041722.nf-font-item:hover {
    1505     border-color: #c7d2fe;
    1506     box-shadow: var(--nf-shadow-sm);
     1723    border-color: var(--nf-border-3);
     1724    box-shadow: var(--nf-shadow-card-hover);
     1725    transform: translateY(-2px);
    15071726}
    15081727
    15091728.nf-font-item__info {
    15101729    flex: 0 0 auto;
    1511     min-width: 140px;
     1730    min-width: 150px;
    15121731}
    15131732
    15141733.nf-font-item__name {
    1515     font-size: 15px;
    1516     font-weight: 700;
     1734    font-size: 16px;
     1735    font-weight: 800;
    15171736    color: var(--nf-text);
    15181737    margin: 0 0 4px;
    15191738    display: block;
     1739    letter-spacing: -.3px;
    15201740}
    15211741
     
    15241744    color: var(--nf-text-3);
    15251745    display: block;
     1746    font-weight: 600;
    15261747}
    15271748
     
    15401761    display: inline-flex;
    15411762    align-items: center;
    1542     gap: 4px;
     1763    gap: 5px;
    15431764    color: var(--nf-error) !important;
    15441765    border-color: #fecaca !important;
     1766    transition: all var(--nf-dur-md) var(--nf-ease);
    15451767}
    15461768
     
    15481770    background: #fef2f2 !important;
    15491771    border-color: var(--nf-error) !important;
     1772    transform: scale(1.02);
    15501773}
    15511774
     
    15591782    color: var(--nf-text-3);
    15601783    font-size: 14px;
    1561     font-style: italic;
    1562     padding: 20px 0;
     1784    padding: 28px 0;
    15631785    text-align: center;
    15641786}
     
    15851807   ========================================================================== */
    15861808
     1809.nf-extensions-title {
     1810    display: flex;
     1811    align-items: center;
     1812    gap: 10px;
     1813    margin: 38px 0 8px;
     1814    font-size: 17px;
     1815    font-weight: 800;
     1816    color: var(--nf-text);
     1817    letter-spacing: -.3px;
     1818}
     1819
     1820.nf-extensions-title .dashicons {
     1821    color: var(--nf-brand-1);
     1822    font-size: 18px;
     1823    width: 18px;
     1824    height: 18px;
     1825}
     1826
    15871827.nf-extensions-grid {
    15881828    display: grid;
    1589     grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
     1829    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    15901830    gap: 16px;
    1591     margin-top: 16px;
     1831    margin-top: 18px;
    15921832}
    15931833
     
    15951835    display: flex;
    15961836    align-items: flex-start;
    1597     gap: 14px;
    1598     padding: 18px;
    1599     background: #fff;
    1600     border: 1px solid #e2e8f0;
    1601     border-radius: 12px;
    1602     transition: border-color 0.2s ease, box-shadow 0.2s ease;
     1837    gap: 16px;
     1838    padding: 20px;
     1839    background: var(--nf-surface);
     1840    border: 1px solid var(--nf-border);
     1841    border-radius: var(--nf-r-lg);
     1842    transition: all var(--nf-dur-md) var(--nf-ease);
     1843    position: relative;
     1844    overflow: hidden;
     1845}
     1846
     1847.nf-extension-card::before {
     1848    content: '';
     1849    position: absolute;
     1850    top: 0;
     1851    left: 0;
     1852    right: 0;
     1853    height: 2px;
     1854    background: var(--nf-grad);
     1855    opacity: 0;
     1856    transition: opacity var(--nf-dur-md) var(--nf-ease);
    16031857}
    16041858
    16051859.nf-extension-card:hover {
    1606     border-color: #c7d2fe;
    1607     box-shadow: 0 2px 8px rgba(99, 102, 241, 0.06);
     1860    border-color: var(--nf-border-3);
     1861    box-shadow: var(--nf-shadow-card-hover);
     1862    transform: translateY(-2px);
     1863}
     1864
     1865.nf-extension-card:hover::before {
     1866    opacity: 1;
    16081867}
    16091868
    16101869.nf-extension-card__icon {
    16111870    flex-shrink: 0;
    1612     width: 36px;
    1613     height: 36px;
     1871    width: 40px;
     1872    height: 40px;
    16141873    display: flex;
    16151874    align-items: center;
    16161875    justify-content: center;
    1617     background: #eef2ff;
    1618     border-radius: 8px;
    1619     color: #6366f1;
     1876    background: var(--nf-grad-subtle);
     1877    border: 1px solid var(--nf-border-3);
     1878    border-radius: var(--nf-r-sm);
     1879    color: var(--nf-brand-1);
    16201880    font-size: 18px;
     1881    transition: all var(--nf-dur-md) var(--nf-ease);
     1882}
     1883
     1884.nf-extension-card__icon .dashicons {
     1885    font-size: 18px;
     1886    width: 18px;
     1887    height: 18px;
     1888}
     1889
     1890.nf-extension-card:hover .nf-extension-card__icon {
     1891    background: var(--nf-brand-1);
     1892    color: var(--nf-text-inv);
     1893    border-color: var(--nf-brand-1);
     1894    box-shadow: 0 2px 8px rgba(99,102,241,.2);
    16211895}
    16221896
     
    16301904    align-items: center;
    16311905    justify-content: space-between;
     1906    gap: 12px;
     1907    margin-bottom: 8px;
     1908}
     1909
     1910.nf-extension-card__label {
     1911    font-weight: 700;
     1912    font-size: 14px;
     1913    color: var(--nf-text);
     1914    letter-spacing: -.2px;
     1915}
     1916
     1917.nf-extension-card__desc {
     1918    font-size: 12.5px;
     1919    color: var(--nf-text-2);
     1920    line-height: 1.55;
     1921    margin: 0;
     1922}
     1923
     1924/* ==========================================================================
     1925   Submissions Table
     1926   ========================================================================== */
     1927
     1928.nf-filter-bar {
     1929    display: flex;
     1930    align-items: center;
     1931    gap: 12px;
     1932    margin-bottom: 22px;
     1933    padding: 14px 20px;
     1934    background: var(--nf-surface);
     1935    border: 1px solid var(--nf-border);
     1936    border-radius: var(--nf-r-lg);
     1937    box-shadow: var(--nf-shadow-sm);
     1938    flex-wrap: wrap;
     1939}
     1940
     1941.nf-filter-bar label {
     1942    font-weight: 700;
     1943    font-size: 13px;
     1944    color: var(--nf-text);
     1945}
     1946
     1947.nf-filter-bar select {
     1948    padding: 8px 14px;
     1949    border: 1px solid var(--nf-border-2);
     1950    border-radius: var(--nf-r-sm);
     1951    font-size: 13px;
     1952    background: var(--nf-surface);
     1953    color: var(--nf-text);
     1954    font-family: inherit;
     1955    cursor: pointer;
     1956    transition: all var(--nf-dur-md) var(--nf-ease);
     1957}
     1958
     1959.nf-filter-bar select:focus {
     1960    border-color: var(--nf-brand-1);
     1961    outline: none;
     1962    box-shadow: 0 0 0 3px rgba(99,102,241,.1);
     1963}
     1964
     1965.nf-submissions-table {
     1966    width: 100%;
     1967    border-collapse: collapse;
     1968    border-radius: var(--nf-r-lg) !important;
     1969    overflow: hidden;
     1970    border: 1px solid var(--nf-border);
     1971    box-shadow: var(--nf-shadow-sm);
     1972}
     1973
     1974.nf-submissions-table thead th {
     1975    background: var(--nf-surface-2);
     1976    font-weight: 700;
     1977    font-size: 12px;
     1978    text-transform: uppercase;
     1979    letter-spacing: .05em;
     1980    color: var(--nf-text-2);
     1981    padding: 14px 16px;
     1982    border-bottom: 1px solid var(--nf-border);
     1983    text-align: left;
     1984}
     1985
     1986.nf-submissions-table tbody td {
     1987    padding: 14px 16px;
     1988    font-size: 13px;
     1989    border-bottom: 1px solid var(--nf-border);
     1990    transition: background var(--nf-dur) var(--nf-ease);
     1991}
     1992
     1993.nf-submissions-table tbody tr:hover td {
     1994    background: var(--nf-surface-2);
     1995}
     1996
     1997.nf-submissions-table tbody tr:last-child td {
     1998    border-bottom: none;
     1999}
     2000
     2001.nfa-sub-row--unread td {
     2002    background: rgba(99,102,241,.03) !important;
     2003    font-weight: 500;
     2004}
     2005
     2006/* Action links inside submissions */
     2007.nf-submissions-table .row-actions {
     2008    visibility: hidden;
     2009    opacity: 0;
     2010    transition: opacity var(--nf-dur) var(--nf-ease);
     2011    font-size: 12px;
     2012}
     2013
     2014.nf-submissions-table tbody tr:hover .row-actions {
     2015    visibility: visible;
     2016    opacity: 1;
     2017}
     2018
     2019.nf-submissions-table .row-actions a {
     2020    color: var(--nf-brand-1);
     2021    text-decoration: none;
     2022    font-weight: 600;
     2023    transition: color var(--nf-dur) var(--nf-ease);
     2024}
     2025
     2026.nf-submissions-table .row-actions a:hover {
     2027    color: var(--nf-brand-2);
     2028}
     2029
     2030.nf-submissions-table .row-actions .delete a {
     2031    color: var(--nf-error);
     2032}
     2033
     2034.nf-submissions-table .row-actions .delete a:hover {
     2035    color: #dc2626;
     2036}
     2037
     2038/* Submissions admin badges */
     2039.nfa-badge {
     2040    display: inline-block;
     2041    padding: 3px 12px;
     2042    border-radius: var(--nf-r-full);
     2043    font-size: 11px;
     2044    font-weight: 700;
     2045    text-transform: uppercase;
     2046    letter-spacing: .04em;
     2047}
     2048
     2049.nfa-badge--blue {
     2050    background: rgba(99,102,241,.08);
     2051    color: var(--nf-brand-1);
     2052    border: 1px solid rgba(99,102,241,.15);
     2053}
     2054
     2055.nfa-badge--gray {
     2056    background: var(--nf-surface-3);
     2057    color: var(--nf-text-2);
     2058    border: 1px solid var(--nf-border);
     2059}
     2060
     2061/* Pagination */
     2062.nf-pagination {
     2063    display: flex;
     2064    align-items: center;
     2065    justify-content: flex-end;
     2066    gap: 6px;
     2067    margin-top: 16px;
     2068    font-size: 13px;
     2069}
     2070
     2071.nf-pagination a,
     2072.nf-pagination span {
     2073    display: inline-flex;
     2074    align-items: center;
     2075    justify-content: center;
     2076    min-width: 36px;
     2077    height: 36px;
     2078    padding: 0 10px;
     2079    border-radius: var(--nf-r-sm);
     2080    font-weight: 600;
     2081    text-decoration: none;
     2082    transition: all var(--nf-dur-md) var(--nf-ease);
     2083}
     2084
     2085.nf-pagination a {
     2086    background: var(--nf-surface);
     2087    border: 1px solid var(--nf-border);
     2088    color: var(--nf-text-2);
     2089}
     2090
     2091.nf-pagination a:hover {
     2092    border-color: var(--nf-brand-1);
     2093    color: var(--nf-brand-1);
     2094    background: rgba(99,102,241,.04);
     2095}
     2096
     2097.nf-pagination .current {
     2098    background: var(--nf-brand-1);
     2099    color: var(--nf-text-inv);
     2100    border: 1px solid var(--nf-brand-1);
     2101    box-shadow: 0 2px 8px rgba(99,102,241,.2);
     2102}
     2103
     2104/* Single Submission Detail */
     2105.nf-submission-detail {
     2106    background: var(--nf-surface);
     2107    border: 1px solid var(--nf-border);
     2108    border-radius: var(--nf-r-xl);
     2109    padding: 32px;
     2110    box-shadow: var(--nf-shadow-sm);
     2111}
     2112
     2113.nf-submission-detail__header {
     2114    display: flex;
     2115    align-items: center;
     2116    justify-content: space-between;
     2117    gap: 16px;
     2118    margin-bottom: 24px;
     2119    padding-bottom: 20px;
     2120    border-bottom: 1px solid var(--nf-border);
     2121    flex-wrap: wrap;
     2122}
     2123
     2124.nf-submission-detail__title {
     2125    font-size: 20px;
     2126    font-weight: 800;
     2127    color: var(--nf-text);
     2128    margin: 0;
     2129    display: flex;
     2130    align-items: center;
    16322131    gap: 10px;
    1633     margin-bottom: 6px;
    1634 }
    1635 
    1636 .nf-extension-card__label {
     2132    letter-spacing: -.3px;
     2133}
     2134
     2135.nf-submission-detail__meta {
     2136    display: flex;
     2137    gap: 16px;
     2138    font-size: 13px;
     2139    color: var(--nf-text-3);
    16372140    font-weight: 600;
     2141}
     2142
     2143.nf-submission-detail table {
     2144    width: 100%;
     2145    border-collapse: collapse;
     2146    margin-top: 4px;
     2147}
     2148
     2149.nf-submission-detail table th {
     2150    text-align: left;
     2151    font-weight: 700;
     2152    font-size: 13px;
     2153    color: var(--nf-text);
     2154    padding: 12px 16px;
     2155    background: var(--nf-surface-2);
     2156    border-bottom: 1px solid var(--nf-border);
     2157    width: 200px;
     2158}
     2159
     2160.nf-submission-detail table td {
    16382161    font-size: 14px;
    1639     color: #1e293b;
    1640 }
    1641 
    1642 .nf-extension-card__desc {
    1643     font-size: 12px;
    1644     color: #64748b;
    1645     line-height: 1.5;
    1646     margin: 0;
    1647 }
     2162    color: var(--nf-text-2);
     2163    padding: 12px 16px;
     2164    border-bottom: 1px solid var(--nf-border);
     2165}
     2166
     2167.nf-submission-detail table tr:last-child th,
     2168.nf-submission-detail table tr:last-child td {
     2169    border-bottom: none;
     2170}
     2171
     2172/* ==========================================================================
     2173   Responsive
     2174   ========================================================================== */
     2175
     2176@media (max-width: 600px) {
     2177    .nf-admin-wrap {
     2178        margin: 10px 10px 30px 0;
     2179    }
     2180
     2181    .nf-admin-header {
     2182        padding: 32px 24px;
     2183    }
     2184
     2185    .nf-admin-header h1 {
     2186        font-size: 26px;
     2187    }
     2188
     2189    .nf-header-stats {
     2190        flex-wrap: wrap;
     2191    }
     2192
     2193    .nf-onboarding {
     2194        padding: 22px;
     2195    }
     2196
     2197    .nf-card {
     2198        padding: 20px;
     2199    }
     2200
     2201    .nf-changelog-timeline {
     2202        padding-left: 32px;
     2203    }
     2204
     2205    .nf-changelog-timeline::before {
     2206        left: 8px;
     2207    }
     2208
     2209    .nf-timeline-entry__marker {
     2210        left: -32px;
     2211    }
     2212
     2213    .nf-timeline-entry__dot {
     2214        left: 2px;
     2215    }
     2216
     2217    .nf-tabs {
     2218        flex-wrap: wrap;
     2219    }
     2220
     2221    .nf-widget-grid {
     2222        grid-template-columns: 1fr;
     2223    }
     2224
     2225    .nf-submission-detail {
     2226        padding: 20px;
     2227    }
     2228}
  • nebula-forge-addons-for-elementor/trunk/assets/css/admin.min.css

    r3462607 r3463192  
    1 :root{--nf-brand-1:#6366f1;--nf-brand-2:#8b5cf6;--nf-brand-3:#a78bfa;--nf-accent:#f97316;--nf-dark:#0f172a;--nf-dark-2:#1e293b;--nf-surface:#ffffff;--nf-surface-2:#f8fafc;--nf-surface-3:#f1f5f9;--nf-text:#0f172a;--nf-text-2:#475569;--nf-text-3:#94a3b8;--nf-text-inv:#ffffff;--nf-border:#e2e8f0;--nf-border-2:#cbd5e1;--nf-success:#10b981;--nf-success-bg:#ecfdf5;--nf-warning:#f59e0b;--nf-error:#ef4444;--nf-r-xs:6px;--nf-r-sm:8px;--nf-r-md:12px;--nf-r-lg:16px;--nf-r-xl:20px;--nf-r-full:999px;--nf-shadow-xs:0 1px 2px rgba(0,0,0,.05);--nf-shadow-sm:0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.04);--nf-shadow-md:0 4px 6px -1px rgba(0,0,0,.07),0 2px 4px -2px rgba(0,0,0,.05);--nf-shadow-lg:0 10px 25px -3px rgba(0,0,0,.08),0 4px 10px -4px rgba(0,0,0,.04);--nf-shadow-xl:0 20px 50px -5px rgba(0,0,0,.1),0 8px 20px -6px rgba(0,0,0,.05);--nf-ease:cubic-bezier(.4,0,.2,1);--nf-dur:.2s;--nf-dur-lg:.3s;--nf-grad:linear-gradient(135deg, var(--nf-brand-1) 0%, var(--nf-brand-2) 50%, var(--nf-brand-3) 100%);--nf-grad-dark:linear-gradient(135deg, #0f172a 0%, #1e293b 100%)}.nf-admin-wrap{max-width:1280px;margin:20px 20px 40px 0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--nf-text);line-height:1.5}.nf-admin-wrap *,.nf-admin-wrap ::after,.nf-admin-wrap ::before{box-sizing:border-box}.nf-admin-content{margin-top:24px}.nf-admin-row{display:grid;grid-template-columns:1fr 340px;gap:28px;align-items:start}@media (max-width:1100px){.nf-admin-row{grid-template-columns:1fr}}.nf-admin-header{background:var(--nf-grad-dark);padding:48px 40px 40px;border-radius:var(--nf-r-xl);color:var(--nf-text-inv);position:relative;overflow:hidden}.nf-admin-header::before{content:'';position:absolute;top:-80px;right:-60px;width:340px;height:340px;background:radial-gradient(circle,rgba(99,102,241,.35) 0,transparent 70%);border-radius:50%;pointer-events:none}.nf-admin-header::after{content:'';position:absolute;bottom:-100px;left:30%;width:260px;height:260px;background:radial-gradient(circle,rgba(139,92,246,.25) 0,transparent 70%);border-radius:50%;pointer-events:none}.nf-admin-header__content{position:relative;z-index:1}.nf-admin-header__top{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;flex-wrap:wrap}.nf-admin-header__badge{display:inline-flex;align-items:center;background:rgba(255,255,255,.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:4px 14px;border-radius:var(--nf-r-full);font-size:12px;font-weight:600;letter-spacing:.5px;margin-bottom:12px;border:1px solid rgba(255,255,255,.2)}.nf-admin-header h1{margin:0 0 8px;font-size:34px;font-weight:800;color:var(--nf-text-inv);line-height:1.15;letter-spacing:-.5px}.nf-admin-header__tagline{margin:0;font-size:15px;opacity:.85;max-width:520px;line-height:1.6}.nf-header-stats{display:flex;gap:16px}.nf-header-stat{background:rgba(255,255,255,.1);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.15);border-radius:var(--nf-r-md);padding:16px 22px;text-align:center;min-width:90px}.nf-header-stat__value{display:block;font-size:28px;font-weight:800;line-height:1;color:var(--nf-text-inv)}.nf-header-stat__label{display:block;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;opacity:.7;margin-top:4px}.nf-admin-header--compact{padding:32px 36px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}.nf-admin-header--compact h1{font-size:26px;display:flex;align-items:center;gap:10px}.nf-admin-header--compact h1 .dashicons{font-size:24px;width:24px;height:24px;opacity:.8}.nf-header-stats--compact{gap:12px}.nf-header-stats--compact .nf-header-stat{padding:12px 18px;min-width:70px}.nf-header-stats--compact .nf-header-stat__value{font-size:22px}.nf-tabs{display:inline-flex;gap:4px;margin-top:20px;padding:5px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);box-shadow:var(--nf-shadow-xs)}.nf-tab{display:inline-flex;align-items:center;gap:7px;padding:10px 18px;border-radius:var(--nf-r-sm);color:var(--nf-text-2);font-size:13px;font-weight:600;text-decoration:none;transition:all var(--nf-dur) var(--nf-ease);border:1px solid transparent}.nf-tab .dashicons{font-size:16px;width:16px;height:16px}.nf-tab:hover{background:var(--nf-surface-3);color:var(--nf-text)}.nf-tab--active{background:var(--nf-brand-1);color:var(--nf-text-inv);box-shadow:0 2px 8px rgba(99,102,241,.3)}.nf-tab--active:hover{background:var(--nf-brand-1);color:var(--nf-text-inv)}.nf-tab:focus-visible{outline:2px solid var(--nf-brand-1);outline-offset:2px}.nf-onboarding{margin-top:24px;padding:28px 32px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);box-shadow:var(--nf-shadow-xs)}.nf-onboarding__title{display:flex;align-items:center;gap:10px;margin:0 0 20px;font-size:17px;font-weight:700;color:var(--nf-text)}.nf-onboarding__title .dashicons{color:var(--nf-brand-1);font-size:20px;width:20px;height:20px}.nf-onboarding__steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}@media (max-width:768px){.nf-onboarding__steps{grid-template-columns:1fr}}.nf-onboard-step{position:relative;padding:20px;background:var(--nf-surface-2);border:1px solid var(--nf-border);border-radius:var(--nf-r-md);transition:all var(--nf-dur) var(--nf-ease)}.nf-onboard-step:hover{border-color:var(--nf-brand-3);box-shadow:var(--nf-shadow-sm);transform:translateY(-2px)}.nf-onboard-step__num{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--nf-grad);border-radius:var(--nf-r-full);color:var(--nf-text-inv);font-size:14px;font-weight:700;margin-bottom:12px}.nf-onboard-step h3{margin:0 0 6px;font-size:15px;font-weight:700;color:var(--nf-text)}.nf-onboard-step p{margin:0;font-size:13px;color:var(--nf-text-2);line-height:1.5}.nf-category-section{margin-bottom:28px}.nf-category-section:last-child{margin-bottom:0}.nf-category-section__title{display:flex;align-items:center;gap:10px;margin:0 0 16px;font-size:16px;font-weight:700;color:var(--nf-text)}.nf-category-section__title .dashicons{color:var(--nf-brand-1);font-size:18px;width:18px;height:18px}.nf-category-section__count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;background:var(--nf-surface-3);border-radius:var(--nf-r-full);font-size:11px;font-weight:700;color:var(--nf-text-2)}.nf-widget-showcase{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.nf-showcase-card{background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-md);padding:20px;transition:all var(--nf-dur-lg) var(--nf-ease);position:relative}.nf-showcase-card:hover{border-color:var(--nf-brand-3);box-shadow:var(--nf-shadow-md);transform:translateY(-3px)}.nf-showcase-card--inactive{opacity:.55}.nf-showcase-card__header{display:flex;align-items:center;gap:10px;margin-bottom:12px}.nf-showcase-card__icon{width:42px;height:42px;background:var(--nf-badge-color,var(--nf-brand-1));border-radius:var(--nf-r-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0;opacity:.9}.nf-showcase-card__icon span{font-size:18px;color:var(--nf-text-inv)}.nf-status-dot{width:8px;height:8px;border-radius:50%;margin-left:auto;flex-shrink:0}.nf-status-dot--active{background:var(--nf-success);box-shadow:0 0 0 3px rgba(16,185,129,.2)}.nf-showcase-card__title{margin:0 0 6px;font-size:15px;font-weight:700;color:var(--nf-text);display:flex;align-items:center;gap:6px;flex-wrap:wrap}.nf-showcase-card__desc{margin:0;font-size:13px;color:var(--nf-text-2);line-height:1.5}.nf-card{background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);padding:24px;margin-bottom:16px;box-shadow:var(--nf-shadow-xs)}.nf-card:last-child{margin-bottom:0}.nf-card__title{display:flex;align-items:center;gap:10px;margin:0 0 18px;font-size:16px;font-weight:700;color:var(--nf-text)}.nf-card__title .dashicons{color:var(--nf-brand-1);font-size:20px;width:20px;height:20px}.nf-card--status{border-left:3px solid var(--nf-brand-1)}.nf-status-list{margin:0;padding:0;list-style:none}.nf-status-list li{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--nf-border);font-size:13px}.nf-status-list li:last-child{border-bottom:none;padding-bottom:0}.nf-status-list__icon{flex-shrink:0}.nf-status-list__icon .dashicons{font-size:18px;width:18px;height:18px}.nf-status-list__icon--ok .dashicons{color:var(--nf-success)}.nf-status-list__icon--error .dashicons{color:var(--nf-error)}.nf-status-list__text{flex:1;font-weight:600;color:var(--nf-text)}.nf-status-list__value{font-size:12px;font-weight:600;color:var(--nf-text-2);background:var(--nf-surface-3);padding:2px 10px;border-radius:var(--nf-r-full)}.nf-card--tip{background:linear-gradient(135deg,#fef3c7 0,#fffbeb 100%);border-color:#fde68a;text-align:center}.nf-card--tip .nf-card__title{justify-content:center}.nf-card__tip-icon{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;background:linear-gradient(135deg,#f59e0b,#d97706);border-radius:var(--nf-r-full);margin:0 auto 12px}.nf-card__tip-icon .dashicons{font-size:24px;width:24px;height:24px;color:var(--nf-text-inv)}.nf-card--tip p{font-size:13px;color:var(--nf-text-2);margin:0 0 16px;line-height:1.6}.nf-links-list{margin:0;padding:0;list-style:none}.nf-links-list li{margin-bottom:6px}.nf-links-list li:last-child{margin-bottom:0}.nf-links-list a{display:flex;align-items:center;gap:10px;padding:11px 14px;background:var(--nf-surface-2);border:1px solid transparent;border-radius:var(--nf-r-sm);color:var(--nf-text);text-decoration:none;font-size:13px;font-weight:600;transition:all var(--nf-dur) var(--nf-ease)}.nf-links-list a:hover{background:var(--nf-brand-1);color:var(--nf-text-inv);box-shadow:var(--nf-shadow-sm)}.nf-links-list a .dashicons{font-size:16px;width:16px;height:16px}.nf-links-list__arrow{margin-left:auto;font-size:14px!important;width:14px!important;height:14px!important;opacity:.5}.nf-links-list a:hover .nf-links-list__arrow{opacity:1}.nf-badge-chip{display:inline-flex;align-items:center;justify-content:center;padding:2px 8px;border-radius:var(--nf-r-full);background:var(--nf-badge-color,var(--nf-brand-1));color:var(--nf-text-inv);font-size:9px;font-weight:800;letter-spacing:.7px;text-transform:uppercase;line-height:1.4}.nf-tooltip{position:relative;display:inline-flex;align-items:center;margin-left:4px;color:var(--nf-text-3);cursor:help}.nf-tooltip .dashicons{font-size:15px;width:15px;height:15px}.nf-tooltip:focus{outline:0;box-shadow:0 0 0 2px rgba(99,102,241,.3);border-radius:var(--nf-r-full)}.nf-tooltip::after{content:attr(data-tooltip);position:absolute;bottom:130%;left:50%;transform:translateX(-50%) translateY(4px);background:var(--nf-dark);color:var(--nf-text-inv);padding:8px 12px;border-radius:var(--nf-r-sm);font-size:12px;line-height:1.4;width:220px;opacity:0;pointer-events:none;transition:opacity var(--nf-dur) var(--nf-ease),transform var(--nf-dur) var(--nf-ease);box-shadow:var(--nf-shadow-xl);z-index:10;font-weight:400}.nf-tooltip::before{content:'';position:absolute;bottom:115%;left:50%;transform:translateX(-50%);border-width:6px;border-style:solid;border-color:var(--nf-dark) transparent transparent transparent;opacity:0;transition:opacity var(--nf-dur) var(--nf-ease);z-index:10}.nf-tooltip:focus::after,.nf-tooltip:focus::before,.nf-tooltip:hover::after,.nf-tooltip:hover::before{opacity:1}.nf-tooltip:focus::after,.nf-tooltip:hover::after{transform:translateX(-50%) translateY(-4px)}.nf-button{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;border:none;border-radius:var(--nf-r-sm);font-size:13px;font-weight:700;cursor:pointer;transition:all var(--nf-dur) var(--nf-ease);text-decoration:none;line-height:1.4}.nf-button .dashicons{font-size:16px;width:16px;height:16px}.nf-button--primary{background:var(--nf-grad);color:var(--nf-text-inv);border:none;box-shadow:0 2px 8px rgba(99,102,241,.25)}.nf-button--primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(99,102,241,.35)}.nf-button--primary:active{transform:translateY(0)}.nf-button--outline{background:var(--nf-surface);color:var(--nf-text);border:1px solid var(--nf-border-2)}.nf-button--outline:hover{border-color:var(--nf-brand-1);color:var(--nf-brand-1);background:rgba(99,102,241,.04)}.nf-button--sm{padding:7px 14px;font-size:12px}.nf-button--sm .dashicons{font-size:14px;width:14px;height:14px}.nf-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 20px;margin-bottom:20px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-md);box-shadow:var(--nf-shadow-xs);flex-wrap:wrap}.nf-toolbar__left{display:flex;gap:8px}.nf-toolbar__counter{font-size:13px;font-weight:700;color:var(--nf-text-2)}.nf-toolbar__counter span{color:var(--nf-brand-1);font-size:16px}.nf-widget-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}@media (max-width:768px){.nf-widget-grid{grid-template-columns:1fr}}.nf-widget-card{background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-md);padding:0;display:flex;flex-direction:column;transition:all var(--nf-dur-lg) var(--nf-ease);overflow:hidden}.nf-widget-card:hover{border-color:var(--nf-brand-3);box-shadow:var(--nf-shadow-md);transform:translateY(-2px)}.nf-widget-card--disabled{opacity:.45}.nf-widget-card--disabled:hover{opacity:.6}.nf-widget-card__header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--nf-border);background:var(--nf-surface-2)}.nf-widget-card__icon{width:40px;height:40px;background:var(--nf-badge-color,var(--nf-brand-1));border-radius:var(--nf-r-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}.nf-widget-card__icon span{font-size:18px;color:var(--nf-text-inv)}.nf-widget-card__content{padding:16px 20px;flex:1}.nf-widget-card__content h3{margin:0 0 6px;font-size:15px;font-weight:700;color:var(--nf-text);display:flex;align-items:center;gap:6px;flex-wrap:wrap}.nf-widget-card__content p{margin:0;font-size:13px;color:var(--nf-text-2);line-height:1.5}.nf-widget-card__footer{display:flex;align-items:flex-start;gap:6px;padding:12px 20px;background:var(--nf-surface-2);border-top:1px solid var(--nf-border);font-size:12px;color:var(--nf-text-3)}.nf-widget-card__footer .dashicons{font-size:14px;width:14px;height:14px;margin-top:1px;flex-shrink:0}.nf-widget-card__tip{line-height:1.4}.nf-toggle{position:relative;display:inline-flex;align-items:center;cursor:pointer}.nf-toggle input{position:absolute;opacity:0;width:0;height:0}.nf-toggle__slider{position:relative;width:44px;height:24px;background:#cbd5e1;border-radius:24px;transition:all var(--nf-dur) var(--nf-ease)}.nf-toggle__slider::before{content:'';position:absolute;height:18px;width:18px;left:3px;bottom:3px;background:var(--nf-surface);border-radius:50%;transition:all var(--nf-dur) var(--nf-ease);box-shadow:0 1px 3px rgba(0,0,0,.15)}.nf-toggle input:checked+.nf-toggle__slider{background:var(--nf-brand-1)}.nf-toggle input:checked+.nf-toggle__slider::before{transform:translateX(20px)}.nf-toggle input:focus-visible+.nf-toggle__slider{box-shadow:0 0 0 3px rgba(99,102,241,.3)}.nf-settings-footer{margin-top:28px;padding:20px 24px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-md);display:flex;align-items:center;gap:16px;flex-wrap:wrap;box-shadow:var(--nf-shadow-xs)}.nf-settings-footer__note{margin:0;font-size:13px;color:var(--nf-text-3)}.nf-notice{display:flex;align-items:center;gap:10px;padding:14px 18px;border-radius:var(--nf-r-sm);margin-bottom:20px;font-size:14px;font-weight:600}.nf-notice--success{background:var(--nf-success-bg);color:#065f46;border:1px solid #a7f3d0}.nf-notice .dashicons{font-size:18px;width:18px;height:18px;color:var(--nf-success)}.nf-changelog-timeline{max-width:780px;position:relative;padding-left:36px}.nf-changelog-timeline::before{content:'';position:absolute;left:11px;top:0;bottom:0;width:2px;background:var(--nf-border);border-radius:2px}.nf-timeline-entry{position:relative;margin-bottom:24px}.nf-timeline-entry:last-child{margin-bottom:0}.nf-timeline-entry__marker{position:absolute;left:-36px;top:22px}.nf-timeline-entry__dot{display:block;width:14px;height:14px;background:var(--nf-surface);border:3px solid var(--nf-border-2);border-radius:50%;position:relative;left:5px;transition:all var(--nf-dur) var(--nf-ease)}.nf-timeline-entry--latest .nf-timeline-entry__dot{background:var(--nf-brand-1);border-color:var(--nf-brand-1);box-shadow:0 0 0 4px rgba(99,102,241,.2)}.nf-timeline-entry__card{background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-md);padding:20px 24px;box-shadow:var(--nf-shadow-xs);transition:all var(--nf-dur) var(--nf-ease)}.nf-timeline-entry:hover .nf-timeline-entry__card{box-shadow:var(--nf-shadow-sm);border-color:var(--nf-brand-3)}.nf-timeline-entry--latest .nf-timeline-entry__card{border-left:3px solid var(--nf-brand-1)}.nf-timeline-entry__header{display:flex;align-items:center;gap:10px;margin-bottom:14px}.nf-timeline-entry__version{font-size:18px;font-weight:800;color:var(--nf-text)}.nf-badge{display:inline-flex;padding:3px 10px;border-radius:var(--nf-r-full);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.nf-badge--latest{background:var(--nf-grad);color:var(--nf-text-inv)}.nf-timeline-entry__changes{margin:0;padding:0;list-style:none}.nf-timeline-entry__changes li{display:flex;align-items:flex-start;gap:8px;padding:8px 0;border-bottom:1px solid var(--nf-border);font-size:13px;color:var(--nf-text-2);line-height:1.5}.nf-timeline-entry__changes li:last-child{border-bottom:none;padding-bottom:0}.nf-timeline-entry__changes li .dashicons{font-size:14px;width:14px;height:14px;margin-top:2px;flex-shrink:0}.nf-change--add .dashicons{color:var(--nf-success)}.nf-change--fix .dashicons{color:var(--nf-error)}.nf-change--improve .dashicons{color:var(--nf-brand-1)}.nf-change--default .dashicons{color:var(--nf-text-3)}@media (max-width:600px){.nf-admin-wrap{margin:10px 10px 20px 0}.nf-admin-header{padding:28px 20px}.nf-admin-header h1{font-size:24px}.nf-header-stats{flex-wrap:wrap}.nf-onboarding{padding:20px}.nf-card{padding:18px}.nf-changelog-timeline{padding-left:28px}.nf-changelog-timeline::before{left:7px}.nf-timeline-entry__marker{left:-28px}.nf-timeline-entry__dot{left:1px}}.nf-font-form{display:flex;flex-direction:column;gap:20px}.nf-font-form__row{display:flex;align-items:center;gap:12px}.nf-font-form__row label{font-weight:600;font-size:13px;color:var(--nf-text);white-space:nowrap}.nf-font-form__row input[type=text]{max-width:400px;width:100%;padding:9px 14px;border:1px solid var(--nf-border-2);border-radius:var(--nf-r-sm);font-size:14px;line-height:1.4;color:var(--nf-text);background:var(--nf-surface);transition:border-color var(--nf-dur) var(--nf-ease),box-shadow var(--nf-dur) var(--nf-ease)}.nf-font-form__row input[type=text]:focus{border-color:var(--nf-brand-1);outline:0;box-shadow:0 0 0 3px rgba(99,102,241,.12)}.nf-font-variants h4{font-weight:600;font-size:13px;color:var(--nf-text);margin:0 0 10px}.nf-font-variant{background:var(--nf-surface-2);border:1px solid var(--nf-border);border-radius:var(--nf-r-sm);padding:16px 18px;margin-bottom:10px;position:relative}.nf-font-variant__row{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}.nf-font-variant__field{display:flex;flex-direction:column;gap:5px;min-width:120px}.nf-font-variant__field label{font-weight:500;font-size:12px;color:var(--nf-text-2);text-transform:uppercase;letter-spacing:.03em}.nf-font-variant__field select{padding:7px 10px;border:1px solid var(--nf-border-2);border-radius:var(--nf-r-xs);font-size:13px;background:var(--nf-surface);color:var(--nf-text);min-width:140px;cursor:pointer;transition:border-color var(--nf-dur) var(--nf-ease)}.nf-font-variant__field select:focus{border-color:var(--nf-brand-1);outline:0;box-shadow:0 0 0 2px rgba(99,102,241,.1)}.nf-font-variant__field--file{flex:1;min-width:200px;flex-direction:row;align-items:center;gap:10px}.nf-font-variant__field--file label{white-space:nowrap}.nfa-upload-font-btn{white-space:nowrap;flex-shrink:0}.nfa-font-filename{font-size:12px;color:var(--nf-brand-1);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}.nfa-remove-variant{width:28px;height:28px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px;line-height:1;color:var(--nf-text-3);background:var(--nf-surface);border:1px solid var(--nf-border)!important;border-radius:var(--nf-r-xs);cursor:pointer;transition:color var(--nf-dur) var(--nf-ease),border-color var(--nf-dur) var(--nf-ease),background var(--nf-dur) var(--nf-ease);padding:0;align-self:flex-end;margin-bottom:2px}.nfa-remove-variant:hover{color:var(--nf-error);border-color:#fecaca!important;background:#fef2f2}.nf-font-form__actions{display:flex;gap:10px;margin-top:4px;align-items:center}.nf-font-form__actions .button{display:inline-flex;align-items:center;gap:4px}.nf-font-form__actions .button .dashicons{font-size:16px;width:16px;height:16px;line-height:1}.nf-font-form__actions .button-primary{background:var(--nf-brand-1);border-color:var(--nf-brand-1);color:#fff}.nf-font-form__actions .button-primary:hover{background:var(--nf-brand-2);border-color:var(--nf-brand-2)}.nf-card--font-list{margin-top:24px}.nf-font-item{display:flex;align-items:center;gap:16px;padding:18px 20px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-md);margin-bottom:12px;transition:border-color var(--nf-dur) var(--nf-ease),box-shadow var(--nf-dur) var(--nf-ease)}.nf-font-item:hover{border-color:#c7d2fe;box-shadow:var(--nf-shadow-sm)}.nf-font-item__info{flex:0 0 auto;min-width:140px}.nf-font-item__name{font-size:15px;font-weight:700;color:var(--nf-text);margin:0 0 4px;display:block}.nf-font-item__variants{font-size:11px;color:var(--nf-text-3);display:block}.nf-font-item__preview{flex:1;font-size:20px;color:var(--nf-text-2);line-height:1.4;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.nfa-delete-font{flex-shrink:0;display:inline-flex;align-items:center;gap:4px;color:var(--nf-error)!important;border-color:#fecaca!important}.nfa-delete-font:hover{background:#fef2f2!important;border-color:var(--nf-error)!important}.nfa-delete-font .dashicons{font-size:16px;width:16px;height:16px}.nf-empty-state{color:var(--nf-text-3);font-size:14px;font-style:italic;padding:20px 0;text-align:center}@media (max-width:600px){.nf-font-variant__row{flex-direction:column;align-items:stretch}.nf-font-variant__field--file{flex-direction:column;align-items:flex-start}.nf-font-item{flex-direction:column;align-items:flex-start}}.nf-extensions-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin-top:16px}.nf-extension-card{display:flex;align-items:flex-start;gap:14px;padding:18px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;transition:border-color .2s ease,box-shadow .2s ease}.nf-extension-card:hover{border-color:#c7d2fe;box-shadow:0 2px 8px rgba(99,102,241,.06)}.nf-extension-card__icon{flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:#eef2ff;border-radius:8px;color:#6366f1;font-size:18px}.nf-extension-card__body{flex:1;min-width:0}.nf-extension-card__header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}.nf-extension-card__label{font-weight:600;font-size:14px;color:#1e293b}.nf-extension-card__desc{font-size:12px;color:#64748b;line-height:1.5;margin:0}
     1:root{--nf-brand-1:#6366f1;--nf-brand-2:#8b5cf6;--nf-brand-3:#a78bfa;--nf-brand-4:#c4b5fd;--nf-accent:#f97316;--nf-accent-2:#fb923c;--nf-dark:#0c111d;--nf-dark-2:#151b2b;--nf-dark-3:#1e2640;--nf-surface:#ffffff;--nf-surface-2:#f9fafb;--nf-surface-3:#f3f4f6;--nf-surface-4:#e5e7eb;--nf-text:#111827;--nf-text-2:#4b5563;--nf-text-3:#9ca3af;--nf-text-inv:#ffffff;--nf-border:#e5e7eb;--nf-border-2:#d1d5db;--nf-border-3:rgba(99,102,241,.18);--nf-success:#10b981;--nf-success-bg:#ecfdf5;--nf-warning:#f59e0b;--nf-error:#ef4444;--nf-r-xs:6px;--nf-r-sm:8px;--nf-r-md:12px;--nf-r-lg:16px;--nf-r-xl:20px;--nf-r-2xl:24px;--nf-r-full:999px;--nf-shadow-xs:0 1px 2px rgba(0,0,0,.04);--nf-shadow-sm:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);--nf-shadow-md:0 4px 6px -1px rgba(0,0,0,.06),0 2px 4px -2px rgba(0,0,0,.04);--nf-shadow-lg:0 10px 15px -3px rgba(0,0,0,.07),0 4px 6px -4px rgba(0,0,0,.04);--nf-shadow-xl:0 20px 40px -4px rgba(0,0,0,.08),0 8px 16px -6px rgba(0,0,0,.04);--nf-shadow-2xl:0 25px 50px -6px rgba(0,0,0,.12);--nf-shadow-inner:inset 0 2px 4px rgba(0,0,0,.04);--nf-shadow-glow:0 0 20px rgba(99,102,241,.15);--nf-shadow-card-hover:0 12px 28px -6px rgba(99,102,241,.12),0 4px 12px -4px rgba(0,0,0,.06);--nf-ease:cubic-bezier(.4,0,.2,1);--nf-ease-out:cubic-bezier(.0,0,.2,1);--nf-ease-spring:cubic-bezier(.175,.885,.32,1.275);--nf-dur:.2s;--nf-dur-md:.3s;--nf-dur-lg:.45s;--nf-grad:linear-gradient(135deg,var(--nf-brand-1) 0%,var(--nf-brand-2) 50%,var(--nf-brand-3) 100%);--nf-grad-dark:linear-gradient(135deg,#0c111d 0%,#151b2b 40%,#1e2640 100%);--nf-grad-subtle:linear-gradient(135deg,rgba(99,102,241,.04) 0%,rgba(139,92,246,.04) 100%);--nf-grad-glass:linear-gradient(135deg,rgba(255,255,255,.12) 0%,rgba(255,255,255,.05) 100%)}.nf-admin-wrap{max-width:1340px;margin:20px 20px 60px 0;font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--nf-text);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}.nf-admin-wrap *,.nf-admin-wrap *::before,.nf-admin-wrap *::after{box-sizing:border-box}.nf-admin-wrap ::selection{background:rgba(99,102,241,.15);color:var(--nf-text)}.nf-admin-wrap :focus-visible{outline:2px solid var(--nf-brand-1);outline-offset:2px;border-radius:var(--nf-r-xs)}.nf-admin-content{margin-top:28px}.nf-admin-row{display:grid;grid-template-columns:1fr 360px;gap:32px;align-items:start}@media (max-width:1100px){.nf-admin-row{grid-template-columns:1fr}}.nf-admin-header{background:var(--nf-grad-dark);padding:52px 48px 48px;border-radius:var(--nf-r-2xl);color:var(--nf-text-inv);position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.06)}.nf-admin-header::before{content:'';position:absolute;top:-120px;right:-80px;width:450px;height:450px;background:radial-gradient(circle,rgba(99,102,241,.4) 0%,rgba(99,102,241,.08) 40%,transparent 70%);border-radius:50%;pointer-events:none;animation:nf-orb-float 8s ease-in-out infinite alternate}.nf-admin-header::after{content:'';position:absolute;bottom:-130px;left:20%;width:380px;height:380px;background:radial-gradient(circle,rgba(139,92,246,.3) 0%,rgba(167,139,250,.06) 40%,transparent 70%);border-radius:50%;pointer-events:none;animation:nf-orb-float 10s ease-in-out infinite alternate-reverse}@keyframes nf-orb-float{0%{transform:translate(0,0) scale(1)}100%{transform:translate(-30px,20px) scale(1.1)}}.nf-admin-header__content{position:relative;z-index:1}.nf-admin-header__top{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;flex-wrap:wrap}.nf-admin-header__badge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:5px 16px;border-radius:var(--nf-r-full);font-size:12px;font-weight:700;letter-spacing:.6px;margin-bottom:16px;border:1px solid rgba(255,255,255,.15);text-transform:uppercase}.nf-admin-header__badge::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--nf-success);box-shadow:0 0 6px rgba(16,185,129,.6)}.nf-admin-header h1{margin:0 0 10px;font-size:36px;font-weight:800;color:var(--nf-text-inv);line-height:1.15;letter-spacing:-.75px}.nf-admin-header__tagline{margin:0;font-size:15px;opacity:.75;max-width:540px;line-height:1.7;font-weight:400}.nf-header-stats{display:flex;gap:12px}.nf-header-stat{background:rgba(255,255,255,.07);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:var(--nf-r-lg);padding:18px 24px;text-align:center;min-width:100px;transition:all var(--nf-dur-md) var(--nf-ease)}.nf-header-stat:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);transform:translateY(-2px)}.nf-header-stat__value{display:block;font-size:30px;font-weight:800;line-height:1;color:var(--nf-text-inv);letter-spacing:-.5px}.nf-header-stat__label{display:block;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1px;opacity:.6;margin-top:6px}.nf-admin-header--compact{padding:36px 40px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}.nf-admin-header--compact h1{font-size:28px;margin-bottom:0;display:flex;align-items:center;gap:12px}.nf-admin-header--compact h1 .dashicons{font-size:24px;width:24px;height:24px;opacity:.7}.nf-header-stats--compact{gap:10px}.nf-header-stats--compact .nf-header-stat{padding:14px 20px;min-width:80px}.nf-header-stats--compact .nf-header-stat__value{font-size:24px}.nf-tabs{display:inline-flex;gap:4px;margin-top:24px;padding:5px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-xl);box-shadow:var(--nf-shadow-sm)}.nf-tab{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:var(--nf-r-md);color:var(--nf-text-2);font-size:13px;font-weight:600;text-decoration:none;transition:all var(--nf-dur-md) var(--nf-ease);border:1px solid transparent;position:relative}.nf-tab .dashicons{font-size:16px;width:16px;height:16px;transition:transform var(--nf-dur-md) var(--nf-ease)}.nf-tab:hover{background:var(--nf-surface-3);color:var(--nf-text)}.nf-tab:hover .dashicons{transform:scale(1.1)}.nf-tab--active{background:var(--nf-brand-1);color:var(--nf-text-inv);box-shadow:0 4px 12px rgba(99,102,241,.3),0 1px 3px rgba(99,102,241,.2)}.nf-tab--active:hover{background:var(--nf-brand-1);color:var(--nf-text-inv);box-shadow:0 6px 16px rgba(99,102,241,.35)}.nf-tab:focus-visible{outline:2px solid var(--nf-brand-1);outline-offset:2px}.nf-onboarding{margin-top:28px;padding:32px 36px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-xl);box-shadow:var(--nf-shadow-sm);position:relative;overflow:hidden}.nf-onboarding::after{content:'';position:absolute;top:0;right:0;width:200px;height:100%;background:var(--nf-grad-subtle);pointer-events:none}.nf-onboarding__title{display:flex;align-items:center;gap:12px;margin:0 0 24px;font-size:18px;font-weight:800;color:var(--nf-text);letter-spacing:-.3px}.nf-onboarding__title .dashicons{color:var(--nf-brand-1);font-size:22px;width:22px;height:22px}.nf-onboarding__steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;position:relative;z-index:1}@media (max-width:768px){.nf-onboarding__steps{grid-template-columns:1fr}}.nf-onboard-step{position:relative;padding:24px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);transition:all var(--nf-dur-md) var(--nf-ease);overflow:hidden}.nf-onboard-step::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--nf-grad);opacity:0;transition:opacity var(--nf-dur-md) var(--nf-ease)}.nf-onboard-step:hover{border-color:var(--nf-border-3);box-shadow:var(--nf-shadow-card-hover);transform:translateY(-3px)}.nf-onboard-step:hover::before{opacity:1}.nf-onboard-step__num{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--nf-grad);border-radius:var(--nf-r-sm);color:var(--nf-text-inv);font-size:15px;font-weight:800;margin-bottom:14px;box-shadow:0 4px 8px rgba(99,102,241,.2)}.nf-onboard-step h3{margin:0 0 8px;font-size:15px;font-weight:700;color:var(--nf-text);letter-spacing:-.2px}.nf-onboard-step p{margin:0;font-size:13px;color:var(--nf-text-2);line-height:1.6}.nf-category-section{margin-bottom:32px}.nf-category-section:last-child{margin-bottom:0}.nf-category-section__title{display:flex;align-items:center;gap:10px;margin:0 0 18px;font-size:17px;font-weight:800;color:var(--nf-text);letter-spacing:-.3px}.nf-category-section__title .dashicons{color:var(--nf-brand-1);font-size:18px;width:18px;height:18px}.nf-category-section__count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 8px;background:var(--nf-grad-subtle);border:1px solid var(--nf-border-3);border-radius:var(--nf-r-full);font-size:11px;font-weight:800;color:var(--nf-brand-1)}.nf-widget-showcase{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px}.nf-showcase-card{background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);padding:22px;transition:all var(--nf-dur-md) var(--nf-ease);position:relative;overflow:hidden}.nf-showcase-card::after{content:'';position:absolute;inset:0;border-radius:inherit;background:var(--nf-grad-subtle);opacity:0;transition:opacity var(--nf-dur-md) var(--nf-ease);pointer-events:none}.nf-showcase-card:hover{border-color:var(--nf-border-3);box-shadow:var(--nf-shadow-card-hover);transform:translateY(-3px)}.nf-showcase-card:hover::after{opacity:1}.nf-showcase-card--inactive{opacity:.45}.nf-showcase-card--inactive:hover{opacity:.6}.nf-showcase-card__header{display:flex;align-items:center;gap:10px;margin-bottom:14px;position:relative;z-index:1}.nf-showcase-card__icon{width:44px;height:44px;background:var(--nf-badge-color,var(--nf-brand-1));border-radius:var(--nf-r-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 3px 8px rgba(0,0,0,.1);transition:transform var(--nf-dur-md) var(--nf-ease-spring)}.nf-showcase-card:hover .nf-showcase-card__icon{transform:scale(1.08) rotate(-2deg)}.nf-showcase-card__icon span{font-size:18px;color:var(--nf-text-inv)}.nf-status-dot{width:9px;height:9px;border-radius:50%;margin-left:auto;flex-shrink:0}.nf-status-dot--active{background:var(--nf-success);box-shadow:0 0 0 3px rgba(16,185,129,.15),0 0 8px rgba(16,185,129,.3);animation:nf-pulse 2.5s ease-in-out infinite}@keyframes nf-pulse{0%,100%{box-shadow:0 0 0 3px rgba(16,185,129,.15),0 0 8px rgba(16,185,129,.3)}50%{box-shadow:0 0 0 5px rgba(16,185,129,.1),0 0 12px rgba(16,185,129,.2)}}.nf-showcase-card__title{margin:0 0 6px;font-size:15px;font-weight:700;color:var(--nf-text);display:flex;align-items:center;gap:6px;flex-wrap:wrap;position:relative;z-index:1;letter-spacing:-.2px}.nf-showcase-card__desc{margin:0;font-size:13px;color:var(--nf-text-2);line-height:1.55;position:relative;z-index:1}.nf-card{background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-xl);padding:28px;margin-bottom:18px;box-shadow:var(--nf-shadow-sm);transition:box-shadow var(--nf-dur-md) var(--nf-ease)}.nf-card:last-child{margin-bottom:0}.nf-card:hover{box-shadow:var(--nf-shadow-md)}.nf-card__title{display:flex;align-items:center;gap:10px;margin:0 0 20px;font-size:16px;font-weight:800;color:var(--nf-text);letter-spacing:-.2px}.nf-card__title .dashicons{color:var(--nf-brand-1);font-size:20px;width:20px;height:20px}.nf-card--status{border-left:3px solid transparent;border-image:var(--nf-grad) 1;border-image-slice:1;border-top-left-radius:0;border-bottom-left-radius:0}.nf-status-list{margin:0;padding:0;list-style:none}.nf-status-list li{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--nf-border);font-size:13px;transition:background var(--nf-dur) var(--nf-ease)}.nf-status-list li:last-child{border-bottom:none;padding-bottom:0}.nf-status-list__icon{flex-shrink:0}.nf-status-list__icon .dashicons{font-size:18px;width:18px;height:18px}.nf-status-list__icon--ok .dashicons{color:var(--nf-success)}.nf-status-list__icon--error .dashicons{color:var(--nf-error)}.nf-status-list__text{flex:1;font-weight:600;color:var(--nf-text)}.nf-status-list__value{font-size:12px;font-weight:700;color:var(--nf-text-2);background:var(--nf-surface-3);padding:3px 12px;border-radius:var(--nf-r-full);border:1px solid var(--nf-border)}.nf-card--tip{background:linear-gradient(135deg,#fef9ee 0%,#fffdf7 50%,#fef3c7 100%);border-color:#fde68a;text-align:center;position:relative;overflow:hidden}.nf-card--tip::before{content:'';position:absolute;top:-40px;right:-40px;width:120px;height:120px;background:radial-gradient(circle,rgba(245,158,11,.15) 0%,transparent 60%);border-radius:50%;pointer-events:none}.nf-card--tip .nf-card__title{justify-content:center}.nf-card__tip-icon{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;background:linear-gradient(135deg,#f59e0b,#d97706);border-radius:var(--nf-r-lg);margin:0 auto 14px;box-shadow:0 4px 12px rgba(245,158,11,.25)}.nf-card__tip-icon .dashicons{font-size:24px;width:24px;height:24px;color:var(--nf-text-inv)}.nf-card--tip p{font-size:13.5px;color:#92400e;margin:0 0 18px;line-height:1.65}.nf-links-list{margin:0;padding:0;list-style:none}.nf-links-list li{margin-bottom:6px}.nf-links-list li:last-child{margin-bottom:0}.nf-links-list a{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--nf-surface-2);border:1px solid transparent;border-radius:var(--nf-r-md);color:var(--nf-text);text-decoration:none;font-size:13px;font-weight:600;transition:all var(--nf-dur-md) var(--nf-ease)}.nf-links-list a:hover{background:var(--nf-brand-1);color:var(--nf-text-inv);box-shadow:0 4px 12px rgba(99,102,241,.2);transform:translateX(3px)}.nf-links-list a .dashicons{font-size:16px;width:16px;height:16px;transition:transform var(--nf-dur-md) var(--nf-ease)}.nf-links-list a:hover .dashicons{transform:scale(1.1)}.nf-links-list__arrow{margin-left:auto;font-size:14px !important;width:14px !important;height:14px !important;opacity:.4;transition:all var(--nf-dur-md) var(--nf-ease) !important}.nf-links-list a:hover .nf-links-list__arrow{opacity:1;transform:translateX(2px) !important}.nf-badge-chip{display:inline-flex;align-items:center;justify-content:center;padding:2px 9px;border-radius:var(--nf-r-full);background:var(--nf-badge-color,var(--nf-brand-1));color:var(--nf-text-inv);font-size:9px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;line-height:1.5;box-shadow:0 1px 3px rgba(0,0,0,.1)}.nf-tooltip{position:relative;display:inline-flex;align-items:center;margin-left:4px;color:var(--nf-text-3);cursor:help}.nf-tooltip .dashicons{font-size:15px;width:15px;height:15px;transition:color var(--nf-dur) var(--nf-ease)}.nf-tooltip:hover .dashicons{color:var(--nf-brand-1)}.nf-tooltip:focus{outline:none;box-shadow:0 0 0 2px rgba(99,102,241,.3);border-radius:var(--nf-r-full)}.nf-tooltip::after{content:attr(data-tooltip);position:absolute;bottom:130%;left:50%;transform:translateX(-50%) translateY(6px);background:var(--nf-dark);color:var(--nf-text-inv);padding:10px 14px;border-radius:var(--nf-r-sm);font-size:12px;line-height:1.5;width:230px;opacity:0;pointer-events:none;transition:opacity var(--nf-dur-md) var(--nf-ease),transform var(--nf-dur-md) var(--nf-ease);box-shadow:var(--nf-shadow-2xl);z-index:10;font-weight:400}.nf-tooltip::before{content:'';position:absolute;bottom:115%;left:50%;transform:translateX(-50%);border-width:6px;border-style:solid;border-color:var(--nf-dark) transparent transparent transparent;opacity:0;transition:opacity var(--nf-dur-md) var(--nf-ease);z-index:10}.nf-tooltip:hover::after,.nf-tooltip:hover::before,.nf-tooltip:focus::after,.nf-tooltip:focus::before{opacity:1}.nf-tooltip:hover::after,.nf-tooltip:focus::after{transform:translateX(-50%) translateY(-4px)}.nf-button{display:inline-flex;align-items:center;gap:7px;padding:11px 22px;border:none;border-radius:var(--nf-r-sm);font-size:13px;font-weight:700;cursor:pointer;transition:all var(--nf-dur-md) var(--nf-ease);text-decoration:none;line-height:1.4;letter-spacing:-.1px;font-family:inherit}.nf-button .dashicons{font-size:16px;width:16px;height:16px}.nf-button--primary{background:var(--nf-grad);color:var(--nf-text-inv);border:none;box-shadow:0 4px 14px rgba(99,102,241,.25);position:relative;overflow:hidden}.nf-button--primary::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.15) 0%,transparent 50%);opacity:0;transition:opacity var(--nf-dur-md) var(--nf-ease)}.nf-button--primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(99,102,241,.35);color:var(--nf-text-inv)}.nf-button--primary:hover::before{opacity:1}.nf-button--primary:active{transform:translateY(0);box-shadow:0 2px 8px rgba(99,102,241,.2)}.nf-button--outline{background:var(--nf-surface);color:var(--nf-text);border:1px solid var(--nf-border-2)}.nf-button--outline:hover{border-color:var(--nf-brand-1);color:var(--nf-brand-1);background:rgba(99,102,241,.04);box-shadow:0 2px 8px rgba(99,102,241,.08)}.nf-button--sm{padding:8px 16px;font-size:12px}.nf-button--sm .dashicons{font-size:14px;width:14px;height:14px}.nf-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 22px;margin-bottom:22px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);box-shadow:var(--nf-shadow-sm);flex-wrap:wrap}.nf-toolbar__left{display:flex;gap:8px}.nf-toolbar__counter{font-size:13px;font-weight:700;color:var(--nf-text-2);display:flex;align-items:center;gap:4px}.nf-toolbar__counter span{color:var(--nf-brand-1);font-size:17px;font-weight:800}.nf-widget-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:18px}@media (max-width:768px){.nf-widget-grid{grid-template-columns:1fr}}.nf-widget-card{background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);padding:0;display:flex;flex-direction:column;transition:all var(--nf-dur-md) var(--nf-ease);overflow:hidden;position:relative}.nf-widget-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--nf-grad);opacity:0;transition:opacity var(--nf-dur-md) var(--nf-ease);z-index:1}.nf-widget-card:hover{border-color:var(--nf-border-3);box-shadow:var(--nf-shadow-card-hover);transform:translateY(-3px)}.nf-widget-card:hover::before{opacity:1}.nf-widget-card--disabled{opacity:.4}.nf-widget-card--disabled:hover{opacity:.55}.nf-widget-card--disabled::before{background:var(--nf-border-2)}.nf-widget-card__header{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--nf-border);background:var(--nf-surface-2)}.nf-widget-card__icon{width:42px;height:42px;background:var(--nf-badge-color,var(--nf-brand-1));border-radius:var(--nf-r-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 2px 6px rgba(0,0,0,.1);transition:transform var(--nf-dur-md) var(--nf-ease-spring)}.nf-widget-card:hover .nf-widget-card__icon{transform:scale(1.08) rotate(-2deg)}.nf-widget-card__icon span{font-size:18px;color:var(--nf-text-inv)}.nf-widget-card__content{padding:18px 22px;flex:1}.nf-widget-card__content h3{margin:0 0 8px;font-size:15px;font-weight:700;color:var(--nf-text);display:flex;align-items:center;gap:8px;flex-wrap:wrap;letter-spacing:-.2px}.nf-widget-card__content p{margin:0;font-size:13px;color:var(--nf-text-2);line-height:1.55}.nf-widget-card__footer{display:flex;align-items:flex-start;gap:8px;padding:14px 22px;background:var(--nf-surface-2);border-top:1px solid var(--nf-border);font-size:12px;color:var(--nf-text-3)}.nf-widget-card__footer .dashicons{font-size:14px;width:14px;height:14px;margin-top:1px;flex-shrink:0;color:var(--nf-brand-3)}.nf-widget-card__tip{line-height:1.5}.nf-toggle{position:relative;display:inline-flex;align-items:center;cursor:pointer}.nf-toggle input{position:absolute;opacity:0;width:0;height:0}.nf-toggle__slider{position:relative;width:48px;height:26px;background:#d1d5db;border-radius:26px;transition:all var(--nf-dur-md) var(--nf-ease);box-shadow:var(--nf-shadow-inner)}.nf-toggle__slider::before{content:'';position:absolute;height:20px;width:20px;left:3px;bottom:3px;background:var(--nf-surface);border-radius:50%;transition:all var(--nf-dur-md) var(--nf-ease-spring);box-shadow:0 1px 4px rgba(0,0,0,.15)}.nf-toggle input:checked + .nf-toggle__slider{background:var(--nf-brand-1);box-shadow:var(--nf-shadow-inner),0 0 12px rgba(99,102,241,.2)}.nf-toggle input:checked + .nf-toggle__slider::before{transform:translateX(22px);box-shadow:0 2px 6px rgba(99,102,241,.3)}.nf-toggle input:focus-visible + .nf-toggle__slider{box-shadow:0 0 0 3px rgba(99,102,241,.25)}.nf-settings-footer{margin-top:30px;padding:22px 28px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);display:flex;align-items:center;gap:18px;flex-wrap:wrap;box-shadow:var(--nf-shadow-sm)}.nf-settings-footer__note{margin:0;font-size:13px;color:var(--nf-text-3)}.nf-notice{display:flex;align-items:center;gap:12px;padding:16px 20px;border-radius:var(--nf-r-md);margin-bottom:22px;font-size:14px;font-weight:600}.nf-notice--success{background:linear-gradient(135deg,#ecfdf5 0%,#f0fdf4 100%);color:#065f46;border:1px solid #a7f3d0;box-shadow:0 2px 8px rgba(16,185,129,.08)}.nf-notice--success .dashicons{font-size:20px;width:20px;height:20px;color:var(--nf-success)}.nf-changelog-timeline{max-width:820px;position:relative;padding-left:40px}.nf-changelog-timeline::before{content:'';position:absolute;left:12px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--nf-brand-1) 0%,var(--nf-border) 30%);border-radius:2px}.nf-timeline-entry{position:relative;margin-bottom:28px}.nf-timeline-entry:last-child{margin-bottom:0}.nf-timeline-entry__marker{position:absolute;left:-40px;top:24px}.nf-timeline-entry__dot{display:block;width:14px;height:14px;background:var(--nf-surface);border:3px solid var(--nf-border-2);border-radius:50%;position:relative;left:6px;transition:all var(--nf-dur-md) var(--nf-ease)}.nf-timeline-entry--latest .nf-timeline-entry__dot{background:var(--nf-brand-1);border-color:var(--nf-brand-1);box-shadow:0 0 0 5px rgba(99,102,241,.15),0 0 12px rgba(99,102,241,.2)}.nf-timeline-entry__card{background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);padding:24px 28px;box-shadow:var(--nf-shadow-sm);transition:all var(--nf-dur-md) var(--nf-ease)}.nf-timeline-entry:hover .nf-timeline-entry__card{box-shadow:var(--nf-shadow-card-hover);border-color:var(--nf-border-3);transform:translateX(4px)}.nf-timeline-entry:hover .nf-timeline-entry__dot{border-color:var(--nf-brand-3);background:var(--nf-brand-4)}.nf-timeline-entry--latest .nf-timeline-entry__card{border-left:3px solid var(--nf-brand-1)}.nf-timeline-entry__header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.nf-timeline-entry__version{font-size:20px;font-weight:800;color:var(--nf-text);letter-spacing:-.3px}.nf-badge{display:inline-flex;padding:3px 12px;border-radius:var(--nf-r-full);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.6px}.nf-badge--latest{background:var(--nf-grad);color:var(--nf-text-inv);box-shadow:0 2px 6px rgba(99,102,241,.2)}.nf-timeline-entry__changes{margin:0;padding:0;list-style:none}.nf-timeline-entry__changes li{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px solid var(--nf-border);font-size:13px;color:var(--nf-text-2);line-height:1.55;transition:all var(--nf-dur) var(--nf-ease)}.nf-timeline-entry__changes li:last-child{border-bottom:none;padding-bottom:0}.nf-timeline-entry__changes li:hover{background:var(--nf-surface-2);margin:0 -12px;padding-left:12px;padding-right:12px;border-radius:var(--nf-r-xs)}.nf-timeline-entry__changes li .dashicons{font-size:14px;width:14px;height:14px;margin-top:3px;flex-shrink:0}.nf-change--add .dashicons{color:var(--nf-success)}.nf-change--fix .dashicons{color:var(--nf-error)}.nf-change--improve .dashicons{color:var(--nf-brand-1)}.nf-change--default .dashicons{color:var(--nf-text-3)}.nf-font-form{display:flex;flex-direction:column;gap:22px}.nf-font-form__row{display:flex;align-items:center;gap:14px}.nf-font-form__row label{font-weight:700;font-size:13px;color:var(--nf-text);white-space:nowrap}.nf-font-form__row input[type="text"]{max-width:420px;width:100%;padding:10px 16px;border:1px solid var(--nf-border-2);border-radius:var(--nf-r-sm);font-size:14px;line-height:1.4;color:var(--nf-text);background:var(--nf-surface);transition:all var(--nf-dur-md) var(--nf-ease);font-family:inherit}.nf-font-form__row input[type="text"]:focus{border-color:var(--nf-brand-1);outline:none;box-shadow:0 0 0 3px rgba(99,102,241,.1)}.nf-font-variants h4{font-weight:700;font-size:13px;color:var(--nf-text);margin:0 0 12px}.nf-font-variant{background:var(--nf-surface-2);border:1px solid var(--nf-border);border-radius:var(--nf-r-md);padding:18px 20px;margin-bottom:12px;position:relative;transition:all var(--nf-dur-md) var(--nf-ease)}.nf-font-variant:hover{border-color:var(--nf-border-3);box-shadow:var(--nf-shadow-sm)}.nf-font-variant__row{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}.nf-font-variant__field{display:flex;flex-direction:column;gap:6px;min-width:130px}.nf-font-variant__field label{font-weight:600;font-size:11px;color:var(--nf-text-3);text-transform:uppercase;letter-spacing:.06em}.nf-font-variant__field select{padding:8px 12px;border:1px solid var(--nf-border-2);border-radius:var(--nf-r-xs);font-size:13px;background:var(--nf-surface);color:var(--nf-text);min-width:150px;cursor:pointer;transition:all var(--nf-dur-md) var(--nf-ease);font-family:inherit}.nf-font-variant__field select:focus{border-color:var(--nf-brand-1);outline:none;box-shadow:0 0 0 3px rgba(99,102,241,.1)}.nf-font-variant__field--file{flex:1;min-width:200px;flex-direction:row;align-items:center;gap:10px}.nf-font-variant__field--file label{white-space:nowrap}.nfa-upload-font-btn{white-space:nowrap;flex-shrink:0}.nfa-font-filename{font-size:12px;color:var(--nf-brand-1);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}.nfa-remove-variant{width:30px;height:30px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px;line-height:1;color:var(--nf-text-3);background:var(--nf-surface);border:1px solid var(--nf-border) !important;border-radius:var(--nf-r-xs);cursor:pointer;transition:all var(--nf-dur-md) var(--nf-ease);padding:0;align-self:flex-end;margin-bottom:2px}.nfa-remove-variant:hover{color:var(--nf-error);border-color:#fecaca !important;background:#fef2f2;transform:scale(1.05)}.nf-font-form__actions{display:flex;gap:12px;margin-top:6px;align-items:center}.nf-font-form__actions .button{display:inline-flex;align-items:center;gap:5px}.nf-font-form__actions .button .dashicons{font-size:16px;width:16px;height:16px;line-height:1}.nf-font-form__actions .button-primary{background:var(--nf-brand-1);border-color:var(--nf-brand-1);color:#fff;transition:all var(--nf-dur-md) var(--nf-ease)}.nf-font-form__actions .button-primary:hover{background:var(--nf-brand-2);border-color:var(--nf-brand-2);box-shadow:0 4px 12px rgba(99,102,241,.2);transform:translateY(-1px)}.nf-card--font-list{margin-top:28px}.nf-font-item{display:flex;align-items:center;gap:18px;padding:20px 22px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);margin-bottom:14px;transition:all var(--nf-dur-md) var(--nf-ease)}.nf-font-item:hover{border-color:var(--nf-border-3);box-shadow:var(--nf-shadow-card-hover);transform:translateY(-2px)}.nf-font-item__info{flex:0 0 auto;min-width:150px}.nf-font-item__name{font-size:16px;font-weight:800;color:var(--nf-text);margin:0 0 4px;display:block;letter-spacing:-.3px}.nf-font-item__variants{font-size:11px;color:var(--nf-text-3);display:block;font-weight:600}.nf-font-item__preview{flex:1;font-size:20px;color:var(--nf-text-2);line-height:1.4;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.nfa-delete-font{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;color:var(--nf-error) !important;border-color:#fecaca !important;transition:all var(--nf-dur-md) var(--nf-ease)}.nfa-delete-font:hover{background:#fef2f2 !important;border-color:var(--nf-error) !important;transform:scale(1.02)}.nfa-delete-font .dashicons{font-size:16px;width:16px;height:16px}.nf-empty-state{color:var(--nf-text-3);font-size:14px;padding:28px 0;text-align:center}@media (max-width:600px){.nf-font-variant__row{flex-direction:column;align-items:stretch}.nf-font-variant__field--file{flex-direction:column;align-items:flex-start}.nf-font-item{flex-direction:column;align-items:flex-start}}.nf-extensions-title{display:flex;align-items:center;gap:10px;margin:38px 0 8px;font-size:17px;font-weight:800;color:var(--nf-text);letter-spacing:-.3px}.nf-extensions-title .dashicons{color:var(--nf-brand-1);font-size:18px;width:18px;height:18px}.nf-extensions-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:18px}.nf-extension-card{display:flex;align-items:flex-start;gap:16px;padding:20px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);transition:all var(--nf-dur-md) var(--nf-ease);position:relative;overflow:hidden}.nf-extension-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--nf-grad);opacity:0;transition:opacity var(--nf-dur-md) var(--nf-ease)}.nf-extension-card:hover{border-color:var(--nf-border-3);box-shadow:var(--nf-shadow-card-hover);transform:translateY(-2px)}.nf-extension-card:hover::before{opacity:1}.nf-extension-card__icon{flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--nf-grad-subtle);border:1px solid var(--nf-border-3);border-radius:var(--nf-r-sm);color:var(--nf-brand-1);font-size:18px;transition:all var(--nf-dur-md) var(--nf-ease)}.nf-extension-card__icon .dashicons{font-size:18px;width:18px;height:18px}.nf-extension-card:hover .nf-extension-card__icon{background:var(--nf-brand-1);color:var(--nf-text-inv);border-color:var(--nf-brand-1);box-shadow:0 2px 8px rgba(99,102,241,.2)}.nf-extension-card__body{flex:1;min-width:0}.nf-extension-card__header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.nf-extension-card__label{font-weight:700;font-size:14px;color:var(--nf-text);letter-spacing:-.2px}.nf-extension-card__desc{font-size:12.5px;color:var(--nf-text-2);line-height:1.55;margin:0}.nf-filter-bar{display:flex;align-items:center;gap:12px;margin-bottom:22px;padding:14px 20px;background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-lg);box-shadow:var(--nf-shadow-sm);flex-wrap:wrap}.nf-filter-bar label{font-weight:700;font-size:13px;color:var(--nf-text)}.nf-filter-bar select{padding:8px 14px;border:1px solid var(--nf-border-2);border-radius:var(--nf-r-sm);font-size:13px;background:var(--nf-surface);color:var(--nf-text);font-family:inherit;cursor:pointer;transition:all var(--nf-dur-md) var(--nf-ease)}.nf-filter-bar select:focus{border-color:var(--nf-brand-1);outline:none;box-shadow:0 0 0 3px rgba(99,102,241,.1)}.nf-submissions-table{width:100%;border-collapse:collapse;border-radius:var(--nf-r-lg) !important;overflow:hidden;border:1px solid var(--nf-border);box-shadow:var(--nf-shadow-sm)}.nf-submissions-table thead th{background:var(--nf-surface-2);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--nf-text-2);padding:14px 16px;border-bottom:1px solid var(--nf-border);text-align:left}.nf-submissions-table tbody td{padding:14px 16px;font-size:13px;border-bottom:1px solid var(--nf-border);transition:background var(--nf-dur) var(--nf-ease)}.nf-submissions-table tbody tr:hover td{background:var(--nf-surface-2)}.nf-submissions-table tbody tr:last-child td{border-bottom:none}.nfa-sub-row--unread td{background:rgba(99,102,241,.03) !important;font-weight:500}.nf-submissions-table .row-actions{visibility:hidden;opacity:0;transition:opacity var(--nf-dur) var(--nf-ease);font-size:12px}.nf-submissions-table tbody tr:hover .row-actions{visibility:visible;opacity:1}.nf-submissions-table .row-actions a{color:var(--nf-brand-1);text-decoration:none;font-weight:600;transition:color var(--nf-dur) var(--nf-ease)}.nf-submissions-table .row-actions a:hover{color:var(--nf-brand-2)}.nf-submissions-table .row-actions .delete a{color:var(--nf-error)}.nf-submissions-table .row-actions .delete a:hover{color:#dc2626}.nfa-badge{display:inline-block;padding:3px 12px;border-radius:var(--nf-r-full);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.nfa-badge--blue{background:rgba(99,102,241,.08);color:var(--nf-brand-1);border:1px solid rgba(99,102,241,.15)}.nfa-badge--gray{background:var(--nf-surface-3);color:var(--nf-text-2);border:1px solid var(--nf-border)}.nf-pagination{display:flex;align-items:center;justify-content:flex-end;gap:6px;margin-top:16px;font-size:13px}.nf-pagination a,.nf-pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 10px;border-radius:var(--nf-r-sm);font-weight:600;text-decoration:none;transition:all var(--nf-dur-md) var(--nf-ease)}.nf-pagination a{background:var(--nf-surface);border:1px solid var(--nf-border);color:var(--nf-text-2)}.nf-pagination a:hover{border-color:var(--nf-brand-1);color:var(--nf-brand-1);background:rgba(99,102,241,.04)}.nf-pagination .current{background:var(--nf-brand-1);color:var(--nf-text-inv);border:1px solid var(--nf-brand-1);box-shadow:0 2px 8px rgba(99,102,241,.2)}.nf-submission-detail{background:var(--nf-surface);border:1px solid var(--nf-border);border-radius:var(--nf-r-xl);padding:32px;box-shadow:var(--nf-shadow-sm)}.nf-submission-detail__header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid var(--nf-border);flex-wrap:wrap}.nf-submission-detail__title{font-size:20px;font-weight:800;color:var(--nf-text);margin:0;display:flex;align-items:center;gap:10px;letter-spacing:-.3px}.nf-submission-detail__meta{display:flex;gap:16px;font-size:13px;color:var(--nf-text-3);font-weight:600}.nf-submission-detail table{width:100%;border-collapse:collapse;margin-top:4px}.nf-submission-detail table th{text-align:left;font-weight:700;font-size:13px;color:var(--nf-text);padding:12px 16px;background:var(--nf-surface-2);border-bottom:1px solid var(--nf-border);width:200px}.nf-submission-detail table td{font-size:14px;color:var(--nf-text-2);padding:12px 16px;border-bottom:1px solid var(--nf-border)}.nf-submission-detail table tr:last-child th,.nf-submission-detail table tr:last-child td{border-bottom:none}@media (max-width:600px){.nf-admin-wrap{margin:10px 10px 30px 0}.nf-admin-header{padding:32px 24px}.nf-admin-header h1{font-size:26px}.nf-header-stats{flex-wrap:wrap}.nf-onboarding{padding:22px}.nf-card{padding:20px}.nf-changelog-timeline{padding-left:32px}.nf-changelog-timeline::before{left:8px}.nf-timeline-entry__marker{left:-32px}.nf-timeline-entry__dot{left:2px}.nf-tabs{flex-wrap:wrap}.nf-widget-grid{grid-template-columns:1fr}.nf-submission-detail{padding:20px}}
  • nebula-forge-addons-for-elementor/trunk/assets/css/frontend.css

    r3462588 r3463192  
    23332333    font-weight: 500;
    23342334}
     2335
     2336/* ==========================================================================
     2337   Numbered Cards
     2338   ========================================================================== */
     2339
     2340.nfa-ncards {
     2341    position: relative;
     2342}
     2343
     2344/* ── Grid Layout ─────────────────────────────────────────────────────── */
     2345
     2346.nfa-ncards__grid {
     2347    display: grid;
     2348    grid-template-columns: repeat(3, minmax(0, 1fr));
     2349    gap: 20px;
     2350}
     2351
     2352.nfa-ncards__card {
     2353    background: #e8e4de;
     2354    border-radius: 16px;
     2355    padding: 28px;
     2356    display: flex;
     2357    flex-direction: column;
     2358    transition: box-shadow 0.3s ease, transform 0.25s ease;
     2359}
     2360
     2361.nfa-ncards--grid .nfa-ncards__card:hover {
     2362    transform: translateY(-4px);
     2363}
     2364
     2365.nfa-ncards__header {
     2366    display: flex;
     2367    align-items: flex-start;
     2368    justify-content: space-between;
     2369    margin-bottom: 16px;
     2370}
     2371
     2372.nfa-ncards__number {
     2373    font-size: 2.5rem;
     2374    font-weight: 300;
     2375    line-height: 1;
     2376    color: #3b3a2f;
     2377    font-style: italic;
     2378}
     2379
     2380.nfa-ncards__icon {
     2381    display: inline-flex;
     2382    align-items: center;
     2383    justify-content: center;
     2384    font-size: 28px;
     2385    color: #3b3a2f;
     2386    line-height: 1;
     2387}
     2388
     2389.nfa-ncards__icon svg {
     2390    width: 28px;
     2391    height: 28px;
     2392}
     2393
     2394.nfa-ncards__image {
     2395    display: inline-flex;
     2396    align-items: center;
     2397    justify-content: center;
     2398    width: 120px;
     2399    height: 120px;
     2400    flex-shrink: 0;
     2401}
     2402
     2403.nfa-ncards__image img {
     2404    width: 100%;
     2405    height: 100%;
     2406    object-fit: contain;
     2407}
     2408
     2409.nfa-ncards__body {
     2410    flex: 1;
     2411}
     2412
     2413.nfa-ncards__title {
     2414    font-size: 0.95rem;
     2415    font-weight: 700;
     2416    text-transform: uppercase;
     2417    letter-spacing: 0.06em;
     2418    color: #3b3a2f;
     2419    margin: 0 0 12px 0;
     2420    line-height: 1.3;
     2421}
     2422
     2423.nfa-ncards__desc {
     2424    font-size: 0.9rem;
     2425    color: #3b3a2f;
     2426    line-height: 1.6;
     2427    margin: 0;
     2428    opacity: 0.85;
     2429}
     2430
     2431/* ── Steps Layout ─────────────────────────────────────────────────────── */
     2432
     2433.nfa-ncards--steps .nfa-ncards__card--step {
     2434    background: #ffffff;
     2435    border: 1px solid #e8e4de;
     2436    border-radius: 16px;
     2437    padding: 32px 28px;
     2438    display: flex;
     2439    flex-direction: column;
     2440    align-items: flex-start;
     2441    position: relative;
     2442    overflow: hidden;
     2443    transition: box-shadow 0.3s ease, transform 0.25s ease;
     2444}
     2445
     2446.nfa-ncards--steps .nfa-ncards__card--step:hover {
     2447    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
     2448    transform: translateY(-3px);
     2449}
     2450
     2451/* Accent border pseudo-element */
     2452.nfa-ncards--steps .nfa-ncards__card--step::before {
     2453    content: '';
     2454    position: absolute;
     2455    background-color: #b8976a;
     2456    transition: opacity 0.3s ease;
     2457    opacity: 0;
     2458}
     2459
     2460.nfa-ncards--steps .nfa-ncards__card--step:hover::before {
     2461    opacity: 1;
     2462}
     2463
     2464/* Accent positions */
     2465.nfa-ncards-accent--left .nfa-ncards__card--step::before {
     2466    top: 0;
     2467    left: 0;
     2468    width: 4px;
     2469    height: 100%;
     2470}
     2471
     2472.nfa-ncards-accent--right .nfa-ncards__card--step::before {
     2473    top: 0;
     2474    right: 0;
     2475    width: 4px;
     2476    height: 100%;
     2477}
     2478
     2479.nfa-ncards-accent--top .nfa-ncards__card--step::before {
     2480    top: 0;
     2481    left: 0;
     2482    width: 100%;
     2483    height: 4px;
     2484}
     2485
     2486.nfa-ncards-accent--bottom .nfa-ncards__card--step::before {
     2487    bottom: 0;
     2488    left: 0;
     2489    width: 100%;
     2490    height: 4px;
     2491}
     2492
     2493.nfa-ncards-accent--none .nfa-ncards__card--step::before {
     2494    display: none;
     2495}
     2496
     2497/* Badge (icon circle) */
     2498.nfa-ncards__badge {
     2499    display: inline-flex;
     2500    align-items: center;
     2501    justify-content: center;
     2502    width: 56px;
     2503    height: 56px;
     2504    border-radius: 50%;
     2505    background-color: #1e3a5f;
     2506    color: #ffffff;
     2507    font-size: 22px;
     2508    flex-shrink: 0;
     2509    margin-bottom: 14px;
     2510    line-height: 1;
     2511}
     2512
     2513.nfa-ncards__badge svg {
     2514    width: 22px;
     2515    height: 22px;
     2516    fill: currentColor;
     2517}
     2518
     2519.nfa-ncards__badge--img {
     2520    background: transparent;
     2521    overflow: hidden;
     2522}
     2523
     2524.nfa-ncards__badge--img img {
     2525    width: 100%;
     2526    height: 100%;
     2527    object-fit: cover;
     2528    border-radius: 50%;
     2529}
     2530
     2531/* Step label */
     2532.nfa-ncards__step-label {
     2533    font-size: 0.75rem;
     2534    font-weight: 600;
     2535    text-transform: uppercase;
     2536    letter-spacing: 0.12em;
     2537    color: #b8976a;
     2538    margin-bottom: 8px;
     2539    display: block;
     2540}
     2541
     2542/* Step title */
     2543.nfa-ncards__step-title {
     2544    font-size: 1.2rem;
     2545    font-weight: 700;
     2546    font-style: italic;
     2547    color: #1e3a5f;
     2548    margin: 0 0 14px 0;
     2549    line-height: 1.3;
     2550}
     2551
     2552/* Divider */
     2553.nfa-ncards__divider {
     2554    display: block;
     2555    width: 50px;
     2556    height: 3px;
     2557    border-radius: 2px;
     2558    background-color: #1e3a5f;
     2559    margin-bottom: 16px;
     2560}
     2561
     2562/* Step description */
     2563.nfa-ncards__step-desc {
     2564    font-size: 0.92rem;
     2565    line-height: 1.65;
     2566    color: #666666;
     2567    margin: 0;
     2568}
     2569
     2570/* ── Carousel Layout ─────────────────────────────────────────────────── */
     2571
     2572.nfa-ncards--carousel {
     2573    overflow: hidden;
     2574    position: relative;
     2575}
     2576
     2577.nfa-ncards__viewport {
     2578    overflow: hidden;
     2579}
     2580
     2581.nfa-ncards__track {
     2582    display: flex;
     2583    transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
     2584    will-change: transform;
     2585    cursor: grab;
     2586    user-select: none;
     2587    -webkit-user-select: none;
     2588}
     2589
     2590.nfa-ncards--carousel.is-dragging .nfa-ncards__track {
     2591    cursor: grabbing;
     2592}
     2593
     2594.nfa-ncards--carousel .nfa-ncards__card {
     2595    flex: 0 0 calc((100% - 40px) / 3);
     2596    display: flex;
     2597    flex-direction: column;
     2598    min-height: 280px;
     2599}
     2600
     2601.nfa-ncards--carousel .nfa-ncards__header {
     2602    margin-bottom: 20px;
     2603    min-height: 90px;
     2604}
     2605
     2606.nfa-ncards--carousel .nfa-ncards__number {
     2607    font-size: 3rem;
     2608}
     2609
     2610/* ── Nav Container (bottom positions) ────────────────────────────────── */
     2611
     2612.nfa-ncards__nav {
     2613    display: flex;
     2614    gap: 8px;
     2615    margin-top: 20px;
     2616}
     2617
     2618.nfa-ncards--nav-bottom-right .nfa-ncards__nav {
     2619    justify-content: flex-end;
     2620}
     2621
     2622.nfa-ncards--nav-bottom-left .nfa-ncards__nav {
     2623    justify-content: flex-start;
     2624}
     2625
     2626.nfa-ncards--nav-bottom-center .nfa-ncards__nav {
     2627    justify-content: center;
     2628}
     2629
     2630.nfa-ncards--nav-top-right .nfa-ncards__nav,
     2631.nfa-ncards--nav-top-left .nfa-ncards__nav,
     2632.nfa-ncards--nav-top-center .nfa-ncards__nav {
     2633    margin-top: 0;
     2634    margin-bottom: 20px;
     2635    order: -1;
     2636}
     2637
     2638.nfa-ncards--nav-top-right .nfa-ncards__nav {
     2639    justify-content: flex-end;
     2640}
     2641
     2642.nfa-ncards--nav-top-left .nfa-ncards__nav {
     2643    justify-content: flex-start;
     2644}
     2645
     2646.nfa-ncards--nav-top-center .nfa-ncards__nav {
     2647    justify-content: center;
     2648}
     2649
     2650/* Make sure top nav actually appears above viewport via flex order */
     2651.nfa-ncards--nav-top-right,
     2652.nfa-ncards--nav-top-left,
     2653.nfa-ncards--nav-top-center {
     2654    display: flex;
     2655    flex-direction: column;
     2656}
     2657
     2658/* ── Sides (overlay) Nav ─────────────────────────────────────────────── */
     2659
     2660.nfa-ncards--nav-sides {
     2661    position: relative;
     2662}
     2663
     2664.nfa-ncards__arrow--side {
     2665    position: absolute;
     2666    top: 50%;
     2667    transform: translateY(-50%);
     2668    z-index: 2;
     2669}
     2670
     2671.nfa-ncards__arrow--side.nfa-ncards__arrow--prev {
     2672    left: -48px;
     2673}
     2674
     2675.nfa-ncards__arrow--side.nfa-ncards__arrow--next {
     2676    right: -48px;
     2677}
     2678
     2679@media (max-width: 1200px) {
     2680    .nfa-ncards__arrow--side.nfa-ncards__arrow--prev {
     2681        left: 8px;
     2682    }
     2683    .nfa-ncards__arrow--side.nfa-ncards__arrow--next {
     2684        right: 8px;
     2685    }
     2686}
     2687
     2688/* ── Arrow Buttons ───────────────────────────────────────────────────── */
     2689
     2690.nfa-ncards__arrow {
     2691    display: inline-flex;
     2692    align-items: center;
     2693    justify-content: center;
     2694    width: 40px;
     2695    height: 40px;
     2696    border-radius: 50%;
     2697    border: 1.5px solid rgba(255, 255, 255, 0.5);
     2698    background: transparent;
     2699    color: #ffffff;
     2700    cursor: pointer;
     2701    transition: background-color 0.25s ease, border-color 0.25s ease, transform 0.2s ease;
     2702    padding: 0;
     2703}
     2704
     2705.nfa-ncards__arrow:hover {
     2706    background-color: rgba(255, 255, 255, 0.15);
     2707    border-color: rgba(255, 255, 255, 0.8);
     2708    transform: scale(1.08);
     2709}
     2710
     2711.nfa-ncards__arrow--side:hover {
     2712    transform: translateY(-50%) scale(1.08);
     2713}
     2714
     2715.nfa-ncards__arrow svg {
     2716    width: 16px;
     2717    height: 16px;
     2718}
     2719
     2720/* ── Dots ─────────────────────────────────────────────────────────────── */
     2721
     2722.nfa-ncards__dots {
     2723    display: flex;
     2724    gap: 8px;
     2725    justify-content: center;
     2726    margin-top: 20px;
     2727    padding: 4px 0;
     2728}
     2729
     2730.nfa-ncards__dot {
     2731    width: 10px;
     2732    height: 10px;
     2733    border-radius: 50%;
     2734    border: none;
     2735    background-color: rgba(255, 255, 255, 0.4);
     2736    cursor: pointer;
     2737    padding: 0;
     2738    transition: background-color 0.25s ease, transform 0.2s ease;
     2739}
     2740
     2741.nfa-ncards__dot:hover {
     2742    transform: scale(1.3);
     2743}
     2744
     2745.nfa-ncards__dot.is-active {
     2746    background-color: #ffffff;
     2747    transform: scale(1.2);
     2748}
     2749
     2750/* ── Responsive ──────────────────────────────────────────────────────── */
     2751
     2752@media (max-width: 1024px) {
     2753    .nfa-ncards__grid {
     2754        grid-template-columns: repeat(2, minmax(0, 1fr));
     2755    }
     2756}
     2757
     2758@media (max-width: 767px) {
     2759    .nfa-ncards__grid {
     2760        grid-template-columns: 1fr;
     2761    }
     2762
     2763    .nfa-ncards__number {
     2764        font-size: 2rem;
     2765    }
     2766
     2767    .nfa-ncards--carousel .nfa-ncards__number {
     2768        font-size: 2.2rem;
     2769    }
     2770}
  • nebula-forge-addons-for-elementor/trunk/assets/css/frontend.min.css

    r3462588 r3463192  
    1 .nfa-hero-cta{color:#131313;display:flex;flex-direction:column;gap:24px;text-decoration:none}.nfa-hero-cta__kicker{letter-spacing:.2em;text-transform:uppercase;font-size:.85rem;opacity:.7;margin:0;position:relative}.nfa-hero-cta__headline{font-size:clamp(2.5rem, 4vw, 3.5rem);line-height:1.1;margin:0;position:relative;letter-spacing:-.02em}.nfa-hero-cta__body{font-size:1.1rem;max-width:640px;margin:0;opacity:.85;line-height:1.7;position:relative}.nfa-hero-cta__button{align-self:flex-start;padding:14px 32px;border-radius:999px;font-weight:600;color:#0f172a;background:#ff6b35;text-decoration:none;transition:transform .3s ease,box-shadow .3s ease,background .3s ease;box-shadow:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);position:relative;display:inline-flex;align-items:center;gap:8px}.nfa-hero-cta__button:focus-visible,.nfa-hero-cta__button:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 30px rgba(255,107,53,.15);background:#ff7d4f}.nfa-hero-cta__button:active{transform:translateY(-1px) scale(.99)}.nfa-feature-list{display:flex;flex-direction:column;gap:24px}.nfa-feature-list__items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.nfa-feature-list__item{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:flex-start;padding:20px;border-radius:16px;background:#fff;border:1px solid rgba(19,19,19,.1);transition:background .2s ease,border-color .2s ease,transform .2s ease}.nfa-feature-list__item:hover{background:#f8f9fa;border-color:#0ea5e9;transform:translateY(-2px)}.nfa-feature-list__icon-wrap{display:inline-flex;justify-content:center;align-items:center;padding:10px;border-radius:12px;background:rgba(14,165,233,.08);transition:background .2s ease}.nfa-feature-list__item:hover .nfa-feature-list__icon-wrap{background:rgba(14,165,233,.08)}.nfa-feature-list__icon{color:#0ea5e9;font-size:24px;line-height:1}.nfa-feature-list__title{margin:0 0 4px 0;color:#131313;font-size:1.05rem;font-weight:600}.nfa-feature-list__text{margin:0;color:rgba(19,19,19,.55);font-size:.95rem;line-height:1.6}.nfa-spotlight-card{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:32px;align-items:center}.nfa-spotlight-card__content{display:flex;flex-direction:column;gap:14px}.nfa-spotlight-card__eyebrow{margin:0;letter-spacing:.15em;text-transform:uppercase;color:#0ea5e9;font-size:.78rem;font-weight:600}.nfa-spotlight-card__title{margin:0;color:#131313;font-size:clamp(1.9rem, 3vw, 2.4rem);letter-spacing:-.01em}.nfa-spotlight-card__description{margin:0;color:rgba(19,19,19,.55);font-size:1.02rem;line-height:1.7}.nfa-spotlight-card__meta{margin:0;color:rgba(19,19,19,.4);font-size:.95rem}.nfa-spotlight-card__button{align-self:flex-start;padding:14px 28px;border-radius:999px;font-weight:600;color:#0f172a;background:#ff6b35;text-decoration:none;transition:transform .3s ease,box-shadow .3s ease,background .3s ease;box-shadow:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);display:inline-flex;align-items:center;gap:8px}.nfa-spotlight-card__button:focus-visible,.nfa-spotlight-card__button:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 30px rgba(255,107,53,.15);background:#ff7d4f}.nfa-spotlight-card__media img{width:100%;height:auto;border-radius:20px;display:block;transition:transform .3s ease}.nfa-spotlight-card:hover .nfa-spotlight-card__media img{transform:scale(1.02)}.nfa-stats-grid{display:flex;flex-direction:column;gap:28px}.nfa-stats-grid__items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.nfa-stats-grid__item{padding:24px;border-radius:18px;background:#fff;border:1px solid rgba(19,19,19,.1);display:grid;row-gap:8px;transition:background .2s ease,border-color .2s ease,transform .2s ease}.nfa-stats-grid__item:hover{background:#f8f9fa;border-color:#0ea5e9;transform:translateY(-2px)}.nfa-stats-grid__value{color:#131313;font-weight:700;font-size:2rem;line-height:1.2;letter-spacing:-.02em}.nfa-stats-grid__label{color:rgba(19,19,19,.55);font-weight:600;font-size:1rem}.nfa-stats-grid__helper{color:rgba(19,19,19,.4);font-size:.9rem;line-height:1.5}.nfa-pricing-table{display:flex;flex-direction:column;gap:20px;color:#131313;position:relative;transition:transform .3s ease,box-shadow .3s ease}.nfa-pricing-table:hover{transform:translateY(-4px)}.nfa-pricing-table__badge{position:absolute;top:18px;right:18px;background:#ff6b35;color:#0f172a;padding:6px 14px;border-radius:999px;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 4px 12px rgba(255,107,53,.15)}.nfa-pricing-table__label{margin:0 0 6px 0;font-size:1.4rem}.nfa-pricing-table__description{margin:0;color:rgba(19,19,19,.55);line-height:1.6}.nfa-pricing-table__price{display:flex;align-items:baseline;gap:8px}.nfa-pricing-table__amount{font-size:2.6rem;font-weight:700;line-height:1;letter-spacing:-.02em}.nfa-pricing-table__suffix{font-size:1rem;color:rgba(19,19,19,.4)}.nfa-pricing-table__features{list-style:none;padding:0;margin:0;display:grid;gap:12px}.nfa-pricing-table__features li{display:flex;align-items:flex-start;gap:12px;color:rgba(19,19,19,.55);line-height:1.5}.nfa-pricing-table__features li::before{content:'\2713';color:#0ea5e9;font-weight:700;font-size:.9rem;margin-top:1px;flex-shrink:0}.nfa-pricing-table__button{align-self:flex-start;padding:14px 28px;border-radius:999px;font-weight:600;color:#0f172a;background:#ff6b35;text-decoration:none;transition:transform .3s ease,box-shadow .3s ease,background .3s ease;box-shadow:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);display:inline-flex;align-items:center;gap:8px}.nfa-pricing-table__button:focus-visible,.nfa-pricing-table__button:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 30px rgba(255,107,53,.15);background:#ff7d4f}.nfa-testimonials{display:flex;flex-direction:column;gap:24px}.nfa-testimonials__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.nfa-testimonials__card{background:#fff;border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:16px;border:1px solid rgba(19,19,19,.1);transition:background .2s ease,border-color .2s ease,transform .2s ease}.nfa-testimonials__card:hover{background:#f8f9fa;border-color:#0ea5e9;transform:translateY(-2px)}.nfa-testimonials__avatar img{width:48px;height:48px;border-radius:50%;object-fit:cover;display:block;border:2px solid rgba(19,19,19,.1)}.nfa-testimonials__quote{margin:0;color:rgba(19,19,19,.55);font-size:1rem;line-height:1.7;font-style:normal}blockquote.nfa-testimonials__quote{border:0;padding:0}.nfa-testimonials__footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto}.nfa-testimonials__name{font-weight:600;color:#131313}.nfa-testimonials__role{color:rgba(19,19,19,.4);font-size:.9rem}.nfa-testimonials__rating{font-size:.9rem;letter-spacing:1px;color:#fbbf24}.nfa-logo-grid{display:flex;flex-direction:column;gap:24px}.nfa-logo-grid__items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;align-items:center}.nfa-logo-grid__logo{display:flex;align-items:center;justify-content:center;padding:20px;border-radius:14px;background:#fff;border:1px solid rgba(19,19,19,.1);min-height:86px;transition:background .2s ease,border-color .2s ease,transform .2s ease}.nfa-logo-grid__logo:hover{background:#f8f9fa;border-color:#0ea5e9;transform:translateY(-3px)}.nfa-logo-grid__logo img{max-width:140px;width:100%;height:auto;opacity:.7;transition:opacity .2s ease,filter .2s ease;filter:grayscale(20%)}.nfa-logo-grid__logo:hover img{opacity:1;filter:grayscale(0%)}.nfa-logo-grid__text{color:#131313;font-weight:600}.nfa-faq{display:flex;flex-direction:column;gap:24px}.nfa-faq__items{display:grid;gap:12px}.nfa-faq__item{background:#fff;border-radius:16px;padding:20px 22px;border:1px solid rgba(19,19,19,.1);transition:background .2s ease,border-color .2s ease}.nfa-faq__item:hover{border-color:#0ea5e9}.nfa-faq__item[open]{background:#f8f9fa;border-color:#0ea5e9}.nfa-faq__question{cursor:pointer;font-weight:600;color:#131313;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;user-select:none}.nfa-faq__question::after{content:'+';font-size:1.2rem;color:#0ea5e9;transition:transform .2s ease;flex-shrink:0;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(14,165,233,.08)}.nfa-faq__item[open] .nfa-faq__question::after{content:'\2212';transform:rotate(180deg)}.nfa-faq__question::-webkit-details-marker{display:none}.nfa-faq__answer{margin-top:14px;color:rgba(19,19,19,.55);line-height:1.7}.nfa-steps{display:flex;flex-direction:column;gap:24px}.nfa-steps__list{display:grid;gap:20px}.nfa-steps--vertical .nfa-steps__list{grid-template-columns:1fr}.nfa-steps--horizontal .nfa-steps__list{grid-template-columns:repeat(3,minmax(0,1fr))}.nfa-steps__item{background:#fff;border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:10px;border:1px solid rgba(19,19,19,.1);transition:background .2s ease,border-color .2s ease,transform .2s ease;position:relative}.nfa-steps__item:hover{background:#f8f9fa;border-color:#0ea5e9;transform:translateY(-2px)}.nfa-steps__label{text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;color:#0ea5e9;font-weight:700}.nfa-steps__title{margin:0;font-size:1.1rem;color:#131313;font-weight:600}.nfa-steps__description{margin:0;color:rgba(19,19,19,.55);line-height:1.6;font-size:.95rem}.nfa-slider{position:relative}.nfa-slider__track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:6px;scrollbar-width:none;-ms-overflow-style:none}.nfa-slider__track::-webkit-scrollbar{display:none}.nfa-slider__item{flex:0 0 100%;scroll-snap-align:start}.nfa-slider__btn{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:999px;border:1px solid rgba(19,19,19,.1);background:#131313;color:#131313;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 20px rgb(15 23 42 / .3);transition:transform .2s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease;z-index:2}.nfa-slider__btn--prev{left:-16px}.nfa-slider__btn--next{right:-16px}.nfa-slider__btn:hover{transform:translateY(-50%) scale(1.08);background:rgba(255,255,255,.08);border-color:#0ea5e9}.nfa-slider__btn:focus-visible{outline:0;box-shadow:0 0 0 3px rgba(125,211,252,.3)}.nfa-showcase{position:relative}.nfa-showcase__nav{display:flex;gap:12px;margin-bottom:24px;justify-content:flex-end}.nfa-showcase__arrow{width:48px;height:48px;border-radius:50%;border:1.5px solid rgba(19,19,19,.15);background:0 0;color:#fff;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.nfa-showcase__arrow:hover{background:#131313;color:#f4f4f4;border-color:#131313}.nfa-showcase__viewport{overflow:hidden}.nfa-showcase__track{display:flex;transition:transform .5s cubic-bezier(.25, .46, .45, .94);will-change:transform}.nfa-showcase__card{flex-shrink:0;position:relative;height:420px;border-radius:20px;overflow:hidden;transition:transform .35s ease;text-decoration:none;display:block}.nfa-showcase__card:hover{transform:translateY(-4px)}.nfa-showcase__img{position:absolute;inset:0;z-index:0}.nfa-showcase__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.nfa-showcase__card:hover .nfa-showcase__img img{transform:scale(1.08)}.nfa-showcase__card--overlay-dark .nfa-showcase__img::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(19,19,19,.92) 0,rgba(19,19,19,.5) 50%,rgba(19,19,19,.15) 100%);z-index:1}.nfa-showcase__card--overlay-light .nfa-showcase__img::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(255,255,255,.92) 0,rgba(255,255,255,.4) 50%,transparent 100%);z-index:1}.nfa-showcase__badge{position:absolute;top:20px;left:20px;background:rgba(244,244,244,.15);backdrop-filter:blur(10px);color:#f4f4f4;padding:5px 16px;border-radius:50px;font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;z-index:2;border:1px solid rgba(244,244,244,.1)}.nfa-showcase__body{position:absolute;bottom:0;left:0;right:0;padding:32px 28px;z-index:2}.nfa-showcase__title{font-size:22px;font-weight:700;color:#f4f4f4;margin-bottom:12px}.nfa-showcase__desc{font-size:14px;color:rgba(244,244,244,.65);line-height:1.8;margin:0}.nfa-showcase__tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.nfa-showcase__tag{font-size:11px;padding:4px 12px;border-radius:50px;border:1px solid rgba(244,244,244,.12);color:rgba(244,244,244,.6);letter-spacing:.3px}.nfa-showcase__dots{display:flex;justify-content:center;gap:8px;margin-top:24px}.nfa-showcase__dot{width:10px;height:10px;border-radius:50%;background:rgba(19,19,19,.2);border:none;cursor:pointer;padding:0;transition:background .3s ease,transform .3s ease}.nfa-showcase__dot--active{background:#131313;transform:scale(1.2)}.nfa-showcase__dot:hover:not(.nfa-showcase__dot--active){background:rgba(19,19,19,.4)}.nfa-areas__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.nfa-areas__grid--featured .nfa-areas__card:first-child{grid-row:1/3}.nfa-areas__card{background:#fff;border-radius:18px;overflow:hidden;position:relative;transition:all .4s ease;display:block;text-decoration:none;color:inherit}a.nfa-areas__card:hover{text-decoration:none;color:inherit}.nfa-areas__card--shadow-sm{box-shadow:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04)}.nfa-areas__card--shadow-md{box-shadow:0 4px 12px rgba(0,0,0,.08)}.nfa-areas__card--shadow-lg{box-shadow:0 10px 30px rgba(0,0,0,.12)}.nfa-areas__card:hover{box-shadow:0 10px 30px rgba(0,0,0,.12)}.nfa-areas__img{height:200px;overflow:hidden;position:relative}.nfa-areas__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}.nfa-areas__badge{position:absolute;top:16px;left:16px;background:#131313;color:#f4f4f4;padding:5px 16px;border-radius:50px;font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;z-index:3}.nfa-areas__body{padding:24px}.nfa-areas__title{font-size:19px;font-weight:600;margin:0 0 8px;color:#131313}.nfa-areas__desc{font-size:14px;color:rgba(19,19,19,.55);line-height:1.7;margin:0}.nfa-areas__card--featured{position:relative}.nfa-areas__card--featured .nfa-areas__img{position:absolute;inset:0;height:100%;z-index:0}.nfa-areas__overlay{position:absolute;inset:0;z-index:1;pointer-events:none}.nfa-areas__card--featured .nfa-areas__body{position:absolute;bottom:0;left:0;right:0;z-index:2;padding:32px 28px}.nfa-areas__card--featured .nfa-areas__title{color:#f4f4f4;font-size:24px;margin-bottom:12px}.nfa-areas__card--featured .nfa-areas__desc{color:rgba(244,244,244,.65);font-size:14px;line-height:1.8}.nfa-areas__card--featured .nfa-areas__badge{background:rgba(244,244,244,.15);backdrop-filter:blur(10px);border:1px solid rgba(244,244,244,.1);z-index:2}.nfa-journey__steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;position:relative}.nfa-journey__steps--line::before{content:'';position:absolute;top:36px;left:48px;right:48px;height:2px;background:linear-gradient(90deg,#131313,rgba(19,19,19,.08));z-index:0}.nfa-journey__step{text-align:center;position:relative;z-index:1}.nfa-journey__number{width:72px;height:72px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:2px solid #131313;background:#fff;color:#131313;font-size:22px;font-weight:700;margin:0 auto 20px;transition:all .3s ease}.nfa-journey__step:hover .nfa-journey__number{background:#131313;color:#f4f4f4;box-shadow:0 8px 24px rgba(19,19,19,.2);transform:scale(1.05)}.nfa-journey__step-title{margin:0 0 10px;font-size:16px;font-weight:600;color:#131313}.nfa-journey__step-description{margin:0;font-size:13px;line-height:1.7;color:rgba(19,19,19,.45)}@media (max-width:900px){.nfa-feature-list__items,.nfa-logo-grid__items,.nfa-stats-grid__items,.nfa-steps--horizontal .nfa-steps__list,.nfa-testimonials__grid{grid-template-columns:1fr}.nfa-journey__steps{grid-template-columns:repeat(2,minmax(0,1fr))}.nfa-journey__steps--line::before{display:none}.nfa-areas__grid--featured .nfa-areas__card:first-child{grid-row:auto}.nfa-areas__card--featured .nfa-areas__img{position:relative;inset:auto;height:200px}.nfa-areas__card--featured .nfa-areas__overlay{display:none}.nfa-areas__card--featured .nfa-areas__body{position:relative;bottom:auto;left:auto;right:auto;padding:24px}.nfa-areas .nfa-areas__card--featured .nfa-areas__title{color:#131313!important;font-size:19px!important;margin-bottom:8px}.nfa-areas .nfa-areas__card--featured .nfa-areas__desc{color:rgba(19,19,19,.55)!important;font-size:14px;line-height:1.7}.nfa-areas .nfa-areas__card--featured .nfa-areas__badge{background:#131313!important;color:#f4f4f4!important;backdrop-filter:none;border:none!important}}@media (max-width:640px){.nfa-journey__steps{grid-template-columns:1fr}.nfa-slider__btn--prev{left:-8px}.nfa-slider__btn--next{right:-8px}}.nfa-team__grid{display:grid;gap:24px;grid-template-columns:repeat(var(--nfa-team-cols,3),1fr)}.nfa-team__card{background:#fff;border-radius:16px;overflow:hidden;text-align:center;transition:box-shadow .3s ease,transform .25s ease;box-shadow:0 1px 4px rgba(0,0,0,.06)}.nfa-team__card:hover{box-shadow:0 8px 24px rgba(0,0,0,.1);transform:translateY(-4px)}.nfa-team__card--layout-left{display:flex;text-align:left}.nfa-team__card--layout-left .nfa-team__photo{flex:0 0 140px;height:auto}.nfa-team__photo{width:100%;height:220px;object-fit:cover;display:block}.nfa-team__card--layout-circle .nfa-team__photo{width:120px;height:120px;border-radius:50%;margin:24px auto 0}.nfa-team__body{padding:20px}.nfa-team__name{margin:0 0 4px;font-size:1.15em;font-weight:600;color:#131313}.nfa-team__role{font-size:.875em;color:rgba(19,19,19,.55);margin-bottom:10px}.nfa-team__bio{font-size:.9em;color:rgba(19,19,19,.7);line-height:1.6;margin-bottom:14px}.nfa-team__social{display:flex;gap:10px;justify-content:center}.nfa-team__card--layout-left .nfa-team__social{justify-content:flex-start}.nfa-team__social a{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:rgba(19,19,19,.06);color:#131313;font-size:15px;transition:background .25s,color .25s;text-decoration:none}.nfa-team__social a:hover{background:#0ea5e9;color:#fff}@media (max-width:767px){.nfa-team__grid{grid-template-columns:1fr}.nfa-team__card--layout-left{flex-direction:column;text-align:center}.nfa-team__card--layout-left .nfa-team__photo{flex:none;width:100%;height:200px}.nfa-team__card--layout-left .nfa-team__social{justify-content:center}}.nfa-cta-banner{border-radius:16px;padding:48px 40px;text-align:center;position:relative;overflow:hidden}.nfa-cta-banner--left{text-align:left}.nfa-cta-banner--side{display:flex;align-items:center;justify-content:space-between;text-align:left;gap:32px}.nfa-cta-banner__icon{font-size:40px;margin-bottom:16px;display:inline-block}.nfa-cta-banner__kicker{display:inline-block;font-size:.8em;font-weight:600;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;opacity:.75}.nfa-cta-banner__title{margin:0 0 14px;font-size:1.75em;font-weight:700;line-height:1.25}.nfa-cta-banner__desc{font-size:1.05em;line-height:1.6;opacity:.85;max-width:640px;margin:0 auto 24px}.nfa-cta-banner--left .nfa-cta-banner__desc,.nfa-cta-banner--side .nfa-cta-banner__desc{margin-left:0}.nfa-cta-banner__actions{display:flex;gap:12px;flex-wrap:wrap}.nfa-cta-banner--center .nfa-cta-banner__actions{justify-content:center}.nfa-cta-banner__btn{display:inline-flex;align-items:center;padding:12px 28px;border-radius:8px;font-weight:600;font-size:.95em;text-decoration:none;transition:opacity .25s,transform .15s;border:none;cursor:pointer}.nfa-cta-banner__btn:hover{opacity:.88;transform:translateY(-1px)}@media (max-width:767px){.nfa-cta-banner{padding:32px 24px}.nfa-cta-banner--side{flex-direction:column;text-align:center}.nfa-cta-banner--side .nfa-cta-banner__actions{justify-content:center}}.nfa-tabs{display:flex;flex-direction:column;gap:0}.nfa-tabs--vertical{flex-direction:row;gap:24px}.nfa-tabs__nav{display:flex;gap:4px;border-bottom:2px solid rgba(19,19,19,.08);padding-bottom:0;overflow-x:auto;-webkit-overflow-scrolling:touch}.nfa-tabs--vertical .nfa-tabs__nav{flex-direction:column;border-bottom:none;border-right:2px solid rgba(19,19,19,.08);padding-right:0;padding-bottom:0;min-width:180px;overflow-x:visible}.nfa-tabs__btn{position:relative;display:inline-flex;align-items:center;gap:8px;padding:12px 24px;font-weight:500;font-size:.95em;background:0 0;border:none;color:rgba(19,19,19,.55);cursor:pointer;white-space:nowrap;transition:color .2s,background .2s;border-radius:8px 8px 0 0}.nfa-tabs--vertical .nfa-tabs__btn{border-radius:8px 0 0 8px;justify-content:flex-start;text-align:left;width:100%}.nfa-tabs__btn:hover{color:#131313;background:rgba(19,19,19,.03)}.nfa-tabs__btn--active{color:#0ea5e9;background:rgba(14,165,233,.08)}.nfa-tabs__btn--active::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:3px;background:#0ea5e9;border-radius:3px 3px 0 0}.nfa-tabs--vertical .nfa-tabs__btn--active::after{bottom:auto;top:0;left:auto;right:-2px;width:3px;height:100%;border-radius:0 3px 3px 0}.nfa-tabs__btn--icon-top{flex-direction:column}.nfa-tabs__btn-icon{font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center}.nfa-tabs__panels{flex:1}.nfa-tabs__panel{display:none;padding:24px;color:rgba(19,19,19,.7);line-height:1.7;border-radius:0 0 12px 12px}.nfa-tabs--vertical .nfa-tabs__panel{border-radius:0 12px 12px 0}.nfa-tabs__panel--active{display:block}@media (max-width:767px){.nfa-tabs--vertical{flex-direction:column}.nfa-tabs--vertical .nfa-tabs__nav{flex-direction:row;border-right:none;border-bottom:2px solid rgba(19,19,19,.08);min-width:0;overflow-x:auto}.nfa-tabs--vertical .nfa-tabs__btn{border-radius:8px 8px 0 0}.nfa-tabs--vertical .nfa-tabs__btn--active::after{bottom:-2px;top:auto;right:0;left:0;width:auto;height:3px;border-radius:3px 3px 0 0}.nfa-tabs--vertical .nfa-tabs__panel{border-radius:0 0 12px 12px}}.nfa-compare{position:relative;overflow:hidden;border-radius:12px;user-select:none;touch-action:none;cursor:col-resize;line-height:0}.nfa-compare--vertical{cursor:row-resize}.nfa-compare__after,.nfa-compare__before{position:relative;width:100%}.nfa-compare__before{position:absolute;top:0;left:0;z-index:2;height:100%;overflow:hidden}.nfa-compare__after img,.nfa-compare__before img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}.nfa-compare__label{position:absolute;bottom:16px;padding:4px 14px;font-size:.8em;font-weight:600;color:#fff;background:rgba(0,0,0,.55);border-radius:6px;z-index:5;pointer-events:none;transition:opacity .3s}.nfa-compare__label--before{left:16px}.nfa-compare__label--after{right:16px}.nfa-compare--vertical .nfa-compare__label--before{top:16px;bottom:auto;left:16px}.nfa-compare--vertical .nfa-compare__label--after{bottom:16px;right:auto;left:16px}.nfa-compare--hover-labels .nfa-compare__label{opacity:0}.nfa-compare--hover-labels:hover .nfa-compare__label{opacity:1}.nfa-compare__slider{position:absolute;top:0;bottom:0;z-index:10;display:flex;align-items:center;justify-content:center}.nfa-compare--horizontal .nfa-compare__slider{flex-direction:column;width:0}.nfa-compare--vertical .nfa-compare__slider{top:auto;left:0;right:0;flex-direction:row;height:0}.nfa-compare__line{position:absolute}.nfa-compare--horizontal .nfa-compare__line{width:3px;top:0;bottom:0;background:#fff}.nfa-compare--vertical .nfa-compare__line{height:3px;left:0;right:0;background:#fff}.nfa-compare__handle{position:relative;z-index:11;width:40px;height:40px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.25);color:#131313;cursor:inherit;flex-shrink:0}.nfa-compare__handle svg{width:14px;height:14px}.nfa-countdown{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px}.nfa-countdown__block{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;min-width:80px;border-radius:12px;background:rgba(19,19,19,.04);transition:transform .25s,box-shadow .25s;position:relative}.nfa-countdown__block:hover{transform:translateY(-3px);box-shadow:0 4px 16px rgba(0,0,0,.08)}.nfa-countdown__digit{font-size:2.5em;font-weight:700;line-height:1.1;color:#131313;font-variant-numeric:tabular-nums}.nfa-countdown__label{font-size:.8em;font-weight:500;color:rgba(19,19,19,.55);text-transform:uppercase;letter-spacing:.06em;margin-top:8px}.nfa-countdown__sep{font-size:2em;font-weight:700;color:rgba(19,19,19,.3);line-height:1;align-self:flex-start;padding-top:20px}.nfa-countdown--inline .nfa-countdown__block{background:0 0;padding:10px 6px;min-width:auto;border-radius:0}.nfa-countdown--inline .nfa-countdown__block:hover{transform:none;box-shadow:none}.nfa-countdown__block--circle{position:relative;background:0 0;padding:0;width:120px;height:120px;border-radius:50%}.nfa-countdown__block--circle:hover{transform:none;box-shadow:none}.nfa-countdown__ring{position:absolute;top:0;left:0;width:100%;height:100%}.nfa-countdown__progress{transition:stroke-dashoffset .6s ease}.nfa-countdown__block--circle .nfa-countdown__digit{font-size:1.6em}.nfa-countdown__block--circle .nfa-countdown__label{font-size:.65em;margin-top:2px}.nfa-countdown__expiry{width:100%;text-align:center;font-size:1.2em;font-weight:600;color:#131313;padding:24px}@media (max-width:480px){.nfa-countdown__digit{font-size:1.8em}.nfa-countdown__block{min-width:60px;padding:14px}.nfa-countdown__block--circle{width:80px;height:80px}.nfa-countdown__block--circle .nfa-countdown__digit{font-size:1.2em}}.nfa-tooltip{position:absolute;z-index:99999;max-width:260px;padding:8px 14px;border-radius:6px;background:#1e293b;color:#fff;font-size:13px;line-height:1.5;text-align:center;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease,transform .25s ease;white-space:normal;word-wrap:break-word;box-shadow:0 4px 12px rgba(0,0,0,.15)}.nfa-tooltip--visible{opacity:1;visibility:visible}.nfa-tooltip::after{content:'';position:absolute;width:0;height:0;border:6px solid transparent}.nfa-tooltip--no-arrow::after{display:none}.nfa-tooltip--top{transform:translateY(6px)}.nfa-tooltip--top.nfa-tooltip--visible{transform:translateY(0)}.nfa-tooltip--top::after{top:100%;left:50%;transform:translateX(-50%);border-top-color:inherit}.nfa-tooltip--bottom{transform:translateY(-6px)}.nfa-tooltip--bottom.nfa-tooltip--visible{transform:translateY(0)}.nfa-tooltip--bottom::after{bottom:100%;left:50%;transform:translateX(-50%);border-bottom-color:inherit}.nfa-tooltip--left{transform:translateX(6px)}.nfa-tooltip--left.nfa-tooltip--visible{transform:translateX(0)}.nfa-tooltip--left::after{left:100%;top:50%;transform:translateY(-50%);border-left-color:inherit}.nfa-tooltip--right{transform:translateX(-6px)}.nfa-tooltip--right.nfa-tooltip--visible{transform:translateX(0)}.nfa-tooltip--right::after{right:100%;top:50%;transform:translateY(-50%);border-right-color:inherit}[data-nfa-wrapper-link]{cursor:pointer;position:relative}[data-nfa-wrapper-link]:focus-visible{outline:2px solid currentColor;outline-offset:2px}.nfa-hamburger__toggle-wrap{display:flex}.nfa-hamburger__toggle{display:inline-flex;align-items:center;justify-content:center;border:none;cursor:pointer;line-height:1;transition:background .2s ease,color .2s ease}.nfa-hamburger__icon--bars{display:flex;flex-direction:column;gap:4px;width:1em}.nfa-hamburger__icon--bars span{display:block;height:2px;background:currentColor;border-radius:2px;transition:transform .3s ease,opacity .3s ease}.nfa-hamburger__icon--dots{display:flex;flex-direction:column;gap:4px;align-items:center;width:1em}.nfa-hamburger__icon--dots span{display:block;width:5px;height:5px;background:currentColor;border-radius:50%}.nfa-hamburger__icon--grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3px;width:1em}.nfa-hamburger__icon--grid span{display:block;width:7px;height:7px;background:currentColor;border-radius:2px}.nfa-hamburger__overlay{position:fixed;inset:0;z-index:99998;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s ease}.nfa-hamburger--open .nfa-hamburger__overlay{opacity:1;visibility:visible}.nfa-hamburger__panel{position:fixed;z-index:99999;background:#fff;overflow-y:auto;-webkit-overflow-scrolling:touch;transition:transform .35s cubic-bezier(.4, 0, .2, 1),visibility .35s ease;visibility:hidden}.nfa-hamburger__panel--left{top:0;left:0;bottom:0;transform:translateX(-100%)}.nfa-hamburger__panel--right{top:0;right:0;bottom:0;transform:translateX(100%)}.nfa-hamburger__panel--top{top:0;left:0;right:0;max-height:80vh;transform:translateY(-100%)}.nfa-hamburger--open .nfa-hamburger__panel{transform:translate(0);visibility:visible}.nfa-hamburger__panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.nfa-hamburger__logo{max-height:40px;width:auto}.nfa-hamburger__close{background:0 0;border:none;font-size:28px;cursor:pointer;line-height:1;padding:4px 8px;transition:color .2s ease;margin-left:auto}.nfa-hamburger__list{list-style:none;margin:0;padding:0}.nfa-hamburger__item--separated{border-bottom:1px solid #e2e8f0}.nfa-hamburger__link{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:15px;font-weight:500;transition:color .2s ease}.nfa-hamburger__link-icon{flex-shrink:0;font-size:1.1em}.nfa-hamburger__arrow{margin-left:auto;font-size:12px;transition:transform .25s ease}.nfa-hamburger__item--sub-open>.nfa-hamburger__link .nfa-hamburger__arrow{transform:rotate(180deg)}.nfa-hamburger__sub-list{list-style:none;margin:0;padding:4px 0 4px 24px;display:none}.nfa-hamburger__item--sub-open>.nfa-hamburger__sub-list{display:block}.nfa-hamburger__sub-link{display:block;padding:6px 0;text-decoration:none;font-size:14px;transition:color .2s ease}.nfa-form__fields{display:flex;flex-wrap:wrap;gap:16px}.nfa-form__col--100{width:100%}.nfa-form__col--75{width:calc(75% - 8px)}.nfa-form__col--66{width:calc(66.666% - 8px)}.nfa-form__col--50{width:calc(50% - 8px)}.nfa-form__col--33{width:calc(33.333% - 8px)}.nfa-form__col--25{width:calc(25% - 12px)}.nfa-form__col--hidden{display:none}.nfa-form__label{display:block;font-weight:600;font-size:13px;margin-bottom:6px}.nfa-form__required{color:#ef4444;margin-left:2px}.nfa-form__input,.nfa-form__select,.nfa-form__textarea{display:block;width:100%;border:1px solid #cbd5e1;font-size:14px;line-height:1.5;transition:border-color .2s ease,box-shadow .2s ease;outline:0;box-sizing:border-box}.nfa-form__input:focus,.nfa-form__select:focus,.nfa-form__textarea:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.1)}.nfa-form__input--file{padding:8px;border-style:dashed}.nfa-form__textarea{resize:vertical;min-height:100px}.nfa-form__choice-group{display:flex;flex-wrap:wrap;gap:12px}.nfa-form__choice{display:flex;align-items:center;gap:6px;font-size:14px;cursor:pointer}.nfa-form__choice input{accent-color:#6366f1;width:16px;height:16px}.nfa-form__field-error{display:block;font-size:12px;color:#ef4444;min-height:18px;margin-top:4px}.nfa-form__actions{display:flex;margin-top:20px}.nfa-form__submit{display:inline-flex;align-items:center;gap:8px;border:none;font-weight:600;cursor:pointer;transition:background .2s ease,transform .15s ease}.nfa-form__submit:hover{transform:translateY(-1px)}.nfa-form__submit:active{transform:translateY(0)}.nfa-form__submit:disabled{opacity:.6;cursor:not-allowed;transform:none}.nfa-form__spinner{display:inline-block;width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:nfa-spin .6s linear infinite}@keyframes nfa-spin{to{transform:rotate(360deg)}}.nfa-form__msg{padding:14px 18px;border-radius:8px;font-size:14px;font-weight:500;margin-top:16px}.nfa-form__msg--success{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0}.nfa-form__msg--error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}.nfa-form__input--invalid,.nfa-form__select--invalid,.nfa-form__textarea--invalid{border-color:#ef4444!important;box-shadow:0 0 0 3px rgba(239,68,68,.1)!important}@media (max-width:767px){.nfa-form__col--25,.nfa-form__col--33,.nfa-form__col--50,.nfa-form__col--66,.nfa-form__col--75{width:100%}}.nfa-badge{display:inline-block;padding:2px 10px;border-radius:999px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.nfa-badge--blue{background:#eef2ff;color:#4f46e5}.nfa-badge--gray{background:#f1f5f9;color:#64748b}.nfa-sub-row--unread td{background:#fafbff;font-weight:500}
     1.nfa-hero-cta{color:#131313;display:flex;flex-direction:column;gap:24px;text-decoration:none}.nfa-hero-cta__kicker{letter-spacing:0.2em;text-transform:uppercase;font-size:0.85rem;opacity:0.7;margin:0;position:relative}.nfa-hero-cta__headline{font-size:clamp(2.5rem,4vw,3.5rem);line-height:1.1;margin:0;position:relative;letter-spacing:-0.02em}.nfa-hero-cta__body{font-size:1.1rem;max-width:640px;margin:0;opacity:0.85;line-height:1.7;position:relative}.nfa-hero-cta__button{align-self:flex-start;padding:14px 32px;border-radius:999px;font-weight:600;color:#0f172a;background:#ff6b35;text-decoration:none;transition:transform 0.3s ease,box-shadow 0.3s ease,background 0.3s ease;box-shadow:0 1px 3px rgba(0,0,0,0.06),0 1px 2px rgba(0,0,0,0.04);position:relative;display:inline-flex;align-items:center;gap:8px}.nfa-hero-cta__button:hover,.nfa-hero-cta__button:focus-visible{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 30px rgba(255,107,53,0.15);background:#ff7d4f}.nfa-hero-cta__button:active{transform:translateY(-1px) scale(0.99)}.nfa-feature-list{display:flex;flex-direction:column;gap:24px}.nfa-feature-list__items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.nfa-feature-list__item{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:flex-start;padding:20px;border-radius:16px;background:#ffffff;border:1px solid rgba(19,19,19,0.1);transition:background 0.2s ease,border-color 0.2s ease,transform 0.2s ease}.nfa-feature-list__item:hover{background:#f8f9fa;border-color:#0ea5e9;transform:translateY(-2px)}.nfa-feature-list__icon-wrap{display:inline-flex;justify-content:center;align-items:center;padding:10px;border-radius:12px;background:rgba(14,165,233,0.08);transition:background 0.2s ease}.nfa-feature-list__item:hover .nfa-feature-list__icon-wrap{background:rgba(14,165,233,0.08)}.nfa-feature-list__icon{color:#0ea5e9;font-size:24px;line-height:1}.nfa-feature-list__title{margin:0 0 4px 0;color:#131313;font-size:1.05rem;font-weight:600}.nfa-feature-list__text{margin:0;color:rgba(19,19,19,0.55);font-size:0.95rem;line-height:1.6}.nfa-spotlight-card{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:32px;align-items:center}.nfa-spotlight-card__content{display:flex;flex-direction:column;gap:14px}.nfa-spotlight-card__eyebrow{margin:0;letter-spacing:0.15em;text-transform:uppercase;color:#0ea5e9;font-size:0.78rem;font-weight:600}.nfa-spotlight-card__title{margin:0;color:#131313;font-size:clamp(1.9rem,3vw,2.4rem);letter-spacing:-0.01em}.nfa-spotlight-card__description{margin:0;color:rgba(19,19,19,0.55);font-size:1.02rem;line-height:1.7}.nfa-spotlight-card__meta{margin:0;color:rgba(19,19,19,0.4);font-size:0.95rem}.nfa-spotlight-card__button{align-self:flex-start;padding:14px 28px;border-radius:999px;font-weight:600;color:#0f172a;background:#ff6b35;text-decoration:none;transition:transform 0.3s ease,box-shadow 0.3s ease,background 0.3s ease;box-shadow:0 1px 3px rgba(0,0,0,0.06),0 1px 2px rgba(0,0,0,0.04);display:inline-flex;align-items:center;gap:8px}.nfa-spotlight-card__button:hover,.nfa-spotlight-card__button:focus-visible{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 30px rgba(255,107,53,0.15);background:#ff7d4f}.nfa-spotlight-card__media img{width:100%;height:auto;border-radius:20px;display:block;transition:transform 0.3s ease}.nfa-spotlight-card:hover .nfa-spotlight-card__media img{transform:scale(1.02)}.nfa-stats-grid{display:flex;flex-direction:column;gap:28px}.nfa-stats-grid__items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.nfa-stats-grid__item{padding:24px;border-radius:18px;background:#ffffff;border:1px solid rgba(19,19,19,0.1);display:grid;row-gap:8px;transition:background 0.2s ease,border-color 0.2s ease,transform 0.2s ease}.nfa-stats-grid__item:hover{background:#f8f9fa;border-color:#0ea5e9;transform:translateY(-2px)}.nfa-stats-grid__value{color:#131313;font-weight:700;font-size:2rem;line-height:1.2;letter-spacing:-0.02em}.nfa-stats-grid__label{color:rgba(19,19,19,0.55);font-weight:600;font-size:1rem}.nfa-stats-grid__helper{color:rgba(19,19,19,0.4);font-size:0.9rem;line-height:1.5}.nfa-pricing-table{display:flex;flex-direction:column;gap:20px;color:#131313;position:relative;transition:transform 0.3s ease,box-shadow 0.3s ease}.nfa-pricing-table:hover{transform:translateY(-4px)}.nfa-pricing-table__badge{position:absolute;top:18px;right:18px;background:#ff6b35;color:#0f172a;padding:6px 14px;border-radius:999px;font-size:0.7rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;box-shadow:0 4px 12px rgba(255,107,53,0.15)}.nfa-pricing-table__label{margin:0 0 6px 0;font-size:1.4rem}.nfa-pricing-table__description{margin:0;color:rgba(19,19,19,0.55);line-height:1.6}.nfa-pricing-table__price{display:flex;align-items:baseline;gap:8px}.nfa-pricing-table__amount{font-size:2.6rem;font-weight:700;line-height:1;letter-spacing:-0.02em}.nfa-pricing-table__suffix{font-size:1rem;color:rgba(19,19,19,0.4)}.nfa-pricing-table__features{list-style:none;padding:0;margin:0;display:grid;gap:12px}.nfa-pricing-table__features li{display:flex;align-items:flex-start;gap:12px;color:rgba(19,19,19,0.55);line-height:1.5}.nfa-pricing-table__features li::before{content:'\2713';color:#0ea5e9;font-weight:700;font-size:0.9rem;margin-top:1px;flex-shrink:0}.nfa-pricing-table__button{align-self:flex-start;padding:14px 28px;border-radius:999px;font-weight:600;color:#0f172a;background:#ff6b35;text-decoration:none;transition:transform 0.3s ease,box-shadow 0.3s ease,background 0.3s ease;box-shadow:0 1px 3px rgba(0,0,0,0.06),0 1px 2px rgba(0,0,0,0.04);display:inline-flex;align-items:center;gap:8px}.nfa-pricing-table__button:hover,.nfa-pricing-table__button:focus-visible{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 30px rgba(255,107,53,0.15);background:#ff7d4f}.nfa-testimonials{display:flex;flex-direction:column;gap:24px}.nfa-testimonials__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.nfa-testimonials__card{background:#ffffff;border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:16px;border:1px solid rgba(19,19,19,0.1);transition:background 0.2s ease,border-color 0.2s ease,transform 0.2s ease}.nfa-testimonials__card:hover{background:#f8f9fa;border-color:#0ea5e9;transform:translateY(-2px)}.nfa-testimonials__avatar img{width:48px;height:48px;border-radius:50%;object-fit:cover;display:block;border:2px solid rgba(19,19,19,0.1)}.nfa-testimonials__quote{margin:0;color:rgba(19,19,19,0.55);font-size:1rem;line-height:1.7;font-style:normal}blockquote.nfa-testimonials__quote{border:0;padding:0}.nfa-testimonials__footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto}.nfa-testimonials__name{font-weight:600;color:#131313}.nfa-testimonials__role{color:rgba(19,19,19,0.4);font-size:0.9rem}.nfa-testimonials__rating{font-size:0.9rem;letter-spacing:1px;color:#fbbf24}.nfa-logo-grid{display:flex;flex-direction:column;gap:24px}.nfa-logo-grid__items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;align-items:center}.nfa-logo-grid__logo{display:flex;align-items:center;justify-content:center;padding:20px;border-radius:14px;background:#ffffff;border:1px solid rgba(19,19,19,0.1);min-height:86px;transition:background 0.2s ease,border-color 0.2s ease,transform 0.2s ease}.nfa-logo-grid__logo:hover{background:#f8f9fa;border-color:#0ea5e9;transform:translateY(-3px)}.nfa-logo-grid__logo img{max-width:140px;width:100%;height:auto;opacity:0.7;transition:opacity 0.2s ease,filter 0.2s ease;filter:grayscale(20%)}.nfa-logo-grid__logo:hover img{opacity:1;filter:grayscale(0%)}.nfa-logo-grid__text{color:#131313;font-weight:600}.nfa-faq{display:flex;flex-direction:column;gap:24px}.nfa-faq__items{display:grid;gap:12px}.nfa-faq__item{background:#ffffff;border-radius:16px;padding:20px 22px;border:1px solid rgba(19,19,19,0.1);transition:background 0.2s ease,border-color 0.2s ease}.nfa-faq__item:hover{border-color:#0ea5e9}.nfa-faq__item[open]{background:#f8f9fa;border-color:#0ea5e9}.nfa-faq__question{cursor:pointer;font-weight:600;color:#131313;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;user-select:none}.nfa-faq__question::after{content:'+';font-size:1.2rem;color:#0ea5e9;transition:transform 0.2s ease;flex-shrink:0;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(14,165,233,0.08)}.nfa-faq__item[open] .nfa-faq__question::after{content:'\2212';transform:rotate(180deg)}.nfa-faq__question::-webkit-details-marker{display:none}.nfa-faq__answer{margin-top:14px;color:rgba(19,19,19,0.55);line-height:1.7}.nfa-steps{display:flex;flex-direction:column;gap:24px}.nfa-steps__list{display:grid;gap:20px}.nfa-steps--vertical .nfa-steps__list{grid-template-columns:1fr}.nfa-steps--horizontal .nfa-steps__list{grid-template-columns:repeat(3,minmax(0,1fr))}.nfa-steps__item{background:#ffffff;border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:10px;border:1px solid rgba(19,19,19,0.1);transition:background 0.2s ease,border-color 0.2s ease,transform 0.2s ease;position:relative}.nfa-steps__item:hover{background:#f8f9fa;border-color:#0ea5e9;transform:translateY(-2px)}.nfa-steps__label{text-transform:uppercase;letter-spacing:0.12em;font-size:0.72rem;color:#0ea5e9;font-weight:700}.nfa-steps__title{margin:0;font-size:1.1rem;color:#131313;font-weight:600}.nfa-steps__description{margin:0;color:rgba(19,19,19,0.55);line-height:1.6;font-size:0.95rem}.nfa-slider{position:relative}.nfa-slider__track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:6px;scrollbar-width:none;-ms-overflow-style:none}.nfa-slider__track::-webkit-scrollbar{display:none}.nfa-slider__item{flex:0 0 100%;scroll-snap-align:start}.nfa-slider__btn{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:999px;border:1px solid rgba(19,19,19,0.1);background:#131313;color:#131313;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 20px rgb(15 23 42 / 0.3);transition:transform 0.2s ease,box-shadow 0.2s ease,background 0.2s ease,border-color 0.2s ease;z-index:2}.nfa-slider__btn--prev{left:-16px}.nfa-slider__btn--next{right:-16px}.nfa-slider__btn:hover{transform:translateY(-50%) scale(1.08);background:rgba(255,255,255,0.08);border-color:#0ea5e9}.nfa-slider__btn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(125,211,252,0.3)}.nfa-showcase{position:relative}.nfa-showcase__nav{display:flex;gap:12px;margin-bottom:24px;justify-content:flex-end}.nfa-showcase__arrow{width:48px;height:48px;border-radius:50%;border:1.5px solid rgba(19,19,19,0.15);background:transparent;color:#fff;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.3s ease}.nfa-showcase__arrow:hover{background:#131313;color:#F4F4F4;border-color:#131313}.nfa-showcase__viewport{overflow:hidden}.nfa-showcase__track{display:flex;transition:transform 0.5s cubic-bezier(0.25,0.46,0.45,0.94);will-change:transform}.nfa-showcase__card{flex-shrink:0;position:relative;height:420px;border-radius:20px;overflow:hidden;transition:transform 0.35s ease;text-decoration:none;display:block}.nfa-showcase__card:hover{transform:translateY(-4px)}.nfa-showcase__img{position:absolute;inset:0;z-index:0}.nfa-showcase__img img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s ease}.nfa-showcase__card:hover .nfa-showcase__img img{transform:scale(1.08)}.nfa-showcase__card--overlay-dark .nfa-showcase__img::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(19,19,19,0.92) 0%,rgba(19,19,19,0.5) 50%,rgba(19,19,19,0.15) 100%);z-index:1}.nfa-showcase__card--overlay-light .nfa-showcase__img::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(255,255,255,0.92) 0%,rgba(255,255,255,0.4) 50%,transparent 100%);z-index:1}.nfa-showcase__badge{position:absolute;top:20px;left:20px;background:rgba(244,244,244,0.15);backdrop-filter:blur(10px);color:#F4F4F4;padding:5px 16px;border-radius:50px;font-size:11px;font-weight:600;letter-spacing:0.5px;text-transform:uppercase;z-index:2;border:1px solid rgba(244,244,244,0.1)}.nfa-showcase__body{position:absolute;bottom:0;left:0;right:0;padding:32px 28px;z-index:2}.nfa-showcase__title{font-size:22px;font-weight:700;color:#F4F4F4;margin-bottom:12px}.nfa-showcase__desc{font-size:14px;color:rgba(244,244,244,0.65);line-height:1.8;margin:0}.nfa-showcase__tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.nfa-showcase__tag{font-size:11px;padding:4px 12px;border-radius:50px;border:1px solid rgba(244,244,244,0.12);color:rgba(244,244,244,0.6);letter-spacing:0.3px}.nfa-showcase__dots{display:flex;justify-content:center;gap:8px;margin-top:24px}.nfa-showcase__dot{width:10px;height:10px;border-radius:50%;background:rgba(19,19,19,0.2);border:none;cursor:pointer;padding:0;transition:background 0.3s ease,transform 0.3s ease}.nfa-showcase__dot--active{background:#131313;transform:scale(1.2)}.nfa-showcase__dot:hover:not(.nfa-showcase__dot--active){background:rgba(19,19,19,0.4)}.nfa-areas__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.nfa-areas__grid--featured .nfa-areas__card:first-child{grid-row:1 / 3}.nfa-areas__card{background:#ffffff;border-radius:18px;overflow:hidden;position:relative;transition:all 0.4s ease;display:block;text-decoration:none;color:inherit}a.nfa-areas__card:hover{text-decoration:none;color:inherit}.nfa-areas__card--shadow-sm{box-shadow:0 1px 3px rgba(0,0,0,0.06),0 1px 2px rgba(0,0,0,0.04)}.nfa-areas__card--shadow-md{box-shadow:0 4px 12px rgba(0,0,0,0.08)}.nfa-areas__card--shadow-lg{box-shadow:0 10px 30px rgba(0,0,0,0.12)}.nfa-areas__card:hover{box-shadow:0 10px 30px rgba(0,0,0,0.12)}.nfa-areas__img{height:200px;overflow:hidden;position:relative}.nfa-areas__img img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s ease}.nfa-areas__badge{position:absolute;top:16px;left:16px;background:#131313;color:#F4F4F4;padding:5px 16px;border-radius:50px;font-size:11px;font-weight:600;letter-spacing:0.5px;text-transform:uppercase;z-index:3}.nfa-areas__body{padding:24px}.nfa-areas__title{font-size:19px;font-weight:600;margin:0 0 8px;color:#131313}.nfa-areas__desc{font-size:14px;color:rgba(19,19,19,0.55);line-height:1.7;margin:0}.nfa-areas__card--featured{position:relative}.nfa-areas__card--featured .nfa-areas__img{position:absolute;inset:0;height:100%;z-index:0}.nfa-areas__overlay{position:absolute;inset:0;z-index:1;pointer-events:none}.nfa-areas__card--featured .nfa-areas__body{position:absolute;bottom:0;left:0;right:0;z-index:2;padding:32px 28px}.nfa-areas__card--featured .nfa-areas__title{color:#F4F4F4;font-size:24px;margin-bottom:12px}.nfa-areas__card--featured .nfa-areas__desc{color:rgba(244,244,244,0.65);font-size:14px;line-height:1.8}.nfa-areas__card--featured .nfa-areas__badge{background:rgba(244,244,244,0.15);backdrop-filter:blur(10px);border:1px solid rgba(244,244,244,0.1);z-index:2}.nfa-journey__steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;position:relative}.nfa-journey__steps--line::before{content:'';position:absolute;top:36px;left:48px;right:48px;height:2px;background:linear-gradient(90deg,#131313,rgba(19,19,19,0.08));z-index:0}.nfa-journey__step{text-align:center;position:relative;z-index:1}.nfa-journey__number{width:72px;height:72px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:2px solid #131313;background:#ffffff;color:#131313;font-size:22px;font-weight:700;margin:0 auto 20px;transition:all 0.3s ease}.nfa-journey__step:hover .nfa-journey__number{background:#131313;color:#f4f4f4;box-shadow:0 8px 24px rgba(19,19,19,0.2);transform:scale(1.05)}.nfa-journey__step-title{margin:0 0 10px;font-size:16px;font-weight:600;color:#131313}.nfa-journey__step-description{margin:0;font-size:13px;line-height:1.7;color:rgba(19,19,19,0.45)}@media (max-width:900px){.nfa-feature-list__items,.nfa-stats-grid__items,.nfa-testimonials__grid,.nfa-logo-grid__items,.nfa-steps--horizontal .nfa-steps__list{grid-template-columns:1fr}.nfa-journey__steps{grid-template-columns:repeat(2,minmax(0,1fr))}.nfa-journey__steps--line::before{display:none}.nfa-areas__grid--featured .nfa-areas__card:first-child{grid-row:auto}.nfa-areas__card--featured .nfa-areas__img{position:relative;inset:auto;height:200px}.nfa-areas__card--featured .nfa-areas__overlay{display:none}.nfa-areas__card--featured .nfa-areas__body{position:relative;bottom:auto;left:auto;right:auto;padding:24px}.nfa-areas .nfa-areas__card--featured .nfa-areas__title{color:#131313 !important;font-size:19px !important;margin-bottom:8px}.nfa-areas .nfa-areas__card--featured .nfa-areas__desc{color:rgba(19,19,19,0.55) !important;font-size:14px;line-height:1.7}.nfa-areas .nfa-areas__card--featured .nfa-areas__badge{background:#131313 !important;color:#F4F4F4 !important;backdrop-filter:none;border:none !important}}@media (max-width:640px){.nfa-journey__steps{grid-template-columns:1fr}.nfa-slider__btn--prev{left:-8px}.nfa-slider__btn--next{right:-8px}}.nfa-team__grid{display:grid;gap:24px;grid-template-columns:repeat(var(--nfa-team-cols,3),1fr)}.nfa-team__card{background:#fff;border-radius:16px;overflow:hidden;text-align:center;transition:box-shadow 0.3s ease,transform 0.25s ease;box-shadow:0 1px 4px rgba(0,0,0,.06)}.nfa-team__card:hover{box-shadow:0 8px 24px rgba(0,0,0,.1);transform:translateY(-4px)}.nfa-team__card--layout-left{display:flex;text-align:left}.nfa-team__card--layout-left .nfa-team__photo{flex:0 0 140px;height:auto}.nfa-team__photo{width:100%;height:220px;object-fit:cover;display:block}.nfa-team__card--layout-circle .nfa-team__photo{width:120px;height:120px;border-radius:50%;margin:24px auto 0}.nfa-team__body{padding:20px}.nfa-team__name{margin:0 0 4px;font-size:1.15em;font-weight:600;color:#131313}.nfa-team__role{font-size:.875em;color:rgba(19,19,19,.55);margin-bottom:10px}.nfa-team__bio{font-size:.9em;color:rgba(19,19,19,.7);line-height:1.6;margin-bottom:14px}.nfa-team__social{display:flex;gap:10px;justify-content:center}.nfa-team__card--layout-left .nfa-team__social{justify-content:flex-start}.nfa-team__social a{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:rgba(19,19,19,.06);color:#131313;font-size:15px;transition:background .25s,color .25s;text-decoration:none}.nfa-team__social a:hover{background:#0ea5e9;color:#fff}@media (max-width:767px){.nfa-team__grid{grid-template-columns:1fr}.nfa-team__card--layout-left{flex-direction:column;text-align:center}.nfa-team__card--layout-left .nfa-team__photo{flex:none;width:100%;height:200px}.nfa-team__card--layout-left .nfa-team__social{justify-content:center}}.nfa-cta-banner{border-radius:16px;padding:48px 40px;text-align:center;position:relative;overflow:hidden}.nfa-cta-banner--left{text-align:left}.nfa-cta-banner--side{display:flex;align-items:center;justify-content:space-between;text-align:left;gap:32px}.nfa-cta-banner__icon{font-size:40px;margin-bottom:16px;display:inline-block}.nfa-cta-banner__kicker{display:inline-block;font-size:.8em;font-weight:600;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;opacity:.75}.nfa-cta-banner__title{margin:0 0 14px;font-size:1.75em;font-weight:700;line-height:1.25}.nfa-cta-banner__desc{font-size:1.05em;line-height:1.6;opacity:.85;max-width:640px;margin:0 auto 24px}.nfa-cta-banner--left .nfa-cta-banner__desc,.nfa-cta-banner--side .nfa-cta-banner__desc{margin-left:0}.nfa-cta-banner__actions{display:flex;gap:12px;flex-wrap:wrap}.nfa-cta-banner--center .nfa-cta-banner__actions{justify-content:center}.nfa-cta-banner__btn{display:inline-flex;align-items:center;padding:12px 28px;border-radius:8px;font-weight:600;font-size:.95em;text-decoration:none;transition:opacity .25s,transform .15s;border:none;cursor:pointer}.nfa-cta-banner__btn:hover{opacity:.88;transform:translateY(-1px)}@media (max-width:767px){.nfa-cta-banner{padding:32px 24px}.nfa-cta-banner--side{flex-direction:column;text-align:center}.nfa-cta-banner--side .nfa-cta-banner__actions{justify-content:center}}.nfa-tabs{display:flex;flex-direction:column;gap:0}.nfa-tabs--vertical{flex-direction:row;gap:24px}.nfa-tabs__nav{display:flex;gap:4px;border-bottom:2px solid rgba(19,19,19,.08);padding-bottom:0;overflow-x:auto;-webkit-overflow-scrolling:touch}.nfa-tabs--vertical .nfa-tabs__nav{flex-direction:column;border-bottom:none;border-right:2px solid rgba(19,19,19,.08);padding-right:0;padding-bottom:0;min-width:180px;overflow-x:visible}.nfa-tabs__btn{position:relative;display:inline-flex;align-items:center;gap:8px;padding:12px 24px;font-weight:500;font-size:.95em;background:transparent;border:none;color:rgba(19,19,19,.55);cursor:pointer;white-space:nowrap;transition:color .2s,background .2s;border-radius:8px 8px 0 0}.nfa-tabs--vertical .nfa-tabs__btn{border-radius:8px 0 0 8px;justify-content:flex-start;text-align:left;width:100%}.nfa-tabs__btn:hover{color:#131313;background:rgba(19,19,19,.03)}.nfa-tabs__btn--active{color:#0ea5e9;background:rgba(14,165,233,.08)}.nfa-tabs__btn--active::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:3px;background:#0ea5e9;border-radius:3px 3px 0 0}.nfa-tabs--vertical .nfa-tabs__btn--active::after{bottom:auto;top:0;left:auto;right:-2px;width:3px;height:100%;border-radius:0 3px 3px 0}.nfa-tabs__btn--icon-top{flex-direction:column}.nfa-tabs__btn-icon{font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center}.nfa-tabs__panels{flex:1}.nfa-tabs__panel{display:none;padding:24px;color:rgba(19,19,19,.7);line-height:1.7;border-radius:0 0 12px 12px}.nfa-tabs--vertical .nfa-tabs__panel{border-radius:0 12px 12px 0}.nfa-tabs__panel--active{display:block}@media (max-width:767px){.nfa-tabs--vertical{flex-direction:column}.nfa-tabs--vertical .nfa-tabs__nav{flex-direction:row;border-right:none;border-bottom:2px solid rgba(19,19,19,.08);min-width:0;overflow-x:auto}.nfa-tabs--vertical .nfa-tabs__btn{border-radius:8px 8px 0 0}.nfa-tabs--vertical .nfa-tabs__btn--active::after{bottom:-2px;top:auto;right:0;left:0;width:auto;height:3px;border-radius:3px 3px 0 0}.nfa-tabs--vertical .nfa-tabs__panel{border-radius:0 0 12px 12px}}.nfa-compare{position:relative;overflow:hidden;border-radius:12px;user-select:none;touch-action:none;cursor:col-resize;line-height:0}.nfa-compare--vertical{cursor:row-resize}.nfa-compare__before,.nfa-compare__after{position:relative;width:100%}.nfa-compare__before{position:absolute;top:0;left:0;z-index:2;height:100%;overflow:hidden}.nfa-compare__before img,.nfa-compare__after img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}.nfa-compare__label{position:absolute;bottom:16px;padding:4px 14px;font-size:.8em;font-weight:600;color:#fff;background:rgba(0,0,0,.55);border-radius:6px;z-index:5;pointer-events:none;transition:opacity .3s}.nfa-compare__label--before{left:16px}.nfa-compare__label--after{right:16px}.nfa-compare--vertical .nfa-compare__label--before{top:16px;bottom:auto;left:16px}.nfa-compare--vertical .nfa-compare__label--after{bottom:16px;right:auto;left:16px}.nfa-compare--hover-labels .nfa-compare__label{opacity:0}.nfa-compare--hover-labels:hover .nfa-compare__label{opacity:1}.nfa-compare__slider{position:absolute;top:0;bottom:0;z-index:10;display:flex;align-items:center;justify-content:center}.nfa-compare--horizontal .nfa-compare__slider{flex-direction:column;width:0}.nfa-compare--vertical .nfa-compare__slider{top:auto;left:0;right:0;flex-direction:row;height:0}.nfa-compare__line{position:absolute}.nfa-compare--horizontal .nfa-compare__line{width:3px;top:0;bottom:0;background:#fff}.nfa-compare--vertical .nfa-compare__line{height:3px;left:0;right:0;background:#fff}.nfa-compare__handle{position:relative;z-index:11;width:40px;height:40px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.25);color:#131313;cursor:inherit;flex-shrink:0}.nfa-compare__handle svg{width:14px;height:14px}.nfa-countdown{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px}.nfa-countdown__block{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;min-width:80px;border-radius:12px;background:rgba(19,19,19,.04);transition:transform .25s,box-shadow .25s;position:relative}.nfa-countdown__block:hover{transform:translateY(-3px);box-shadow:0 4px 16px rgba(0,0,0,.08)}.nfa-countdown__digit{font-size:2.5em;font-weight:700;line-height:1.1;color:#131313;font-variant-numeric:tabular-nums}.nfa-countdown__label{font-size:.8em;font-weight:500;color:rgba(19,19,19,.55);text-transform:uppercase;letter-spacing:.06em;margin-top:8px}.nfa-countdown__sep{font-size:2em;font-weight:700;color:rgba(19,19,19,.3);line-height:1;align-self:flex-start;padding-top:20px}.nfa-countdown--inline .nfa-countdown__block{background:transparent;padding:10px 6px;min-width:auto;border-radius:0}.nfa-countdown--inline .nfa-countdown__block:hover{transform:none;box-shadow:none}.nfa-countdown__block--circle{position:relative;background:transparent;padding:0;width:120px;height:120px;border-radius:50%}.nfa-countdown__block--circle:hover{transform:none;box-shadow:none}.nfa-countdown__ring{position:absolute;top:0;left:0;width:100%;height:100%}.nfa-countdown__progress{transition:stroke-dashoffset .6s ease}.nfa-countdown__block--circle .nfa-countdown__digit{font-size:1.6em}.nfa-countdown__block--circle .nfa-countdown__label{font-size:.65em;margin-top:2px}.nfa-countdown__expiry{width:100%;text-align:center;font-size:1.2em;font-weight:600;color:#131313;padding:24px}@media (max-width:480px){.nfa-countdown__digit{font-size:1.8em}.nfa-countdown__block{min-width:60px;padding:14px}.nfa-countdown__block--circle{width:80px;height:80px}.nfa-countdown__block--circle .nfa-countdown__digit{font-size:1.2em}}.nfa-tooltip{position:absolute;z-index:99999;max-width:260px;padding:8px 14px;border-radius:6px;background:#1e293b;color:#fff;font-size:13px;line-height:1.5;text-align:center;pointer-events:none;opacity:0;visibility:hidden;transition:opacity 0.25s ease,visibility 0.25s ease,transform 0.25s ease;white-space:normal;word-wrap:break-word;box-shadow:0 4px 12px rgba(0,0,0,0.15)}.nfa-tooltip--visible{opacity:1;visibility:visible}.nfa-tooltip::after{content:'';position:absolute;width:0;height:0;border:6px solid transparent}.nfa-tooltip--no-arrow::after{display:none}.nfa-tooltip--top{transform:translateY(6px)}.nfa-tooltip--top.nfa-tooltip--visible{transform:translateY(0)}.nfa-tooltip--top::after{top:100%;left:50%;transform:translateX(-50%);border-top-color:inherit}.nfa-tooltip--bottom{transform:translateY(-6px)}.nfa-tooltip--bottom.nfa-tooltip--visible{transform:translateY(0)}.nfa-tooltip--bottom::after{bottom:100%;left:50%;transform:translateX(-50%);border-bottom-color:inherit}.nfa-tooltip--left{transform:translateX(6px)}.nfa-tooltip--left.nfa-tooltip--visible{transform:translateX(0)}.nfa-tooltip--left::after{left:100%;top:50%;transform:translateY(-50%);border-left-color:inherit}.nfa-tooltip--right{transform:translateX(-6px)}.nfa-tooltip--right.nfa-tooltip--visible{transform:translateX(0)}.nfa-tooltip--right::after{right:100%;top:50%;transform:translateY(-50%);border-right-color:inherit}[data-nfa-wrapper-link]{cursor:pointer;position:relative}[data-nfa-wrapper-link]:focus-visible{outline:2px solid currentColor;outline-offset:2px}.nfa-hamburger__toggle-wrap{display:flex}.nfa-hamburger__toggle{display:inline-flex;align-items:center;justify-content:center;border:none;cursor:pointer;line-height:1;transition:background 0.2s ease,color 0.2s ease}.nfa-hamburger__icon--bars{display:flex;flex-direction:column;gap:4px;width:1em}.nfa-hamburger__icon--bars span{display:block;height:2px;background:currentColor;border-radius:2px;transition:transform 0.3s ease,opacity 0.3s ease}.nfa-hamburger__icon--dots{display:flex;flex-direction:column;gap:4px;align-items:center;width:1em}.nfa-hamburger__icon--dots span{display:block;width:5px;height:5px;background:currentColor;border-radius:50%}.nfa-hamburger__icon--grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3px;width:1em}.nfa-hamburger__icon--grid span{display:block;width:7px;height:7px;background:currentColor;border-radius:2px}.nfa-hamburger__overlay{position:fixed;inset:0;z-index:99998;opacity:0;visibility:hidden;transition:opacity 0.35s ease,visibility 0.35s ease}.nfa-hamburger--open .nfa-hamburger__overlay{opacity:1;visibility:visible}.nfa-hamburger__panel{position:fixed;z-index:99999;background:#fff;overflow-y:auto;-webkit-overflow-scrolling:touch;transition:transform 0.35s cubic-bezier(0.4,0,0.2,1),visibility 0.35s ease;visibility:hidden}.nfa-hamburger__panel--left{top:0;left:0;bottom:0;transform:translateX(-100%)}.nfa-hamburger__panel--right{top:0;right:0;bottom:0;transform:translateX(100%)}.nfa-hamburger__panel--top{top:0;left:0;right:0;max-height:80vh;transform:translateY(-100%)}.nfa-hamburger--open .nfa-hamburger__panel{transform:translate(0);visibility:visible}.nfa-hamburger__panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.nfa-hamburger__logo{max-height:40px;width:auto}.nfa-hamburger__close{background:none;border:none;font-size:28px;cursor:pointer;line-height:1;padding:4px 8px;transition:color 0.2s ease;margin-left:auto}.nfa-hamburger__list{list-style:none;margin:0;padding:0}.nfa-hamburger__item--separated{border-bottom:1px solid #e2e8f0}.nfa-hamburger__link{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:15px;font-weight:500;transition:color 0.2s ease}.nfa-hamburger__link-icon{flex-shrink:0;font-size:1.1em}.nfa-hamburger__arrow{margin-left:auto;font-size:12px;transition:transform 0.25s ease}.nfa-hamburger__item--sub-open > .nfa-hamburger__link .nfa-hamburger__arrow{transform:rotate(180deg)}.nfa-hamburger__sub-list{list-style:none;margin:0;padding:4px 0 4px 24px;display:none}.nfa-hamburger__item--sub-open > .nfa-hamburger__sub-list{display:block}.nfa-hamburger__sub-link{display:block;padding:6px 0;text-decoration:none;font-size:14px;transition:color 0.2s ease}.nfa-form__fields{display:flex;flex-wrap:wrap;gap:16px}.nfa-form__col--100{width:100%}.nfa-form__col--75{width:calc(75% - 8px)}.nfa-form__col--66{width:calc(66.666% - 8px)}.nfa-form__col--50{width:calc(50% - 8px)}.nfa-form__col--33{width:calc(33.333% - 8px)}.nfa-form__col--25{width:calc(25% - 12px)}.nfa-form__col--hidden{display:none}.nfa-form__label{display:block;font-weight:600;font-size:13px;margin-bottom:6px}.nfa-form__required{color:#ef4444;margin-left:2px}.nfa-form__input,.nfa-form__select,.nfa-form__textarea{display:block;width:100%;border:1px solid #cbd5e1;font-size:14px;line-height:1.5;transition:border-color 0.2s ease,box-shadow 0.2s ease;outline:none;box-sizing:border-box}.nfa-form__input:focus,.nfa-form__select:focus,.nfa-form__textarea:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,0.1)}.nfa-form__input--file{padding:8px;border-style:dashed}.nfa-form__textarea{resize:vertical;min-height:100px}.nfa-form__choice-group{display:flex;flex-wrap:wrap;gap:12px}.nfa-form__choice{display:flex;align-items:center;gap:6px;font-size:14px;cursor:pointer}.nfa-form__choice input{accent-color:#6366f1;width:16px;height:16px}.nfa-form__field-error{display:block;font-size:12px;color:#ef4444;min-height:18px;margin-top:4px}.nfa-form__actions{display:flex;margin-top:20px}.nfa-form__submit{display:inline-flex;align-items:center;gap:8px;border:none;font-weight:600;cursor:pointer;transition:background 0.2s ease,transform 0.15s ease}.nfa-form__submit:hover{transform:translateY(-1px)}.nfa-form__submit:active{transform:translateY(0)}.nfa-form__submit:disabled{opacity:0.6;cursor:not-allowed;transform:none}.nfa-form__spinner{display:inline-block;width:16px;height:16px;border:2px solid rgba(255,255,255,0.3);border-top-color:#fff;border-radius:50%;animation:nfa-spin 0.6s linear infinite}@keyframes nfa-spin{to{transform:rotate(360deg)}}.nfa-form__msg{padding:14px 18px;border-radius:8px;font-size:14px;font-weight:500;margin-top:16px}.nfa-form__msg--success{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0}.nfa-form__msg--error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}.nfa-form__input--invalid,.nfa-form__select--invalid,.nfa-form__textarea--invalid{border-color:#ef4444 !important;box-shadow:0 0 0 3px rgba(239,68,68,0.1) !important}@media (max-width:767px){.nfa-form__col--75,.nfa-form__col--66,.nfa-form__col--50,.nfa-form__col--33,.nfa-form__col--25{width:100%}}.nfa-badge{display:inline-block;padding:2px 10px;border-radius:999px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.04em}.nfa-badge--blue{background:#eef2ff;color:#4f46e5}.nfa-badge--gray{background:#f1f5f9;color:#64748b}.nfa-sub-row--unread td{background:#fafbff;font-weight:500}.nfa-ncards{position:relative}.nfa-ncards__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.nfa-ncards__card{background:#e8e4de;border-radius:16px;padding:28px;display:flex;flex-direction:column;transition:box-shadow 0.3s ease,transform 0.25s ease}.nfa-ncards--grid .nfa-ncards__card:hover{transform:translateY(-4px)}.nfa-ncards__header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px}.nfa-ncards__number{font-size:2.5rem;font-weight:300;line-height:1;color:#3b3a2f;font-style:italic}.nfa-ncards__icon{display:inline-flex;align-items:center;justify-content:center;font-size:28px;color:#3b3a2f;line-height:1}.nfa-ncards__icon svg{width:28px;height:28px}.nfa-ncards__image{display:inline-flex;align-items:center;justify-content:center;width:120px;height:120px;flex-shrink:0}.nfa-ncards__image img{width:100%;height:100%;object-fit:contain}.nfa-ncards__body{flex:1}.nfa-ncards__title{font-size:0.95rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:#3b3a2f;margin:0 0 12px 0;line-height:1.3}.nfa-ncards__desc{font-size:0.9rem;color:#3b3a2f;line-height:1.6;margin:0;opacity:0.85}.nfa-ncards--steps .nfa-ncards__card--step{background:#ffffff;border:1px solid #e8e4de;border-radius:16px;padding:32px 28px;display:flex;flex-direction:column;align-items:flex-start;position:relative;overflow:hidden;transition:box-shadow 0.3s ease,transform 0.25s ease}.nfa-ncards--steps .nfa-ncards__card--step:hover{box-shadow:0 8px 30px rgba(0,0,0,0.08);transform:translateY(-3px)}.nfa-ncards--steps .nfa-ncards__card--step::before{content:'';position:absolute;background-color:#b8976a;transition:opacity 0.3s ease;opacity:0}.nfa-ncards--steps .nfa-ncards__card--step:hover::before{opacity:1}.nfa-ncards-accent--left .nfa-ncards__card--step::before{top:0;left:0;width:4px;height:100%}.nfa-ncards-accent--right .nfa-ncards__card--step::before{top:0;right:0;width:4px;height:100%}.nfa-ncards-accent--top .nfa-ncards__card--step::before{top:0;left:0;width:100%;height:4px}.nfa-ncards-accent--bottom .nfa-ncards__card--step::before{bottom:0;left:0;width:100%;height:4px}.nfa-ncards-accent--none .nfa-ncards__card--step::before{display:none}.nfa-ncards__badge{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background-color:#1e3a5f;color:#ffffff;font-size:22px;flex-shrink:0;margin-bottom:14px;line-height:1}.nfa-ncards__badge svg{width:22px;height:22px;fill:currentColor}.nfa-ncards__badge--img{background:transparent;overflow:hidden}.nfa-ncards__badge--img img{width:100%;height:100%;object-fit:cover;border-radius:50%}.nfa-ncards__step-label{font-size:0.75rem;font-weight:600;text-transform:uppercase;letter-spacing:0.12em;color:#b8976a;margin-bottom:8px;display:block}.nfa-ncards__step-title{font-size:1.2rem;font-weight:700;font-style:italic;color:#1e3a5f;margin:0 0 14px 0;line-height:1.3}.nfa-ncards__divider{display:block;width:50px;height:3px;border-radius:2px;background-color:#1e3a5f;margin-bottom:16px}.nfa-ncards__step-desc{font-size:0.92rem;line-height:1.65;color:#666666;margin:0}.nfa-ncards--carousel{overflow:hidden;position:relative}.nfa-ncards__viewport{overflow:hidden}.nfa-ncards__track{display:flex;transition:transform 0.45s cubic-bezier(0.25,0.46,0.45,0.94);will-change:transform;cursor:grab;user-select:none;-webkit-user-select:none}.nfa-ncards--carousel.is-dragging .nfa-ncards__track{cursor:grabbing}.nfa-ncards--carousel .nfa-ncards__card{flex:0 0 calc((100% - 40px) / 3);display:flex;flex-direction:column;min-height:280px}.nfa-ncards--carousel .nfa-ncards__header{margin-bottom:20px;min-height:90px}.nfa-ncards--carousel .nfa-ncards__number{font-size:3rem}.nfa-ncards__nav{display:flex;gap:8px;margin-top:20px}.nfa-ncards--nav-bottom-right .nfa-ncards__nav{justify-content:flex-end}.nfa-ncards--nav-bottom-left .nfa-ncards__nav{justify-content:flex-start}.nfa-ncards--nav-bottom-center .nfa-ncards__nav{justify-content:center}.nfa-ncards--nav-top-right .nfa-ncards__nav,.nfa-ncards--nav-top-left .nfa-ncards__nav,.nfa-ncards--nav-top-center .nfa-ncards__nav{margin-top:0;margin-bottom:20px;order:-1}.nfa-ncards--nav-top-right .nfa-ncards__nav{justify-content:flex-end}.nfa-ncards--nav-top-left .nfa-ncards__nav{justify-content:flex-start}.nfa-ncards--nav-top-center .nfa-ncards__nav{justify-content:center}.nfa-ncards--nav-top-right,.nfa-ncards--nav-top-left,.nfa-ncards--nav-top-center{display:flex;flex-direction:column}.nfa-ncards--nav-sides{position:relative}.nfa-ncards__arrow--side{position:absolute;top:50%;transform:translateY(-50%);z-index:2}.nfa-ncards__arrow--side.nfa-ncards__arrow--prev{left:-48px}.nfa-ncards__arrow--side.nfa-ncards__arrow--next{right:-48px}@media (max-width:1200px){.nfa-ncards__arrow--side.nfa-ncards__arrow--prev{left:8px}.nfa-ncards__arrow--side.nfa-ncards__arrow--next{right:8px}}.nfa-ncards__arrow{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:1.5px solid rgba(255,255,255,0.5);background:transparent;color:#ffffff;cursor:pointer;transition:background-color 0.25s ease,border-color 0.25s ease,transform 0.2s ease;padding:0}.nfa-ncards__arrow:hover{background-color:rgba(255,255,255,0.15);border-color:rgba(255,255,255,0.8);transform:scale(1.08)}.nfa-ncards__arrow--side:hover{transform:translateY(-50%) scale(1.08)}.nfa-ncards__arrow svg{width:16px;height:16px}.nfa-ncards__dots{display:flex;gap:8px;justify-content:center;margin-top:20px;padding:4px 0}.nfa-ncards__dot{width:10px;height:10px;border-radius:50%;border:none;background-color:rgba(255,255,255,0.4);cursor:pointer;padding:0;transition:background-color 0.25s ease,transform 0.2s ease}.nfa-ncards__dot:hover{transform:scale(1.3)}.nfa-ncards__dot.is-active{background-color:#ffffff;transform:scale(1.2)}@media (max-width:1024px){.nfa-ncards__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:767px){.nfa-ncards__grid{grid-template-columns:1fr}.nfa-ncards__number{font-size:2rem}.nfa-ncards--carousel .nfa-ncards__number{font-size:2.2rem}}
  • nebula-forge-addons-for-elementor/trunk/assets/js/frontend.js

    r3462588 r3463192  
    232232            // Initial render.
    233233            render();
     234            startAutoplay();
     235        });
     236    };
     237
     238    /**
     239     * Initialize Numbered Cards carousel layout.
     240     *
     241     * @param {jQuery} scope The widget wrapper element.
     242     */
     243    const initNumberedCards = (scope) => {
     244        const $carousel = scope.find('.nfa-ncards--carousel');
     245        if (!$carousel.length) return;
     246
     247        $carousel.each(function () {
     248            const $el         = $(this);
     249            const track       = $el.find('.nfa-ncards__track').get(0);
     250            const cards       = Array.from(track.children);
     251            const totalSlides = cards.length;
     252
     253            if (!track || totalSlides === 0) return;
     254
     255            // Prevent double-binding on Elementor re-init.
     256            if ($el.data('ncards-bound')) return;
     257            $el.data('ncards-bound', true);
     258
     259            const perViewDesktop = Math.max(1, parseInt($el.data('per-view'), 10) || 3);
     260            const perViewTablet  = Math.max(1, parseInt($el.data('per-view-tablet'), 10) || 2);
     261            const perViewMobile  = Math.max(1, parseInt($el.data('per-view-mobile'), 10) || 1);
     262            const gap            = Math.max(0, parseInt($el.data('gap'), 10) || 20);
     263            const doAutoplay     = $el.data('autoplay') === 'yes';
     264            const autoplaySpeed  = Math.max(1000, parseInt($el.data('autoplay-speed'), 10) || 4000);
     265            const pauseOnHover   = $el.data('pause-on-hover') === 'yes';
     266            const enableDrag     = $el.data('mouse-drag') === 'yes';
     267            const infiniteLoop   = $el.data('infinite') === 'yes';
     268            const transSpeed     = Math.max(100, parseInt($el.data('speed'), 10) || 450);
     269            const $dots          = $el.find('.nfa-ncards__dots');
     270
     271            // Apply transition speed
     272            track.style.transition = 'transform ' + transSpeed + 'ms cubic-bezier(0.25,0.46,0.45,0.94)';
     273
     274            let pos = 0;
     275            let autoplayTimer = null;
     276
     277            function getPerView() {
     278                const w = window.innerWidth;
     279                if (w <= 767) return perViewMobile;
     280                if (w <= 1024) return perViewTablet;
     281                return perViewDesktop;
     282            }
     283
     284            function getMaxPos() {
     285                return Math.max(0, totalSlides - getPerView());
     286            }
     287
     288            /* ── Dots ─────────────────────────────────── */
     289            function buildDots() {
     290                if (!$dots.length) return;
     291                $dots.empty();
     292                const maxPos = getMaxPos();
     293                for (let i = 0; i <= maxPos; i++) {
     294                    const dot = document.createElement('button');
     295                    dot.className = 'nfa-ncards__dot' + (i === pos ? ' is-active' : '');
     296                    dot.setAttribute('aria-label', 'Go to slide ' + (i + 1));
     297                    dot.addEventListener('click', function () {
     298                        pos = i;
     299                        render();
     300                        updateDots();
     301                        resetAutoplay();
     302                    });
     303                    $dots.get(0).appendChild(dot);
     304                }
     305            }
     306
     307            function updateDots() {
     308                if (!$dots.length) return;
     309                $dots.find('.nfa-ncards__dot').each(function (i) {
     310                    $(this).toggleClass('is-active', i === pos);
     311                });
     312            }
     313
     314            function render() {
     315                const pv = getPerView();
     316                const cardWidth = 'calc((100% - ' + (gap * (pv - 1)) + 'px) / ' + pv + ')';
     317                cards.forEach(function (card) {
     318                    card.style.flex = '0 0 ' + cardWidth;
     319                });
     320
     321                if (cards[0]) {
     322                    const rect   = cards[0].getBoundingClientRect();
     323                    const cardPx = rect.width + gap;
     324                    track.style.transform = 'translateX(-' + (pos * cardPx) + 'px)';
     325                }
     326            }
     327
     328            function next() {
     329                if (infiniteLoop) {
     330                    pos = pos >= getMaxPos() ? 0 : pos + 1;
     331                } else {
     332                    pos = Math.min(pos + 1, getMaxPos());
     333                }
     334                render();
     335                updateDots();
     336            }
     337
     338            function prev() {
     339                if (infiniteLoop) {
     340                    pos = pos <= 0 ? getMaxPos() : pos - 1;
     341                } else {
     342                    pos = Math.max(pos - 1, 0);
     343                }
     344                render();
     345                updateDots();
     346            }
     347
     348            function startAutoplay() {
     349                if (!doAutoplay) return;
     350                stopAutoplay();
     351                autoplayTimer = setInterval(next, autoplaySpeed);
     352            }
     353
     354            function stopAutoplay() {
     355                if (autoplayTimer) {
     356                    clearInterval(autoplayTimer);
     357                    autoplayTimer = null;
     358                }
     359            }
     360
     361            function resetAutoplay() {
     362                if (!doAutoplay) return;
     363                stopAutoplay();
     364                startAutoplay();
     365            }
     366
     367            /* ── Arrow clicks ─────────────────────────── */
     368            $el.find('.nfa-ncards__arrow--prev').on('click', function () {
     369                prev();
     370                resetAutoplay();
     371            });
     372
     373            $el.find('.nfa-ncards__arrow--next').on('click', function () {
     374                next();
     375                resetAutoplay();
     376            });
     377
     378            /* ── Mouse / Touch Drag ───────────────────── */
     379            if (enableDrag) {
     380                let dragStartX  = 0;
     381                let dragDelta   = 0;
     382                let isDragging  = false;
     383                let startTransX = 0;
     384                const threshold = 40; // px to trigger slide change
     385
     386                function getTranslateX() {
     387                    const st = window.getComputedStyle(track);
     388                    const mx = new DOMMatrix(st.transform);
     389                    return mx.m41;
     390                }
     391
     392                function onDragStart(e) {
     393                    isDragging  = true;
     394                    dragStartX  = e.type.includes('touch') ? e.touches[0].clientX : e.clientX;
     395                    startTransX = getTranslateX();
     396                    track.style.transition = 'none';
     397                    stopAutoplay();
     398                    $el.addClass('is-dragging');
     399                }
     400
     401                function onDragMove(e) {
     402                    if (!isDragging) return;
     403                    const clientX = e.type.includes('touch') ? e.touches[0].clientX : e.clientX;
     404                    dragDelta = clientX - dragStartX;
     405                    track.style.transform = 'translateX(' + (startTransX + dragDelta) + 'px)';
     406                }
     407
     408                function onDragEnd() {
     409                    if (!isDragging) return;
     410                    isDragging = false;
     411                    $el.removeClass('is-dragging');
     412                    track.style.transition = 'transform ' + transSpeed + 'ms cubic-bezier(0.25,0.46,0.45,0.94)';
     413
     414                    if (Math.abs(dragDelta) > threshold) {
     415                        if (dragDelta < 0) {
     416                            next();
     417                        } else {
     418                            prev();
     419                        }
     420                    } else {
     421                        render(); // snap back
     422                    }
     423                    dragDelta = 0;
     424                    resetAutoplay();
     425                }
     426
     427                // Mouse events
     428                track.addEventListener('mousedown', onDragStart);
     429                window.addEventListener('mousemove', onDragMove);
     430                window.addEventListener('mouseup', onDragEnd);
     431
     432                // Touch events
     433                track.addEventListener('touchstart', onDragStart, { passive: true });
     434                track.addEventListener('touchmove', onDragMove, { passive: true });
     435                track.addEventListener('touchend', onDragEnd);
     436
     437                // Prevent image dragging
     438                $(track).find('img').on('dragstart', function (e) { e.preventDefault(); });
     439
     440                // Prevent click on links after drag
     441                $(track).on('click', 'a', function (e) {
     442                    if (Math.abs(dragDelta) > 5) {
     443                        e.preventDefault();
     444                    }
     445                });
     446            }
     447
     448            if (pauseOnHover && doAutoplay) {
     449                $el.on('mouseenter', stopAutoplay);
     450                $el.on('mouseleave', startAutoplay);
     451            }
     452
     453            let resizeTimer;
     454            $(window).on('resize.nfaNumberedCards', function () {
     455                clearTimeout(resizeTimer);
     456                resizeTimer = setTimeout(function () {
     457                    pos = Math.min(pos, getMaxPos());
     458                    render();
     459                    buildDots();
     460                }, 150);
     461            });
     462
     463            render();
     464            buildDots();
    234465            startAutoplay();
    235466        });
     
    8151046        elementorFrontend.hooks.addAction('frontend/element_ready/nfa-logo-grid.default', initSlider);
    8161047        elementorFrontend.hooks.addAction('frontend/element_ready/nfa-showcase-carousel.default', initShowcaseCarousel);
     1048        elementorFrontend.hooks.addAction('frontend/element_ready/nfa-numbered-cards.default', initNumberedCards);
    8171049        elementorFrontend.hooks.addAction('frontend/element_ready/nfa-content-tabs.default', initContentTabs);
    8181050        elementorFrontend.hooks.addAction('frontend/element_ready/nfa-image-comparison.default', initImageComparison);
  • nebula-forge-addons-for-elementor/trunk/assets/js/frontend.min.js

    r3462588 r3463192  
    1 !function(e){"use strict";const t=t=>{t.find(".nfa-slider").each(function(){const t=e(this),n=t.find(".nfa-slider__track").get(0);if(!n)return;const a=Math.max(1,Math.min(6,parseInt(t.data("slider-per-view"),10)||3)),o=Math.max(0,parseInt(t.data("slider-gap"),10)||20),i=Array.from(n.children),r=()=>{n.style.gap=o+"px";const e="calc((100% - "+o*(a-1)+"px) / "+a+")";i.forEach(t=>{t.style.flex="0 0 "+e})};if(r(),t.data("slider-bound"))return;let s;t.data("slider-bound",!0),e(window).on("resize.nfaSlider",()=>{clearTimeout(s),s=setTimeout(r,150)}),t.find(".nfa-slider__btn--prev").on("click",()=>{n.scrollBy({left:-n.clientWidth,behavior:"smooth"})}),t.find(".nfa-slider__btn--next").on("click",()=>{n.scrollBy({left:n.clientWidth,behavior:"smooth"})})})},n=t=>{const n=t.find(".nfa-showcase");n.length&&n.each(function(){const t=e(this),n=t.find(".nfa-showcase__track").get(0),a=t.find(".nfa-showcase__dots"),o=Array.from(n.children),i=o.length;if(!n||0===i)return;if(t.data("showcase-bound"))return;t.data("showcase-bound",!0);const r=Math.max(1,parseInt(t.data("per-view"),10)||3),s=Math.max(1,parseInt(t.data("per-view-tablet"),10)||2),d=Math.max(1,parseInt(t.data("per-view-mobile"),10)||1),f=Math.max(0,parseInt(t.data("gap"),10)||20),l="yes"===t.data("autoplay"),c=Math.max(1e3,parseInt(t.data("autoplay-speed"),10)||4e3),u="yes"===t.data("pause-on-hover");let m,h=0,p=null;function _(){const e=window.innerWidth;return e<=767?d:e<=1024?s:r}function b(){return Math.max(0,i-_())}function g(){const t=_(),i="calc((100% - "+f*(t-1)+"px) / "+t+")";if(o.forEach(function(e){e.style.flex="0 0 "+i}),o[0]){const e=o[0].getBoundingClientRect().width+f;n.style.transform="translateX(-"+h*e+"px)"}!function(){if(!a.length)return;const t=b()+1;if(a.children().length!==t){a.empty();for(var n=0;n<t;n++)a.append('<button class="nfa-showcase__dot" data-index="'+n+'" aria-label="Slide '+(n+1)+'"></button>');a.find(".nfa-showcase__dot").on("click",function(){h=parseInt(e(this).data("index"),10),h=Math.min(h,b()),g(),y()})}a.find(".nfa-showcase__dot").removeClass("nfa-showcase__dot--active"),a.find(".nfa-showcase__dot").eq(h).addClass("nfa-showcase__dot--active")}()}function v(){h=h>=b()?0:h+1,g()}function w(){l&&(k(),p=setInterval(v,c))}function k(){p&&(clearInterval(p),p=null)}function y(){l&&(k(),w())}t.find(".nfa-showcase__arrow--prev").on("click",function(){h=h<=0?b():h-1,g(),y()}),t.find(".nfa-showcase__arrow--next").on("click",function(){v(),y()}),u&&l&&(t.on("mouseenter",k),t.on("mouseleave",w)),e(window).on("resize.nfaShowcaseCarousel",function(){clearTimeout(m),m=setTimeout(function(){h=Math.min(h,b()),g()},150)}),g(),w()})},a=t=>{const n=t.find("[data-tabs]");n.length&&n.each(function(){const t=e(this);if(t.data("tabs-bound"))return;t.data("tabs-bound",!0);const n=t.find(".nfa-tabs__btn"),a=t.find(".nfa-tabs__panel");n.on("click",function(){const o=e(this),i=o.attr("aria-controls");n.removeClass("nfa-tabs__btn--active").attr("aria-selected","false"),o.addClass("nfa-tabs__btn--active").attr("aria-selected","true"),a.removeClass("nfa-tabs__panel--active").attr("hidden",!0),t.find("#"+i).addClass("nfa-tabs__panel--active").removeAttr("hidden")})})},o=t=>{const n=t.find("[data-compare]");n.length&&n.each(function(){const t=this,n=e(t);if(n.data("compare-bound"))return;n.data("compare-bound",!0);const a="horizontal"===(n.data("orientation")||"horizontal"),o=n.find(".nfa-compare__before"),i=n.find(".nfa-compare__slider");let r=!1;function s(e){e=Math.max(0,Math.min(100,e)),a?(o.css("clip-path","inset(0 "+(100-e)+"% 0 0)"),i.css("left",e+"%")):(o.css("clip-path","inset(0 0 "+(100-e)+"% 0)"),i.css("top",e+"%"))}function d(e){const n=t.getBoundingClientRect(),o=e.touches?e.touches[0].clientX:e.clientX,i=e.touches?e.touches[0].clientY:e.clientY;return a?(o-n.left)/n.width*100:(i-n.top)/n.height*100}function f(e){r&&(e.preventDefault(),s(d(e)))}function l(){r=!1,e(document).off("mousemove.nfaCompare touchmove.nfaCompare"),e(document).off("mouseup.nfaCompare touchend.nfaCompare")}n.on("mousedown touchstart",function(t){r=!0,s(d(t)),e(document).on("mousemove.nfaCompare touchmove.nfaCompare",f),e(document).on("mouseup.nfaCompare touchend.nfaCompare",l)})})},i=t=>{const n=t.find("[data-countdown]");n.length&&n.each(function(){const t=e(this);if(t.data("countdown-bound"))return;t.data("countdown-bound",!0);const n=new Date(t.data("target")).getTime(),a=t.data("expiry")||{},o=(t.data("units")||"days,hours,minutes,seconds").split(","),i=2*Math.PI*44;function r(){const e=Date.now(),r=Math.max(0,n-e);if(r<=0)return void function(){clearInterval(s);const e=a.action||"none";"message"===e?(t.find(".nfa-countdown__block, .nfa-countdown__sep").hide(),t.find(".nfa-countdown__expiry").show()):"hide"===e?t.hide():"redirect"===e&&a.redirect&&(window.location.href=a.redirect)}();const d=Math.floor(r/1e3),f={days:Math.floor(d/86400),hours:Math.floor(d%86400/3600),minutes:Math.floor(d%3600/60),seconds:d%60};o.forEach(function(e){t.find('[data-digit="'+e+'"]').text(String(f[e]).padStart(2,"0"));const n=t.find('[data-unit="'+e+'"] .nfa-countdown__progress');if(n.length){const t=parseInt(n.data("max"),10)||60,a=i*(1-f[e]/t);n.attr("stroke-dashoffset",a)}})}r();const s=setInterval(r,1e3)})},r=()=>{document.querySelectorAll("[data-nfa-tooltip]").forEach(e=>{if(e._nfaTooltipBound)return;e._nfaTooltipBound=!0;const t=e.getAttribute("data-nfa-tooltip"),n=e.getAttribute("data-nfa-tooltip-pos")||"top",a=e.getAttribute("data-nfa-tooltip-trigger")||"hover",o="0"!==e.getAttribute("data-nfa-tooltip-arrow"),i=parseInt(e.getAttribute("data-nfa-tooltip-duration"),10)||250,r=document.createElement("div");function s(){!function(){const t=e.getBoundingClientRect(),a=r.getBoundingClientRect(),o=window.pageYOffset||document.documentElement.scrollTop,i=window.pageXOffset||document.documentElement.scrollLeft;let s,d;switch(n){case"bottom":s=t.bottom+o+8,d=t.left+i+t.width/2-a.width/2;break;case"left":s=t.top+o+t.height/2-a.height/2,d=t.left+i-a.width-8;break;case"right":s=t.top+o+t.height/2-a.height/2,d=t.right+i+8;break;default:s=t.top+o-a.height-8,d=t.left+i+t.width/2-a.width/2}r.style.top=s+"px",r.style.left=d+"px"}(),r.classList.add("nfa-tooltip--visible")}function d(){r.classList.remove("nfa-tooltip--visible")}r.className="nfa-tooltip nfa-tooltip--"+n,o||r.classList.add("nfa-tooltip--no-arrow"),r.textContent=t,r.style.transitionDuration=i+"ms",r.setAttribute("role","tooltip"),r.id="nfa-tooltip-"+Math.random().toString(36).substr(2,9),e.setAttribute("aria-describedby",r.id),e.style.position=e.style.position||"relative",document.body.appendChild(r),"click"===a?(e.addEventListener("click",e=>{e.preventDefault(),r.classList.contains("nfa-tooltip--visible")?d():s()}),document.addEventListener("click",t=>{e.contains(t.target)||r.contains(t.target)||d()})):(e.addEventListener("mouseenter",s),e.addEventListener("mouseleave",d),e.addEventListener("focusin",s),e.addEventListener("focusout",d))})},s=t=>{t.find(".nfa-hamburger").each(function(){const t=e(this);if(t.data("nfa-hm-bound"))return;t.data("nfa-hm-bound",!0);const n=t.find(".nfa-hamburger__toggle"),a=t.find(".nfa-hamburger__panel"),o=t.find(".nfa-hamburger__overlay"),i=t.find(".nfa-hamburger__close"),r=1===t.data("close-on-link")||"1"===t.data("close-on-link"),s=1===t.data("close-on-esc")||"1"===t.data("close-on-esc");function d(){t.removeClass("nfa-hamburger--open"),n.attr("aria-expanded","false"),a.attr("aria-hidden","true"),n.focus()}n.on("click",function(e){e.preventDefault(),t.hasClass("nfa-hamburger--open")?d():(t.addClass("nfa-hamburger--open"),n.attr("aria-expanded","true"),a.attr("aria-hidden","false"),a.find("a, button").first().focus())}),i.on("click",d),o.on("click",d),s&&e(document).on("keydown",function(e){"Escape"===e.key&&t.hasClass("nfa-hamburger--open")&&d()}),r&&a.on("click",".nfa-hamburger__link, .nfa-hamburger__sub-link",function(){const t=e(this).attr("href");t&&"#"!==t&&d()}),t.find(".nfa-hamburger__item--has-sub > .nfa-hamburger__link").on("click",function(t){"#"===e(this).attr("href")&&t.preventDefault(),e(this).parent().toggleClass("nfa-hamburger__item--sub-open")})})},d=t=>{t.find(".nfa-form").each(function(){const t=e(this);if(t.data("nfa-form-bound"))return;t.data("nfa-form-bound",!0);const n=t.data("nfa-form");if(!n)return;const a=t.find(".nfa-form__el"),o=t.find(".nfa-form__submit"),i=t.find(".nfa-form__submit-text"),r=t.find(".nfa-form__spinner"),s=t.find(".nfa-form__msg");function d(t){const o=e(t),i=o.closest(".nfa-form__col").find(".nfa-form__field-error");let r=!0,s="";if(t.required)if("checkbox"===t.type){const e=t.name;a.find('input[name="'+e+'"]:checked').length||(r=!1,s=n.requiredMsg||"This field is required.")}else t.value.trim()||(r=!1,s=n.requiredMsg||"This field is required.");if(r&&t.value.trim()&&("email"!==t.type||/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(t.value)||(r=!1,s="Please enter a valid email address."),"url"!==t.type||/^https?:\/\/.+/.test(t.value)||(r=!1,s="Please enter a valid URL."),"tel"!==t.type||/^[\d\s+\-().]+$/.test(t.value)||(r=!1,s="Please enter a valid phone number."),"file"===t.type)){const e=parseFloat(o.data("max-size")||5);t.files[0]&&t.files[0].size>1024*e*1024&&(r=!1,s="File exceeds "+e+"MB limit.")}return r?(o.removeClass("nfa-form__input--invalid nfa-form__select--invalid nfa-form__textarea--invalid"),i.text("")):(o.addClass("nfa-form__input--invalid nfa-form__select--invalid nfa-form__textarea--invalid"),i.text(s)),r}a.find("input, textarea, select").on("blur change",function(){d(this)}),a.on("submit",function(t){t.preventDefault();let f=!0;if(a.find("input[required], textarea[required], select[required]").each(function(){d(this)||(f=!1)}),!f)return void a.find(".nfa-form__input--invalid, .nfa-form__select--invalid, .nfa-form__textarea--invalid").first().focus();const l=[],c={};a.find("[data-label]").each(function(){const t=e(this),n=t.data("label"),o=t.attr("type")||this.tagName.toLowerCase();if("checkbox"!==o){if("radio"!==o)"file"!==o?l.push({label:n,value:t.val()||""}):l.push({label:n,value:this.files[0]?this.files[0].name:""});else if(!c[n]){c[n]=!0;const e=a.find('input[data-label="'+n+'"]:checked').val()||"";l.push({label:n,value:e})}}else if(!c[n]){c[n]=!0;const t=[];a.find('input[data-label="'+n+'"]:checked').each(function(){t.push(e(this).val())}),l.push({label:n,value:t})}}),o.prop("disabled",!0),i.css("opacity","0.5"),r.show(),s.hide(),e.ajax({url:n.ajaxUrl,type:"POST",data:{action:"nfa_form_submit",nonce:n.nonce,form_name:n.formName,action_save:n.actionSave?"1":"",action_email:n.actionEmail?"1":"",email_to:n.emailTo,email_subject:n.emailSubject,email_from_name:n.emailFromName,email_reply_to:n.emailReplyTo,page_url:window.location.href,fields:JSON.stringify(l)},success:function(e){o.prop("disabled",!1),i.css("opacity","1"),r.hide(),e.success?(s.removeClass("nfa-form__msg--error").addClass("nfa-form__msg--success").text(n.successMessage||e.data.message).show(),a[0].reset(),a.find(".nfa-form__field-error").text(""),n.actionRedirect&&n.redirectUrl&&setTimeout(function(){window.location.href=n.redirectUrl},1e3)):s.removeClass("nfa-form__msg--success").addClass("nfa-form__msg--error").text(n.errorMessage||e.data.message||"Error").show()},error:function(){o.prop("disabled",!1),i.css("opacity","1"),r.hide(),s.removeClass("nfa-form__msg--success").addClass("nfa-form__msg--error").text(n.errorMessage||"Network error. Please try again.").show()}})})})};e(window).on("elementor/frontend/init",()=>{window.elementorFrontend&&elementorFrontend.hooks&&(elementorFrontend.hooks.addAction("frontend/element_ready/nfa-testimonial-grid.default",t),elementorFrontend.hooks.addAction("frontend/element_ready/nfa-logo-grid.default",t),elementorFrontend.hooks.addAction("frontend/element_ready/nfa-showcase-carousel.default",n),elementorFrontend.hooks.addAction("frontend/element_ready/nfa-content-tabs.default",a),elementorFrontend.hooks.addAction("frontend/element_ready/nfa-image-comparison.default",o),elementorFrontend.hooks.addAction("frontend/element_ready/nfa-countdown-timer.default",i),elementorFrontend.hooks.addAction("frontend/element_ready/nfa-hamburger-menu.default",s),elementorFrontend.hooks.addAction("frontend/element_ready/nfa-advanced-form.default",d),elementorFrontend.hooks.addAction("frontend/element_ready/global",()=>{r(),document.querySelectorAll("[data-nfa-wrapper-link]").forEach(e=>{if(e._nfaWrapperLinkBound)return;e._nfaWrapperLinkBound=!0;const t=e.getAttribute("data-nfa-wrapper-link"),n="1"===e.getAttribute("data-nfa-link-external"),a="1"===e.getAttribute("data-nfa-link-nofollow");t&&(e.addEventListener("click",e=>{const o=e.target.tagName.toLowerCase();if("a"!==o&&"button"!==o&&"input"!==o&&"textarea"!==o&&"select"!==o)if(n){const e=window.open(t,"_blank");e&&a&&(e.opener=null)}else window.location.href=t}),e.addEventListener("keydown",t=>{"Enter"===t.key&&e.click()}))})}))})}(jQuery);
     1(function ($) { 'use strict'; const initSlider = (scope) => { const $sliders = scope.find('.nfa-slider'); $sliders.each(function () { const $slider = $(this); const track = $slider.find('.nfa-slider__track').get(0); if (!track) { return; } const perView = Math.max(1, Math.min(6, parseInt($slider.data('slider-per-view'), 10) || 3)); const gap = Math.max(0, parseInt($slider.data('slider-gap'), 10) || 20); const items = Array.from(track.children); const updateSizes = () => { track.style.gap = gap + 'px'; const width = 'calc((100% - ' + (gap * (perView - 1)) + 'px) / ' + perView + ')'; items.forEach((item) => { item.style.flex = '0 0 ' + width; }); }; updateSizes(); if ($slider.data('slider-bound')) { return; } $slider.data('slider-bound', true); let resizeTimer; $(window).on('resize.nfaSlider', () => { clearTimeout(resizeTimer); resizeTimer = setTimeout(updateSizes, 150); }); $slider.find('.nfa-slider__btn--prev').on('click', () => { track.scrollBy({ left: -track.clientWidth, behavior: 'smooth' }); }); $slider.find('.nfa-slider__btn--next').on('click', () => { track.scrollBy({ left: track.clientWidth, behavior: 'smooth' }); }); }); }; const initShowcaseCarousel = (scope) => { const $carousel = scope.find('.nfa-showcase'); if (!$carousel.length) { return; } $carousel.each(function () { const $el = $(this); const track = $el.find('.nfa-showcase__track').get(0); const $dotsWrap = $el.find('.nfa-showcase__dots'); const cards = Array.from(track.children); const totalSlides = cards.length; if (!track || totalSlides === 0) { return; } if ($el.data('showcase-bound')) { return; } $el.data('showcase-bound', true); const perViewDesktop = Math.max(1, parseInt($el.data('per-view'), 10) || 3); const perViewTablet = Math.max(1, parseInt($el.data('per-view-tablet'), 10) || 2); const perViewMobile = Math.max(1, parseInt($el.data('per-view-mobile'), 10) || 1); const gap = Math.max(0, parseInt($el.data('gap'), 10) || 20); const doAutoplay = $el.data('autoplay') === 'yes'; const autoplaySpeed = Math.max(1000, parseInt($el.data('autoplay-speed'), 10) || 4000); const pauseOnHover = $el.data('pause-on-hover') === 'yes'; let pos = 0; let autoplayTimer = null; function getPerView() { const w = window.innerWidth; if (w <= 767) return perViewMobile; if (w <= 1024) return perViewTablet; return perViewDesktop; } function getMaxPos() { return Math.max(0, totalSlides - getPerView()); } function render() { const pv = getPerView(); const cardWidth = 'calc((100% - ' + (gap * (pv - 1)) + 'px) / ' + pv + ')'; cards.forEach(function (card) { card.style.flex = '0 0 ' + cardWidth; }); if (cards[0]) { const rect = cards[0].getBoundingClientRect(); const cardPx = rect.width + gap; track.style.transform = 'translateX(-' + (pos * cardPx) + 'px)'; } updateDots(); } function updateDots() { if (!$dotsWrap.length) return; const maxPos = getMaxPos(); const dotCount = maxPos + 1; if ($dotsWrap.children().length !== dotCount) { $dotsWrap.empty(); for (var i = 0; i < dotCount; i++) { $dotsWrap.append('<button class="nfa-showcase__dot" data-index="' + i + '" aria-label="Slide ' + (i + 1) + '"></button>'); } $dotsWrap.find('.nfa-showcase__dot').on('click', function () { pos = parseInt($(this).data('index'), 10); pos = Math.min(pos, getMaxPos()); render(); resetAutoplay(); }); } $dotsWrap.find('.nfa-showcase__dot').removeClass('nfa-showcase__dot--active'); $dotsWrap.find('.nfa-showcase__dot').eq(pos).addClass('nfa-showcase__dot--active'); } function next() { pos = pos >= getMaxPos() ? 0 : pos + 1; render(); } function prev() { pos = pos <= 0 ? getMaxPos() : pos - 1; render(); } function startAutoplay() { if (!doAutoplay) return; stopAutoplay(); autoplayTimer = setInterval(next, autoplaySpeed); } function stopAutoplay() { if (autoplayTimer) { clearInterval(autoplayTimer); autoplayTimer = null; } } function resetAutoplay() { if (!doAutoplay) return; stopAutoplay(); startAutoplay(); } $el.find('.nfa-showcase__arrow--prev').on('click', function () { prev(); resetAutoplay(); }); $el.find('.nfa-showcase__arrow--next').on('click', function () { next(); resetAutoplay(); }); if (pauseOnHover && doAutoplay) { $el.on('mouseenter', stopAutoplay); $el.on('mouseleave', startAutoplay); } let resizeTimer; $(window).on('resize.nfaShowcaseCarousel', function () { clearTimeout(resizeTimer); resizeTimer = setTimeout(function () { pos = Math.min(pos, getMaxPos()); render(); }, 150); }); render(); startAutoplay(); }); }; const initNumberedCards = (scope) => { const $carousel = scope.find('.nfa-ncards--carousel'); if (!$carousel.length) return; $carousel.each(function () { const $el = $(this); const track = $el.find('.nfa-ncards__track').get(0); const cards = Array.from(track.children); const totalSlides = cards.length; if (!track || totalSlides === 0) return; if ($el.data('ncards-bound')) return; $el.data('ncards-bound', true); const perViewDesktop = Math.max(1, parseInt($el.data('per-view'), 10) || 3); const perViewTablet = Math.max(1, parseInt($el.data('per-view-tablet'), 10) || 2); const perViewMobile = Math.max(1, parseInt($el.data('per-view-mobile'), 10) || 1); const gap = Math.max(0, parseInt($el.data('gap'), 10) || 20); const doAutoplay = $el.data('autoplay') === 'yes'; const autoplaySpeed = Math.max(1000, parseInt($el.data('autoplay-speed'), 10) || 4000); const pauseOnHover = $el.data('pause-on-hover') === 'yes'; const enableDrag = $el.data('mouse-drag') === 'yes'; const infiniteLoop = $el.data('infinite') === 'yes'; const transSpeed = Math.max(100, parseInt($el.data('speed'), 10) || 450); const $dots = $el.find('.nfa-ncards__dots'); track.style.transition = 'transform ' + transSpeed + 'ms cubic-bezier(0.25,0.46,0.45,0.94)'; let pos = 0; let autoplayTimer = null; function getPerView() { const w = window.innerWidth; if (w <= 767) return perViewMobile; if (w <= 1024) return perViewTablet; return perViewDesktop; } function getMaxPos() { return Math.max(0, totalSlides - getPerView()); } /* ── Dots ─────────────────────────────────── */ function buildDots() { if (!$dots.length) return; $dots.empty(); const maxPos = getMaxPos(); for (let i = 0; i <= maxPos; i++) { const dot = document.createElement('button'); dot.className = 'nfa-ncards__dot' + (i === pos ? ' is-active' : ''); dot.setAttribute('aria-label', 'Go to slide ' + (i + 1)); dot.addEventListener('click', function () { pos = i; render(); updateDots(); resetAutoplay(); }); $dots.get(0).appendChild(dot); } } function updateDots() { if (!$dots.length) return; $dots.find('.nfa-ncards__dot').each(function (i) { $(this).toggleClass('is-active', i === pos); }); } function render() { const pv = getPerView(); const cardWidth = 'calc((100% - ' + (gap * (pv - 1)) + 'px) / ' + pv + ')'; cards.forEach(function (card) { card.style.flex = '0 0 ' + cardWidth; }); if (cards[0]) { const rect = cards[0].getBoundingClientRect(); const cardPx = rect.width + gap; track.style.transform = 'translateX(-' + (pos * cardPx) + 'px)'; } } function next() { if (infiniteLoop) { pos = pos >= getMaxPos() ? 0 : pos + 1; } else { pos = Math.min(pos + 1, getMaxPos()); } render(); updateDots(); } function prev() { if (infiniteLoop) { pos = pos <= 0 ? getMaxPos() : pos - 1; } else { pos = Math.max(pos - 1, 0); } render(); updateDots(); } function startAutoplay() { if (!doAutoplay) return; stopAutoplay(); autoplayTimer = setInterval(next, autoplaySpeed); } function stopAutoplay() { if (autoplayTimer) { clearInterval(autoplayTimer); autoplayTimer = null; } } function resetAutoplay() { if (!doAutoplay) return; stopAutoplay(); startAutoplay(); } /* ── Arrow clicks ─────────────────────────── */ $el.find('.nfa-ncards__arrow--prev').on('click', function () { prev(); resetAutoplay(); }); $el.find('.nfa-ncards__arrow--next').on('click', function () { next(); resetAutoplay(); }); /* ── Mouse / Touch Drag ───────────────────── */ if (enableDrag) { let dragStartX = 0; let dragDelta = 0; let isDragging = false; let startTransX = 0; const threshold = 40; function getTranslateX() { const st = window.getComputedStyle(track); const mx = new DOMMatrix(st.transform); return mx.m41; } function onDragStart(e) { isDragging = true; dragStartX = e.type.includes('touch') ? e.touches[0].clientX : e.clientX; startTransX = getTranslateX(); track.style.transition = 'none'; stopAutoplay(); $el.addClass('is-dragging'); } function onDragMove(e) { if (!isDragging) return; const clientX = e.type.includes('touch') ? e.touches[0].clientX : e.clientX; dragDelta = clientX - dragStartX; track.style.transform = 'translateX(' + (startTransX + dragDelta) + 'px)'; } function onDragEnd() { if (!isDragging) return; isDragging = false; $el.removeClass('is-dragging'); track.style.transition = 'transform ' + transSpeed + 'ms cubic-bezier(0.25,0.46,0.45,0.94)'; if (Math.abs(dragDelta) > threshold) { if (dragDelta < 0) { next(); } else { prev(); } } else { render(); } dragDelta = 0; resetAutoplay(); } track.addEventListener('mousedown', onDragStart); window.addEventListener('mousemove', onDragMove); window.addEventListener('mouseup', onDragEnd); track.addEventListener('touchstart', onDragStart, { passive: true }); track.addEventListener('touchmove', onDragMove, { passive: true }); track.addEventListener('touchend', onDragEnd); $(track).find('img').on('dragstart', function (e) { e.preventDefault(); }); $(track).on('click', 'a', function (e) { if (Math.abs(dragDelta) > 5) { e.preventDefault(); } }); } if (pauseOnHover && doAutoplay) { $el.on('mouseenter', stopAutoplay); $el.on('mouseleave', startAutoplay); } let resizeTimer; $(window).on('resize.nfaNumberedCards', function () { clearTimeout(resizeTimer); resizeTimer = setTimeout(function () { pos = Math.min(pos, getMaxPos()); render(); buildDots(); }, 150); }); render(); buildDots(); startAutoplay(); }); }; const initContentTabs = (scope) => { const $tabs = scope.find('[data-tabs]'); if (!$tabs.length) return; $tabs.each(function () { const $el = $(this); if ($el.data('tabs-bound')) return; $el.data('tabs-bound', true); const $buttons = $el.find('.nfa-tabs__btn'); const $panels = $el.find('.nfa-tabs__panel'); $buttons.on('click', function () { const $btn = $(this); const target = $btn.attr('aria-controls'); $buttons.removeClass('nfa-tabs__btn--active').attr('aria-selected', 'false'); $btn.addClass('nfa-tabs__btn--active').attr('aria-selected', 'true'); $panels.removeClass('nfa-tabs__panel--active').attr('hidden', true); $el.find('#' + target).addClass('nfa-tabs__panel--active').removeAttr('hidden'); }); }); }; const initImageComparison = (scope) => { const $compare = scope.find('[data-compare]'); if (!$compare.length) return; $compare.each(function () { const el = this; const $el = $(el); if ($el.data('compare-bound')) return; $el.data('compare-bound', true); const orientation = $el.data('orientation') || 'horizontal'; const isHoriz = orientation === 'horizontal'; const $before = $el.find('.nfa-compare__before'); const $slider = $el.find('.nfa-compare__slider'); let dragging = false; function setPosition(pct) { pct = Math.max(0, Math.min(100, pct)); if (isHoriz) { $before.css('clip-path', 'inset(0 ' + (100 - pct) + '% 0 0)'); $slider.css('left', pct + '%'); } else { $before.css('clip-path', 'inset(0 0 ' + (100 - pct) + '% 0)'); $slider.css('top', pct + '%'); } } function getPercent(e) { const rect = el.getBoundingClientRect(); const clientX = e.touches ? e.touches[0].clientX : e.clientX; const clientY = e.touches ? e.touches[0].clientY : e.clientY; if (isHoriz) { return ((clientX - rect.left) / rect.width) * 100; } return ((clientY - rect.top) / rect.height) * 100; } function onMove(e) { if (!dragging) return; e.preventDefault(); setPosition(getPercent(e)); } function onUp() { dragging = false; $(document).off('mousemove.nfaCompare touchmove.nfaCompare'); $(document).off('mouseup.nfaCompare touchend.nfaCompare'); } $el.on('mousedown touchstart', function (e) { dragging = true; setPosition(getPercent(e)); $(document).on('mousemove.nfaCompare touchmove.nfaCompare', onMove); $(document).on('mouseup.nfaCompare touchend.nfaCompare', onUp); }); }); }; const initCountdownTimer = (scope) => { const $countdown = scope.find('[data-countdown]'); if (!$countdown.length) return; $countdown.each(function () { const $el = $(this); if ($el.data('countdown-bound')) return; $el.data('countdown-bound', true); const targetDate = new Date($el.data('target')).getTime(); const expiry = $el.data('expiry') || {}; const units = ($el.data('units') || 'days,hours,minutes,seconds').split(','); const circumference = 2 * Math.PI * 44; function update() { const now = Date.now(); const diff = Math.max(0, targetDate - now); if (diff <= 0) { handleExpiry(); return; } const totalSec = Math.floor(diff / 1000); const vals = { days: Math.floor(totalSec / 86400), hours: Math.floor((totalSec % 86400) / 3600), minutes: Math.floor((totalSec % 3600) / 60), seconds: totalSec % 60, }; units.forEach(function (unit) { const $digit = $el.find('[data-digit="' + unit + '"]'); $digit.text(String(vals[unit]).padStart(2, '0')); const $progress = $el.find('[data-unit="' + unit + '"] .nfa-countdown__progress'); if ($progress.length) { const max = parseInt($progress.data('max'), 10) || 60; const fraction = vals[unit] / max; const offset = circumference * (1 - fraction); $progress.attr('stroke-dashoffset', offset); } }); } function handleExpiry() { clearInterval(timer); const action = expiry.action || 'none'; if (action === 'message') { $el.find('.nfa-countdown__block, .nfa-countdown__sep').hide(); $el.find('.nfa-countdown__expiry').show(); } else if (action === 'hide') { $el.hide(); } else if (action === 'redirect' && expiry.redirect) { window.location.href = expiry.redirect; } } update(); const timer = setInterval(update, 1000); }); }; const initTooltips = () => { document.querySelectorAll('[data-nfa-tooltip]').forEach((el) => { if (el._nfaTooltipBound) { return; } el._nfaTooltipBound = true; const text = el.getAttribute('data-nfa-tooltip'); const pos = el.getAttribute('data-nfa-tooltip-pos') || 'top'; const trigger = el.getAttribute('data-nfa-tooltip-trigger') || 'hover'; const showArrow = el.getAttribute('data-nfa-tooltip-arrow') !== '0'; const duration = parseInt(el.getAttribute('data-nfa-tooltip-duration'), 10) || 250; const tip = document.createElement('div'); tip.className = 'nfa-tooltip nfa-tooltip--' + pos; if (!showArrow) { tip.classList.add('nfa-tooltip--no-arrow'); } tip.textContent = text; tip.style.transitionDuration = duration + 'ms'; tip.setAttribute('role', 'tooltip'); tip.id = 'nfa-tooltip-' + Math.random().toString(36).substr(2, 9); el.setAttribute('aria-describedby', tip.id); el.style.position = el.style.position || 'relative'; document.body.appendChild(tip); function positionTip() { const rect = el.getBoundingClientRect(); const tipRect = tip.getBoundingClientRect(); const scrollY = window.pageYOffset || document.documentElement.scrollTop; const scrollX = window.pageXOffset || document.documentElement.scrollLeft; const gap = 8; let top, left; switch (pos) { case 'bottom': top = rect.bottom + scrollY + gap; left = rect.left + scrollX + (rect.width / 2) - (tipRect.width / 2); break; case 'left': top = rect.top + scrollY + (rect.height / 2) - (tipRect.height / 2); left = rect.left + scrollX - tipRect.width - gap; break; case 'right': top = rect.top + scrollY + (rect.height / 2) - (tipRect.height / 2); left = rect.right + scrollX + gap; break; default: top = rect.top + scrollY - tipRect.height - gap; left = rect.left + scrollX + (rect.width / 2) - (tipRect.width / 2); } tip.style.top = top + 'px'; tip.style.left = left + 'px'; } function showTip() { positionTip(); tip.classList.add('nfa-tooltip--visible'); } function hideTip() { tip.classList.remove('nfa-tooltip--visible'); } if (trigger === 'click') { el.addEventListener('click', (e) => { e.preventDefault(); if (tip.classList.contains('nfa-tooltip--visible')) { hideTip(); } else { showTip(); } }); document.addEventListener('click', (e) => { if (!el.contains(e.target) && !tip.contains(e.target)) { hideTip(); } }); } else { el.addEventListener('mouseenter', showTip); el.addEventListener('mouseleave', hideTip); el.addEventListener('focusin', showTip); el.addEventListener('focusout', hideTip); } }); }; const initWrapperLinks = () => { document.querySelectorAll('[data-nfa-wrapper-link]').forEach((el) => { if (el._nfaWrapperLinkBound) { return; } el._nfaWrapperLinkBound = true; const url = el.getAttribute('data-nfa-wrapper-link'); const isExternal = el.getAttribute('data-nfa-link-external') === '1'; const isNofollow = el.getAttribute('data-nfa-link-nofollow') === '1'; if (!url) { return; } el.addEventListener('click', (e) => { const tag = e.target.tagName.toLowerCase(); if (tag === 'a' || tag === 'button' || tag === 'input' || tag === 'textarea' || tag === 'select') { return; } if (isExternal) { const win = window.open(url, '_blank'); if (win && isNofollow) { win.opener = null; } } else { window.location.href = url; } }); el.addEventListener('keydown', (e) => { if (e.key === 'Enter') { el.click(); } }); }); }; const initHamburgerMenu = (scope) => { const $menus = scope.find('.nfa-hamburger'); $menus.each(function () { const $root = $(this); if ($root.data('nfa-hm-bound')) return; $root.data('nfa-hm-bound', true); const $toggle = $root.find('.nfa-hamburger__toggle'); const $panel = $root.find('.nfa-hamburger__panel'); const $overlay = $root.find('.nfa-hamburger__overlay'); const $close = $root.find('.nfa-hamburger__close'); const closeOnLink = $root.data('close-on-link') === 1 || $root.data('close-on-link') === '1'; const closeOnEsc = $root.data('close-on-esc') === 1 || $root.data('close-on-esc') === '1'; function open() { $root.addClass('nfa-hamburger--open'); $toggle.attr('aria-expanded', 'true'); $panel.attr('aria-hidden', 'false'); $panel.find('a, button').first().focus(); } function close() { $root.removeClass('nfa-hamburger--open'); $toggle.attr('aria-expanded', 'false'); $panel.attr('aria-hidden', 'true'); $toggle.focus(); } $toggle.on('click', function (e) { e.preventDefault(); if ($root.hasClass('nfa-hamburger--open')) { close(); } else { open(); } }); $close.on('click', close); $overlay.on('click', close); if (closeOnEsc) { $(document).on('keydown', function (e) { if (e.key === 'Escape' && $root.hasClass('nfa-hamburger--open')) { close(); } }); } if (closeOnLink) { $panel.on('click', '.nfa-hamburger__link, .nfa-hamburger__sub-link', function () { const href = $(this).attr('href'); if (href && href !== '#') { close(); } }); } $root.find('.nfa-hamburger__item--has-sub > .nfa-hamburger__link').on('click', function (e) { if ($(this).attr('href') === '#') { e.preventDefault(); } $(this).parent().toggleClass('nfa-hamburger__item--sub-open'); }); }); }; const initAdvancedForm = (scope) => { const $forms = scope.find('.nfa-form'); $forms.each(function () { const $root = $(this); if ($root.data('nfa-form-bound')) return; $root.data('nfa-form-bound', true); const config = $root.data('nfa-form'); if (!config) return; const $form = $root.find('.nfa-form__el'); const $submit = $root.find('.nfa-form__submit'); const $text = $root.find('.nfa-form__submit-text'); const $spin = $root.find('.nfa-form__spinner'); const $msg = $root.find('.nfa-form__msg'); function validateField(el) { const $el = $(el); const $err = $el.closest('.nfa-form__col').find('.nfa-form__field-error'); let valid = true; let errMsg = ''; if (el.required) { if (el.type === 'checkbox') { const name = el.name; const checked = $form.find('input[name="' + name + '"]:checked').length; if (!checked) { valid = false; errMsg = config.requiredMsg || 'This field is required.'; } } else if (!el.value.trim()) { valid = false; errMsg = config.requiredMsg || 'This field is required.'; } } if (valid && el.value.trim()) { if (el.type === 'email' && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(el.value)) { valid = false; errMsg = 'Please enter a valid email address.'; } if (el.type === 'url' && !/^https?:\/\/.+/.test(el.value)) { valid = false; errMsg = 'Please enter a valid URL.'; } if (el.type === 'tel' && !/^[\d\s+\-().]+$/.test(el.value)) { valid = false; errMsg = 'Please enter a valid phone number.'; } if (el.type === 'file') { const maxMB = parseFloat($el.data('max-size') || 5); if (el.files[0] && el.files[0].size > maxMB * 1024 * 1024) { valid = false; errMsg = 'File exceeds ' + maxMB + 'MB limit.'; } } } if (!valid) { $el.addClass('nfa-form__input--invalid nfa-form__select--invalid nfa-form__textarea--invalid'); $err.text(errMsg); } else { $el.removeClass('nfa-form__input--invalid nfa-form__select--invalid nfa-form__textarea--invalid'); $err.text(''); } return valid; } $form.find('input, textarea, select').on('blur change', function () { validateField(this); }); $form.on('submit', function (e) { e.preventDefault(); let allValid = true; $form.find('input[required], textarea[required], select[required]').each(function () { if (!validateField(this)) { allValid = false; } }); if (!allValid) { $form.find('.nfa-form__input--invalid, .nfa-form__select--invalid, .nfa-form__textarea--invalid').first().focus(); return; } const fields = []; const seen = {}; $form.find('[data-label]').each(function () { const $el = $(this); const label = $el.data('label'); const type = $el.attr('type') || this.tagName.toLowerCase(); if (type === 'checkbox') { if (!seen[label]) { seen[label] = true; const vals = []; $form.find('input[data-label="' + label + '"]:checked').each(function () { vals.push($(this).val()); }); fields.push({ label: label, value: vals }); } return; } if (type === 'radio') { if (!seen[label]) { seen[label] = true; const val = $form.find('input[data-label="' + label + '"]:checked').val() || ''; fields.push({ label: label, value: val }); } return; } if (type === 'file') { fields.push({ label: label, value: this.files[0] ? this.files[0].name : '' }); return; } fields.push({ label: label, value: $el.val() || '' }); }); $submit.prop('disabled', true); $text.css('opacity', '0.5'); $spin.show(); $msg.hide(); $.ajax({ url: config.ajaxUrl, type: 'POST', data: { action: 'nfa_form_submit', nonce: config.nonce, form_name: config.formName, action_save: config.actionSave ? '1' : '', action_email: config.actionEmail ? '1' : '', email_to: config.emailTo, email_subject: config.emailSubject, email_from_name: config.emailFromName, email_reply_to: config.emailReplyTo, page_url: window.location.href, fields: JSON.stringify(fields), }, success: function (resp) { $submit.prop('disabled', false); $text.css('opacity', '1'); $spin.hide(); if (resp.success) { $msg.removeClass('nfa-form__msg--error').addClass('nfa-form__msg--success') .text(config.successMessage || resp.data.message).show(); $form[0].reset(); $form.find('.nfa-form__field-error').text(''); if (config.actionRedirect && config.redirectUrl) { setTimeout(function () { window.location.href = config.redirectUrl; }, 1000); } } else { $msg.removeClass('nfa-form__msg--success').addClass('nfa-form__msg--error') .text(config.errorMessage || resp.data.message || 'Error').show(); } }, error: function () { $submit.prop('disabled', false); $text.css('opacity', '1'); $spin.hide(); $msg.removeClass('nfa-form__msg--success').addClass('nfa-form__msg--error') .text(config.errorMessage || 'Network error. Please try again.').show(); }, }); }); }); }; $(window).on('elementor/frontend/init', () => { if (!window.elementorFrontend || !elementorFrontend.hooks) { return; } elementorFrontend.hooks.addAction('frontend/element_ready/nfa-testimonial-grid.default', initSlider); elementorFrontend.hooks.addAction('frontend/element_ready/nfa-logo-grid.default', initSlider); elementorFrontend.hooks.addAction('frontend/element_ready/nfa-showcase-carousel.default', initShowcaseCarousel); elementorFrontend.hooks.addAction('frontend/element_ready/nfa-numbered-cards.default', initNumberedCards); elementorFrontend.hooks.addAction('frontend/element_ready/nfa-content-tabs.default', initContentTabs); elementorFrontend.hooks.addAction('frontend/element_ready/nfa-image-comparison.default', initImageComparison); elementorFrontend.hooks.addAction('frontend/element_ready/nfa-countdown-timer.default', initCountdownTimer); elementorFrontend.hooks.addAction('frontend/element_ready/nfa-hamburger-menu.default', initHamburgerMenu); elementorFrontend.hooks.addAction('frontend/element_ready/nfa-advanced-form.default', initAdvancedForm); elementorFrontend.hooks.addAction('frontend/element_ready/global', () => { initTooltips(); initWrapperLinks(); }); }); })(jQuery);
  • nebula-forge-addons-for-elementor/trunk/includes/Admin/Admin_Manager.php

    r3462588 r3463192  
    189189
    190190        wp_enqueue_style(
     191            'nebula-forge-admin-inter',
     192            'https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap',
     193            [],
     194            null
     195        );
     196
     197        wp_enqueue_style(
    191198            'nebula-forge-admin',
    192199            NEBULA_FORGE_ADDON_URL . 'assets/css/admin.css',
    193             [],
     200            ['nebula-forge-admin-inter'],
    194201            NEBULA_FORGE_ADDON_VERSION
    195202        );
  • nebula-forge-addons-for-elementor/trunk/includes/Admin/Settings_Page.php

    r3462573 r3463192  
    219219
    220220                    <!-- Extensions Section -->
    221                     <div class="nf-card" style="margin-top: 32px;">
    222                         <h2 style="margin-top:0;">
    223                             <span class="dashicons dashicons-admin-plugins" style="margin-right:8px;"></span>
    224                             <?php esc_html_e('Pro Extensions', 'nebula-forge-addons-for-elementor'); ?>
    225                         </h2>
    226                         <p style="color:#64748b;margin-bottom:16px;">
    227                             <?php esc_html_e('Toggle professional extensions that add advanced capabilities to every Elementor element.', 'nebula-forge-addons-for-elementor'); ?>
    228                         </p>
    229                         <div class="nf-extensions-grid">
     221                    <h2 class="nf-extensions-title">
     222                        <span class="dashicons dashicons-admin-plugins"></span>
     223                        <?php esc_html_e('Pro Extensions', 'nebula-forge-addons-for-elementor'); ?>
     224                    </h2>
     225                    <p class="nf-extensions-desc" style="color:var(--nf-text-2);margin:0 0 4px;font-size:13px;">
     226                        <?php esc_html_e('Toggle professional extensions that add advanced capabilities to every Elementor element.', 'nebula-forge-addons-for-elementor'); ?>
     227                    </p>
     228                    <div class="nf-extensions-grid">
    230229                            <?php foreach ($extensions as $ext_key => $ext) : ?>
    231230                                <?php $is_ext_enabled = in_array($ext_key, $enabled_extensions, true); ?>
     
    247246                            <?php endforeach; ?>
    248247                        </div>
    249                     </div>
    250248
    251249                    <div class="nf-settings-footer">
  • nebula-forge-addons-for-elementor/trunk/includes/Admin/Submissions_Page.php

    r3462588 r3463192  
    143143            <div class="nf-admin-content">
    144144                <!-- Filter Bar -->
    145                 <form method="get" class="nf-toolbar" style="margin-bottom:16px;">
     145                <form method="get" class="nf-filter-bar">
    146146                    <input type="hidden" name="page" value="<?php echo esc_attr(Admin_Manager::MENU_SLUG_SUBMISSIONS); ?>">
     147                    <label><?php esc_html_e('Filter by form:', 'nebula-forge-addons-for-elementor'); ?></label>
    147148                    <div class="nf-toolbar__left">
    148                         <select name="form_name" style="min-width:180px;padding:6px 10px;">
     149                        <select name="form_name">
    149150                            <option value=""><?php esc_html_e('All Forms', 'nebula-forge-addons-for-elementor'); ?></option>
    150151                            <?php foreach ($form_names as $fn) : ?>
     
    164165                    <form method="post">
    165166                        <?php wp_nonce_field('nfa_submissions_action', 'nfa_sub_nonce'); ?>
    166                         <table class="widefat nf-submissions-table" style="border-radius:12px;overflow:hidden;">
     167                        <table class="widefat nf-submissions-table">
    167168                            <thead>
    168169                                <tr>
     
    217218                        </table>
    218219
    219                         <div class="nf-toolbar" style="margin-top:12px;">
     220                        <div class="nf-toolbar" style="margin-top:16px;">
    220221                            <div class="nf-toolbar__left">
    221222                                <button type="submit" name="nfa_bulk_action" value="delete" class="nf-button nf-button--outline nf-button--sm" style="color:#ef4444;" onclick="return confirm('<?php esc_attr_e('Delete selected submissions?', 'nebula-forge-addons-for-elementor'); ?>');">
     
    245246                    </form>
    246247                <?php else : ?>
    247                     <div class="nf-card" style="text-align:center;padding:48px;">
    248                         <span class="dashicons dashicons-email-alt" style="font-size:48px;color:#cbd5e1;margin-bottom:16px;"></span>
    249                         <h3><?php esc_html_e('No submissions yet', 'nebula-forge-addons-for-elementor'); ?></h3>
    250                         <p style="color:#64748b;"><?php esc_html_e('Form submissions will appear here once visitors start submitting your forms.', 'nebula-forge-addons-for-elementor'); ?></p>
     248                    <div class="nf-card" style="text-align:center;padding:56px 28px;">
     249                        <span class="dashicons dashicons-email-alt" style="font-size:52px;width:52px;height:52px;color:var(--nf-text-3);margin-bottom:16px;display:inline-block;"></span>
     250                        <h3 style="margin:0 0 8px;font-size:18px;font-weight:800;letter-spacing:-.3px;"><?php esc_html_e('No submissions yet', 'nebula-forge-addons-for-elementor'); ?></h3>
     251                        <p style="color:var(--nf-text-2);margin:0;font-size:14px;"><?php esc_html_e('Form submissions will appear here once visitors start submitting your forms.', 'nebula-forge-addons-for-elementor'); ?></p>
    251252                    </div>
    252253                <?php endif; ?>
     
    309310
    310311            <div class="nf-admin-content">
    311                 <div class="nf-card">
    312                     <h2 style="margin-top:0;">
    313                         <span class="dashicons dashicons-editor-table" style="margin-right:8px;"></span>
     312                <div class="nf-submission-detail">
     313                    <h2 class="nf-card__title">
     314                        <span class="dashicons dashicons-editor-table"></span>
    314315                        <?php esc_html_e('Form Data', 'nebula-forge-addons-for-elementor'); ?>
    315316                    </h2>
    316317                    <?php if (is_array($data) && !empty($data)) : ?>
    317                         <table class="widefat" style="border-radius:8px;overflow:hidden;">
     318                        <table class="widefat nf-submissions-table">
    318319                            <tbody>
    319320                                <?php foreach ($data as $i => $d) : ?>
    320                                     <tr class="<?php echo $i % 2 === 0 ? 'alternate' : ''; ?>">
    321                                         <td style="font-weight:600;width:200px;"><?php echo esc_html($d['label']); ?></td>
     321                                    <tr>
     322                                        <td style="font-weight:700;width:200px;"><?php echo esc_html($d['label']); ?></td>
    322323                                        <td><?php echo nl2br(esc_html($d['value'])); ?></td>
    323324                                    </tr>
     
    330331                </div>
    331332
    332                 <div class="nf-card" style="margin-top:16px;">
    333                     <h2 style="margin-top:0;">
    334                         <span class="dashicons dashicons-info-outline" style="margin-right:8px;"></span>
     333                <div class="nf-submission-detail" style="margin-top:18px;">
     334                    <h2 class="nf-card__title">
     335                        <span class="dashicons dashicons-info-outline"></span>
    335336                        <?php esc_html_e('Metadata', 'nebula-forge-addons-for-elementor'); ?>
    336337                    </h2>
    337                     <table class="widefat" style="border-radius:8px;overflow:hidden;">
     338                    <table class="widefat nf-submissions-table">
    338339                        <tbody>
    339340                            <tr>
  • nebula-forge-addons-for-elementor/trunk/includes/Admin/Widget_Registry.php

    r3462588 r3463192  
    220220                'icon'        => 'eicon-form-horizontal',
    221221            ],
     222            'numbered_cards' => [
     223                'label'       => __('Numbered Cards', 'nebula-forge-addons-for-elementor'),
     224                'description' => __('Numbered feature/process cards with Grid and Carousel layout modes, icons or images.', 'nebula-forge-addons-for-elementor'),
     225                'tooltip'     => __('Display services, features, or process steps as numbered cards in a grid or sliding carousel.', 'nebula-forge-addons-for-elementor'),
     226                'badge'       => __('CARDS', 'nebula-forge-addons-for-elementor'),
     227                'badge_color' => '#84cc16',
     228                'category'    => 'content',
     229                'class'       => Widgets\Numbered_Cards_Widget::class,
     230                'icon'        => 'eicon-number-field',
     231            ],
    222232        ];
    223233    }
  • nebula-forge-addons-for-elementor/trunk/includes/Widgets/Faq_Accordion_Widget.php

    r3462552 r3463192  
    9191            [
    9292                'label' => esc_html__('Answer', 'nebula-forge-addons-for-elementor'),
    93                 'type' => Controls_Manager::TEXTAREA,
     93                'type' => Controls_Manager::WYSIWYG,
    9494                'default' => esc_html__('No. All widgets are built for the free Elementor plugin.', 'nebula-forge-addons-for-elementor'),
    95                 'rows' => 3,
    9695            ]
    9796        );
     
    347346                            <?php if (!empty($item['answer'])) : ?>
    348347                                <div class="nfa-faq__answer">
    349                                     <?php echo esc_html($item['answer']); ?>
     348                                    <?php echo wp_kses_post($item['answer']); ?>
    350349                                </div>
    351350                            <?php endif; ?>
  • nebula-forge-addons-for-elementor/trunk/nebula-forge-addons-for-elementor.php

    r3462588 r3463192  
    44 * Plugin URI:        https://wordpress.org/plugins/nebula-forge-addons-for-elementor/
    55 * Description:       Professional Elementor widgets for any WordPress page — blogs, portfolios, landing pages, WooCommerce, and beyond.
    6  * Version:           0.7.0
     6 * Version:           0.8.0
    77 * Author:            Zainaster
    88 * Author URI:        https://profiles.wordpress.org/shoaibzain/
     
    2222}
    2323
    24 define('NEBULA_FORGE_ADDON_VERSION', '0.7.0');
     24define('NEBULA_FORGE_ADDON_VERSION', '0.8.0');
    2525define('NEBULA_FORGE_ADDON_FILE', __FILE__);
    2626define('NEBULA_FORGE_ADDON_BASENAME', plugin_basename(__FILE__));
  • nebula-forge-addons-for-elementor/trunk/readme.txt

    r3462588 r3463192  
    55Tested up to: 6.9.1
    66Requires PHP: 7.4
    7 Stable tag: 0.7.0
     7Stable tag: 0.8.0
    88Requires Plugins: elementor
    99License: GPLv2 or later
     
    128128
    129129== Changelog ==
     130= 0.8.0 =
     131* Added Numbered Cards widget with 3 layout modes: Grid, Steps, and Carousel.
     132* Grid layout: configurable columns, gap, card background, padding, border radius, border, and box shadow.
     133* Steps layout: icon badge circle, step label prefix, bold italic title, divider, accent border on hover (left/top/right/bottom/none), full typography and color controls.
     134* Carousel layout: slides per view (responsive), gap, arrows, dots, mouse/touch drag, infinite loop, transition speed, autoplay with pause on hover.
     135* Carousel arrow position: bottom-right/left/center, top-right/left/center, sides overlay.
     136* Redesigned admin UI with premium glassmorphism styling, animated background orbs, Inter font, and elevated cards.
     137* Changed FAQ widget answer field from textarea to WYSIWYG rich-text editor.
     138* Updated frontend CSS and JS with numbered cards styles, carousel logic, and drag support.
     139* Bumped total widget count from 19 to 20.
     140
    130141= 0.7.0 =
    131142* Added Hamburger Menu widget — off-canvas mobile navigation with slide panel (left/right/top), WP nav menu or custom items, submenu accordion, three icon styles, overlay, close on link/ESC, and full style controls.
Note: See TracChangeset for help on using the changeset viewer.