{"version":3,"file":"main.a9e75eb8fba37961090e.css","mappings":"AAOA,EACI,sBAGJ,wBACI,aACA,uHACA,+HAGJ,KACI,+MACA,eACA,oBAGJ,KACI,SACA,aCZU,CDaV,kBACA,gBAGJ,GACI,iBACA,cETU,CFUV,mBACA,kBEnBS,CFsBb,GACI,iBACA,gBEjBU,CFkBV,qBACA,iBE5BS,CF+Bb,GACI,cExBU,CFyBV,oBACA,iBElCS,CFmCT,iBAGJ,GACI,cE/BU,CFgCV,sBACA,iBEzCS,CF0CT,gBAGJ,KACI,iBE9CS,CF+CT,yBACA,WE/CS,CFkDb,OACI,cAGJ,gBACI,gBEjDU,CFkDV,aC7DU,CEFd,SACE,WACA,YACA,qBAGF,aACE,oBACA,WAGF,YACE,WACA,YACA,qBAGF,YACE,WACA,YACA,qBAGF,YACE,WACA,WACA,YACA,qBAOF,mBACE,aACA,mBACA,qBACE,cACA,iBACA,kBACA,oBACA,mBACA,2BACE,0BAKN,gCACE,aF5CY,CE6CZ,iBACA,kBACA,oBACA,mBAQF,gCAEE,WACA,YAEF,mBACE,iBACA,gBD/DW,CCiEb,oBACE,eDlEW,CCmEX,kBAGF,QACE,iBDvEW,CCwEX,aACA,mBACA,gBDnEY,CCoEZ,iBACA,YACA,kBAEA,uBACA,iBACA,YACA,iBACA,SAEA,oBACE,gBAGF,qBACE,gBACA,gBDrFU,CCsFV,iBACA,YAGF,sBACE,gBACA,gBD5FU,CC6FV,iBACA,YAGF,sBACE,uBAGF,cACE,eAGF,iBACE,wBFnEY,CEoEZ,yBACA,aF1HS,CE2HT,+CACE,wBFzEU,CE4Ed,mBACE,qBFlIO,CEmIP,aF5EY,CE6EZ,yBACA,mDACE,wBFjFU,CEkFV,oBFlFU,CEmFV,UFxIK,CE2IT,kBACE,aFrFY,CEsFZ,iDACE,wBFzFU,CE0FV,UF/IK,CEiJP,+BACE,0CAGJ,gBACE,UFtJO,CEuJP,wBFrIS,CEsIT,yBACA,sBACE,wBFtIO,CEuIP,UF3JK,CE8JT,0BACE,aF7IS,CE8IT,qBFhKO,CEiKP,yBACA,gCACE,wBF/IO,CEgJP,UFpKK,CEuKT,yBACE,aFtJS,CEuJT,+BACE,wBFtJO,CEuJP,UF3KK,CEgLP,0EAEE,WACA,YAEF,wCACE,gBD7KO,CC+KT,yCACE,eDhLO,CCqLT,oCACE,kBAEF,yCACE,OACA,iBDvLO,CCyLT,yCACE,QACA,kBD3LO,CC+LX,wCAEE,mBACA,oBF1MU,CE2MV,aFzMU,CE0MV,wBF5MU,CEoNd,qCAEI,gCACE,cACA,eAEF,iCACE,cACA,gBAUN,yBAEI,gCACE,cACA,eAEF,iCACE,cACA,gBASN,eACE,kBACA,mBACE,WACA,eACA,yBACE,YFvNQ,CE2NV,0BACE,YF5NQ,CEiOd,kBACE,aFlQY,CEmQZ,kBACA,SACA,yBACA,aACA,UACA,mDACA,qBACE,gBACA,mBACA,2CACE,aFrQO,CEwQX,wBACE,OAEF,yBACE,wBAIJ,kBACE,WACA,wBFhSY,CEiSZ,gBAMF,iBACE,4BACA,sBACA,uBACE,eACA,wBF5SU,CE8SZ,wBACE,wBFhTU,CEkTZ,qDACE,oBACA,iEACE,WAUJ,wBACE,yBACA,iBD1TS,CC2TT,YACA,WACA,aACA,QACA,mBACA,qBF1UO,CE2UP,oBFtUU,CEuUV,4BACE,WACA,YACA,eDrUO,CCuUT,8BACE,YACA,gBACA,iBD1UO,CC2UP,gBACA,YACA,eACA,YACA,wCACE,wBFxVK,CEyVL,aFtVM,CEwVR,4CACE,YACA,aAGJ,qCACE,oBFzTQ,CE0TR,iBACA,aACA,yCACE,gBAON,+BACE,oBF7VS,CE8VT,iBACA,aAIJ,aACE,kBACA,qBACA,eACA,4BACE,mBACA,wBFzXS,CE0XT,aFtXU,CEwXZ,mCACE,sBACA,yBACA,iBDvXS,CCwXT,gBACA,YACA,WACA,aACA,8BACA,UAEA,8DACE,cACA,mBACA,gBACA,uBAGF,qDACE,cAGJ,kCACE,kBACA,SACA,aACA,iBACA,gBACA,mDACA,sDACE,gBACA,wBF3ZO,CE4ZP,gCACA,eACA,2BACA,4DACE,wBF/ZM,CEkaV,kEACE,WACA,2BAEF,2DACE,iBACA,eACA,+EACE,kBDhaK,CCmaT,kEACE,OAEF,mEACE,QAIF,qDACE,4BACA,6BAEF,oDACE,cACA,UAKN,2BAEE,kBACA,kBACA,aACA,eACA,oIACE,aAEF,uCACE,eACA,gBACA,kBACA,oBAGF,+CACE,kBACA,MACA,OACA,YACA,WACA,gBACA,kBACA,+BACA,iBACA,oBFvdU,CE0dV,qGACE,wBF7dQ,CEieV,iIACE,wBF/dQ,CEkeZ,yDACE,mBACA,kIACE,aFteQ,CEyeZ,6DACE,oBAGA,2EACE,wBF5eQ,CE6eR,oBF5eQ,CE8eV,uFACE,cAMJ,6BACE,WACA,aACA,kBACA,WACA,QACA,UACA,YACA,kBACA,yBACA,gCACA,4BACA,wBAQJ,kBACI,wBACA,4BACA,kBACA,qBACA,6BACA,YACA,eACA,wBACE,aAEF,mDACE,wBFjfQ,CEmfV,4EACE,yDACA,qDACA,iDAEF,iCACE,mBACA,0DACE,oBACA,wBFriBM,CEuiBR,0DACE,wBF1iBK,CE4iBP,qCACE,aF1iBM,CE+iBd,yBACI,kBACA,MACA,OACA,QACA,SACA,wBFpjBU,CEqjBV,mBACA,uBACA,eACA,6BACE,YACA,WACA,YAEF,+BACE,oCAIN,yBACI,kBACA,WACA,YACA,WACA,SACA,WACA,sBACA,kBACA,uBACA,eAQF,sCACE,cAEF,wCACE,cACA,gBAEF,4CACE,aACA,0DACE,mBDjlBQ,CCqlBV,wDACE,cACA,kBDxlBQ,CC2lBZ,sCACE,aACA,oDACE,cACA,kBD/lBQ,CCqmBZ,wBACE,kBACA,MACA,OACA,YACA,WACA,kBACA,+BACA,yBACA,yDAIJ,mBACE,aACA,eACA,OD5nBW,CC6nBX,6CACE,mCACA,aACA,sBACA,qBF5oBO,CE6oBP,kBACA,yBACA,iBDroBS,CCsoBT,kBACA,YACA,gDACE,gBACA,eACA,kBACA,mDACE,mBAGJ,wDACE,eAEF,qDACE,aACA,8BACA,mBACA,wDACE,eAEF,wDACE,aACA,mBACA,OD5pBK,CC6pBL,kBD3pBK,CC4pBL,SACA,4DACE,WACA,YACA,YFxqBI,CEyqBJ,2FACE,eACA,YFpoBE,CEqoBF,iGACE,YF7nBE,CEmoBZ,oDACE,kBACA,uDACE,SACA,iBAEF,0DACE,gBD9qBM,CCirBV,0DACE,YACA,cD1rBO,CC2rBP,eD3rBO,CC4rBP,6BAEF,mDACE,cD9rBO,CC+rBP,eD/rBO,CCgsBP,6BACA,uDACE,aACA,8BACA,WACA,iBDtsBK,CCusBL,kEACE,gBAIN,iFACE,eACA,gDAEF,oDACE,gDACA,0FACE,oCAGJ,sDACE,WAQN,eACE,WACA,kBACA,oBACA,wBACE,kBACA,aACA,QACA,yBAEF,qCACE,YACA,WACA,YACA,kBAEF,wBACE,aACA,QAEF,qBACE,yBACA,iBACA,WAEE,mDACE,cAEF,sDACE,cAEF,yHAEE,SAEF,sDACE,kBAEF,qDACE,mBAGJ,2BACE,gBAEE,gFACE,2BAEF,+EACE,4BAGJ,gDACE,iBACA,wBF5xBM,CE6xBN,gBACA,0CACA,kDAEE,6DACE,aACA,8BACA,OD5xBC,CC8xBH,kEACE,WAEF,+DACE,wBFzyBE,CE0yBF,eACA,wEACE,WAIN,uDACE,wBFjzBI,CEkzBJ,4EACE,UAQF,8DACE,gBACA,mBACA,UAKF,+DACE,gCAKF,+EACE,wBACA,wBF30BE,CE40BF,2FACE,8BAEF,0FACE,+BAKR,gDACE,kBACA,sBACA,0DACE,wBF31BG,CE61BL,+DACE,kBACA,aF31BI,CE81BR,qJAEE,eACA,aF7zBM,CE8zBN,wBFt2BK,CEw2BP,qFACE,+BACA,cAKJ,uBACE,yBACA,mBACA,oBF/2BQ,CEg3BR,mCACE,sBAEF,kCACE,uBAGJ,4BACE,aACA,SACA,yBAKN,uGAGI,eAGJ,aACE,WACA,kBACA,kBACE,qBACA,YACA,aFv2BU,CEw2BV,sBACA,oBACA,yBACA,aACA,0BACA,wBACE,eACA,aF72BQ,CEq3Bd,qBACE,eACA,YACA,MACA,OACA,WACA,YACA,uBACA,uBACA,kBACA,mCACA,2BACE,aAEF,6BACE,aAIJ,eACE,kBACA,UACA,WACA,gBACA,iBACA,aACA,sBACA,qBF37BS,CE47BT,gBACA,cAEE,iCACE,YACA,iBACA,wBFx7BQ,CEy7BR,gCACA,eACA,UFr8BK,CEs8BL,gBACA,aACA,8BACA,SACA,wCACE,YACA,mBACA,qBF78BG,CE88BH,gCACA,aFr8BM,CEs8BN,iBACA,mBAGJ,oCACE,YACA,cAEF,kCACE,cDt8BQ,CCu8BR,cACA,gBAEF,kCACE,aACA,yBACA,2BACA,0CACE,gBDh9BM,CCo9BZ,qBACE,gBAUA,4BACE,YFt8BQ,CE+8Bd,sBACE,wBFx+BW,CEy+BX,UF7/BS,CE8/BT,gBACA,gBACA,iBDt/BW,CCu/BX,gBDh/BY,CCm/Bd,uBACE,kBACA,qBFtgCS,CEugCT,yBACA,yBACA,gDACA,0BACA,gBAEA,4BACE,YACA,SDpgCS,CCqgCT,sBACA,cACA,kBACA,MACA,OAGF,6BACE,oBFlhCU,CEmhCV,yDACE,wBFphCQ,CEuhCZ,gCACE,oBF7gCS,CE8gCT,4DACE,wBF/gCO,CEkhCX,qCACE,oBFt+BW,CEu+BX,iEACE,wBFx+BS,CE4+Bb,gCACE,aACA,+BACA,QDjiCS,CCkiCT,oCACE,gBAIJ,8BACE,eACA,kBACA,aACA,gBACA,kCACE,kBACA,UACA,YAEF,iDACE,UAEF,oCACE,aF5gCU,CEghCd,gCACE,cD3jCS,CC6jCT,aACA,yBAOJ,mBACE,UAHe,CAIf,WAJe,CAKf,kBACA,MACA,OACA,gBAGF,eACE,UACA,YACA,kBACA,eF7lCS,CE8lCT,yBAGF,mBACE,0BACA,4BACA,YACA,kBAGF,kBACE,4BACA,YACA,iBACA,SACA,UAGF,gBACE,UACA,YACA,kBACA,YACA,UACA,mBAGF,gBACE,0BACA,+BAGF,gBACE,aACA,oBAGF,gBACE,aACA,oBAOF,SACE,aACA,aFpoCY,CEqoCZ,wBACE,aACA,mBACA,QACA,WDxoCS,CCyoCT,8BACE,aF1mCQ,CE2mCR,eAEF,qCACE,YACA,WACA,cACA,cAEF,sCACE,mBAGJ,6BACE,mBACA,4CACE,gBD1pCO,CC2pCP,iIAEE,gCAIN,2BACE,sBACA,0CACE,qBDtqCO,CCuqCP,2BACA,iBDtqCO,CCuqCP,6HAEE,8BAIN,6DAEE,aFhpCU,CEupCd,iBACE,kBACA,aACA,mBAIE,uEACE,gBACA,uBACA,YAKF,kEACE,cAGF,8EACE,gBACA,kBACA,uBACA,qBACA,wBAGA,iGACE,aAKN,4CACE,OACA,YAGF,2CACE,kBACA,MACA,SACA,aACA,mBACA,uBACA,WDpuCS,CCquCT,gBACA,YACA,+BACA,aF3uCU,CE4uCV,eACA,WACA,wBAEA,oDACE,WACA,YAEA,mEACE,kBAIJ,iDACE,kBF9vCQ,CE+vCR,aFzvCQ,CE0vCR,oBF7vCQ,CEgwCV,kDACE,kBFnwCQ,CEswCV,iDACE,OACA,+BACA,iBAGF,kDACE,QACA,8BACA,kBAIJ,wCACE,kBACA,qBAEA,8CACE,kBACA,OACA,MACA,SAGF,+CACE,kBACA,QACA,MACA,SAIJ,oCACE,kBACA,qBACA,gBACA,yBACA,kBACA,sCACA,YACA,gBACA,gBAEA,0CACE,OAGF,2CACE,QAIJ,yCACE,aACA,mBACA,QACA,gBACA,aFzzCU,CE0zCV,qCAEA,sDACE,YACA,WACA,cACA,cAGF,uDACE,mBACA,gBACA,uBACA,YAGF,+CACE,kBFl1CQ,CEm1CR,aF3yCQ,CE4yCR,eAGF,iDACE,kBFx1CQ,CEy1CR,aFjzCQ,CEkzCR,eAGF,4DACE,aFvzCQ,CEwzCR,kBF9zCO,CEi0CT,qDACE,0BAGF,oDACE,0BAGF,oDACE,kBAQN,YACE,kBACA,YACA,mBACA,4BACA,mBACA,sBACA,WACA,iBACA,kBACA,UACA,oBACA,uBACA,+BAEE,oCACE,YACA,kBACA,QACA,WACA,gBACA,iBACA,mBACA,4DAIF,mCACE,YACA,kBACA,QACA,UACA,gBACA,iBACA,mBACA,4DAGJ,2BACE,2BACA,kCACE,YACA,kBACA,SACA,SACA,iBACA,iBACA,mBACA,4DAGJ,8BACE,2BACA,qCACE,YACA,kBACA,YACA,SACA,iBACA,iBACA,mBACA,4DAGJ,qBACE,UAGJ,sBACE,kBACA,sBACA,wCACE,UAIJ,YACE,qBACA,WACA,YACA,aF/7CY,CEg8CZ,mBACE,qBANJ,YAQE,uCACA,+CACA,gBACE,GACE,kCAGJ,wBACE,GACE,kCCp9CN,aACI,wBHES,CGCb,gBAEI,aHKU,CGDV,+FACI,aHDM,CGIV,kBACI,aHJM,CGOV,gCACI,aHXM,CGcV,uBACI,wBHpBK,CGuBT,qBACI,wBHvBM,CGwBN,oBHvBM,CG6BN,iCACI,qBHlCD,CGmCC,oBH9BE,CG+BF,aH/BE,CINd,YACI,wBJUU,CIPd,eACI,aJFS,CIOL,gDACI,oBJHE,CIOV,sBACI,wBJLM,CIQV,oBACI,wBJRM,CISN,oBJXM,CIcV,+BACI,aJlBM,CI2BN,iCACI,UJlCD,CImCC,uCAEI,UJrCL,CIwCH,gCACI,wBJhCE,CIiCF,oBJnCE,CIoCF,aJpCE,CI4CV,uCACI,wBJ3CM,CI4CN,oBJ1CM,CI2CN,6CACE,iBJvDC,CIgEH,2CACI,wBJxDE,CIyDF,aJ3DE,CI6DN,kDACI,wBJ5DE,CI6DF,oBJ/DE,CIiEN,iDACI,oBJhEE,CIkEN,gDACI,wBJnEE,CIoEF,oBJnEE,CIoEF,sDACI,wBJrEF,CI+EN,oDACI,+BACA,oBJpFE,CIuFF,iEACI,wBJvFF,CI2FF,+EACI,wBJ1FF,CI2FE,oBJ7FF,CIsGN,qCACE,aJrGI,CIuGN,wEACE,wBJxEI,CI2EJ,yEACE,wBJ7GE,CI+GJ,yEACE,wBJ/GE,CIiHJ,oDACE,aJrHE,CI0HV,wCACI,wBJ1HM,CI2HN,8CACE,oCAIN,wCACI,qBJzIG,CIiJL,uCACE,yBACA,yDAMI,qDACI,qBJ1JL,CI2JK,oBJlJF,CIoJF,2DACI,cAIJ,kEACI,wBJ3JF,CI+JF,gFACI,qBJxKL,CIiLP,sCACI,aJxKM,CIgLN,2EACI,YJpLE,CIqLF,gHACI,YJtJF,CIyJN,4DACI,wBJxLE,CIyLF,oBJxLE,CIyLF,uEACI,YJ7JF,CI+JF,kEACI,wBJ7LF,CI+LF,iFACI,oBJnKF,CIqKF,2EACI,wBJnMF,CIoME,oBJpMF,CIiNF,+DACE,wBJjNA,CImNE,8EACE,wBJrNJ,CIwNA,sEACE,wBJxNF,CI8NA,8FACE,wBJlOF,CIqOF,+DACE,wBJrOA,CIsOA,yEACE,wBJtOF,CIyOF,iFACE,aJ7MA,CI8MA,wBJ7OA,CIkPJ,sCACE,oBJnPE,CIyPN,iCACE,UJlQC,CImQD,wBJxPI,CIyPJ,yBACA,uCACE,aJ/NE,CIgOF,wBJ/PE,CKTd,8BACE,kBACA,YACA,aACA,OAEA,6DACE,OACA,kBACA,YACA,YAGF,8CACE,YACA,WACA,kBACA,aACA,sBACA,qBACA,uBAEF,8DACE,iBAGF,4CACE,eACA,OACA,SACA,QACA,yBACA,gBACA,4BACA,gEACA,aACA,sBACA,gBACA,2BACA,sBACA,UAEA,4DACE,aACA,sBACA,OACA,gBACA,UACA,oBACA,uBAGF,iDACE,gBACA,kBAGF,oEACE,UACA,aACA,gBACA,gCACA,gBACA,WAEA,0EACE,aAEA,4EACE,aACA,mBACA,aL/DI,CKgEJ,QACA,eACA,wBAEA,0FACE,WACA,YAGF,gFACE,YAGF,kFACE,kBLlFE,CKmFF,aL7EE,CKgFJ,mFACE,kBLtFE,CK2FR,0EACE,OACA,mBACA,YAEA,yFACE,mBACA,gBACA,uBAIJ,kFACE,aACA,yBACA,mBACA,aLxGM,CKyGN,cACA,QAIJ,iDACE,wBACA,oCAEA,iEACE,UACA,oBAKN,mDACE,wBLxFU,CK2FZ,uCACE,iBACA,sBACA,yBACA,qBACA,iBAEA,qDACE,0R;AC7IN,gBACI,kBACA,iBACA,oBACA,sBACA,yBACA,kBACA,oBACI,YAEJ,oBACI,YAEJ,mBACI,iBACA,oBACA,YACA,kBACA,mBACA,gBACA,gBAEJ,yBACI,gBACA,iBACA,YACA,mBACA,sBACA,2BACI,qBACA,mBACA,aNpBE,CMuBV,yBACI,aACA,uBACA,QAEJ,sBACI,aACA,uBACA,mBACA,aNpCM,CMuCV,mDACI,yBACA,Y;AChDR,mBACI,kBACA,kBACA,yBACA,gBACA,2CACA,aACA,WACA,gBACA,aACA,sBACA,8BACA,sBACI,gBACA,kBACA,yBACI,kBAIZ,cACI,sBACA,aACA,uBACA,mBACA,YACA,oCACA,gBACA,2CACA,SACA,kBACA,QACA,WAEA,6BACA,gCACA,kBPjBS,COmBT,0BACA,oCAEJ,2CAEI,WACA,cACA,QACA,SACA,kBACA,4CACA,YACA,mCACA,+DAEJ,6BACA,6B;ACtDA,oCACI,gBACA,YACA,aACA,sBACA,mBACA,2BAEA,yDACI,eRRG,CQSH,mBACA,YACA,mBACA,mCAEA,wEACI,aACA,uBACA,cAGJ,gEACI,cAGJ,kEACI,aACA,uBACA,SACA,mB;AC7BZ,SACI,OAEA,eACI,uBACA,gBACA,mBACA,kBAGJ,kBACI,aACA,yBAKR,yBACI,cACI,cAKR,qCACI,cACI,c;AC1BR,YACE,qBACA,gBAEA,0BACE,YACA,aAIF,uBACE,yBACA,yBACA,eVZO,CUcP,qCACI,aAGJ,6BACI,oBVsBM,CUlBR,iCACE,aACA,cAMJ,+CACE,4BACA,6BAKN,YACI,kBVrCS,CUsCT,+CACA,iBACA,YACA,gBACA,UACA,8BACA,+BACA,gCACA,4CACI,aAGJ,uBACI,gCACA,wBVpDK,CUqDL,eAEA,oCACI,mBAGJ,0CACI,gBACA,+BAEA,mDACI,wBV9DF,CUgEF,iDACI,yBAEJ,0DACI,2BAIR,6BACI,wBVzEE,CU0EF,uDACI,2B;AChFhB,cACI,mBACA,sBACI,WACA,aACA,mBACA,8BACA,wBXHM,CWIN,yBACA,gBACA,eACA,4BACI,gBAEJ,2BACI,aXPE,CWQF,kBAEJ,+BACI,iBACA,yBACA,iCAEJ,4CACI,wBXnBE,CWoBF,eAGR,uBACI,mCACA,uCACI,aACA,yBACA,mBAIJ,0DACI,yB;ACrCZ,gBACI,aACA,2DACI,CAEJ,gBACA,mBACA,sBACI,gBAEJ,qBACI,aZLM,CYMN,gBACA,kBACA,iBACA,cACA,WAGJ,yBACI,iBAEJ,uBACI,kBACA,+BACI,aACA,mBACA,gBACA,eACA,kBACA,aZvBE,CYwBF,uDACI,aAIR,qCACI,kBACA,QACA,OACA,wBZtCC,CYuCD,YZlCE,CYqCF,qCACI,WAEJ,2CACI,UAMhB,qBACI,gBAGJ,6CACI,eACA,cACA,aZtDU,CYuDV,kBACA,mBACA,uBAGJ,wBACI,iBACA,iBAIJ,sCACI,gBACI,wCACA,mD;;ACcR;IACI,YAAY;AAChB;;AC7FA,mBACI,sBACA,YACA,iBAEA,0BACI,iBACA,oBdoCM,CcnCN,4BAGJ,8CACI,kBACA,aAEA,uDACI,mBACA,kBACA,SACA,yBACA,mEACI,kBACA,YACA,WACA,8BACA,mBACA,qBACA,YACA,WACA,yEACI,eACA,adYN,CcPN,4DACI,kBACA,QACA,SAMA,iFACI,mBACA,iBAMR,uDACI,gBAEA,0EACI,UAGJ,0EACI,iBAIZ,qCACI,iBACA,oBdxBM,Cc0BF,2FACI,oBAMA,mGACI,mB;AC5ElB,wCACE,aACA,sBACA,SAGE,2EACE,sBACA,qBAGF,qEACE,WAGF,yEACE,aACA,QAGF,0EACE,aACA,QACA,mBACA,gBAEA,iFACE,eACA,YAEA,+FACE,WACA,YAON,4EACE,aACA,8BAEA,mFACE,mBACA,eAKN,iDACE,kBACA,uDACE,WACA,WACA,kBfjDM,CekDN,kBACA,QACA,cAEF,uDACE,gBACA,YACA,kBACA,W;ACjER,wBACE,aACA,Q;ACFF,gCACI,ajBMU,C;AkBPd,eACE,iCACA,WACA,wBACA,qBACA,gB;ACLF,mCACE,sBACA,WACA,wBACA,qBACA,gB;ACLF,iCACE,oBACA,mBACA,QACA,kBACA,uCACE,eAEF,iDACE,oBACA,mBACA,uBACA,YACA,YACA,yBACA,kBACA,eACA,wBACA,apBsCY,CoBpCZ,uDACE,UpBpBK,CoBqBL,wBpBgCU,CoB7BZ,wDACE,wBpB4BU,CoBzBZ,0DACE,oBAGF,gEACE,apB+BS,CoB5Bb,4CACE,sBACA,WACA,YACA,kBACA,kBACA,gBACA,gBACA,aACA,YACA,UAEF,iDACE,aACA,W;ACnDJ,+CACI,gBACA,iBAEA,yBACA,kBAEA,YACA,gBACA,WACA,aACA,QACA,mBACA,sBACA,qBAEJ,2DACI,iBACA,cACA,gBACA,eAEJ,iEACI,eAEJ,qDACI,e;AAxBI,uDACI,arBME,C;AsBXd,gBACI,aACA,qDACA,SAEA,2BACI,aACA,2BACA,M;ACNR,iBACI,aACA,QACA,mBACA,mBAGJ,qBACI,aACA,cAGJ,sBACI,iBACA,sBACA,yBAGJ,kBACI,gBAGJ,iDACI,kBACA,mBACA,gC;ACzBJ,+BACI,aACA,mBACA,SACA,kBACA,eAEA,qCACI,YAGJ,wCACI,aACA,sBAEA,qDACI,axBTE,CwBaV,qCACI,kBxBjBM,C;AyBHd,+BACI,aACA,uBACA,mBAGJ,qCACI,gBAGJ,yCACI,mBACA,kBACA,mBACA,uEACA,yCAGJ,uCACE,GACE,UACA,8BAEF,IACE,UACA,0BAEF,KACE,UACA,8B;AC7BJ,+BACI,aACA,uBACA,mBAGJ,kCACI,gBAGJ,sCACI,mBACA,kBACA,mBACA,oEACA,yCAGJ,oCACE,GACE,UACA,8BAEF,IACE,UACA,0BAEF,KACE,UACA,8B;AC7BJ,+BACI,aACA,uBACA,mBAGJ,kCACI,gBAGJ,sCACI,mBACA,kBACA,mBACA,oEACA,yCAGJ,oCACE,GACE,UACA,6BAEF,IACE,UACA,0BAEF,KACE,UACA,+B;AC7BJ,yCACI,gBACA,kBACA,mBACA,uEAGJ,uCACE,GACE,WACA,yBAEF,IACE,UAEF,IACE,UAEF,KACE,WACA,wB;ACrBJ,+BACI,aACA,uBACA,mBAGJ,mCACI,kBACA,6CACA,kBACA,kBACA,wBACA,yBACA,kBACA,8BACA,mBACA,+EACA,yCAGJ,qFACI,WACA,qBACA,kBACA,MAEJ,2CACI,iCACA,wBACA,yBACA,kBACA,8BACA,mBACA,wEACA,mBAEJ,0CACI,wBACA,wBACA,yBACA,kBACA,8BACA,mBACA,wEACA,iCAGJ,qCACE,GACE,8BAEF,SACE,uC;ACnDA,uBACI,mBACA,mBAIJ,wCACI,mBAEJ,mDACI,gBAEJ,iDACI,sB;ACdR,gCACI,OACA,aAEA,uCACI,OACA,YACA,WACA,iB;ACRR,gCACI,OACA,aAEA,uCACI,OACA,YACA,WACA,iB;ACRR,kCACI,aACA,qBACA,mBAEA,iDACI,OACA,kBACA,gCACA,mBACA,eACA,wCAEA,wDACI,oBjCuCI,CiCnCZ,oDACI,cACA,kBACA,gBhCHM,CgCIN,ajCdM,CiCeN,mBACA,sC;ACvBJ,0DACI,wC;ACFR,yBACI,yBACA,wBnCoEW,CmCnEX,iBlCQS,CkCPT,WlCQS,CkCNT,uCACI,e;ACNJ,oCACI,gBAEA,2CACI,gBACA,iBACA,kBACA,yBACA,4CACA,eACA,gBAEA,iDACI,mBAGJ,iDACI,+B;AClBhB,kCACI,aACA,SACA,mBAEA,yCACI,UrCNG,CqCOH,gBAGJ,0CACI,yBACA,aACA,kBAEA,yDACI,aACA,uDACA,kBACA,+BACA,kBAEA,oEACI,kBACA,MACA,OACA,YACA,kBrC4BA,CqC3BA,kBACA,8BACA,UAGJ,2DACI,iBACA,kBACA,0BACA,kBACA,UACA,kBAEA,8EACI,UrCzCT,CqC6CC,iEACI,yBACA,arCxCF,CqCyCE,2BACA,kBACA,UACA,kBAEA,+EACI,0BACA,mBAGJ,wEACI,UrC3DT,C;AsCDX,kFACI,mCAGJ,uEACI,UAKJ,yBACI,8EAEI,cAKR,yBACI,8EAEI,gBAOR,qCAEI,8EAEI,cAIR,qCAEI,8EAEI,gB;;ACyRR;IACI,qBAAqB;IACrB,WAAW;IACX,eAAe;IACf,iBAAiB;IACjB,iBAAiB;IACjB,yBAAiB;OAAjB,sBAAiB;YAAjB,iBAAiB;AACrB;AACA;IACI,gBAAgB;IAChB,sBAAsB;AAC1B;AACA;IACI,uBAAkB;IAAlB,kBAAkB;IAClB,eAAe;AACnB;AACA;IACI,eAAe;AACnB;;;ACuKA;;6BAE6B;AAC7B;IACI,uBAAuB;AAC3B;;AAEA;;6DAE6D;AAC7D;;IAEI,8BAA8B;AAClC;AACA;IACI,8BAA8B;AAClC;AAEA;IACI,2BAA2B;AAC/B;AACA;IACI,yBAAyB;AAC7B;AACA;IACI,UAAU;IACV,kBAAkB;IAClB,uBAAuB;IACvB,4BAA4B;AAChC;AACA;IACI,mBAAmB,EAAE,aAAa;AACtC;;AC1hBA,sCACI,aACA,cACA,aACA,sBACA,kBAEA,+CACI,kBACA,MACA,OACA,QACA,SACA,oCACA,aACA,uBACA,mBACA,aAGJ,sDACI,aACA,sBACA,cACA,aACA,cACA,UACA,2BAEA,8DACI,W;AC9BZ,0CACI,OAEA,+FACI,OACA,aACA,sBACA,SACA,cAIA,yDACI,yBAKJ,gEACI,iBACA,c;;ACmXZ;IACI,aAAa;AACjB;AAEA;IACI,aAAa;AACjB;;;AC7YA,wBACI,eACA,aACA,kBACA,gBAEA,sCACI,eACA,gBACA,yBACA,kBACA,YACA,gBACA,kBACA,WACA,a5C8BM,C4C3BV,mCACI,yBACA,kBACA,SACA,UAEA,uCACI,WACA,aAEA,gDACI,wBACA,SACA,SACA,YACA,oBACA,oB5C1BF,C4C8BN,0CACI,cACA,aACA,mDACI,yBACA,QACA,SACA,YACA,oBACA,oB5CvCF,C4C2CN,2CACI,cACA,aACA,UAIR,oCACI,kBACA,eAGI,yGACI,SACA,oB5CzDF,C4C0DE,oB;AChEZ,aACI,eACA,gBAEA,sBACI,mBACA,gBACA,uBAEA,6BACI,gBACA,uBAEA,+BACI,WAGJ,+BACI,a7CuBN,C6CnBF,+BACI,cACA,WAIR,uBACI,a7CtBE,C6C0BV,gBACI,kBACA,eAGJ,mBACI,kB7CrCM,C6CsCN,a7ClCM,C6CqCV,iBACI,kB7CzCM,C6C0CN,a7CLM,C6CMN,e;AC/CJ,2BACI,yBACA,kBACA,cAEI,2DACI,a;ACNZ,0DACI,gBACA,aACA,qCACA,SAEJ,iEACI,WACA,S;;AC+pBR;IACI,+CAAsC;AAC1C;AAEA;IACI,wBAAwB;AAC5B;AACI;AACA;QACI,mCAAmC;AACvC;AACA;QACI,qCAAqC;AACzC;AACA;QACI,wCAAwC;AAC5C;AACJ;;ACzrBA,iCACI,aACA,mBACA,QACA,eACA,SAEA,mEACI,SAGJ,0CACI,SACA,YAEA,wDACI,aAGJ,4EACI,QApBZ,iCAwBI,OACA,YACA,wBAGA,ajDtBU,CiDuBV,ejD7BO,CiD8BP,yBACA,iBAGA,aAGA,sCACA,4BAGA,wBACA,qCAEA,qCACI,YAGJ,+CACI,ajD3CM,CiD4CN,WACA,YAGJ,wCAEI,yCAGJ,uCACI,e;AC7DR,6BACI,kBACA,QACA,MACA,UACA,YACA,+BACA,yBACA,aACA,mBACA,uBACA,WAEA,qCACI,cACA,kBACA,SACA,yBACA,eACA,mBACA,alDZM,CkDeV,mCACI,iBAEA,2CACI,alDjBE,CkDqBV,wCACI,WACA,WAEA,gDACI,2BAGJ,8CACI,iB;ACvCR,0DACI,kBACA,UACA,SACA,YACA,eACA,gBAEA,+DACI,+BAEA,0EACI,kBACA,8BAKZ,2EACI,UACA,QACA,2BAEA,gFACI,wBACA,qCAIR,kGACI,MACA,YAGJ,0EACI,OACA,WACA,kBACA,8BAEA,kFACI,UAIR,+HAEI,gBAGJ,sEACI,mBACA,gBACA,YACA,eACA,anDhDM,CmDiDN,aACA,aACA,mBACA,eACA,wBAEA,oFACI,WACA,YAGJ,4EACI,kBnDjEE,CmDkEF,anD5DE,CmD+DN,6EACI,kBnDrEE,CmDyEV,8EACI,OACA,gBACA,eACA,anDvEM,CmDwEN,eACA,aACA,mBACA,YACA,gBACA,uBACA,mB;ACzFR,iCACE,aACA,uBAEF,8CACI,iBACA,iBACA,cACA,kBACA,aACA,0B;ACRI,uEACI,gBAEA,2EACI,S;ACJZ,wBACI,gCAIR,mBACI,yBACA,iBrDES,CqDDT,aACA,sBACA,2BACA,2BAGJ,sBACI,oBACA,mBACA,yBACA,iBrDTS,CqDUT,2BACA,2BAGJ,2BACI,aACA,mBACA,uBACA,wCACA,2BACA,4BACA,+BACI,8BACA,oCACI,iBAKZ,8CACI,kBACA,kDACI,mBAIR,iDACI,WACA,kBACA,2BACA,8BACA,qDACI,qBAIR,yBACI,yBACA,+BACI,gBAIR,4CACI,gBACA,aACA,sBACA,OrDzDS,CqD0DT,YACA,kDACI,iBACA,gBAIR,4BACI,WACA,aACA,QACA,kBACA,mBAGJ,6BACI,2BACA,2BAGJ,mCACI,2BACA,2BC1FJ,iBACE,aACA,e;ACHF,4BACI,oBACA,cAEA,2CACE,eACA,gBACA,cAEA,8DACE,aACA,mBACA,UACA,cAEA,oFACE,oBACA,cAEA,4FACE,iBAEA,+FACE,eAGF,8FACE,iBACA,iBACA,axDrBA,CwDyBJ,iHACE,cACA,eAIA,4GACE,eACA,gBACA,gBAGF,0HACE,aACA,mBACA,eAEA,6IACE,WACA,gBACA,eAMR,qFACE,gBAEA,6FACE,YACA,WAMN,8DACE,6B;ACvER,6CACE,aACA,aACA,QACA,azD6Da,C;A0D/DP,+BACI,8BAKJ,qDACI,kB1D8CI,C0D5CJ,+DACI,kB1DNF,C;A2DHF,8EACI,yBACA,kB3D2CD,C2D1CC,iBACA,kBACA,eACA,2BACA,OACA,kBACA,kBAEA,oFACI,kB3DmCJ,C2DhCA,uFACI,kB3DiCJ,C2DhCI,WAEA,4FACI,gBAIR,uFACI,WACA,mB;AC7BpB,kFACI,mCAGJ,uEACI,UAKJ,yBACE,8EAEE,cAKJ,yBACE,8EAEE,gBAOJ,qCAEE,8EAEE,cAIJ,qCAEE,8EAEE,gB;ACvCA,4CACI,yBACA,kBACA,c;ACJR,YACI,gBACA,SAEJ,gBACI,WACA,aACA,O7DIS,C6DHT,wBACI,cAGR,6CAEI,YACA,yBACA,gBACA,iB7DNS,C6DOT,aACA,mBACA,O7DTS,C6DUT,mBACA,uBACA,kBAEJ,uBACI,a9DnBU,C8DqBd,uBACI,eACA,6BACI,a9DYM,C;A+D3Cd,8BACI,kBACA,oCACI,a/DwCM,C+DpCd,gCACE,W;ACRF,iCACE,gBAEA,4CACE,eACA,gBACA,YACA,2BAGF,6CACE,oCAEA,wDACE,2BACA,uBAEA,uEACE,ahETM,CgEUN,mBAGF,8DACE,oC;ACvBR,oBACE,a;ACDF,mDACI,qBACA,2BACA,UAEJ,sDACI,gBACA,uBACA,mBAKJ,yBACE,sHAGE,cAKJ,yBACE,sHAGE,gBAOJ,qCAEE,sHAGE,aAIF,mHAEE,mBACA,qBAIJ,qCAEE,sHAGE,gBAKJ,gDACE,aACA,sBACA,UAIF,yBACE,gDACE,mBAEA,kDACE,QAON,qCACE,gDACE,sBAEA,kDACE,WAKN,qCACE,gDACE,mBAEA,kDACE,Q;AC7FN,8BACI,WAEA,uCACI,aACA,sBACA,mBACA,8BACA,kBACA,gBACA,YACA,gBAEA,iDACI,kBACA,OACA,SACA,WACA,kBnEZE,CmEaF,2BACA,UACA,aACA,8BACA,gBAEA,4DACI,UAEJ,6DACI,QAGJ,qDACI,kBAEA,0DACI,aACA,WACA,kBnEgBJ,CmEfI,UACA,cACA,QACA,kBACA,6BACA,qCAIA,oEACI,wBAMhB,8CACI,WACA,kBACA,OACA,QACA,aAEA,oDACI,kBACA,WACA,YACA,wBnE3DF,CmE4DE,kBACA,UACA,2BAEA,8DACI,wBnElBJ,CmEqBA,2DACI,qBACA,wBnEvBJ,CmEyBI,kEACI,anEzBR,CmE6BA,6DACI,eAGJ,2DACI,kBACA,SACA,gCACA,iBACA,anEvFN,CmEwFM,2B;AC9FpB,qCACI,kBACA,gBACA,YACA,cACA,aACA,sBAEA,sDACI,kBACA,MACA,OACA,WACA,YACA,8BACA,YAGJ,8CACI,OACA,gBACA,aACA,sBACA,c;ACtBJ,uDACI,aACA,yBACA,WACA,kBACA,eACA,2BAEA,6DACI,oBrE0CI,CqEvCR,gEACI,oBrEwCI,CqEhCJ,yEACI,arEhBF,CqEiBE,gBpEPF,CoEWN,oEACI,arEtBE,CqEuBF,gBpEZE,C;AqEhBN,wCACI,kBACA,mBACA,gCACA,aACA,8BAEA,8CAEI,gBAGJ,iDACI,aACA,QAIR,mCACI,eAEA,kDACI,atEhBF,CsEiBE,kB;ACrBA,mFACI,iB;;ACsNpB;EACE;;;;;;GAMC;AACH;;ACjOI,4CACI,gBAIR,kBACI,mBAEI,yBACI,aACA,QAHR,qBAKI,gBACA,yBACI,WAGR,wBACI,iBACA,sBACA,qBACA,yBACA,iBACA,oBzEnBM,CyEoBN,2BACI,YAGA,+CACI,gCAIZ,gCACI,mBAEJ,yCACI,sBAEJ,6BACI,gBCtCR,qCACE,2BACE,iDAKJ,qCACE,2BACE,iDAKJ,UACE,aACA,mBAEA,mBACE,OACA,YACA,gBACA,uBACA,mBAGF,kBACE,cACA,oBACA,mBACA,uBACA,YACA,YACA,yBACA,kBACA,eACA,a1EgBY,C0EfZ,sDAEA,2BACE,WACA,YAEA,sCACE,WACA,YAIJ,wBACE,yBACA,U1EtDK,C0EyDP,2BACE,mBACA,a1EtDQ,C0EwDR,iCACE,+BACA,a1E1DM,C0E+DZ,sBACE,YAEA,4BACE,gBACA,uBACA,mBAON,8CACE,cACA,gBACA,gBACA,uBACA,mB;ACvFF,kBACI,aACA,mBACA,QAGJ,uBACI,WACA,YACA,kBACA,wB3EFU,C2EKd,iCACI,wB3EkDW,C2E/Cf,oCACI,wB3ECS,C2EEb,kBACI,OACA,aACA,sB;ACxBJ,gCACE,eAMF,qCACE,yCACE,gBAIJ,qCACE,yCACE,c;ACZJ,qCACE,sCACE,gBAIJ,qCACE,sCACE,c;ACVJ,mBACI,oBACA,kBAIJ,sDAEI,aACA,mBACA,O7EDS,C6EET,gB7EMU,C6ELV,gBACA,iBACA,qB9EdO,C8EeP,a9EwCY,C8EvCZ,yBACA,eACA,6EAEA,gGACI,wB9EgCQ,C8E/BR,oB9E+BQ,C8E9BR,U9EvBG,C8E0BP,sLAEI,mBACA,oB9ExBM,C8EyBN,a9ExBM,C8EyBN,wB9E7BK,C8EgCT,kFACI,WACA,YAKR,2BACI,yBACA,0BACA,kBACA,mBAKJ,mGAGI,iBAIJ,2BACI,uBACA,W7EjDS,C6EkDT,0BACA,8BAEA,yCACI,WACA,YAGJ,gDACI,yB9EhBQ,C8EmBZ,2FAEI,yB9ErEM,C8E2EV,8GAEI,wB9E3BQ,C8E4BR,oB9E5BQ,C8E6BR,U9EpFG,C8EsFH,wJACI,wB9ElCI,C8EmCJ,oB9EnCI,C8EuCZ,uDACI,qCAEA,4EACI,qCAMZ,wCACI,cACA,eAIJ,+CACI,cACA,eAMJ,qCACE,kBACE,gBAIJ,qCACE,kBACE,c;AC7HJ,qCACI,aACA,sBACA,cACA,O;ACJJ,+BACI,cAEA,wCACI,aACA,mBACA,eACA,OACA,cACA,iBAEA,yBARJ,wCASQ,sBACA,UAGJ,iDACI,OACA,YACA,aACA,sBACA,gBAEA,yBAPJ,iDAQQ,eACA,iBACA,SAIR,mDACI,cACA,gBACA,gBACA,YACA,OAEA,4DACI,cACA,OAEA,gFACI,YACA,aAEA,yFACI,gBACA,oBhF1CV,CgF2CU,YACA,iBACA,mEACA,OAEA,8LACI,ehFrDjB,CgFsDiB,oBhFjDd,CgFkDc,gBAGJ,qGACI,oBhFtDd,CgFyDU,yBAlBJ,yFAmBQ,gBACA,iBACA,ehFjEjB,CgFkEiB,oBhF7Dd,CgF8Dc,aAKZ,yBApCJ,4DAqCQ,iBACA,OAIR,yBAjDJ,mDAkDQ,WACA,eACA,sBACA,YACA,eAKZ,uCACI,aACA,SACA,qBACA,gBAII,0DACI,iBAGJ,yDACI,kBACA,kBAIR,yBAlBJ,uCAmBQ,cACA,uBACA,wBACA,aACA,sBACA,cACA,mBACA,iB;AAhHA,gDACI,O;ACJhB,eACI,YAEA,8BACI,cACA,gBACA,mBAGI,qEACI,gBACA,WACA,YAKZ,wCACI,gBACA,YACA,cACA,aACA,sBAEA,2CACI,OACA,YACA,cAEA,oDACI,eACA,ajFYF,C;AkF3Cd,gCACI,aACA,qCACA,SACA,kBlFDS,CkFET,gCACA,8BACA,YACA,mBAEA,uCACI,oBACA,kBACA,aACA,SACA,8BAEA,0CACI,aACA,QAIR,yCACI,oBACA,aACA,yB;AC1BR,4BACI,SAEA,mCACI,aACA,sCACA,enFLG,CmFMH,SACA,YACA,gCAEA,4CACI,oBACA,aACA,2BACA,iDACI,UnFhBL,CmFiBK,gBAIR,4CACI,oBACA,kBACA,aACA,2BACA,QAGJ,2CACI,qBACA,aACA,yBAIR,8CACI,mBAIA,0DACI,aACA,SACA,mBACA,uBACA,anFtCE,CmFuCF,iBACA,eACA,2BAEA,gEACQ,anFIJ,C;AoFxDhB,iBACI,yBACA,mBAEA,oCACI,eACA,kBpFFM,CoFGN,aACA,gBACA,mBACA,SAEA,2CACI,OACA,aACA,mBACA,SAEA,2FACI,SACA,cAGJ,6CACI,apFhBF,CoFiBE,gBACA,cAIR,6CACI,aACA,sBACA,iBACA,kBACA,gBAGJ,+CACI,2BAGJ,yCACI,gCAEA,oDACI,wBAOJ,mDACI,mB;ACrDZ,uCACI,yBACA,kBACA,aACA,SAEA,iDACI,gB;ACPZ,aACI,WACA,yBACA,kBACA,iCACI,YAEJ,wEAEI,iBACA,aACA,8BACA,mBACA,gCACA,wBtFXM,CsFYN,2BACA,4BACA,SAEJ,uCACI,YACA,wBtFnBK,CsFoBL,6CACI,gBAGR,8CACI,atFPK,CsFQL,kBACA,gBACA,aACA,mBACA,QAEJ,kCACI,aACA,QAEJ,iCACI,aACA,8BACA,+BACA,aACA,oBACA,SACA,gBAIR,mBACI,kBACA,yBACA,gBACA,sBACA,+DAEI,atFdM,CsFgBV,2CACI,oBACA,kBACA,QACA,aACA,sBACA,uBACA,mBACA,atF5DM,CsF6DN,iDACI,mBACA,eACA,atF5BE,CsF6BF,oBtF7BE,CsFgCV,0CACI,iBACA,aACA,8BACA,SACA,gBACA,gDACI,atF1EE,CsF4EN,oDACI,uBACA,kBAGR,2CACI,uBACA,qBACA,gCACA,aACA,uBACA,QACA,gBACA,iDACI,atF1FE,CsF2FF,gBACA,mBAKZ,0BACI,oBtFrFS,CsFsFT,oDACI,wBtF9FI,CsF+FJ,gCAIR,mBACI,6BACA,sBACA,mCACA,atF1EU,CsF6Ed,yBACI,GACI,8BACA,UAEJ,IACI,UAEJ,IACI,UAEJ,KACI,6BACA,W;ACpIJ,gDACI,WACA,YAEJ,uDACI,yB;ACLJ,+BACI,YACA,wBxFWI,CwFVJ,yBACA,kBACA,axFeK,C;AsFpBb,aACI,WACA,yBACA,kBACA,iCACI,YAEJ,wEAEI,iBACA,aACA,8BACA,mBACA,gCACA,wBtFXM,CsFYN,2BACA,4BACA,SAEJ,uCACI,YACA,wBtFnBK,CsFoBL,6CACI,gBAGR,8CACI,atFPK,CsFQL,kBACA,gBACA,aACA,mBACA,QAEJ,kCACI,aACA,QAEJ,iCACI,aACA,8BACA,+BACA,aACA,oBACA,SACA,gBAIR,mBACI,kBACA,yBACA,gBACA,sBACA,+DAEI,atFdM,CsFgBV,2CACI,oBACA,kBACA,QACA,aACA,sBACA,uBACA,mBACA,atF5DM,CsF6DN,iDACI,mBACA,eACA,atF5BE,CsF6BF,oBtF7BE,CsFgCV,0CACI,iBACA,aACA,8BACA,SACA,gBACA,gDACI,atF1EE,CsF4EN,oDACI,uBACA,kBAGR,2CACI,uBACA,qBACA,gCACA,aACA,uBACA,QACA,gBACA,iDACI,atF1FE,CsF2FF,gBACA,mBAKZ,0BACI,oBtFrFS,CsFsFT,oDACI,wBtF9FI,CsF+FJ,gCAIR,mBACI,6BACA,sBACA,mCACA,atF1EU,CsF6Ed,yBACI,GACI,8BACA,UAEJ,IACI,UAEJ,IACI,UAEJ,KACI,6BACA,W;AGrIR,eACI,aACA,sBACA,gBAEA,4BACI,OACA,aACA,uBACA,sBAGJ,0BACI,OAEJ,qBACI,iB;AChBR,+BACA,aACA,8BACA,mBACA,kBAEA,iBzFKa,CyFJb,yBAEA,YACA,gBAEA,gBzFMc,CyFLd,iBAEA,mCACE,iBAGF,qCACE,eACA,oB1FsBY,C0FpBZ,a1FoBY,C0FnBZ,wB1FrBW,C0FuBX,8CACI,a1FgBQ,C;A2F3Cd,cACE,aACA,8BACA,mBACA,kBAEA,iB1FKW,C0FJX,yBAEA,YACA,gBAEA,gB1FMY,C0FLZ,iBAEA,kBACE,iBAGF,oBACE,eACA,oB3FsBU,C2FpBV,a3FoBU,C2FnBV,wB3FrBS,C2FuBT,6BACI,a3FgBM,C;A4F3Cd,6BACI,+BACA,4BACA,yBAEA,mCACI,WAGJ,mCACI,UAEA,yCACI,oB5FmDG,C4FjDP,uCACI,oB5FGC,C4FDL,wCACI,oB5FXE,C;A6FRd,sCACI,kBAEA,+CACI,kBACA,MACA,OACA,WACA,YACA,yCACA,uB;ACTR,sBACI,aACA,sBACA,SAEI,qDACI,8BACA,+BACA,wB9FNC,C8FSL,8CACI,8BACA,+BACA,gCAGJ,sCACI,2BACA,4BACA,6BAGJ,qCACI,8BACA,+BACA,gCAGR,gDACI,iCACA,aACA,8BACA,aACA,yBACA,qDACI,aACA,mBACA,SAEJ,sDACI,eACA,qBAEA,2KAEI,a9FJF,C8FQV,sDACI,aACA,sBACA,2DACI,a9FhDE,C8FiDF,iBAGR,iCACI,kBACA,a9FrDM,C8FsDN,aACA,mBACA,QAEA,wCACI,WACA,WACA,YACA,gBACA,wB9FjEE,C8FsEd,gCACI,aACA,gBACA,aACA,sBACA,sCACI,kBACA,a9F3EM,C8F4EN,aACA,mBACA,SACA,6CACI,WACA,WACA,YACA,wB9FrFE,C8FwFV,+CACI,sBACA,oB9F1FM,C8F2FN,iBACA,mBACA,kBACA,aACA,aACA,mBACA,+DACA,qDACI,eACA,oB9F/DE,C8FgEF,oFACI,a9FjEF,C8FmEF,8DACI,a9FpEF,C8FyEV,yCACI,aACA,yBACA,QAIR,gCACI,OACA,aACA,gBAEA,+CACI,aACA,OACA,gBACA,YACA,UACA,QACA,gBAEA,2DACI,gBAIR,+CACI,gBACA,aACA,kBACA,mBACA,uBACA,QACA,a9F7IM,C8FiJd,+BACI,a9FnJU,C8FoJV,kBACA,oBACA,kBC3JJ,YACE,kBACA,a/FGY,oE+FGV,wBAGJ,uBACI,UACA,2BAGJ,qBACI,UACA,wBAGJ,uBACI,UACA,wBAGJ,qBACI,UACA,2BAGJ,iBACI,8B;AClCJ,8BACI,mB;ACCI,4DACI,mB;ACHZ,iCACI,kBACA,kBACA,yBACA,gBACA,2CACA,4BACA,WACA,gBACA,aACA,sBACA,8BAEA,4CACI,sBACA,aACA,uBACA,mBACA,YACA,oCACA,gBACA,2CACA,SACA,kBACA,QACA,WACA,6BACA,gCACA,0BACA,oCAEA,gDACI,kBlGbC,CkGcD,+GAEI,+DAIR,iDACI,kBlGeI,CkGdJ,iHAEI,+DAIR,uGAEI,WACA,cACA,QACA,SACA,kBACA,4CACA,YACA,mCAGJ,2DACA,2D;AC5DR,4BACI,gBAEA,mCACI,YACA,gBACA,aACA,qCACA,SACA,UAEA,6CACI,kBACA,mBACA,gBAEA,6DlGQV,mBACA,gBACA,uBkGRc,kElGMd,mBACA,gBACA,uBkGLc,4ElGGd,mBACA,gBACA,uBkGCU,sDACI,cACA,eAIR,0CACI,kBAIJ,2CACI,mBACA,iBACA,mBACA,aACA,mBACA,yBAEA,oGACI,kBACA,qBACA,kBACA,mBAEA,4HACI,kBACA,QACA,SACA,gCACA,2BAIA,wIACI,WACA,YAKZ,uDACI,anG3DF,CmG6DF,yDACI,anGlDH,CmGuDT,mDACI,kBnG1EM,CmG4EF,0EACI,gCACA,kBACA,SACA,cAEA,uFACI,Y;ACpFZ,6DACI,gB;ACHR,iBACI,yBACA,kBACA,gBAEA,yBACI,kBrGHE,CqGIF,aACA,gCAGI,uCACI,mBAKZ,+BACI,erGlBD,CqGoBC,uCACI,gCAEA,oDACI,mB;ACxBhB,6BACI,SAEA,mDACI,iBACA,yBACA,wBtG8BC,CsG7BD,kBACA,aACA,iBACA,aACA,8BACA,mBAEA,yDACI,eACA,wBtGqBF,CsGjBN,oDACI,yBACA,gBACA,0BACA,aAGI,oFACI,mBAEA,0FACI,cACA,iBACA,kBAEJ,oGACI,atG9BV,CsG+BU,wBtGnCX,CsGoCW,aACA,eAOZ,wDACI,0B;AChDhB,iCACI,iBACA,kBACA,yBACA,4BACA,oBACA,mBACA,QACA,uCACI,oBvG4CQ,CuG3CR,avG2CQ,CuG1CR,eAGR,2CACI,cACA,aACA,SACA,sBAEJ,oBACI,aACA,8BACA,mB;ACtBA,2CACI,kBACA,eACA,qBACA,iDACI,axGiDI,CwG/CJ,eAIA,qEACI,8BACA,gCACA,8BACA,qBACA,kBACA,YACA,WACA,WACA,UAEJ,qEACI,UACA,8BACA,qBACA,kBACA,cACA,WACA,YAIR,oDACI,YACA,kBAEA,6DACI,qBAGJ,2DACI,mBACA,aACA,QAEA,sEACI,wBxGCJ,CwGGJ,oEACI,aACA,YAIA,0EACI,qBACA,axGrDN,CwG2DV,4CACI,gBAGA,oDACI,kBxGvBG,CwG6BC,gEACI,axGvBJ,CwG0BA,kEACI,wBASJ,iEACI,axGnFN,CwGoFM,cACA,gBAEA,4EACI,UxGjGb,CwGkGa,iB;AClGxB,8CACI,aACA,sBACA,OACA,YACA,cAEA,sDACI,ezGPG,CyGQH,aACA,kBACA,yBACA,cACA,YAGR,qCACI,8CACI,gB;AClBR,sCACI,gBACA,aACA,kBACA,yBAGJ,gCACI,aACA,wB1GuCW,C0GtCX,a1G4CY,C0G3CZ,kBACA,yBACA,YACA,gBACA,iDACI,YAEJ,gDACI,Y;ACnBR,+BACI,wB3G+CW,C2G9CX,a3GoDY,C2GnDZ,kBACA,yBACA,iBACA,kBACA,oBACA,cACA,kBAEA,qDACI,a3GJM,C2GKN,kBACA,kBAIA,4DACI,kBACA,SACA,SAKR,yCACI,gBACA,uDACA,oBAEA,2DACI,iBAGJ,oDACI,a;AClCJ,8CACI,a5GkDI,C4G7CR,+CACI,a5GDE,C4GGN,8CACI,a5GoDG,C4GlDP,8CACI,a5GIC,C;A6GnBb,sCACI,aACA,sBACA,SACA,e7GHO,C6GIP,aACA,kBACA,yBACA,c;ACRJ,qCACI,aACA,sBACA,OACA,YACA,qBACA,c;ACNJ,sCACI,aACA,mBACA,SACA,cAIJ,qCACI,sCACI,gB;ACRA,+FACI,gCAKJ,6CACI,YACA,UACA,YACA,e;ACZZ,yBACI,yBACA,ejHDO,CiHEP,aACA,aACA,sBACA,OAEA,wCACI,aACA,8BACA,mBACA,mBAEA,sDACI,SACA,UACA,iB;;ACoDZ;IACI,6BAA6B;AACjC;;ACvEA,gBACI,cACA,YACA,WACA,kBACA,2B;ACJA,qBACI,gCACA,mBACA,iBAIA,gDACI,yBACA,iBACA,kBACA,aACA,WACA,mBACA,gBACA,8BACA,mBACA,SACA,yBACA,2BAEA,yDACI,aAGJ,sDACI,oBpHtBF,CoHyBF,yDACI,OAGI,sFACI,gBnHjBV,CmHkBU,apH7BV,CoHkCM,qEACI,apHaR,CoHRJ,yDACI,aACA,8BACA,mBAKZ,+BACI,iB;ACxDR,mBACI,aACA,OACA,sBAEA,qBACI,gCACA,mBACA,iBAGJ,qCACI,mBAEA,oDACI,yBACA,yBACA,kBACA,aACA,WACA,mBACA,gBACA,8BACA,mBACA,SACA,0CACA,2BACA,eAEA,6DACI,aAGJ,0DACI,oBrH5BF,CqH6BE,wBrHaD,CqHVH,6DACI,OAGI,mFACI,gBAGJ,oFACI,gBpH7BV,CoH8BU,arHzCV,CqH8CF,6DACI,aACA,8BACA,mBACA,QAEA,oFACI,arHJJ,CqHMI,6FACI,WACA,YAGJ,0FACI,wBrHdR,CqHeQ,UrHpEb,CqH2EP,iCACI,iB;AC7ER,oCACI,YACA,aACA,OACA,sBACA,cACA,2BACA,8BAMA,6CAHJ,oCAIQ,kB;AAbJ,8BACI,YAEA,sCACI,etHJD,CsHKC,YACA,gCAKI,0DACI,kBtHVP,CsHaG,2DACI,Y;ACjBpB,0CACI,aACA,sBACA,eACA,SAEF,oDACE,mBAEA,oEACE,gBACA,gBAGF,mEACE,aACA,eACA,S;ACjBN,oCACI,sBACA,aACA,yBACA,aACA,8BACA,mB;ACNJ,mCACI,aACA,Q;ACFJ,oCACI,sBACA,yBACA,kBACA,aACA,yCACI,YACA,c;ACPR,kDACI,gBACA,mBAEJ,sCACE,aACA,8BACA,mB;ACNE,6BACI,gBACA,aACA,sBACA,sCACA,mBACA,6CACA,gBAEA,0CACI,iBACA,aACA,gDACA,gCACA,2BAEA,gDACI,mBAEJ,gDACI,kBAIA,2DACI,2BACA,UAIR,gDACI,kB5H5BF,C4H8BM,iEACI,UAKZ,uDACI,mBAOR,uCACI,aAKJ,sCACI,iB;ACvDZ,6BACI,WACA,YACA,kBACA,YACA,iBACA,qBAGJ,mCACI,kBACA,YAGJ,wCACI,wB7HCS,C6HEb,0CACI,wB7HsDY,C6HnDhB,uCACI,wB7HsCW,C6HnCf,oCACI,WACA,iB;AC5BJ,oCACI,yBACA,kBACA,gBACA,e9HHO,C8HIP,aACA,aACA,sBACA,SACA,gBAEA,wDACI,aACA,mBACA,QACA,eACA,mBACA,yBACA,YACA,kBACA,2BAEA,8DACI,a9HgCI,C8H/BJ,oB9H+BI,C;A+HvDhB,8BACI,yBACA,kBACA,gBAEA,kDACI,e/HLG,C+HMH,aACA,gCACA,2BAEA,wDACI,U/HXD,C+HYC,kB/H0CI,C+HzCJ,sFACI,2BACA,a/HTF,C+HaN,2FACI,a/HbE,C+HeF,+HACI,U/HvBL,C+H2BH,uEACI,2BACA,a/HvBE,C+HyBF,6EACI,a/HsBA,C+HlBR,sDACI,aACA,OACA,oBAIR,mDACI,aACA,cAEA,4EACI,aACA,mBACA,SAEA,+EACI,aACA,SACA,mBAEA,mGACI,aAKZ,4EACI,kBACA,a/H1DE,C;AgILN,4DACI,aACA,sBACA,S;ACNZ,2CACI,iBACA,qBACA,sBACA,yBACA,iBACA,qBACA,gBACA,8CACI,YAGA,oIACI,gCAGR,8CACI,gBACA,mB;AClBR,8BACI,mBACA,oBACA,gCAEA,4FACI,+B;ACNR,4BACI,cACA,gBAEA,mCACI,gBACA,Y;ACNR,4BACI,YACA,WACA,cAEA,oCACI,gCACA,oBACA,mBACA,aACA,mBACA,Y;ACRA,mEACI,eACA,eACA,WAGJ,+BACI,eAIA,uCACI,Q;ACdhB,cACI,YACA,WACA,aACA,sBACA,kBtIHS,CsIKT,sBACI,gCACA,eACA,WACA,etIXG,CsIaH,+BACI,eACA,aACA,qBAEA,sCACI,SACA,atIVF,CsIWE,iBACA,kBACA,oBAKZ,+BACI,OACA,WACA,wBtI7BK,CsI8BL,cAED,wCACI,oBACA,mBACA,gCAGI,uDACI,atIjCL,CsIkCK,eAIR,iDACI,mBAKX,sBACI,kBACA,6BACA,etIvDG,C;AuIDX,+BACI,YACA,WACA,aACA,sBACA,kBvIFS,CuIIT,uCACI,gCACA,eACA,WACA,evIVG,CuIYH,gDACI,eACA,aACA,qBAEA,uDACI,SACA,avITF,CuIUE,iBACA,kBACA,oBAKZ,gDACI,OACA,WACA,wBvI5BK,CuI6BL,cAGI,+DACI,avI3BF,CuI4BE,eAKZ,uCACI,evI1CG,CuI2CH,kBACA,6B;AC7CR,8BACI,aACA,sBACA,cACA,gBAEA,sCACI,gCACA,oBACA,mBAEA,6DACI,eAKJ,0CACI,aACA,QACA,cACA,mBACA,2BACA,eAEA,iGACI,axI2BA,CwI1BA,wBxIvBF,CwI4BM,kFACI,aAEJ,iFACI,qBAKZ,uDACI,WACA,4EACI,qBAEJ,2EACI,aAIA,mEACI,qBAOpB,2CACI,OACA,aACA,sBACA,kBACA,uBACA,axI1DM,CwI2DN,gBAEA,gDACI,eACA,axIjBI,C;AyIrDhB,iCACI,aACA,SACA,YACA,WACA,cAEA,2CACI,MACA,wDACI,YACA,YACA,gBACA,UACA,iCAIR,8CACI,+BACA,mBACA,2D;ACpBJ,2CACI,aACA,QACA,mBACA,mBAEA,8CACI,SACA,UAIR,0GAEI,aACA,e1IfG,C0IgBH,yBACA,kBAEA,sHACI,aACA,mBAEA,4HACI,gBACA,cACA,OAGJ,4HACI,O;AC/BhB,+BACI,Y;ACCI,qGACI,gCAGR,mCACI,aACA,gBAEA,4EACI,SAGJ,sCACI,gBAEJ,sCACI,iBACA,mB;AClBR,iDACI,aACA,yBACA,WACA,kBACA,eACA,2BAEA,uDACI,oB7I0CI,C6IvCR,0DACI,oB7IwCI,C6IhCJ,mEACI,a7IhBF,C6IiBE,gB5IPF,C4IWN,8DACI,a7ItBE,C6IuBF,gB5IZE,C;A6IlBd,kCACE,kBACA,SACA,UACA,YACA,e9IJS,C8IKT,yBACA,wCACA,SAEA,qDACE,2BAEA,uDACE,gBAIJ,qDACE,2BAGF,yCACE,mBACA,kBACA,gCACA,oBAIA,8CACE,kBAEA,gDACE,2BACA,kBACA,cACA,aACA,8BACA,WACA,yBACA,mBACA,YACA,U9I3CG,C8I6CH,sDACE,qBACA,yBACA,a9IJI,C8IUZ,2CACE,aACA,yBAGF,kDACE,kBAEA,0DACE,kBACA,aACA,QACA,YACA,YACA,W;ACpEN,iBACI,sBACA,0BACI,iBACA,YACA,aAEJ,oBACI,c;ACPR,+CACI,wBAIJ,gCACI,mHAEA,+BACA,6DAEA,sCACI,+BACA,YAIR,2CACI,GACI,iHAGJ,IACI,kHAGJ,IACI,kHAGJ,IACI,mHAGJ,IACI,mHAGJ,IACI,mHAGJ,IACI,mHAGJ,IACI,mHAGJ,IACI,mHAGJ,IACI,mHAGJ,KACI,oH;AC1DN,qEACE,ajJQU,CiJPV,aACA,mBACA,OACA,uBACA,WACA,YACA,aACA,kBAEA,uEACE,oBAGF,yEACE,OACA,WACA,YACA,2BACA,mBAIA,+EACE,sBACA,ajJ0BQ,CiJzBR,oCACA,2BACA,mBACA,mBACA,mCACA,kCAIJ,2FACE,YACA,UACA,kBACA,iBACA,cACA,wBjJzBO,C;AkJnBb,yBACE,iBACA,gBAGF,4CACE,UACA,wBlJEY,CkJCd,kDACE,wBlJLY,CkJQd,wDACE,wBlJRY,CmJHN,qCACI,gBACA,YACA,gBAEA,4CACI,UAIA,+CACI,anJJN,CmJKM,UACA,kBAMpB,sCACI,oBnJnBU,CmJoBV,anJdU,CmJeV,gCACA,aACA,mBAEA,yDACI,4BACA,aACA,mBACA,SACA,WAEA,kEACI,kBnJjCE,CmJoCN,kEACI,cACA,e;AC3CZ,SACI,mBAEA,gBACI,kBACA,kBACA,aACA,qBACA,QAEA,sBACI,apJ4CI,CoJzCR,yBACI,WACA,cAGJ,sBACI,WACA,kBpJhBE,CoJiBF,WACA,OACA,kBAIA,4BACI,0BACA,mBAMR,kCACI,2BACA,iBACA,kBACA,gBACA,cAEA,0CACI,aACA,SACA,mBACA,iBAIA,mDACI,OACA,WACA,cAEJ,mDACI,aACA,QAGJ,gDACI,kBpJdL,CoJeK,YACA,aAIR,wCACI,kBpJrBD,CoJwBH,4CACI,kBACA,aAEA,8CACI,cACA,WACA,cACA,WAEA,oDACI,kBpJnCT,CoJoCS,YACA,aAOpB,sBACI,gBAIR,qCAKoB,mDACI,aACA,gB;ACvGpB,8BACI,cACA,YAEJ,6BACI,aACA,eACA,YACA,2BACA,mBAEJ,kCACI,aAIA,2EACI,aAGJ,0CACI,eAKZ,sCAEQ,8BACI,aAEJ,6BACI,qBACA,oBAEA,mCACI,sBACA,oCACA,2BACA,mBACA,mBACA,mCACA,kCACA,arJSA,E;AsJrDhB,gCACI,UACA,aACA,OACA,yBACA,eAEA,iDACI,kBACA,yBACA,aACA,sBACA,SACA,WAEA,iEACI,aACA,QACA,mBACA,WAEA,gFACI,aACA,eACA,UtJvBL,CsJwBK,eACA,gBAGJ,+EACI,aAGJ,gFACI,OACA,aACA,sBACA,kBACA,WAEA,qMAEI,atJnCN,CsJoCM,kBACA,UACA,QAEA,mNACI,SAGJ,iNACI,UAIR,sFACI,oBACA,iBACA,kBtJxDP,CsJyDO,oBtJvDN,CsJwDM,WACA,iBACA,YACA,sBAEA,oGACI,aAMhB,kEACI,etJzED,CsJ0EC,eACA,YACA,yBAEA,gFACI,cACA,WACA,gBACA,aACA,uBACA,mBACA,QACA,yBACA,atJjCA,CsJkCA,kBACA,etJzFL,CsJ+FH,yDACI,eACA,WACA,gBACA,SACA,UACA,YACA,YACA,kBAIQ,qNAEI,atJtGV,CsJyGM,8FACI,atJ1GV,CsJ2GU,OACA,gBACA,aACA,WAEA,4GACI,cACA,2BACA,YACA,iBACA,iBACA,sBAEA,wHACI,4BACA,6BAOpB,0EACI,cACA,gBAEA,sFACI,eAKZ,iDACI,kBACA,YACA,aACA,0BACA,OACA,MACA,YAMZ,sCACI,gCACI,YACA,0CACI,0BAGA,yDACI,WACA,MACA,OACA,yBACA,0BAEA,yEACI,WACA,mBACA,uFACI,eAQxB,qCAEQ,iDACI,cAGI,gFACI,cAGJ,wNAGI,aAIA,mFACI,yCACA,0CAQZ,yDACI,aACA,wEACI,aAIA,gPAGI,e;AAxNI,2FACI,cAEA,wMAEI,YACA,WAMZ,6EACI,etJnBjB,C;AuJDX,sBACI,aACA,aACA,sBAEA,+BACI,aACA,mBACA,OACA,0BACA,gBAGJ,iEACI,aACA,aAGJ,sCACI,iCACI,mB;ACpBZ,2BACE,gBACA,qBxJDS,CwJET,gDACA,0BACA,2BACA,yBACA,8BAEA,8BACE,iBACA,mBAGF,6BACE,iBAGF,oCACE,gBACA,SACA,aACA,2BACA,8BACA,eAEA,4DACE,wBxJiBQ,CwJhBR,oBxJgBQ,CwJdR,kEACE,wBxJcM,CwJNd,yBACE,aACA,sBACA,YACA,WACA,qBAEA,iCACE,WACA,oBACA,gCACA,gBACA,cACA,aACA,mBACA,8BACA,sBAEA,wCACE,eACA,gBACA,cACA,SACA,mBACA,OAGF,iDACE,aACA,mBACA,WAEA,8DACE,SAGF,gEACE,aACA,mBACA,uBACA,WACA,YACA,UACA,gBACA,YACA,kBACA,eACA,cACA,aACA,sCAEA,sEACE,eACA,kBxJxFI,CwJ8FZ,mCACE,WACA,gCACA,gBACA,aACA,sBACA,sBAEA,4CACE,aACA,QACA,kBAEA,yDACE,wBxJ5GM,CwJ6GN,kBAEA,+DACE,eACA,wBxJ/GI,CwJkHN,kEACE,axJlHI,CwJoHJ,wEACE,mBAOV,2CACE,OACA,WACA,wBxJlIU,CwJmIV,cAMA,4DACE,aACA,mBACA,axJzIQ,CwJ0IR,qBxJhJK,CwJiJL,gCACA,oCACA,2BACA,eAEA,qEACE,iBAEA,2FACE,wBxJpJI,CwJqJJ,WACA,gBACA,kBACA,iBAIJ,oEACE,aACA,uBACA,mBACA,WACA,eAEA,iFACE,YACA,WACA,UAEA,sFACE,SACA,UAKN,yEACE,axJ7IM,CwJgJR,mEACE,2BACA,yBxJlJM,CwJmJN,axJlLM,CwJoLN,2EACE,8BAEA,0GACE,wBxJtHI,CwJ0HR,yEACE,8BAEA,wGACE,wBxJxLC,CwJ4LL,kGACE,qBAvEC,CA2EL,kEACE,OACA,aACA,sBACA,yBAEA,0EACE,QACA,aACA,8BACA,mBAEA,mFACE,YACA,eACA,gBACA,sBACA,uBACA,aACA,mBACA,uBAGF,iFACE,OACA,2BACA,SAIA,sFACE,eAKN,wEACE,aACA,cACA,mBACA,mBAGF,0EACE,aACA,iBACA,axJ3PI,CwJ4PJ,cACA,cACA,yBAIJ,kEACE,wBxJtQM,CwJ2QZ,gCACE,OACA,aACA,mBACA,uBACA,kBACA,axJ9QU,CwJ+QV,WACA,wBxJnRU,C;AyJJd,wEAEI,+B;ACFJ,+BACI,eACA,8BACA,mBACA,yBACA,SACA,cACA,YACA,WACA,YACA,YACA,mKACA,4CACA,aACA,sBACA,gBAGA,0CACI,gCAIJ,yBAvBJ,+BAwBQ,kBAGJ,2CACI,kBACA,UACA,MACA,SACA,UACA,iBACA,yBACA,aAGA,yBAXJ,2CAYQ,cAIR,uCACI,gBACA,cAGJ,oCACI,QACA,WAGA,gBACA,YAIA,+CAVJ,oCAWQ,gBACA,gBAIJ,yBAhBJ,oCAiBQ,eACA,gBAEA,0CACI,gBAKZ,qCACI,kBACA,YACA,MACA,gBACA,cACA,gBACA,eAGA,gDACI,mBACA,uBACA,uBACA,gBACA,UACA,oBAIR,wCACI,gBACA,0BACA,2BAGJ,gDACI,0BACA,2BAGJ,uCACI,2BAGJ,uCAEI,oGAGJ,uCAEI,oGAIA,0BACA,2B;AC3HR,yBACI,sBACA,iBACA,cAEA,kDACI,iBACA,iBACA,gBAEA,yEACI,UACA,aACA,uBACA,mBAGJ,2EACI,gB;ACfZ,eACA,qBACA,oBAYA,gBACI,yCACA,qB5JhBO,C4JiBP,aACA,uBACA,mBACA,YACA,mBACA,yDACA,sBACA,4BACA,yBACA,a5JjBU,C4JkBV,iCACI,kBACA,cACA,kBACA,a5JhBK,C4JmBT,+BACI,sBACA,uBACA,cAEA,wDACI,aACA,WACA,uBACA,mBAEA,6JAEI,WAMhB,yBACI,wBACA,WACA,aAGA,+BACI,gBACA,mBAIJ,gCACI,gBACA,YACA,mBAIR,6CAEI,YACA,uBACA,mBAIA,yBACI,gBAEJ,yBACI,kBAEJ,wBACI,gBACA,mBAIR,yBACI,WAGJ,gDACI,iBACA,kBACA,kBACA,a5J3FU,C4J4FV,mDACI,iBACA,mBAEJ,mDACI,iBACA,qBAEJ,sDACI,cACA,a5JtGM,C4JuGN,kBAEJ,oEACI,mBAEJ,kDACI,mBAEJ,kDACI,a5J/EM,C4JiFV,gFACI,oB5JvHM,C4JyHV,0DACI,iBACA,uEACI,oB5J5EI,C4JgFR,wEACE,yBAIN,iEACI,mBAGJ,4DACI,gBAEJ,wDACI,yBACA,WACA,kBAEJ,wEACI,wB5JlGQ,C4JmGR,WACA,8EACI,wB5JpGI,C4JsGR,iFACI,wB5JxJE,C4JyJF,a5JxJE,C4J2JV,yEACI,a5J9GQ,C4J+GR,mBACA,+BACA,+EACI,+BACA,oB5JlHI,C4J4HhB,uCAEI,mBACA,OACA,aACA,sBAGJ,8BACI,gBA9KS,CA+KT,kBACA,WACA,YACA,gBACA,aACA,mBAEA,uCACI,aACA,sBACA,kBACA,gBACA,kBACA,WACA,YACA,uCAEJ,mCACI,wB5J3MK,C4J6MT,8CACI,qB5JhNG,C4JiNH,oB5J7MM,C4JiNd,2BACI,YACA,aACA,sBACA,OAEA,gCACI,wB5J1NK,C4J2NL,OAIR,kBACI,kBACA,WACA,SACA,YACA,gBAGJ,uBACI,eA9NS,CA+NT,iB3JhOS,C2JmOb,2FAGI,wBAGJ,4DAEI,UACA,4BAGJ,iCACI,kBAGJ,mBACI,kBACA,aACA,8BACA,eA9PY,CA+PZ,wCACI,kBACA,eAjQQ,CAkQR,cACA,WACA,gBACA,mBACA,+CACI,cAEJ,4DACI,UACA,mBAIZ,wBACI,iBACA,aACA,sBACA,uBACA,uBACA,8BACI,gBACA,kBACA,a5JrRM,C4JsRN,cAEJ,2BACI,a5JtRM,C4JuRN,mBAGR,uBACI,YACA,aACA,mBACA,eAEJ,WACI,wB5JjSU,C4JkSV,a5JvSU,C4JwSV,YACA,kBACA,gCAEA,0BACI,wB5J7QM,C4J8QN,a5J1SM,C4J2SN,gBACA,mBACA,aACA,mBACA,8BACA,kBACA,mBAGJ,6BACI,wB5JzSK,C4J0SL,a5J7TK,C4J8TL,gBACA,gCACA,aACA,mBACA,8BACA,kBACA,mBAGR,WACI,YACA,qB5J3UO,C4J4UP,WAhUS,CAiUT,gCACA,aACA,mBACA,8BACA,eACA,WACA,4BACI,aACA,mBACA,sBAEJ,uBACI,iBACA,oBACA,WA/UK,CAgVL,WACA,6BACI,eAGR,qCACI,aACA,yCACI,Y5J1VE,C4J2VF,eAEJ,4CACI,eACA,wB5JhWE,C4JmWV,yCACI,aACA,aACA,mBACA,6CACI,UACA,eAEJ,gDACI,eACA,wB5JnXE,C4JsXV,0BACI,kBACA,aACA,sBACA,SAEA,8BACI,UACA,iBAEJ,mCACI,aACA,mBACA,iBACA,kBACA,2BACA,mBACA,sBACA,yDACI,iBACA,gBACA,wB5J1XH,C4J2XG,yBACA,kBACA,YACA,mBACA,QAEJ,yCACI,oCACA,2BACA,mBACA,mBACA,mCACA,kCAIZ,2BACI,uBACA,oB5J1ZM,C4J4ZV,gCACI,YACA,mCACI,e5JtaD,C4JuaC,yBAEA,gDACI,2BACA,sDACI,kB5JzaN,C4J0aM,sHACI,a5JxXR,C4JyXQ,Y5JzXR,C4JgYR,0CACI,kBACA,gDACI,kBACA,WACA,UACA,YACA,kB5JzbF,C4J0bE,QAKR,yFAEI,eAIZ,sCAEQ,qEACI,aACA,mBACA,gFACI,yBACA,2BAGA,sFACI,sBACA,oCACA,2BACA,mBACA,oB5JnaJ,E4JyaZ,wBACI,WACA,eA5dQ,CA6dR,kBACA,MACA,aACA,8CACI,gBACA,4BACA,aACA,OACA,8BACA,mBACA,YACA,gBAEJ,6CACI,WACA,oB5J5eE,C4J6eF,eAIQ,wJACI,a5JhcR,C4JicQ,Y5JjcR,C4JucZ,4BACI,WACA,cAnfK,CAqfL,0CACI,UAEJ,iDACI,WAjgBI,CAugBZ,sCACI,mBACA,0DACI,mBAGI,4IACI,a5J7fP,C4J8fO,Y5J9fP,C4JygBL,2EACI,eAKZ,4BACI,gCACA,4BACA,aACA,+BACA,gCACI,Y5JniBM,C4JoiBN,WAEJ,uCACI,UACA,W5J/iBG,C4JijBP,kCACI,iBACA,a5JziBM,C4J0iBN,mBACA,oBAIR,mCACI,gCACA,4BACA,aACA,mBACA,+BACA,WAnjBS,CAojBT,uCACI,S5JjkBG,C4JkkBH,WAEJ,yCACI,iBACA,U5JtkBG,C4JukBH,mBACA,oBAIR,eACI,eACA,YACA,WACA,8BACA,sCACA,WA9kBY,CAglBZ,4CACI,WACA,sBACA,8BAGQ,yEACI,a5J/jBN,C4JikBE,uEACI,Y5JlkBN,C4JmkBM,8EACI,UACA,c5JrkBV,C4J4kBV,2CACI,QACA,gBACA,4DACI,a5JhlBE,C4JilBF,iBACA,iBACA,kBACA,mBACA,gBACA,uBAEJ,wDACI,kBAGA,kEACI,wB5JjnBF,C4JmnBF,qEACI,a5JhmBF,C4JkmBF,mEACI,Y5JnmBF,C4JomBE,0EACI,UACA,c5JtmBN,C4J4mBV,mCACI,aACA,aAGQ,wHACI,a5JznBP,C4J0nBO,Y5J1nBP,C4J6nBD,uDACI,kB5JhpBF,C4JipBE,mBAKJ,2EACI,iBAIZ,oBACI,OAEJ,sBACI,YAEJ,wCACI,aACA,QAEJ,sCACI,wB5J9pBM,C4J+pBN,WACA,iBACA,YACA,cACA,iBACA,gCACA,uBACA,mBACA,gBAEJ,wDACI,UAEJ,4BACI,aACA,8BACA,gCAEJ,yBACI,oBACA,WAEJ,qCACI,iBACA,wB5J9qBK,C4J+qBL,yBAGA,oDACI,6BAMZ,sCAEI,yBACI,UAEJ,eACI,OACA,kBAGA,qCACI,aAEJ,+KAII,aAEJ,4BACI,YAEJ,uBACI,cAMR,qBACI,eAvuBQ,CAwuBR,kBACA,gCACA,YACA,YACA,OACA,e5JjvBG,C4JkvBH,+BACA,cAGI,yDACI,iBAEA,wEACI,YAEA,wFACI,mBACA,eACA,yBACA,a5J1vBV,C4J2vBU,eAKA,wGACI,uBAEA,qHACI,gBAGJ,qHACI,iBACA,kBACA,2IACI,gBAGJ,yHACI,QAGJ,2HACI,kB5JtxBtB,C4J2xBkB,yIACI,kB5JxuBpB,C4JyuBoB,WAKJ,+HACI,a5JhyBtB,C4JiyBsB,mBAW5B,wCACI,YAEA,+CACI,YAGR,oCACI,mBAOZ,sCAEQ,qBACI,YACA,2BACA,uBAEA,4BACI,qCACA,OAIR,iBACI,oBCl1BZ,sCAEE,4BAGF,gCAEE,UAIF,8DAEE,+BAGF,wDAEE,UAIF,sDAEE,+BAEF,gDAEE,UAGF,gDACE,mCAGF,qCACE,UCpCF,QACE,8BAEF,kBACE,QACE,uBAEF,IACE,uBAEF,IACE,wBAEF,IACE,wBAIJ,aACE,gDAGF,uBACE,GACE,mBAEF,IACE,qBAEF,KACE,oBAIJ,OACE,sCAEF,2BACE,GACE,oCAEF,KACE,qCCxCJ,UACI,iBACA,yBACA,kBACA,sBACA,aACI,SAIR,wBACI,aACA,QACA,8BACI,cAEJ,sCACI,iBACA,uBACA,+BACA,wBACA,uBACA,sFACI,gBACA,kBACA,gBAEJ,0CACI,6BACA,mBACA,+BACA,+BACA,sDAGA,gDACI,mCAGR,4CACI,0BAEJ,4CACI,eAEJ,6CACI,kBACA,sBACA,sBAEJ,4FAEI,kBACA,sBACA,sBAEJ,+CACI,kBACA,sBACA,sBAEJ,4CACI,kBACA,sBACA,sBAEJ,+CACI,kBACA,sBACA,sBAEJ,4CACI,YCjEZ,WACI,oBACA,kBACA,gBACA,0DACA,uKAKJ,eACI,YACA,aACA,sBACA,OAGJ,SACI,gBAGJ,QACI,OACA,wBhKxBU,CgK2Bd,SACI,ahKUU,CgKTV,eACI,eACA,ahKSM,CgKRN,0BAIR,WACI,WACA,YACA,kBAEJ,iBACI,WACA,YACA,kBAEJ,YACI,wBhK1CU,CgK2CV,oCACI,wBhKvBM,CgKwBN,0CACI,wBhKxBE,CgK6Bd,YACI,WACA,YACA,eACI,iBACA,gBACA,gBAEJ,wBACI,ahK3DM,CgK6DV,uBACI,WAIR,sBACI,eACA,mFACI,yCACA,iDAEJ,4BACI,ahK1CM,CgK8Cd,YACI,WACA,YACA,iBAGJ,iBACI,ahKrDU,CgKsDV,uBACI,ahKrDM,CgK0DV,uBACI,mBAEJ,yBACI,YACA,aAIR,+BACI,wBhK7GU,CgK8GV,ahK3GU,CgK4GV,kBACA,yBACA,aACA,kBAEA,iEACI,kBAMD,4BACI,cACA,kBACA,mBACA,oBACA,yBAKX,MACI,eAGJ,cACI,yBACA,UAIJ,6BACI,eAGJ,2CACI,mBAGJ,gBACI,aACA,mBACA,sBACI,ahKpHM,CgKqHN,eACA,4BACI,0BAGR,sCACI,oBACA,WAMR,mFAEI,ahKpIU,CgKuId,sEACI,wBhKhLS,CgKiLT,kFACI,kBAIR,uFACI,wBhKtLU,CgKyLd,gBACI,kBACA,wBhKzJU,CgK0JV,ahKvLU,CgKwLV,gBACA,yBACA,aACA,mBACA,uBACA,iBAEA,wBACI,gBACA,YACA,gBAIR,kBACE,oBACA,4BACA,qBACA,gBACA,uBAGA,6BACE,qBAEF,+BACE,qBAEF,8BACE,yB;AChOJ,iEAAc,CAAd,8FAAc;;AAAd;;;CAAc;;AAAd;;CAAc;;AAAd;;;CCcC,sBAAsB;ADdT;;AAAd;;CAAc;;AAAd;CCsBC,gBAAgB;CAChB,cAAW;IAAX,WAAW;ADvBE;;AAAd;;;CAAc;;AAAd;CCgCC,iBAAiB,EAAE,MAAM;CACzB,8BAA8B,EAAE,MAAM;ADjCzB;;AAAd;;;CAAc;;AAAd;;CAAc;;AAAd;CC8CC,SAAS;AD9CI;;AAAd;;CAAc;;AAAd;CCsDC;;;;;;;;;kBASiB;AD/DJ;;AAAd;;;CAAc;;AAAd;;;CAAc;;AAAd;CC6EC,SAAS,EAAE,MAAM;CACjB,cAAc,EAAE,MAAM;AD9ET;;AAAd;;;CAAc;;AAAd;;CAAc;;AAAd;CC2FC,yCAAiC;SAAjC,iCAAiC;AD3FpB;;AAAd;;CAAc;;AAAd;;CCoGC,mBAAmB;ADpGN;;AAAd;;;CAAc;;AAAd;;;;CCgHC;;;;;;WAMU,EAAE,MAAM;CAClB,cAAc,EAAE,MAAM;ADvHT;;AAAd;;CAAc;;AAAd;CC+HC,cAAc;AD/HD;;AAAd;;CAAc;;AAAd;;CCwIC,cAAc;CACd,cAAc;CACd,kBAAkB;CAClB,wBAAwB;AD3IX;;AAAd;CC+IC,eAAe;AD/IF;;AAAd;CCmJC,WAAW;ADnJE;;AAAd;;;CAAc;;AAAd;;;CAAc;;AAAd;CCiKC,cAAc,EAAE,MAAM;CACtB,qBAAqB,EAAE,MAAM;ADlKhB;;AAAd;;;CAAc;;AAAd;;;CAAc;;AAAd;;;;;CCoLC,oBAAoB,EAAE,MAAM;CAC5B,eAAe,EAAE,MAAM;CACvB,iBAAiB,EAAE,MAAM;CACzB,SAAS,EAAE,MAAM;ADvLJ;;AAAd;;;CAAc;;AAAd;SCgMS,MAAM;CACd,oBAAoB;ADjMP;;AAAd;;CAAc;;AAAd;;;;CC4MC,0BAA0B;AD5Mb;;AAAd;;CAAc;;AAAd;CCoNC,kBAAkB;CAClB,UAAU;ADrNG;;AAAd;;CAAc;;AAAd;CC6NC,8BAA8B;AD7NjB;;AAAd;;;CAAc;;AAAd;CCsOC,gBAAgB;ADtOH;;AAAd;;CAAc;;AAAd;CC8OC,UAAU;AD9OG;;AAAd;;CAAc;;AAAd;CCsPC,wBAAwB;ADtPX;;AAAd;;CAAc;;AAAd;;CC+PC,YAAY;AD/PC;;AAAd;;;CAAc;;AAAd;CCwQC,6BAA6B,EAAE,MAAM;CACrC,oBAAoB,EAAE,MAAM;ADzQf;;AAAd;;CAAc;;AAAd;CCiRC,wBAAwB;ADjRX;;AAAd;;;CAAc;;AAAd;CC0RC,0BAA0B,EAAE,MAAM;CAClC,aAAa,EAAE,MAAM;AD3RR;;AAAd;;;CAAc;;AAAd;;CAAc;;AAAd;CCwSC,kBAAkB;ADxSL,CAAd;;;;EAAc;;AAAd;;EAAc;;AAAd;;;;;;;;;;;;;EEuBE,SAAS;AFvBG;;AAAd;EE2BE,6BAA6B;EAC7B,sBAAsB;AF5BV;;AAAd;EEgCE,SAAS;EACT,UAAU;AFjCE;;AAAd;;EEsCE,gBAAgB;EAChB,SAAS;EACT,UAAU;AFxCE;;AAAd;;EAAc;;AAAd;;;;;EAAc;;AAAd;EEuDE,4NAAsP,EAAE,MAAM;EAC9P,gBAAgB,EAAE,MAAM;AFxDZ;;;AAAd;;;EAAc;;AAAd;EEkEE,oBAAoB;EACpB,oBAAoB;AFnER;;AAAd;;;;;;;;;;;;;;;;;;;;;;;;EAAc;;AAAd;;;EEmGE,sBAAsB,EAAE,MAAM;EAC9B,eAAe,EAAE,MAAM;EACvB,mBAAmB,EAAE,MAAM;EAC3B,0BAA0B,EAAE,MAAM;AFtGtB;;AAAd;;EAAc;;AAAd;EE8GE,qBAAqB;AF9GT;;AAAd;;;;;;;;EAAc;;AAAd;EE4HE,mBAAmB;AF5HP;;AAAd;EEgIE,gBAAgB;AFhIJ;;AAAd;EEqIE,UAAU;EACV,cAAwC;AFtI5B;;AAAd;;EEqIE,UAAU;EACV,cAAwC;AFtI5B;;AAAd;;EE2IE,eAAe;AF3IH;;AAAd;;;;;;EAAc;;AAAd;CEuJC,aAAa;AFvJA;;AAAd;EE2JE,yBAAyB;AF3Jb;;AAAd;;;;;;EEoKE,kBAAkB;EAClB,oBAAoB;AFrKR;;AAAd;;;EAAc;;AAAd;EE8KE,cAAc;EACd,wBAAwB;AF/KZ;;AAAd;;;;;;EAAc;;AAAd;;;;;EE+LE,UAAU;EACV,oBAAoB;EACpB,cAAc;AFjMF;;AAAd;;;;;EAAc;;AAAd;;;;EE+ME,+GAAyI;AF/M7H;;AAAd;;;;;;;;;;;;;;;EAAc;;AAAd;;;;;;;;EE2OE,cAAc,EAAE,MAAM;EACtB,sBAAsB,EAAE,MAAM;AF5OlB;;AAAd;;;;;EAAc;;AAAd;;EEwPE,eAAe;EACf,YAAY;AFzPA;;AAAd;;EAAc;;AAAd;EEiQE,aAAa;AFjQD;;AGAd;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;IHAA;;;;;;;;;;;OAAc;;IGAd;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;IAAA;SAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;;IAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;;IHAA,gFAAc;IGAd;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;IAAA;CAAA;CAAA;CAAA;AHCA;CGDA;AHCoB;AAApB;CGDA;AHCoB;AAApB;;CGDA;EAAA;EAAA;;CAAA;EAAA;EAAA;AHCoB;AAApB;;CGDA;EAAA;EAAA;;CAAA;EAAA;EAAA;AHCoB;AAApB;;CGDA;EAAA;EAAA;;CAAA;EAAA;EAAA;AHCoB;AAApB;;CGDA;EAAA;EAAA;;CAAA;EAAA;EAAA;AHCoB;AAApB;;CGDA;EAAA;EAAA;;CAAA;EAAA;EAAA;AHCoB;AGDpB;CAAA;CAAA;AAAA;;CAAA;EAAA;EAAA;CAAA;AAAA;CAAA;CAAA;CAAA;AAAA;;CAAA;EAAA;EAAA;CAAA;AHEA;CGFA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;;CGFA;EAAA;EAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;;CGFA;EAAA;EAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;IAAA;SAAA;AHEmB;AAAnB;CGFA;IAAA;SAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;MAAA;AHEmB;AAAnB;CGFA;MAAA;AHEmB;AAAnB;CGFA;MAAA;AHEmB;AAAnB;CGFA;MAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;CAAA;CAAA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAAnB;CGFA;AHEmB;AAFnB;CGAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;AH2TA;AA3TA;CGAA;CAAA;AH2TA;AA3TA;CGAA;AH2TA;AA3TA;CGAA;AH2TA;AA3TA;;CGAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;AH2TA;AA3TA;;CGAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;EAAA;AH2TA;AA3TA;;CGAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;EAAA;AH2TA;AA3TA;;CGAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;AH2TA;AA3TA;;CGAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;;CAAA;EAAA;EAAA;AH2TA;;AIzTA,6BACI,WACA,WACA,wBrKEU,CqKDV,gBACA,mB;ACLJ,aACI,gBAGI,+CACI,4BACA,6BAIR,gCACI,4BACA,yBACA,crKMM,CqKLN,gBACA,sCACI,oBtKVE,CsKWF,aAIR,yBACI,kBtKnBK,CsKoBL,+CACA,iBACA,YACA,gBACA,UACA,8BACA,+BACA,gCAGJ,wBACI,eACA,gCAEA,qCACI,mBAGJ,2CACI,gBACA,+BAEA,oDACI,wBtKzCF,CsK4CF,kDACI,yBAGJ,2DACI,2BAIR,8BACI,wBtKtDE,CsKuDF,wDACI,2B","sources":["webpack://@flowfuse/flowfuse/./frontend/src/ui-components/stylesheets/ff-core.scss","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/stylesheets/ff-colors.scss","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/stylesheets/ff-utility.scss","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/stylesheets/ff-components.scss","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/stylesheets/ff-theme-light.scss","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/stylesheets/ff-theme-dark.scss","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/stylesheets/ff-immersive-editor.scss","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/components/empty-state.scss","webpack://@flowfuse/flowfuse/./frontend/src/components/TeamTypeTile.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/PageNotFound.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/SectionTopMenu.vue","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/components/form/ListBox.vue","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/components/accordion.scss","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/components/audit-log.scss","webpack://@flowfuse/flowfuse/./frontend/src/components/dialogs/AssetDetailDialog.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/blueprints/BlueprintTile.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/admin/FlowBlueprints/dialogs/ImportFlowBlueprintsDialog.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/admin/FlowBlueprints/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/admin/NotificationsHub.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/admin/Template/sections/Catalogues.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/admin/Template/sections/NPMRegistry.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/TextCopier.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/admin/Template/sections/Environment.vue","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/pages/admin.scss","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/components/info-card.scss","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/components/PopoverItem.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/icons-animated/Installing.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/icons-animated/Pulling.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/icons-animated/Pushing.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/icons-animated/Restarting.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/icons-animated/Starting.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/device/Overview.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/charts/performance/CpuChart.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/charts/performance/MemoryChart.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/variant-selector/TabSelector.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/variant-selector/OptionTileSelector.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/notices/NoticeBanner.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/dialogs/device-group-management/components/device-list.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/elements/ToggleButtonGroup.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/device/VersionHistory/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/dialogs/SnapshotDiffChangePanel.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/dialogs/AssetCompareDialog.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/flow-viewer/FlowViewer.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/drawers/snapshots/SnapshotDetailsDrawer.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/device/VersionHistory/Snapshots/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/version-history/timeline/TimelineGraph.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/version-history/timeline/TimelineEvent.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/device/VersionHistory/Timeline/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/device/components/AssignDeviceDialog.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/device/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/immersive-editor/DrawerTrigger.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/ResizeBar.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/immersive-editor/EditorDrawer.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/immersive-editor/LoadingScreenWrapper.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/device/Editor/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/components/blueprint-selection.scss","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/Blueprints/BlueprintSelection.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/dialogs/BlueprintSelectorDialog.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/components/InstanceForm.vue","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/components/form/DateTime.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/Settings/Maintenance.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/VersionHistory/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/VersionHistory/Timeline/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/FileUpload.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/file-browser/cells/FilePath.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/file-browser/VisibilitySelector.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/Assets.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/DevicesBrowser.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/multi-step-forms/StepSlider.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/multi-step-forms/MultiStepForm.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/multi-step-forms/instance/steps/ApplicationStep.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/multi-step-forms/instance/steps/DuplicationStep.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/multi-step-forms/instance/steps/InstanceStep.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/components/InstanceLogs.vue","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/pages/project.scss","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/Overview.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/Performance/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/instance/ActionButton.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/components/DashboardLink.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/components/EditorLink.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/multi-step-forms/instance/steps/flows-step/BlueprintsSection.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/multi-step-forms/instance/steps/flows-step/ImportFlowsSection.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/multi-step-forms/instance/steps/flows-step/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/bill-of-materials/InstancesItem.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/bill-of-materials/VersionsList.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/bill-of-materials/DependencyItem.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/application/DeviceGroup/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/components/pipelines.scss","webpack://@flowfuse/flowfuse/./frontend/src/pages/application/components/cells/DeploymentName.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/pipelines/DeployStageDialog.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/application/Settings/components/RoleRow.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/IconLink.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/components/ApplicationSummaryLabel.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/tiles/InstanceCounter.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Applications/components/Application.vue","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/components/applications-list.scss","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Applications/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/AuditLog.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Billing/components/UsageOverview.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/tiles/MediumTile.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Clients/components/BrokerClient.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Clients/dialogs/ClientDialog.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Clients/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Docs/components/TopicDocs.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Docs/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Hierarchy/components/TopicSegment.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Hierarchy/TopicHierarchy/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Hierarchy/TopicInspector/PayloadMetadata.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Hierarchy/components/TopicSchema.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Hierarchy/components/suggestions/TopicSuggestion.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Hierarchy/TopicInspector/PayloadSchema.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Hierarchy/TopicInspector/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/Hierarchy/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Brokers/components/BrokerForm.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Home/components/DashboardSection.vue","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/components/kebab-menu/KebabMenu.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/instance/components/InstanceMinimalStatusBadge.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Home/components/RecentlyModifiedDevices.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Home/components/RecentlyModifiedInstances.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Home/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Library/Blueprints.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Library/Registry/components/RegistryEntry.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Library/Registry/Index.vue","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/components/code-previewer.scss","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Library/TeamLibrary.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Members/components/ApplicationPermissionsRow.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Performance/components/CPUUtilizationCell.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Pipelines/components/TeamPipelineStage.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Pipelines/components/TeamPipeline.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Pipelines/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Settings/TeamAdminTools.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Tables/Table/TableExplorer/components/RowsHeader.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Tables/Table/TableExplorer/components/table-cells/text-cell.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Tables/Table/TableExplorer/components/RowsList.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Tables/Table/TableExplorer/drawers/components/TableColumn.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Tables/Table/TableExplorer/drawers/CreateTable.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Tables/Table/TableExplorer/drawers/TableSchema.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Tables/Table/TableExplorer/components/TablesList.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Tables/Table/TableExplorer/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Tables/Table/components/TableCredentials.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Tables/components/ChooseDatabase.vue","webpack://@flowfuse/flowfuse/./frontend/src/pages/team/Tables/components/DatabaseForm.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/multi-step-forms/instance/steps/TeamStep.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/dialogs/EducationModal.vue","webpack://@flowfuse/flowfuse/./frontend/src/layouts/Docs.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/ExpertButton.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/NotificationsButton.vue","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/components/team-list.scss","webpack://@flowfuse/flowfuse/./frontend/src/components/TeamSelection.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/global-search/components/ResultSection.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/global-search/components/SearchTrigger.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/global-search/GlobalSearch.vue","webpack://@flowfuse/flowfuse/./frontend/src/layouts/ImmersiveEditor.vue","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/components/notifications.scss","webpack://@flowfuse/flowfuse/./frontend/src/components/drawers/LeftDrawer.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/drawers/RightDrawer.vue","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/pages/login.scss","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/layouts.scss","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/transitions.scss","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/animations.scss","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/components/charts.scss","webpack://@flowfuse/flowfuse/./frontend/src/stylesheets/common.scss","webpack://@flowfuse/flowfuse/./frontend/src/index.css","webpack://@flowfuse/flowfuse/./frontend/src/%3Cinput%20css%20L7LxdO%3E","webpack://@flowfuse/flowfuse/./frontend/src/%3Cinput%20css%20ZjglFo%3E","webpack://@flowfuse/flowfuse/<no source>","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/components/Divider.vue","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/components/form/ComboBox.vue"],"sourcesContent":["@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n@use \"../../ui-components/stylesheets/ff-utility.scss\" as *;\n\n/*\n  ff-core contains styling on the fundamental HTML elements\n*/\n\n* {\n    box-sizing: border-box;\n}\n\n.transition-fade--color {\n    --time: 0.3s;\n    transition: var(--time) color, var(--time) background-color, var(--time) fill, var(--time) stroke, var(--time) border-color;\n    -webkit-transition: var(--time) color, var(--time) background-color, var(--time) fill, var(--time) stroke, var(--time) border-color;\n}\n\nhtml {\n    font-family: ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,\"Helvetica Neue\",Arial,\"Noto Sans\",sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\";\n    font-size: 14px;\n    line-height: 1.25rem;\n}\n\nbody {\n    margin: 0;\n    color: $ff-grey-800;\n    position: relative;\n    overflow: hidden;\n}\n\nh1 {\n    font-weight: bold;\n    font-size: $ff-funit-xl;\n    line-height: 1.45 * $ff-funit-xl;\n    margin-bottom: $ff-unit-lg;\n}\n\nh2 {\n    font-weight: bold;\n    font-size: $ff-funit-lg;\n    line-height: 1.45 * $ff-funit-lg;\n    margin-bottom: $ff-unit-sm;\n}\n\nh3 {\n    font-size: $ff-funit-md;\n    line-height: 1.45 * $ff-funit-md;\n    margin-bottom: $ff-unit-sm;\n    font-weight: bold;\n}\n\nh4 {\n    font-size: $ff-funit-md;\n    line-height: 1.45 * $ff-funit-sm;\n    margin-bottom: $ff-unit-sm;\n    font-weight: 500;\n}\n\ncode {\n    border-radius: $ff-unit-sm;\n    border: 1px solid $ff-grey-200;\n    padding: $ff-unit-md;\n}\n\np code {\n    padding: 0 $ff-unit-xs;\n}\n\n.ff-description {\n    font-size: $ff-funit-sm;\n    color: $ff-grey-400;\n}\n","// Raw Color Scheme\n\n$ff-black: black;\n$ff-white: white;\n\n$ff-grey-50: #F9FAFB;\n$ff-grey-100: #F3F4F6;\n$ff-grey-200: #E5E7EB;\n$ff-grey-300: #D1D5DB;\n$ff-grey-400: #9CA3AF;\n$ff-grey-500: #6B7280;\n$ff-grey-600: #4B5563;\n$ff-grey-700: #374151;\n$ff-grey-800: #1F2937;\n$ff-grey-900: #111827;\n\n$ff-red-50: #FFEBEB;\n$ff-red-100: #FFC6C6;\n$ff-red-200: #FF8D8D;\n$ff-red-300: #F16F6F;\n$ff-red-400: #ED4E4E;\n$ff-red-500: #D12B2B;\n$ff-red-500B: #D82525;\n$ff-red-600: #BC3838;\n$ff-red-700: #AB1818;\n$ff-red-800: #8F0001;\n$ff-red-900: #760000;\n\n$ff-teal-50: #E4FBFC;\n$ff-teal-100: #C4F3F5;\n$ff-teal-200: #B2EBEE;\n$ff-teal-300: #8CE2E7;\n$ff-teal-400: #74D4D9;\n$ff-teal-500: #50C3C9;\n$ff-teal-600: #35AAB0;\n$ff-teal-700: #31959A;\n$ff-teal-800: #397B7E;\n$ff-teal-900: #406466;\n\n$ff-blue-50: #EFF6FF;\n$ff-blue-100: #DBEAFE;\n$ff-blue-200: #BFDBFE;\n$ff-blue-300: #93C5FD;\n$ff-blue-400: #60A5FA;\n$ff-blue-500: #3B82F6;\n$ff-blue-600: #2563EB;\n$ff-blue-700: #1D4ED8;\n$ff-blue-800: #1E40AF;\n$ff-blue-900: #1E3A8A;\n\n$ff-indigo-50: #EEF2FF;\n$ff-indigo-100: #E0E7FF;\n$ff-indigo-200: #C7D2FE;\n$ff-indigo-300: #A5B4FC;\n$ff-indigo-400: #818CF8;\n$ff-indigo-500: #6366F1;\n$ff-indigo-600: #4F46E5;\n$ff-indigo-700: #4338CA;\n$ff-indigo-800: #3730A3;\n$ff-indigo-900: #312E81;\n\n$ff-green-50: #ECFDF5;\n$ff-green-100: #D1FAE5;\n$ff-green-200: #A7F3D0;\n$ff-green-300: #6EE7B7;\n$ff-green-400: #34D399;\n$ff-green-500: #10B981;\n$ff-green-600: #059669;\n$ff-green-700: #047857;\n$ff-green-800: #065F46;\n$ff-green-900: #064E3B;\n\n$ff-yellow-10: #FFFCF5;\n$ff-yellow-50: #FFFBEB;\n$ff-yellow-100: #FEF3C7;\n$ff-yellow-200: #FDE68A;\n$ff-yellow-300: #FCD34D;\n$ff-yellow-400: #FBBF24;\n$ff-yellow-500: #F59E0B;\n$ff-yellow-600: #D97706;\n$ff-yellow-700: #B45309;\n$ff-yellow-800: #92400E;\n$ff-yellow-900: #78350F;\n\n// Theme Colors\n\n$ff-color--action: $ff-indigo-800;\n$ff-color--highlight: $ff-indigo-600;\n$ff-color--highlight--light: $ff-grey-100;\n$ff-color--danger: $ff-red-500;\n$ff-color--danger--dark: $ff-red-600;\n$ff-color--disabled: $ff-grey-400;\n$ff-color--border: $ff-grey-200;\n$ff-color--context-menu: $ff-white;\n","/*\n    ff-utility contains functional variables and classes for padding/margin and sizings\n*/\n\n// screen sizes\n$ff-screen-sm: 640px;\n$ff-screen-md: 768px;\n$ff-screen-lg: 1024px;\n$ff-screen-xl: 1280px;\n$ff-screen-2xl: 1536px;\n\n// unit\n$ff-unit-xs: 3px;\n$ff-unit-sm: 6px;\n$ff-unit-md: 9px;\n$ff-unit-lg: 18px;\n$ff-unit-xl: 27px;\n\n// font unit\n$ff-funit-xs: 0.75rem;\n$ff-funit-sm: 0.85rem;\n$ff-funit-md: 1rem;\n$ff-funit-lg: 1.5rem;\n$ff-funit-xl: 2rem;\n\n@mixin truncate {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n@use \"../../ui-components/stylesheets/ff-utility.scss\" as *;\n\n/*\n  ff-core contains styling on the custom, ff components\n*/\n\n.ff-icon {\n  width: 20px;\n  height: 20px;\n  display: inline-block;\n}\n\n.ff-disabled {\n  pointer-events: none;\n  opacity: 0.4;\n}\n\n.ff-icon-sm {\n  width: 16px;\n  height: 16px;\n  display: inline-block;\n}\n\n.ff-icon-md {\n  width: 20px;\n  height: 20px;\n  display: inline-block;\n}\n\n.ff-icon-lg {\n  width: 24px;\n  width: 24px;\n  height: 24px;\n  display: inline-block;\n}\n\n/*\n  FF Breadcrumb\n*/\n\n.ff-nav-breadcrumb {\n  display: flex;\n  align-items: center;\n  a {\n    color: $ff-blue-600;\n    font-weight: bold;\n    font-size: 1.25rem;\n    line-height: 1.75rem;\n    white-space: nowrap;\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n}\n\n.ff-nav-breadcrumb--active span {\n  color: $ff-grey-800;\n  font-weight: bold;\n  font-size: 1.25rem;\n  line-height: 1.75rem;\n  white-space: nowrap;\n}\n\n/*\n  FF Button\n*/\n\n// nested element\n.ff-btn--icon,\n.ff-btn--icon svg {\n  width: 20px;\n  height: 20px;\n}\n.ff-btn--icon-left {\n  margin-left: -$ff-unit-xs;\n  margin-right: $ff-unit-sm;\n}\n.ff-btn--icon-right {\n  margin-left: $ff-unit-sm;\n  margin-right: -$ff-unit-xs;\n}\n\n.ff-btn {\n  border-radius: $ff-unit-sm;\n  display: flex;\n  align-items: center;\n  font-size: $ff-funit-sm;\n  line-height: 20px;\n  height: 32px;\n  position: relative;\n\n  justify-content: center;\n  font-weight: bold;\n  height: auto;\n  padding: $ff-unit-sm 16px;\n  border: 0;\n\n  &.ff-btn-icon {\n    padding: $ff-unit-sm $ff-unit-md;\n  }\n\n  &.ff-btn-small {\n    padding: $ff-unit-xs $ff-unit-sm;\n    font-size: $ff-funit-xs;\n    line-height: 16px;\n    height: 24px;\n  }\n\n  &.ff-btn-medium {\n    padding: $ff-unit-xs $ff-unit-sm;\n    font-size: $ff-funit-xs;\n    line-height: 18px;\n    height: 26px;\n  }\n\n  &.ff-btn-fwidth {\n    justify-content: center;\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n\n  &--primary {\n    background-color: $ff-color--action;\n    border: 1px solid $ff-color--action;\n    color: $ff-grey-50;\n    &:hover, &.active {\n      background-color: $ff-color--highlight;\n    }\n  }\n  &--secondary {\n    background-color: $ff-white;\n    color: $ff-color--action;\n    border: 1px solid $ff-color--action;\n    &:hover, &.active {\n      background-color: $ff-color--highlight;\n      border-color: $ff-color--highlight;\n      color: $ff-white;\n    }\n  }\n  &--tertiary {\n    color: $ff-color--action;\n    &:hover, &.active {\n      background-color: $ff-color--highlight;\n      color: $ff-white;\n    }\n    &[disabled=\"\"] {\n      background-color: transparent !important;\n    }\n  }\n  &--danger {\n    color: $ff-white;\n    background-color: $ff-color--danger;\n    border: 1px solid $ff-color--danger;\n    &:hover {\n      background-color: $ff-color--danger--dark;\n      color: $ff-white;\n    }\n  }\n  &--secondary-danger {\n    color: $ff-color--danger;\n    background-color: $ff-white;\n    border: 1px solid $ff-color--danger;\n    &:hover {\n      background-color: $ff-color--danger--dark;\n      color: $ff-white;\n    }\n  }\n  &--tertiary-danger {\n    color: $ff-color--danger;\n    &:hover {\n      background-color: $ff-color--danger--dark;\n      color: $ff-white;\n    }\n  }\n\n  &.ff-btn-small {\n    .ff-btn--icon,\n    .ff-btn--icon svg {\n      width: 16px;\n      height: 16px;\n    }\n    .ff-btn--icon-left {\n      margin-right: $ff-unit-xs;\n    }\n    .ff-btn--icon-right {\n      margin-left: $ff-unit-xs;\n    }\n  }\n\n  &.ff-btn-fwidth {\n    .ff-btn--icon {\n      position: absolute;\n    }\n    .ff-btn--icon-left {\n      left: 0;\n      padding-left: $ff-unit-lg;\n    }\n    .ff-btn--icon-left {\n      right: 0;\n      padding-right: $ff-unit-lg;\n    }\n  }\n\n  &:disabled,\n  &[disabled=true] {\n    cursor: not-allowed;\n    border-color: $ff-grey-200;\n    color: $ff-grey-400;\n    background-color: $ff-grey-200;\n  }\n}\n\n/*\n  Drawer responsive context\n  Remove icon margins when buttons are in icon-only mode within narrow drawer\n*/\n@container drawer (max-width: 639px) {\n  .ff-btn-icon {\n    .ff-btn--icon-left {\n      margin-left: 0;\n      margin-right: 0;\n    }\n    .ff-btn--icon-right {\n      margin-left: 0;\n      margin-right: 0;\n    }\n  }\n}\n\n/*\n  Viewport responsive context (for pages outside drawer, e.g., instance overview)\n  Remove icon margins when viewport is narrow and buttons are in icon-only mode\n  Breakpoint matches Tailwind's sm breakpoint (640px)\n*/\n@media (max-width: 639px) {\n  .ff-btn-icon {\n    .ff-btn--icon-left {\n      margin-left: 0;\n      margin-right: 0;\n    }\n    .ff-btn--icon-right {\n      margin-left: 0;\n      margin-right: 0;\n    }\n  }\n}\n\n/*\n  FF Kebab Menu\n*/\n\n.ff-kebab-menu {\n  position: relative;\n  >svg {\n    width: 20px;\n    cursor: pointer;\n    &:hover {\n      fill: $ff-blue-600;\n    }\n  }\n  &.active {\n    >svg {\n      fill: $ff-blue-600;\n    }\n  }\n}\n\n.ff-kebab-options {\n  color: $ff-grey-800;\n  position: absolute;\n  top: 24px;\n  border: 1px solid $ff-grey-300;\n  z-index: 1000;\n  padding: 0;\n  box-shadow: 0px 6px 9px 0px #00000038;\n  li {\n    min-width: 150px;\n    white-space: nowrap;\n    &.ff-kebab-item--danger {\n      color: $ff-red-500;\n    }\n  }\n  &--left {\n    left: 0;\n  }\n  &--right {\n    right: calc(100% - 24px);\n  }\n}\n\n.ff-kebab-divider {\n  height: 1px;\n  background-color: $ff-grey-200;\n  list-style: none;\n}\n\n/*\n  FF List Item\n*/\nli.ff-kebab-item {\n  padding: 12px 48px 12px 12px;\n  background-color: white;\n  &:hover {\n    cursor: pointer;\n    background-color: $ff-grey-200;\n  }\n  &.active {\n    background-color: $ff-grey-100;\n  }\n  &.disabled, :disabled {\n    pointer-events: none;\n    label {\n      opacity: 0.5;\n    }\n  }\n}\n\n/*\n  FF Input\n*/\n\n.ff-input {\n  &.ff-text-input {\n    border: 1px solid $ff-grey-300;\n    border-radius: $ff-unit-sm;\n    height: 32px;\n    width: 100%;\n    display: flex;\n    gap: 0px;\n    align-items: center;\n    background-color: $ff-white;\n    border-color: $ff-grey-300;\n    svg {\n      width: 20px;\n      height: 20px;\n      margin-left: $ff-unit-sm;\n    }\n    input {\n      flex-grow: 1;\n      padding: $ff-unit-sm $ff-unit-md;\n      border-radius: $ff-unit-sm;\n      background: none;\n      height: 100%;\n      border-width: 0;\n      min-width: 0;\n      &[disabled] {\n        background-color: $ff-grey-50;\n        color: $ff-grey-300;\n      }\n      &:focus-visible {\n        border: none;\n        outline: none;\n      }\n    }\n    &:focus-within {\n      border-color: $ff-blue-600;\n      border-width: 2px;\n      outline: none;\n      svg {\n        margin-left: $ff-unit-sm - 1px;\n      }\n    }\n  }\n}\n\n.ff-input--error {\n  &.ff-text-input {\n    border-color: $ff-red-500;\n    border-width: 2px;\n    outline: none;\n  }\n}\n\n.ff-dropdown {\n  position: relative;\n  display: inline-block;\n  cursor: pointer;\n  &[disabled=\"true\"] {\n    cursor: not-allowed;\n    background-color: $ff-grey-50;\n    color: $ff-grey-400;\n  }\n  .ff-dropdown-selected {\n    background-color: white;\n    border: 1px solid $ff-grey-300;\n    border-radius: $ff-unit-sm;\n    padding: $ff-unit-sm $ff-unit-md;\n    height: 32px;\n    width: 100%;\n    display: flex;\n    justify-content: space-between;\n    z-index: 2;\n\n    > .ff-dropdown-selected-item {\n      flex-shrink: 1;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    > .ff-dropdown-icon {\n      flex-shrink: 0;\n    }\n  }\n  .ff-dropdown-options {\n    position: absolute;\n    top: 100%;\n    display: none;\n    max-height: 14rem;\n    overflow-y: auto;\n    box-shadow: 0px 6px 9px 0px #00000038;\n    .ff-dropdown-option {\n      padding: $ff-unit-sm $ff-unit-md;\n      background-color: $ff-grey-50;\n      border-bottom: 1px solid $ff-grey-200;\n      cursor: pointer;\n      transition: ease-in-out .3s;\n      &:hover {\n        background-color: $ff-grey-100;\n      }\n    }\n    &.ff-dropdown-options--full-width {\n      width: 100%;\n      border-width: 0 1px 1px 1px;\n    }\n    &.ff-dropdown-options--fit {\n      border-width: 1px;\n      min-width: none;\n      .ff-dropdown-option {\n        padding-right: $ff-unit-xl;\n      }\n    }\n    &.ff-dropdown-options--align-left {\n      left: 0;\n    }\n    &.ff-dropdown-options--align-right {\n      right: 0;\n    }\n  }\n  &.ff-dropdown--open {\n    .ff-dropdown-selected {\n      border-bottom-left-radius: 0;\n      border-bottom-right-radius: 0;\n    }\n    .ff-dropdown-options {\n      display: block;\n      z-index: 2;\n    }\n  }\n}\n\n.ff-checkbox,\n.ff-radio-btn {\n  position: relative;\n  padding-left: 25px;\n  display: flex;\n  cursor: pointer;\n  input[type=checkbox], input[type=radio] {\n    display: none;\n  }\n  label {\n    cursor: pointer;\n    font-weight: 500;\n    font-size: 0.875rem;\n    line-height: 1.25rem;\n  }\n  /* Create a custom checkbox */\n  .checkbox {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 16px;\n    width: 16px;\n    margin-left: 4px;\n    border-radius: 4px;\n    background-color: transparent;\n    border: 1px solid;\n    border-color: $ff-grey-400;\n  }\n  &:hover:not([disabled=true]) {\n    .checkbox {\n      background-color: $ff-grey-200;\n    }\n  }\n  &:hover:not([disabled=true]) {\n    .checkbox[checked=true] {\n      background-color: $ff-grey-500;\n    }\n  }\n  &[disabled=true] {\n    cursor: not-allowed;\n    label, p {\n      color: $ff-grey-400;\n    }\n  }\n  &[disabled=true] * {\n    pointer-events: none;\n  }\n  .checkbox {\n    &[checked=true] {\n      background-color: $ff-grey-600;\n      border-color: $ff-grey-700;\n    }\n    &[checked=true]:after {\n      display: block;\n    }\n  }\n}\n\n.ff-checkbox {\n  .checkbox:after {\n    content: \"\";\n    display: none;\n    position: absolute;\n    left: 4.5px;\n    top: 1px;\n    width: 5px;\n    height: 10px;\n    border: solid white;\n    border-width: 0 2px 2px 0;\n    -webkit-transform: rotate(45deg);\n    -ms-transform: rotate(45deg);\n    transform: rotate(45deg);\n  }\n}\n\n/**\n *  FF Toggle Switch\n */\n\n.ff-toggle-switch {\n    --ff-toggle-width: 54px;\n    --ff-toggle-translate: 20px;\n    position: relative;\n    display: inline-block;\n    width: var(--ff-toggle-width);\n    height: 34px;\n    cursor: pointer;\n    input {\n      display: none;\n    }\n    &.checked .ff-toggle-switch-slider {\n      background-color: $ff-blue-900;\n    }\n    &.checked .ff-toggle-switch-slider .ff-toggle-switch-button{\n      -webkit-transform: translateX(var(--ff-toggle-translate));\n      -ms-transform: translateX(var(--ff-toggle-translate));\n      transform: translateX(var(--ff-toggle-translate));\n    }\n    &[disabled=true] {\n      cursor: not-allowed;\n      .ff-toggle-switch-slider {\n        pointer-events: none;\n        background-color: $ff-grey-200;\n      }\n      .ff-toggle-switch-button {\n        background-color: $ff-grey-50;\n      }\n      svg {\n        color: $ff-grey-300;\n      }\n    }\n}\n\n.ff-toggle-switch-slider {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background-color: $ff-grey-400;\n    border-radius: 34px;\n    -webkit-transition: 0.4s;\n    transition: 0.4s;\n    svg {\n      padding: 3px;\n      width: 100%;\n      height: 100%;\n    }\n    &:hover {\n      background-color: $ff-indigo-700 !important;\n    }\n}\n\n.ff-toggle-switch-button {\n    position: absolute;\n    content: \"\";\n    height: 26px;\n    width: 26px;\n    left: 4px;\n    bottom: 4px;\n    background-color: white;\n    border-radius: 50%;\n    -webkit-transition: 0.4s;\n    transition: 0.4s;\n}\n\n/**\n *  FF Radio Group\n */\n\n.ff-radio-group {\n  .ff-radio-group-label {\n    display: block;\n  }\n  .ff-radio-group-options {\n    display: block;\n    margin-top: 1rem;\n  }\n  .ff-radio-group--horizontal {\n    display: flex;\n    .ff-radio-btn {\n      margin-right: $ff-funit-lg;\n    }\n  }\n  .ff-radio-group--vertical {\n    .ff-radio-btn {\n      display: block;\n      margin-bottom: $ff-funit-md;\n    }\n  }\n  .ff-radio-group--grid {\n    display: grid;\n    .ff-radio-btn {\n      display: block;\n      margin-bottom: $ff-funit-md;\n    }\n  }\n}\n\n.ff-radio-btn {\n  .checkbox {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 16px;\n    width: 16px;\n    border-radius: 4px;\n    background-color: transparent;\n    border: 1px solid $ff-grey-400;\n    background-image: url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e\")\n  }\n}\n\n.ff-tile-selection {\n  display: flex;\n  flex-wrap: wrap;\n  gap: $ff-unit-md;\n  .ff-tile-selection-option {\n    --ff-tile-selection-color: #{$ff-blue-700};\n    display: flex;\n    flex-direction: column;\n    background-color: $ff-white;\n    font-size: 0.875rem;\n    border: 2px solid $ff-grey-300;\n    border-radius: $ff-unit-sm;\n    padding: 12px $ff-unit-lg;\n    width: 275px;\n    ul {\n      list-style: disc;\n      margin-top: 3px;\n      padding-left: 18px;\n      li {\n        line-height: 1.5rem;\n      }\n    }\n    &:last-child {\n      margin-right: 0;\n    }\n    &--header {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      h2 {\n        font-size: 14px;\n      }\n      > h2 {\n        display: flex;\n        align-items: center;\n        gap: $ff-unit-md;\n        padding-right: $ff-unit-xl;\n        margin: 0;\n        svg {\n          width: 20px;\n          height: 20px;\n          fill: $ff-grey-300;\n          &.ff-tile-selection-option--edit {\n            cursor: pointer;\n            fill: $ff-blue-800;\n            &:hover {\n              fill: $ff-indigo-600;\n            }\n          }\n        }\n      }\n    }\n    &--price {\n      text-align: center;\n      h2 {\n        margin: 0;\n        line-height: 1rem;\n      }\n      label {\n        font-size: $ff-funit-sm;\n      }\n    }\n    &--description {\n      flex-grow: 1;\n      margin-top: $ff-unit-sm;\n      padding-top: $ff-unit-sm;\n      border-top: 1px solid $ff-grey-300;\n    }\n    &--meta {\n      margin-top: $ff-unit-md;\n      padding-top: $ff-unit-md;\n      border-top: 1px solid $ff-grey-300;\n      >div {\n        display: flex;\n        justify-content: space-between;\n        width: 100%;\n        margin-bottom: $ff-unit-sm;\n        &:last-child {\n          margin-bottom: 0;\n        }\n      }\n    }\n    &:not(.editable):not(.disabled):hover {\n      cursor: pointer;\n      border: 2px solid var(--ff-tile-selection-color);\n    }\n    &.active {\n      border: 2px solid var(--ff-tile-selection-color);\n      .ff-tile-selection-option--header svg {\n        fill: var(--ff-tile-selection-color);\n      }\n    }\n    &.disabled {\n      opacity: 0.5;\n    }\n  }\n}\n\n/*\n  FF Data Table\n*/\n.ff-data-table {\n  width: 100%;\n  font-size: 0.875rem;\n  line-height: 1.25rem;\n  &--options {\n    margin-bottom: 6px;\n    display: flex;\n    gap: 6px;\n    justify-content: flex-end;\n  }\n  &--search.ff-text-input {\n    flex-grow: 1;\n    width: auto;\n    height: 34px;\n    border-radius: 6px;\n  }\n  &--actions {\n    display: flex;\n    gap: 6px;\n  }\n  &--data {\n    border-collapse: separate;\n    border-spacing: 0;\n    width: 100%;\n    .ff-data-table--cell {\n      .ff-icon {\n        margin: -1px 0;\n      }\n      .ff-icon-lg {\n        margin: -3px 0;\n      }\n      .ff-btn .ff-icon,\n      .ff-btn .ff-icon-lg {\n        margin: 0;\n      }\n      &:first-child {\n        padding-left: 16px;\n      }\n      &:last-child {\n        padding-right: 16px;\n      }\n    }\n    thead {\n      background: white; // hides td borders when header is sticky\n      .ff-data-table--row .ff-data-table--cell {\n        &:first-child {\n          border-top-left-radius: 6px;\n        }\n        &:last-child {\n          border-top-right-radius: 6px;\n        }\n      }\n      .ff-data-table--cell {\n        padding: 9px 12px;\n        background-color: $ff-grey-100;\n        font-weight: 600;\n        transition: 0.3s background-color, 0.3s color;\n        -webkit-transition: 0.3s background-color, 0.3s color;\n        &.sortable {\n          >div {\n            display: flex;\n            justify-content: space-between;\n            gap: $ff-unit-md;\n          }\n          .ff-icon {\n            opacity: 0.2;\n          }\n          &:hover {\n            background-color: $ff-grey-200;\n            cursor: pointer;\n            .ff-icon {\n              opacity: 0.5;\n            }\n          }\n        }\n        &.sorted {\n          background-color: $ff-grey-200;\n          .ff-icon.icon-sorted {\n            opacity: 1;\n          }\n        }\n      }\n    }\n    tbody {\n      .ff-data-table--row {\n        &.collapsible {\n          td {\n            border-top: none;\n            border-bottom: none;\n            padding: 0;\n          }\n        }\n\n        &:last-of-type {\n          td {\n            border-bottom: 1px solid $ff-grey-300;\n          }\n        }\n\n        &:last-child {\n          .ff-data-table--cell {\n            border-bottom-width: 1px;\n            border-top-color: $ff-grey-200;\n            &:first-child {\n              border-bottom-left-radius: 6px;\n            }\n            &:last-child {\n              border-bottom-right-radius: 6px;\n            }\n          }\n        }\n      }\n      .ff-data-table--cell {\n        padding: 12px 12px;\n        background-color: white;\n        &.highlight {\n          background-color: $ff-grey-50;\n        }\n        &.status-message {\n          text-align: center;\n          color: $ff-grey-400;\n        }\n      }\n      .selectable:hover .ff-data-table--cell,\n      .selectable:hover .ff-data-table--cell span svg.ff-icon {\n        cursor: pointer;\n        color: $ff-blue-600;\n        background-color: $ff-grey-50;\n      }\n      .selectable:hover .ff-data-table--cell button svg.ff-icon {\n        background-color: transparent;\n        color: inherit;\n      }\n    }\n  }\n  &--row {\n    td {\n      border-width: 1px 0px 0px;\n      border-style: solid;\n      border-color: $ff-grey-300;\n      &:first-child {\n        border-left-width: 1px;\n      }\n      &:last-child {\n        border-right-width: 1px;\n      }\n    }\n    &-actions {\n      display: flex;\n      gap: 12px;\n      justify-content: flex-end;\n    }\n  }\n}\n\n.ff-data-table thead .ff-checkbox,\n.ff-data-table tbody .ff-checkbox,\n.ff-data-table tbody .ff-radio-btn {\n    display: inline;\n}\n\n.ff-loadmore {\n  width: 100%;\n  text-align: center;\n  span {\n    display: inline-block;\n    margin: auto;\n    color: $ff-blue-500;\n    background-color: white;\n    padding: $ff-unit-xs $ff-unit-md 4px;\n    border: 1px solid $ff-grey-300;\n    border-top: 0;\n    border-radius: 0 0 6px 6px;\n    &:hover {\n      cursor: pointer;\n      color: $ff-blue-700;\n    }\n  }\n}\n\n/*\n  FF Dialog Box\n*/\n.ff-dialog-container {\n  position: fixed;\n  z-index: 110;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  justify-content: center;\n  align-items: flex-start;\n  overflow-y: hidden;\n  background-color: rgba($ff-grey-800, 0.3);\n  &--open {\n    display: flex;\n  }\n  &--closed {\n    display: none;\n  }\n}\n\n.ff-dialog-box {\n  position: relative;\n  z-index: 2;\n  width: 100%;\n  max-width: 42rem;\n  margin: 90px auto;\n  display: flex;\n  flex-direction: column;\n  background-color: $ff-white;\n  max-height: 85vh;\n  overflow: auto;\n  .ff-dialog {\n    &-header {\n      height: 48px;\n      line-height: 48px;\n      background-color: $ff-grey-800;\n      border-bottom: 2px solid $ff-red-400;\n      padding: 0 $ff-unit-lg;\n      color: $ff-white;\n      font-weight: 600;\n      display: flex;\n      justify-content: space-between;\n      gap: 12px;\n      &--light {\n        height: auto;\n        line-height: normal;\n        background-color: $ff-white;\n        border-bottom: 1px solid $ff-grey-200;\n        color: $ff-grey-800;\n        padding: $ff-unit-md $ff-unit-lg;\n        align-items: center;\n      }\n    }\n    &-subheader {\n      opacity: 0.65;\n      display: block;\n    }\n    &-content {\n      padding: $ff-funit-lg;\n      overflow: auto;\n      max-height: 75vh;\n    }\n    &-actions {\n      display: flex;\n      justify-content: flex-end;\n      padding: $ff-unit-md $ff-unit-lg $ff-unit-lg $ff-unit-lg;\n      .ff-btn {\n        margin-left: $ff-funit-md;\n      }\n    }\n  }\n  &--wide {\n    max-width: 52rem;\n  }\n}\n\n/*\n  Help Tooltip\n*/\n\n.ff-help-tooltip {\n  &:hover {\n    path {\n      fill: $ff-blue-800;\n    }\n  }\n}\n\n/*\n  Notifications\n*/\n\n.ff-notification-pill {\n  background-color: $ff-red-600;\n  color: $ff-white;\n  padding: $ff-unit-xs $ff-unit-md;\n  font-weight: 600;\n  border-radius: $ff-unit-sm;\n  font-size: $ff-funit-sm;\n}\n\n.ff-notification-toast {\n  position: relative;\n  background-color: $ff-white;\n  border: 1px solid $ff-grey-400;\n  padding: $ff-unit-md $ff-unit-md $ff-unit-md $ff-unit-lg;\n  box-shadow: -$ff-unit-sm $ff-unit-sm $ff-unit-sm #0000008c;\n  border-radius: 0 $ff-unit-sm $ff-unit-sm 0;\n  max-width: 475px;\n\n  &--bar {\n    height: 100%;\n    width: $ff-unit-md;\n    background-color: black;\n    display: block;\n    position: absolute;\n    top: 0;\n    left: 0;\n  }\n\n  &--info {\n    border-color: $ff-grey-400;\n    .ff-notification-toast--bar {\n      background-color: $ff-grey-400;\n    }\n  }\n  &--warning {\n    border-color: $ff-red-400;\n    .ff-notification-toast--bar {\n      background-color: $ff-red-400;\n    }\n  }\n  &--confirmation {\n    border-color: $ff-green-400;\n    .ff-notification-toast--bar {\n      background-color: $ff-green-400;\n    }\n  }\n\n  &--message {\n    display: grid;\n    grid-template-columns: 1fr 20px;\n    gap: $ff-unit-lg;\n    >div {\n      padding-top: 2px;\n    }\n  }\n\n  &--close {\n    cursor: pointer;\n    position: relative;\n    display: flex;\n    max-height: 20px;\n    svg {\n      position: relative;\n      z-index: 2;\n      padding: 4px;\n    }\n    .countdown-wrapper {\n      z-index: 1;\n    }\n    &:hover {\n      color: $ff-indigo-600;\n    }\n  }\n\n  &--actions {\n    margin-top: $ff-unit-md;\n    // margin-right: $ff-unit-xl;\n    display: flex;\n    justify-content: flex-end;\n  }\n}\n\n/* Countdown Pie */\n$countdown_size: 20px;\n\n.countdown-wrapper {\n  width: $countdown_size;\n  height: $countdown_size;\n  position: absolute;\n  top: 0;\n  left: 0;\n  background: white;\n}\n\n.countdown-pie {\n  width: 50%;\n  height: 100%;\n  position: absolute;\n  background: $ff-white;\n  border: 2px solid $ff-grey-300;\n}\n\n.countdown-spinner {\n  transform-origin: 100% 50%;\n  border-radius: ($countdown_size*0.5) 0 0 ($countdown_size*0.5);\n  z-index: 200;\n  border-right: none;\n}\n\n.countdown-filler {\n  border-radius: 0 ($countdown_size*0.5) ($countdown_size*0.5) 0;\n  z-index: 100;\n  border-left: none;\n  left: 50%;\n  opacity: 0;\n}\n\n.countdown-mask {\n  width: 50%;\n  height: 100%;\n  position: absolute;\n  z-index: 300;\n  opacity: 1;\n  background: inherit;\n}\n\n@keyframes rota {\n  0%   { transform: rotate(0deg); }\n  100% { transform: rotate(360deg); }\n}\n\n@keyframes fill {\n  0%        { opacity: 0; }\n  50%, 100% { opacity: 1; }\n}\n\n@keyframes mask {\n  0%        { opacity: 1; }\n  50%, 100% { opacity: 0; }\n}\n\n\n/*\n  FF Tabs\n*/\n.ff-tabs {\n  display: flex;\n  color: $ff-grey-800;\n  .ff-tab-option {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    padding: $ff-unit-md;\n    &:hover {\n      color: $ff-blue-700;\n      cursor: pointer;\n    }\n    .ff-tab-icon {\n      height: 14px;\n      width: 14px;\n      flex-shrink: 0;\n      display: block;\n    }\n    .ff-tab-label {\n      white-space: nowrap;\n    }\n  }\n  &.ff-tabs--horizontal {\n    flex-direction: row;\n    .ff-tab-option {\n      margin-right: $ff-unit-md;\n      &.router-link-active,\n      &.ff-tab-option--active {\n        border-bottom: $ff-unit-xs solid $ff-blue-700;\n      }\n    }\n  }\n  &.ff-tabs--vertical {\n    flex-direction: column;\n    .ff-tab-option {\n      border-left-width: $ff-unit-xs;\n      border-color: transparent;\n      margin-bottom: $ff-unit-md;\n      &.router-link-active,\n      &.ff-tab-option--active {\n        border-left: $ff-unit-xs solid $ff-blue-700;\n      }\n    }\n  }\n  .router-link-active,\n  .ff-tab-option--active {\n    color: $ff-blue-600;\n  }\n}\n\n/*\n  FF Tabs - Overflow Handling\n*/\n.ff-tabs-wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n\n  // When overflow is NOT enabled, apply ellipsis to tab labels\n  &:not(.ff-tabs-wrapper--overflow-enabled) {\n    .ff-tab-label {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      min-width: 0;\n    }\n  }\n\n  &.ff-tabs-wrapper--overflow-enabled {\n    .ff-tab-option {\n      flex-shrink: 0; // Prevent tabs from shrinking, allow them to take full width\n    }\n\n    .ff-tabs__scroll-container {\n      overflow-x: auto;\n      overflow-y: hidden;\n      scroll-behavior: smooth;\n      scrollbar-width: none; // Hide scrollbar for Firefox\n      -ms-overflow-style: none; // Hide scrollbar for IE/Edge\n\n      // Hide scrollbar for Chrome, Safari, and Opera\n      &::-webkit-scrollbar {\n        display: none;\n      }\n    }\n  }\n\n  .ff-tabs__scroll-container {\n    flex: 1;\n    min-width: 0;\n  }\n\n  .ff-tabs__overflow-button {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: $ff-unit-sm;\n    background: white;\n    border: none;\n    border-right: 1px solid $ff-grey-300;\n    color: $ff-grey-500;\n    cursor: pointer;\n    z-index: 10;\n    transition: all 0.2s ease;\n\n    .ff-icon {\n      width: 16px;\n      height: 16px;\n\n      &.ff-icon-second {\n        margin-left: -10px;\n      }\n    }\n\n    &:hover {\n      background: $ff-grey-100;\n      color: $ff-grey-700;\n      border-color: $ff-grey-400;\n    }\n\n    &:active {\n      background: $ff-grey-200;\n    }\n\n    &--left {\n      left: 0;\n      border-right: 1px solid $ff-grey-300;\n      border-left: none;\n    }\n\n    &--right {\n      right: 0;\n      border-left: 1px solid $ff-grey-300;\n      border-right: none;\n    }\n  }\n\n  .ff-tabs__menu-wrapper {\n    position: relative;\n    display: inline-block;\n\n    &--left {\n      position: absolute;\n      left: 0;\n      top: 0;\n      bottom: 0;\n    }\n\n    &--right {\n      position: absolute;\n      right: 0;\n      top: 0;\n      bottom: 0;\n    }\n  }\n\n  .ff-tabs__dropdown {\n    position: absolute;\n    top: calc(100% + 4px);\n    background: white;\n    border: 1px solid $ff-grey-300;\n    border-radius: 4px;\n    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n    z-index: 100;\n    min-width: 150px;\n    max-width: 250px;\n\n    &--left {\n      left: 0;\n    }\n\n    &--right {\n      right: 0;\n    }\n  }\n\n  .ff-tabs__dropdown-item {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    padding: $ff-unit-sm $ff-unit-md;\n    color: $ff-grey-800;\n    transition: background-color 0.2s ease;\n\n    .ff-tab-icon {\n      height: 14px;\n      width: 14px;\n      flex-shrink: 0;\n      display: block;\n    }\n\n    .ff-tab-label {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      min-width: 0;\n    }\n\n    &:hover {\n      background: $ff-grey-100;\n      color: $ff-blue-700;\n      cursor: pointer;\n    }\n\n    &--active {\n      background: $ff-grey-100;\n      color: $ff-blue-700;\n      cursor: pointer;\n    }\n\n    &.router-link-active {\n      color: $ff-blue-600;\n      background: $ff-blue-50;\n    }\n\n    &:first-child {\n      border-radius: 4px 4px 0 0;\n    }\n\n    &:last-child {\n      border-radius: 0 0 4px 4px;\n    }\n\n    &:only-child {\n      border-radius: 4px;\n    }\n  }\n}\n\n/*\n  FF Tooltip\n*/\n.ff-tooltip {\n  position: absolute;\n  z-index: 100;\n  font-weight: normal; // prevent parent overriding if embedded in hX\n  white-space: preserve-breaks;\n  height: fit-content;\n  background-color: black;\n  color: white;\n  padding: 3px 12px;\n  border-radius: 3px;\n  opacity: 0;\n  pointer-events: none;\n  transition: 0.3s opacity;\n  -webkit-transition: 0.3s opacity;\n  &.ff-tooltip-right {\n    &::after {\n      content: \" \";\n      position: absolute;\n      top: 50%;\n      right: 100%; /* To the left of the tooltip */\n      margin-top: -5px;\n      border-width: 5px;\n      border-style: solid;\n      border-color: transparent black transparent transparent;\n    }\n  }\n  &.ff-tooltip-left {\n    &::after {\n      content: \" \";\n      position: absolute;\n      top: 50%;\n      left: 100%; /* To the right of the tooltip */\n      margin-top: -5px;\n      border-width: 5px;\n      border-style: solid;\n      border-color: transparent transparent transparent black;\n    }\n  }\n  &.ff-tooltip-top {\n    transform: translateX(-50%);\n    &::after {\n      content: \" \";\n      position: absolute;\n      top: 100%; /* At the bottom of the tooltip */\n      left: 50%;\n      margin-left: -5px;\n      border-width: 5px;\n      border-style: solid;\n      border-color: black transparent transparent transparent;\n    }\n  }\n  &.ff-tooltip-bottom {\n    transform: translateX(-50%);\n    &::after {\n      content: \" \";\n      position: absolute;\n      bottom: 100%;  /* At the top of the tooltip */\n      left: 50%;\n      margin-left: -5px;\n      border-width: 5px;\n      border-style: solid;\n      border-color: transparent transparent black transparent;\n    }\n  }\n  &--visible {\n    opacity: 1;\n  }\n}\n.ff-tooltip-container {\n  position: relative;\n  vertical-align: bottom;\n  &:hover .ff-tooltip {\n    opacity: 1;\n  }\n}\n\n.ff-spinner {\n  display: inline-block;\n  width: 20px;\n  height: 20px;\n  color: $ff-grey-500;\n  circle {\n    stroke: transparent;\n  }\n  animation: spin 1s ease-in-out infinite;\n  -webkit-animation: spin 1s ease-in-out infinite;\n  @keyframes spin {\n    to {\n      -webkit-transform: rotate(360deg);\n    }\n  }\n  @-webkit-keyframes spin {\n    to {\n      -webkit-transform: rotate(360deg);\n    }\n  }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n\n.ff-bg-light {\n    background-color: $ff-grey-50;\n}\n\n.ff-theme-light {\n\n    color: $ff-grey-800;\n\n    /* Core */\n\n    h1, h2, h3, h4, h5{\n        color: $ff-grey-700;\n    }\n    \n    p {\n        color: $ff-grey-800;\n    }\n\n    .ff-description {\n        color: $ff-grey-500;\n    }\n\n    select {\n        background-color: $ff-grey-50;\n    }\n\n    code {\n        background-color: $ff-grey-100;\n        border-color: $ff-grey-200;\n    }\n\n    /* FlowFuse Components */\n\n    .ff-btn {\n        &:disabled {\n            background-color: $ff-white;\n            border-color: $ff-grey-300;\n            color: $ff-grey-300;\n        }\n    }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n\n.ff-bg-dark {\n    background-color: $ff-grey-800;\n}\n\n.ff-theme-dark {\n    color: $ff-grey-50;\n    \n    /* Core */\n\n    table {\n        td, th {\n            border-color: $ff-grey-500;\n        }\n    }\n\n    select {\n        background-color: $ff-grey-800;\n    }\n\n    code {\n        background-color: $ff-grey-900;\n        border-color: $ff-grey-700;\n    }\n\n    .ff-description {\n        color: $ff-grey-400;\n    }\n\n    /* FlowFuse Components */\n\n    /**\n    * Buttons\n    */\n    .ff-btn {\n        &--tertiary {\n            color: $ff-white;\n            &:hover {\n                // background-color: $ff-color--secondary--highlight;\n                color: $ff-white;\n            }\n        }\n        &:disabled {\n            background-color: $ff-grey-700;\n            border-color: $ff-grey-500;\n            color: $ff-grey-500;\n        }\n    }\n\n    /**\n    *  Text Input\n    */\n\n    .ff-input.ff-text-input {\n        background-color: $ff-grey-700;\n        border-color: $ff-grey-900;\n        &:focus {\n          border-color: $ff-white;\n        }\n    }\n\n    /**\n    *  Dropdowns\n    */\n\n    .ff-dropdown {\n        &[disabled=\"true\"] {\n            background-color: $ff-grey-700;\n            color: $ff-grey-500;\n        }\n        .ff-dropdown-selected {\n            background-color: $ff-grey-700;\n            border-color: $ff-grey-500;\n        }\n        .ff-dropdown-options {\n            border-color: $ff-grey-700;\n        }\n        .ff-dropdown-option {\n            background-color: $ff-grey-700;\n            border-color: $ff-grey-800;\n            &:hover {\n                background-color: $ff-grey-800;\n            }\n        }\n    }\n\n    /**\n    *  Checkboxes\n    */\n\n    .ff-checkbox {\n        .checkbox[checked=true] {\n            background-color: transparent;\n            border-color: $ff-grey-500;\n        }\n        &:hover:not([disabled=true]) {\n            .checkbox {\n                background-color: $ff-grey-600;\n            }\n        }\n        &:hover:not([disabled=true]) {\n            .checkbox[checked=true] {\n                background-color: $ff-grey-800;\n                border-color: $ff-grey-600;\n            }\n        }\n    }\n\n    /**\n    *  FF Toggle Switch\n    */\n    .ff-toggle-switch {\n        svg {\n          color: $ff-grey-800;\n        }\n        input:checked + .ff-toggle-switch-slider {\n          background-color: $ff-blue-600;\n        }\n        &[disabled=true] {\n          .ff-toggle-switch-slider {\n            background-color: $ff-grey-700;\n          }\n          .ff-toggle-switch-button {\n            background-color: $ff-grey-800;\n          }\n          svg {\n            color: $ff-grey-500;\n          }\n        }\n    }\n\n    .ff-toggle-switch-slider {\n        background-color: $ff-grey-600;\n        &:hover {\n          background-color: $ff-indigo-500 !important;\n        }\n    }\n\n    .ff-toggle-switch-button {\n        background-color: $ff-white;\n    }\n\n    /**\n    *  Radio Group\n    */\n\n    .ff-radio-btn {\n      .checkbox {\n        border: 1px solid $ff-grey-600;\n        background-image: url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%231F2937' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='4'/%3e%3c/svg%3e\")    \n      }\n    }\n    \n    .ff-radio-btn {\n        .checkbox {\n            &[checked=true] {\n                background-color: $ff-white;\n                border-color: $ff-grey-700;\n            }\n            &[checked=true]:after {\n                display: block;\n            }\n        }\n        &:hover:not([disabled=true]) {\n            .checkbox {\n                background-color: $ff-grey-600;\n            }\n        }\n        &:hover:not([disabled=true]) {\n            .checkbox[checked=true] {\n                background-color: $ff-white;\n            }\n        }\n    }\n\n    /**\n    *  Toast Notification\n    */\n\n    .ff-notification-toast {\n        color: $ff-grey-800;\n    }\n\n    /**\n    *  Selection Tile\n    */\n\n    .ff-tile-selection {\n        .ff-tile-selection-option--header > h2 svg {\n            fill: $ff-grey-500;\n            &.ff-tile-selection-option--edit:hover {\n                fill: $ff-blue-300;\n            }\n        }\n        .ff-tile-selection-option {\n            background-color: $ff-grey-700;\n            border-color: $ff-grey-800;\n            &.active svg {\n                fill: $ff-blue-300;\n            }\n            &:hover {\n                background-color: $ff-grey-800;\n            }\n            &:not(.editable):hover {\n                border-color: $ff-blue-300;\n            }\n            &[selected=true] {\n                background-color: $ff-grey-800;\n                border-color: $ff-grey-800;\n            }\n        }\n    }\n\n    /**\n    *  Data Table\n    */\n    .ff-data-table {\n        &--data {\n          .ff-data-table--cell {\n          }\n          thead {\n            .ff-data-table--cell {\n              background-color: $ff-grey-900;\n              &.sortable {\n                &:hover {\n                  background-color: $ff-grey-800;\n                }\n              }\n              &.sorted {\n                background-color: $ff-grey-900;\n              }\n            }\n          }\n          tbody {\n            .ff-data-table--row:last-child {\n              .ff-data-table--cell {\n                border-top-color: $ff-grey-600;\n              }\n            }\n            .ff-data-table--cell {\n              background-color: $ff-grey-700;\n              &.highlight {\n                background-color: $ff-grey-800;\n              }\n            }\n            .selectable:hover .ff-data-table--cell {\n              color: $ff-blue-300;\n              background-color: $ff-grey-600;\n            }\n          }\n        }\n        &--row {\n          td {\n            border-color: $ff-grey-600;\n          }\n        }\n      }\n      \n      .ff-loadmore {\n        span {\n          color: $ff-white;\n          background-color: $ff-grey-900;\n          border: 1px solid $ff-grey-600;\n          &:hover {\n            color: $ff-blue-300;\n            background-color: $ff-grey-600;\n          }\n        }\n      }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n\n.ff--immersive-editor-wrapper {\n  position: relative;\n  height: 100%;\n  display: flex;\n  flex: 1;\n\n  .ff-layout--immersive--content {\n    flex: 1;\n    position: relative;\n    min-width: 0;\n    height: 100%;\n  }\n\n  .editor-wrapper {\n    height: 100%;\n    width: 100%;\n    position: absolute;\n    display: flex;\n    flex-direction: column;\n    align-content: center;\n    justify-content: center;\n  }\n  .editor-wrapper .status-wrapper {\n    margin-top: -64px;\n  }\n\n  .tabs-wrapper {\n    position: fixed;\n    left: 0;\n    top: 60px;\n    width: 0;\n    height: calc(100% - 60px);\n    background: white;\n    transform: translateX(-100%);\n    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    container-type: inline-size;\n    container-name: drawer;\n    z-index: 1;\n\n    > .drawer-content {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      overflow: hidden;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.2s;\n    }\n\n    main {\n      overflow-y: auto;\n      overflow-x: hidden;\n    }\n\n    > .drawer-content > .header {\n      padding: 0;\n      display: flex;\n      line-height: 1.5;\n      border-bottom: 1px solid $ff-grey-200;\n      background: white;\n      z-index: 10;\n\n      .logo {\n        display: flex;\n\n        a {\n          display: flex;\n          align-items: center;\n          color: $ff-grey-500;\n          gap: 4px;\n          padding: 0 15px;\n          transition: all 0.2s ease;\n\n          .ff-btn--icon {\n            width: 16px;\n            height: 16px;\n          }\n\n          img {\n            height: 20px;\n          }\n\n          &:hover {\n            background: $ff-grey-100;\n            color: $ff-grey-700;\n          }\n\n          &:active {\n            background: $ff-grey-200;\n          }\n        }\n      }\n\n      .tabs {\n        flex: 1;\n        padding: 0 15px 0 0;\n        min-width: 0;\n\n        .ff-tab-option {\n          white-space: nowrap;\n          overflow: hidden;\n          text-overflow: ellipsis;\n        }\n      }\n\n      .side-actions {\n        display: flex;\n        justify-content: flex-end;\n        align-items: center;\n        color: $ff-grey-500;\n        flex-shrink: 0;\n        gap: 5px;\n      }\n    }\n\n    &.open {\n      transform: translateX(0);\n      box-shadow: 5px 0 8px rgba(0, 0, 0, 0.10);\n\n      > .drawer-content {\n        opacity: 1;\n        pointer-events: auto;\n      }\n    }\n  }\n\n  .resize-bar.resizing {\n    background-color: $ff-blue-500;\n  }\n\n  &.resizing {\n    cursor: ew-resize;\n    -moz-user-select: none;\n    -webkit-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n\n    .tabs-wrapper {\n      transition: none;\n    }\n  }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n\n.ff-empty-state {\n    text-align: center;\n    padding-top: 64px;\n    padding-bottom: 64px;\n    background-color: white;\n    border: 1px solid $ff-grey-200;\n    border-radius: 3px;\n    >div {\n        margin: auto;\n    }\n    img {\n        margin: auto;\n    }\n    h1 {\n        font-size: 1.5rem;\n        line-height: 1.75rem;\n        margin: auto;\n        margin-top: 1.5rem;\n        margin-bottom: 1rem;\n        font-weight: 500;\n        max-width: 450px;\n    }\n    &--message {\n        max-width: 500px;\n        font-size: 1.1rem;\n        margin: auto;\n        margin-top: 1.25rem;\n        margin-bottom: 1.25rem;\n        p {\n            margin-bottom: 0.75rem;\n            line-height: 1.5rem;\n            color: $ff-grey-800;\n        }\n    }\n    &--actions {\n        display: flex;\n        justify-content: center;\n        gap: 6px;\n    }\n    &--note {\n        display: flex;\n        justify-content: center;\n        margin-top: 1.75rem;\n        color: $ff-grey-400;\n    }\n\n    &.ff-empty-state-feature-unavailable {\n        background-color: inherit;\n        border: none; \n    }\n}","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-team-type-tile {\n    position: relative;\n    border-radius: 6px;\n    border: 2px solid $ff-grey-300;\n    background: white;\n    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.25);\n    padding: 24px;\n    width: 100%;\n    max-width: 300px;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    ul {\n        list-style: disc;\n        padding-left: 16px;\n        li {\n            margin-bottom: 6px;\n        }\n    }\n}\n.trial-ribbon {\n    --ribbon-overlap: 8px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 30px;\n    left: calc(-1 * var(--ribbon-overlap));\n    line-height: 1.3;\n    width: calc(100% + 2 * var(--ribbon-overlap));\n    margin: 0;\n    position: absolute;\n    top: 8px;\n    color: white;\n    // text-shadow: 0 1px 1px #111;\n    border-top: 1px solid #363636;\n    border-bottom: 1px solid #202020;\n    background: $ff-red-500;\n    // background: linear-gradient($ff-red-500 0%, $ff-red-700 100%);\n    border-radius: 2px 2px 0 0;\n    box-shadow: 0 1px 2px rgba(0,0,0,0.3);\n}\n.trial-ribbon::before,\n.trial-ribbon::after {\n    content: '';\n    display: block;\n    width: 0;\n    height: 0;\n    position: absolute;\n    bottom: calc((-2 * var(--ribbon-overlap)) - 1px);\n    z-index: -10;\n    border: var(--ribbon-overlap) solid;\n    border-color: $ff-red-900 transparent transparent transparent;\n}\n.trial-ribbon::before {left: 0;}\n.trial-ribbon::after {right: 0;}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.not-found-wrapper {\n    background: none;\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: flex-start;\n\n    .not-found-container {\n        background: $ff-white;\n        padding: 30px 150px;\n        margin: 50px;\n        border-radius: 20px;\n        box-shadow: 0 0 50px rgba(0, 0, 0, 0.2);\n\n        .image-wrapper {\n            display: flex;\n            justify-content: center;\n            margin: 30px 0;\n        }\n\n        .title {\n            margin: 30px 0;\n        }\n\n        .actions {\n            display: flex;\n            justify-content: center;\n            gap: 15px;\n            margin: 30px 0 15px;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.wrapper {\n    flex: 1;\n\n    .info {\n        text-overflow: ellipsis;\n        overflow: hidden;\n        white-space: nowrap;\n        align-self:center;\n    }\n\n    .actions {\n        display: flex;\n        justify-content: flex-end;\n    }\n}\n\n// Hide info icon on small viewports (below 640px)\n@media (max-width: 639px) {\n    .ff-info-icon {\n        display: none;\n    }\n}\n\n// Also hide info icon when drawer is narrow (below 640px)\n@container drawer (max-width: 639px) {\n    .ff-info-icon {\n        display: none;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-listbox {\n  display: inline-block;\n  min-width: 200px;\n\n  &:focus-visible {\n    border: none;\n    outline: none;\n\n  }\n\n  .ff-button {\n    border: 1px solid $ff-grey-300;\n    padding: 5px 5px 5px 10px;\n    background: $ff-white;\n\n    &:focus-visible {\n        outline: none;\n    }\n\n    &:focus {\n        border-color: $ff-blue-500;\n    }\n\n    .icon {\n      svg {\n        width: 1.5rem;\n        height: 1.5rem;\n      }\n    }\n  }\n\n  &[data-headlessui-state=\"open\"] {\n    button {\n      border-bottom-left-radius: 0;\n      border-bottom-right-radius: 0;\n    }\n  }\n}\n\n.ff-options {\n    background: $ff-grey-50;\n    box-shadow: 0 6px 9px 0 #00000038;\n    max-height: 28rem;\n    z-index: 200;\n    overflow-y: auto;\n    padding: 0;\n    border-left: 1px solid $ff-grey-200;\n    border-right: 1px solid $ff-grey-200;\n    border-bottom: 1px solid $ff-grey-200;\n    &:focus-visible, &:focus {\n        outline: none;\n    }\n\n    .ff-option {\n        border-bottom: 1px solid $ff-grey-200;\n        background-color: $ff-grey-50;\n        cursor: pointer;\n\n        &:last-of-type {\n            border-bottom: none;\n        }\n\n        .ff-option-content {\n            padding: $ff-unit-sm $ff-unit-md;\n            border: 1px solid transparent;\n\n            &.selected {\n                background-color: $ff-grey-200;\n            }\n            &.active {\n                border: 1px solid $ff-indigo-300;\n            }\n            &.selected.active {\n                border-color: transparent;\n            }\n        }\n\n        &:hover {\n            background-color: $ff-grey-200;\n            .ff-option-content.active {\n                border-color: transparent\n            }\n        }\n    }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n\n.ff-accordion {\n    margin-bottom: 24px;\n    &--button {\n        width: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        background-color: $ff-grey-100;\n        border: 1px solid $ff-grey-300;\n        padding: 6px 9px;\n        cursor: default;\n        label {\n            font-weight: 500;\n        }\n        span {\n            color: $ff-grey-500;\n            font-size: 0.875rem;\n        }\n        .ff-icon {\n            margin-left: 12px;\n            transition: 0.3s transform;\n            -webkit-transition: 0.3s transform;\n        }\n        &:not([disabled]):hover{\n            background-color: $ff-grey-200;\n            cursor: pointer;\n        }\n    }\n    &--content {\n        transition: max-height 0.6s ease-out;\n        .ff-audit-entry {\n            padding: 12px;\n            border: 1px solid $ff-grey-300;\n            border-top-width: 0;\n        }\n    }\n    &.open {\n        .ff-accordion--button .ff-icon.chevron {\n            transform: rotate(-90deg);\n        }\n    }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n@use \"../../ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-audit-entry {\n    display: grid;\n    grid-template-areas:\n        'time       author'\n        'entry       entry';\n    grid-gap: 0.25rem;\n    align-items: center;\n    label {\n        font-weight: 500;\n    }\n    span {\n        color: $ff-grey-400;\n        font-weight: 400;\n        font-size: 0.875rem;\n        line-height: 1rem;\n        display: block;\n        width:100%;\n    }\n\n    svg path {\n        stroke-width: 2px;\n    }\n    &--error {\n        position: relative;\n        summary {\n            display: flex;\n            align-items: center;\n            list-style: none;\n            cursor: pointer;\n            font-size: 0.875rem;\n            color: $ff-grey-500;\n            &::-webkit-details-marker {\n                display: none;\n            }\n        }\n        // the chevron down will only show when detail is opened\n        span .ff-icon {\n            position: absolute;\n            top: 3px;\n            left: 0;\n            background-color: $ff-grey-50;\n            fill: $ff-grey-500;\n        }\n        &:hover {\n            summary {\n                color: black;\n            }\n            span .ff-icon {\n                fill: black;\n            }\n        }\n    }\n}\n\n.ff-audit-entry-info {\n    grid-area: entry;\n}\n\n.ff-audit-entry-trigger, .ff-audit-entry-time {\n    grid-area: time;\n    display: block;\n    color: $ff-grey-500;\n    overflow-x: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n}\n\n.ff-audit-entry-trigger {\n    grid-area: author;\n    text-align: right;\n}\n\n\n@media screen and (min-width: $ff-screen-lg) {\n    .ff-audit-entry {\n        grid-template-areas: 'time entry author';\n        grid-template-columns: min-content 1fr min-content;\n    }\n}","<template>\n    <ff-dialog\n        v-if=\"visible\"\n        ref=\"dialog\" :header=\"header\" :sub-header=\"`Node-RED Version: ${nrVersion}`\" confirm-label=\"Close\" :closeOnConfirm=\"true\"\n        data-el=\"flow-view-dialog\" boxClass=\"!min-w-[80%] !min-h-[80%] !w-[80%] !h-[80%]\"\n        contentClass=\"overflow-hidden flex-grow\" @confirm=\"confirm()\"\n    >\n        <template #default>\n            <div ref=\"viewer\" data-el=\"ff-flow-previewer\" class=\"ff-flow-viewer\" @click.stop.prevent>\n                Loading...\n            </div>\n        </template>\n        <template #actions>\n            <div class=\"flex justify-end\">\n                <ff-button data-action=\"dialog-confirm\" @click=\"confirm()\">Close</ff-button>\n            </div>\n        </template>\n    </ff-dialog>\n</template>\n<script>\n\nimport FlowRenderer from '@flowfuse/flow-renderer'\n\nimport BlueprintAPI from '../../api/flowBlueprints.js'\n\nexport default {\n    name: 'FlowViewerDialog',\n    props: {\n        title: {\n            type: String,\n            default: ''\n        }\n    },\n    setup () {\n        return {\n            async show (payload) { // accepts blueprints, snapshots and libraries\n                // If there is no flows property, but there is a category property, we assume this is a blueprint\n                // and try to load the content dynamically\n                this.visible = true\n                this.$nextTick(async () => {\n                    if (!payload.flows && Object.hasOwn(payload, 'category')) {\n                        const blueprint = await BlueprintAPI.getFlowBlueprint(payload.id)\n                        payload.flows = blueprint.flows\n                    }\n                    this.mode = 'view'\n                    this.$refs.dialog.show()\n                    this.payload = payload\n                    setTimeout(() => {\n                        this.renderFlows()\n                    }, 20)\n                })\n            }\n        }\n    },\n    data () {\n        return {\n            payload: [],\n            visible: false\n        }\n    },\n    computed: {\n        flow () {\n            return this.payload?.flows?.flows || []\n        },\n        nrVersion () {\n            const mods = this.payload?.settings?.modules\n            if (mods) {\n                return mods['node-red'] || 'Unavailable'\n            }\n            return ''\n        },\n        header () {\n            return this.payload?.name || this.title || 'Flow'\n        }\n    },\n    mounted () {\n    },\n    methods: {\n        confirm () {\n            this.$refs.dialog.close()\n            this.visible = false\n        },\n        renderFlows () {\n            const flowRenderer = new FlowRenderer()\n            flowRenderer.renderFlows(this.flow, {\n                container: this.$refs.viewer\n            })\n        }\n    }\n}\n</script>\n\n<style scoped>\n.ff-flow-viewer {\n    height: 100%;\n}\n</style>\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-blueprint-tile {\n    background-color: $ff-white;\n    width: 250px;\n    border-width: 2px;\n\n    &.active {\n        border-width: 2px;\n        border-color: $ff-blue-600;\n        transition: border-color .3s;\n    }\n\n    .ff-blueprint-tile--header {\n        position: relative;\n        height: 115px;\n\n        .ff-icon {\n            transform: scale(8);\n            position: absolute;\n            top: 70px;\n            transition: transform .3s;\n            &.alt-preview {\n                position: absolute;\n                height: 30px;\n                width: 30px;\n                transform: scale(1) !important;\n                top: 5px !important;\n                right: 5px !important;\n                stroke: none;\n                opacity: .7;\n                &:hover {\n                    cursor: zoom-in;\n                    color: $ff-blue-600;\n                }\n            }\n        }\n\n        .ff-more-info {\n            position: absolute;\n            top: 5px;\n            left: 5px;\n        }\n    }\n\n    &.no-icon {\n        .ff-blueprint-tile--header {\n            .ff-icon:not(.alt-preview) {\n                transform: scale(4);\n                position: initial;\n            }\n        }\n    }\n\n    .ff-dialog-container {\n        .ff-dialog-box {\n            max-width: 75rem;\n\n            .ff-dialog-content {\n                padding: 0;\n            }\n\n            .ff-dialog-actions {\n                padding: 5px 15px;\n            }\n        }\n    }\n    &.interactive:hover {\n        border-width: 2px;\n        border-color: $ff-blue-600;\n        .ff-blueprint-tile--header {\n            .ff-icon:not(.alt-preview) {\n                transform: scale(10);\n            }\n        }\n\n        &.no-icon {\n            .ff-blueprint-tile--header {\n                .ff-icon:not(.alt-preview) {\n                    transform: scale(6);\n                }\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-dialog-container {\n  .ff-dialog-content {\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n\n    .file-upload-section {\n      .file-row > div {\n        flex-direction: column;\n        align-items: baseline;\n      }\n\n      .ff-btn {\n        width: 100%;\n      }\n\n      .file-input {\n        display: flex;\n        gap: 5px;\n      }\n\n      .loaded-file {\n        display: flex;\n        gap: 5px;\n        align-items: center;\n        margin-top: 10px;\n\n        .clear {\n          cursor: pointer;\n          padding: 5px;\n\n          .ff-btn--icon {\n            width: 15px;\n            height: 15px;\n          }\n        }\n      }\n    }\n\n    .textarea-section {\n      .textarea-wrapper {\n        display: flex;\n        justify-content: space-between;\n\n        .clear {\n          font-weight: normal;\n          cursor: pointer;\n        }\n      }\n    }\n\n    .divider {\n      position: relative;\n      .line {\n        height: 1px;\n        width: 100%;\n        background: $ff-grey-400;\n        position: absolute;\n        top: 50%;\n        display: block;\n      }\n      .text {\n        background: white;\n        padding: 5px;\n        position: relative;\n        z-index: 10;\n      }\n    }\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.tools {\n  display: flex;\n  gap: 5px;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.inactive-team {\n    color: $ff-grey-400;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\ninput:disabled {\n  background-color: $ff-white !important;\n  opacity: .9;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\ntextarea:disabled {\n  background-color: $ff-white;\n  opacity: .9;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-text-copier {\n  display: inline-flex;\n  align-items: center;\n  gap: 3px;\n  position: relative;\n  &:hover {\n    cursor: pointer;\n  }\n  .ff-icon-button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 4px;\n    border: none;\n    background: transparent;\n    border-radius: 4px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n    color: $ff-color--action;\n\n    &:hover {\n      color: $ff-white;\n      background-color: $ff-color--highlight;\n    }\n\n    &:active {\n      background-color: $ff-color--highlight;\n    }\n\n    .ff-icon {\n      pointer-events: none;\n    }\n\n    .ff-icon-check {\n      color: $ff-green-600;\n    }\n  }\n  .ff-copied {\n    background-color: black;\n    color: white;\n    padding: 3px;\n    border-radius: 3px;\n    position: absolute;\n    margin-top: -3px;\n    margin-left: 3px;\n    display: none;\n    z-index: 100;\n    left: 100%;\n  }\n  .ff-copied-left {\n    left: inherit;\n    right: 100%;\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-data-table--cell textarea {\n    resize: vertical;\n    max-height: 10rem; /* 160px approx ~8 lines, after which user will need to scroll */\n    /* Below styles emulate the text control in a form row */\n    border: 1px solid #D1D5DB;\n    border-radius: 6px;\n    /* height: 32px; */\n    padding: 6px;\n    min-height: 32px; /* align with item in cell-1*/\n    width: 100%;\n    display: flex;\n    gap: 0px;\n    align-items: center;\n    background-color: white;\n    border-color: #D1D5DB;\n}\n.ff-data-table--cell .env-cell-uneditable {\n    max-height: 10rem; /* 160px approx ~8 lines, after which user will need to scroll */\n    overflow: auto;\n    white-space: pre;\n    cursor: default;\n}\n.ff-data-table--cell .env-cell-uneditable input {\n    cursor: default;\n}\n.ff-data-table--cell div.uneditable {\n    cursor: default;\n}\n",".ff-admin-audit {\n    display: grid;\n    grid-template-columns: 2fr minmax(min-content, 240px);\n    gap: 24px;\n    \n    &.full-width {\n        display: flex;\n        grid-template-columns: none;\n        gap: 0;\n        \n        \n    }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n\n.ff-info-card h3 {\n    display: flex;\n    gap: 9px;\n    margin-bottom: 12px;\n    align-items: center;\n}\n\n.ff-info-card h3 svg {\n    width: 1.5rem;\n    height: 1.5rem;\n}\n\n.ff-info-card-content {\n    padding: 6px 12px;\n    background-color: white;\n    border: 1px solid $ff-grey-300;\n}\n\n.ff-info-card-row {\n    min-height: 36px;\n}\n\n.ff-info-card .ff-info-card-row:not(:last-child) {\n    margin-bottom: 6px;\n    padding-bottom: 6px;\n    border-bottom: 1px solid $ff-grey-200;\n}","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.popover-item {\n    display: flex;\n    align-items: center;\n    gap: 15px;\n    padding: 10px 20px;\n    cursor: pointer;\n\n    .icon {\n        padding: 5px;\n    }\n\n    .content {\n        display: flex;\n        flex-direction: column;\n\n        .description {\n            color: $ff-grey-400;\n        }\n    }\n\n    &:hover {\n        background: $ff-grey-100;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n\n.ff-icon-anim {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n.ff-icon-installing {\n    overflow: hidden;\n}\n\n.ff-icon-installing svg {\n    --anim-time: 0.75s;\n    position: relative;\n    color: currentColor;\n    animation: ff-icon-installing var(--anim-time) infinite linear;\n    animation-delay: calc(var(--anim-time) / 2);\n}\n\n@keyframes ff-icon-installing {\n  0% {\n    opacity: 0;\n    transform: translate(0, -100%);\n  }\n  50% {\n    opacity: 1;\n    transform: translate(0, 0);\n  }\n  100% {\n    opacity: 0;\n    transform: translate(0, 100%);\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n\n.ff-icon-anim {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n.ff-icon-pulling {\n    overflow: hidden;\n}\n\n.ff-icon-pulling svg {\n    --anim-time: 0.75s;\n    position: relative;\n    color: currentColor;\n    animation: ff-icon-pulling var(--anim-time) infinite linear;\n    animation-delay: calc(var(--anim-time) / 2);\n}\n\n@keyframes ff-icon-pulling {\n  0% {\n    opacity: 0;\n    transform: translate(0, -100%);\n  }\n  50% {\n    opacity: 1;\n    transform: translate(0, 0);\n  }\n  100% {\n    opacity: 0;\n    transform: translate(0, 100%);\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n\n.ff-icon-anim {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n.ff-icon-pushing {\n    overflow: hidden;\n}\n\n.ff-icon-pushing svg {\n    --anim-time: 0.75s;\n    position: relative;\n    color: currentColor;\n    animation: ff-icon-pushing var(--anim-time) infinite linear;\n    animation-delay: calc(var(--anim-time) / 2);\n}\n\n@keyframes ff-icon-pushing {\n  0% {\n    opacity: 0;\n    transform: translate(0, 100%);\n  }\n  50% {\n    opacity: 1;\n    transform: translate(0, 0);\n  }\n  100% {\n    opacity: 0;\n    transform: translate(0, -100%);\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n\n.ff-icon-restarting svg {\n    --anim-time: 1s;\n    position: relative;\n    color: currentColor;\n    animation: ff-icon-restarting var(--anim-time) infinite linear;\n}\n\n@keyframes ff-icon-restarting {\n  0% {\n    opacity: 0.2;\n    transform: rotate(360deg);\n  }\n  33% {\n    opacity: 1;\n  }\n  66% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.2;\n    transform: rotate(0deg);\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-icon-anim {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n.ff-icon-starting {\n    --cell-width: 2px;\n    --cell-offset: calc(var(--cell-width) * 1.5);\n    --anim-time: 0.5s;\n    position: relative;\n    width: var(--cell-width);\n    height: var(--cell-width);\n    border-radius: 5px;\n    background-color: currentColor;\n    color: currentColor;\n    animation: ff-icon-starting var(--anim-time) infinite linear alternate;\n    animation-delay: calc(var(--anim-time) / 2);\n}\n\n.ff-icon-starting::before, .ff-icon-starting::after {\n    content: \"\";\n    display: inline-block;\n    position: absolute;\n    top: 0;\n}\n.ff-icon-starting::before {\n    left: calc(-1 * var(--cell-offset));\n    width: var(--cell-width);\n    height: var(--cell-width);\n    border-radius: 5px;\n    background-color: currentColor;\n    color: currentColor;\n    animation: ff-icon-starting var(--anim-time) infinite alternate;\n    animation-delay: 0s;\n}\n.ff-icon-starting::after {\n    left: var(--cell-offset);\n    width: var(--cell-width);\n    height: var(--cell-width);\n    border-radius: 5px;\n    background-color: currentColor;\n    color: currentColor;\n    animation: ff-icon-starting var(--anim-time) infinite alternate;\n    animation-delay: var(--anim-time);\n}\n\n@keyframes ff-icon-starting {\n  0% {\n    background-color: currentColor;\n  }\n  50%, 100% {\n    background-color: rgba($ff-grey-500, 0.2);\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-device-overview {\n    h1 {\n        border-bottom: none;\n        margin-bottom: 12px;\n    }\n}\n.ff-device-overview-audit {\n    .ff-accordion {\n        margin-bottom: 12px;\n    }\n    .ff-accordion:last-child {\n        margin-bottom: 0;\n    }\n    .ff-accordion--content {\n        background-color: white;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.chart-wrapper {\n    flex: 1;\n    display: flex;\n\n    .chart {\n        flex: 1;\n        height: 100%;\n        width: 100%;\n        min-height: 250px;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.chart-wrapper {\n    flex: 1;\n    display: flex;\n\n    .chart {\n        flex: 1;\n        height: 100%;\n        width: 100%;\n        min-height: 250px;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-tab-selector {\n    display: flex;\n    align-items: flex-end;\n    margin-bottom: 15px;\n\n    .ff-tab-option {\n        flex: 1;\n        text-align: center;\n        border-bottom: 2px solid $ff-color--border;\n        padding-bottom: 5px;\n        cursor: pointer;\n        transition: border-color ease-in-out .3s;\n\n        &.active {\n            border-color: $ff-indigo-500;\n        }\n    }\n\n    .ff-tab-separator {\n        flex-shrink: 0;\n        font-style: italic;\n        font-size: $ff-funit-sm;\n        color: $ff-grey-500;\n        padding: 0 12px 5px;\n        border-bottom: 2px solid transparent; // keeps height aligned with tabs\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-option-tile-selector {\n    .ff-option-tile {\n        transition: border-color ease-in-out .3s;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.notice {\n    border: 1px solid $ff-yellow-100;\n    background-color: $ff-yellow-10;\n    border-radius: $ff-unit-sm;\n    padding: $ff-unit-md;\n\n    .icon-wrapper {\n        min-width: 40px;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.device-list-accordion {\n    &.ff-accordion {\n        margin-bottom: 0;\n\n        button {\n            border-top: none;\n            border-left: none;\n            border-right: none;\n            background: transparent;\n            transition: background-color ease-in-out .3s;\n            padding-left: 0;\n            padding-right: 0;\n\n            label {\n                font-weight: normal;\n            }\n\n            &:hover {\n                background-color: transparent;\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-toggle-group {\n    display: flex;\n    gap: 15px;\n    align-items: center;\n\n    .title {\n        color: $ff-black;\n        font-weight: 400;\n    }\n\n    .toggle {\n        border: 1px solid $ff-blue-800;\n        display: flex;\n        border-radius: 5px;\n\n        .inner-wrapper {\n            display: grid;\n            grid-template-columns: repeat(var(--button-count), 1fr);\n            border-radius: 4px;\n            border: 1px solid transparent;\n            position: relative;\n\n            .indicator {\n                position: absolute;\n                top: 0;\n                left: 0;\n                height: 100%;\n                background: $ff-indigo-700;\n                border-radius: 4px;\n                transition: transform 0.2s ease;\n                z-index: 0;\n            }\n\n            a {\n                padding: 5px 10px;\n                border-radius: 4px;\n                transition: color 0.2s ease;\n                position: relative;\n                z-index: 1;\n                text-align: center;\n\n                &.router-link-active {\n                    color: $ff-white;\n                }\n            }\n\n            .ff-btn {\n                background: transparent;\n                color: $ff-grey-500;\n                border-color: transparent;\n                position: relative;\n                z-index: 1;\n                border-radius: 4px;\n\n                &:focus-visible {\n                    outline: 2px solid $ff-indigo-700;\n                    outline-offset: 1px;\n                }\n\n                &.active {\n                    color: $ff-white;\n                }\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.page-fade-enter-active, .page-fade-leave-active {\n    transition: opacity .2s ease-in-out;\n}\n\n.page-fade-enter, .page-fade-leave-to {\n    opacity: 0;\n}\n\n// Viewport-based responsive behavior (matches Tailwind sm: breakpoint)\n// Hide button text on narrow viewports (< 640px)\n@media (max-width: 639px) {\n    .upload-snapshot-text,\n    .create-snapshot-text {\n        display: none;\n    }\n}\n\n// Show button text on wider viewports (>= 640px)\n@media (min-width: 640px) {\n    .upload-snapshot-text,\n    .create-snapshot-text {\n        display: inline;\n    }\n}\n\n// Container query for drawer context - responsive button behavior\n// Breakpoint matches DRAWER_MOBILE_BREAKPOINT constant in Editor/index.vue\n// These override viewport-based rules when inside the drawer\n@container drawer (max-width: 639px) {\n    // Hide text when drawer is narrow - icon-only mode\n    .upload-snapshot-text,\n    .create-snapshot-text {\n        display: none;\n    }\n}\n\n@container drawer (min-width: 640px) {\n    // Show text when drawer is wide enough\n    .upload-snapshot-text,\n    .create-snapshot-text {\n        display: inline;\n    }\n}\n\n","<template>\n    <div class=\"text-xs border-b border-gray-200 overflow-hidden\">\n        <!-- Compact mode (structural props: name, type, position, wires, tab …) -->\n        <div v-if=\"compact\" class=\"flex items-start gap-3 px-3 py-2\">\n            <span class=\"text-gray-500 shrink-0 w-20 pt-0.5 truncate\">{{ label ?? prop }}</span>\n            <div class=\"flex-1 flex flex-wrap items-center gap-1.5\">\n                <template v-for=\"(seg, i) in compactSegments\" :key=\"i\">\n                    <span v-if=\"seg.type === 'arrow'\" class=\"text-gray-400\">→</span>\n                    <span v-else-if=\"seg.type === 'sep'\" class=\"text-gray-300 mx-0.5\">|</span>\n                    <span v-else-if=\"seg.type === 'nodesep'\" class=\"text-gray-400 font-mono -mx-0.5\">,</span>\n                    <span\n                        v-else\n                        class=\"px-1.5 py-0.5 rounded font-mono text-xs\"\n                        :title=\"seg.text\"\n                        :class=\"{\n                            'bg-red-50 text-red-700 line-through': seg.kind === 'removed',\n                            'bg-green-50 text-green-700': seg.kind === 'added',\n                            'bg-gray-100 text-gray-600': seg.kind === 'unchanged'\n                        }\"\n                    >{{ seg.text }}</span>\n                </template>\n            </div>\n        </div>\n\n        <!-- Git diff mode -->\n        <template v-else>\n            <!-- Collapsible header -->\n            <div\n                class=\"px-3 py-1 bg-gray-50 border-b border-gray-100 text-gray-500 sticky top-0 flex items-center gap-1 cursor-pointer select-none hover:bg-gray-100\"\n                @click=\"collapsed = !collapsed\"\n            >\n                <svg\n                    class=\"w-2.5 h-2.5 text-gray-400 transition-transform duration-150 flex-shrink-0\"\n                    :class=\"{ 'rotate-90': !collapsed }\"\n                    viewBox=\"0 0 20 20\" fill=\"currentColor\"\n                    aria-hidden=\"true\"\n                >\n                    <path fill-rule=\"evenodd\" d=\"M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z\" clip-rule=\"evenodd\" />\n                </svg>\n                <span>Property</span>\n                <span class=\"font-semibold text-gray-700\">{{ label ?? prop }}</span>\n                <span class=\"ml-auto flex items-center gap-2\">\n                    <template v-if=\"!collapsed\">\n                        <!-- Wrap toggle (shown when any line exceeds 50 chars) -->\n                        <button\n                            v-if=\"hasLongLines\"\n                            class=\"text-gray-400 hover:text-gray-600 px-1 py-0.5 rounded hover:bg-gray-200\"\n                            title=\"Toggle word wrap\"\n                            @click.stop=\"wrapped = !wrapped\"\n                        >Wrap</button>\n                        <!-- Prettify button (shown when value looks like JSON) -->\n                        <button\n                            v-if=\"canPrettify && !prettified\"\n                            class=\"text-gray-400 hover:text-gray-600 px-1 py-0.5 rounded hover:bg-gray-200\"\n                            title=\"Pretty-print JSON and re-diff\"\n                            @click.stop=\"prettify\"\n                        >Prettify</button>\n                        <button\n                            v-if=\"prettified\"\n                            class=\"text-blue-500 hover:text-blue-700 px-1 py-0.5 rounded hover:bg-blue-50\"\n                            title=\"Show raw values\"\n                            @click.stop=\"unprettify\"\n                        >Raw</button>\n                    </template>\n                    <span class=\"text-gray-400\">{{ changeSummary }}</span>\n                </span>\n            </div>\n            <div v-show=\"!collapsed\" class=\"font-mono\">\n                <div class=\"diff-scroll-container\" :class=\"{ 'diff-wrap': wrapped }\">\n                    <div class=\"diff-content\">\n                        <template v-for=\"(line, i) in lines\" :key=\"i\">\n                            <!-- Collapsed unchanged section -->\n                            <div\n                                v-if=\"line.type === 'collapsed'\"\n                                class=\"flex leading-5 text-blue-600 bg-blue-50 cursor-pointer hover:bg-blue-100 select-none border-y border-blue-100\"\n                                @click=\"expandSection(i)\"\n                            >\n                                <span class=\"line-num border-r border-blue-200 text-blue-400\" />\n                                <span class=\"line-num border-r border-blue-200 text-blue-400\" />\n                                <span class=\"px-3 flex-1 text-center\">&#8597; {{ line.count }} unchanged line{{ line.count === 1 ? '' : 's' }}</span>\n                            </div>\n                            <!-- Diff line -->\n                            <div\n                                v-else\n                                :class=\"lineClass(line)\"\n                                :data-change=\"line.type !== 'unchanged' || undefined\"\n                                class=\"flex leading-5\"\n                            >\n                                <span class=\"line-num border-r select-none shrink-0\" :class=\"lineNumClass(line)\">{{ line.oldNum || '' }}</span>\n                                <span class=\"line-num border-r select-none shrink-0\" :class=\"lineNumClass(line)\">{{ line.newNum || '' }}</span>\n                                <span class=\"px-2\" :class=\"wrapped ? 'whitespace-pre-wrap break-all' : 'whitespace-pre'\">{{ linePrefix(line) }}{{ line.text }}</span>\n                            </div>\n                        </template>\n                    </div>\n                </div>\n            </div>\n        </template>\n    </div>\n</template>\n\n<script>\nimport { diffLines } from 'diff'\n\nconst CONTEXT = 3\nconst LONG_LINE_THRESHOLD = 50\n\nexport default {\n    name: 'SnapshotDiffChangePanel',\n    props: {\n        prop: { type: String, default: '' },\n        label: { type: String, default: null },\n        value1: { type: [String, Number, Boolean, Array, Object], default: undefined },\n        value2: { type: [String, Number, Boolean, Array, Object], default: undefined },\n        compact: { type: Boolean, default: false },\n        initiallyExpanded: { type: Boolean, default: true }\n    },\n    data () {\n        return { lines: [], collapsed: !this.initiallyExpanded, wrapped: false, prettified: false }\n    },\n    computed: {\n        changeSummary () {\n            const added = this.lines.filter(l => l.type === 'added').length\n            const removed = this.lines.filter(l => l.type === 'removed').length\n            if (added && removed) return `+${added} -${removed}`\n            if (added) return `+${added}`\n            if (removed) return `-${removed}`\n            return ''\n        },\n        hasLongLines () {\n            return this.lines.some(l => l.text && l.text.length > LONG_LINE_THRESHOLD)\n        },\n        canPrettify () {\n            return this.looksLikeJson(this.value1) || this.looksLikeJson(this.value2)\n        },\n        compactSegments () {\n            const segments = []\n\n            // Wires: array-of-arrays → show per output port, one badge per node\n            if (Array.isArray(this.value1) || Array.isArray(this.value2)) {\n                const w1 = Array.isArray(this.value1) ? this.value1 : []\n                const w2 = Array.isArray(this.value2) ? this.value2 : []\n                const len = Math.max(w1.length, w2.length)\n                for (let i = 0; i < len; i++) {\n                    if (i > 0) segments.push({ type: 'sep' })\n                    const nodes1 = Array.isArray(w1[i]) ? w1[i] : (w1[i] ? [w1[i]] : [])\n                    const nodes2 = Array.isArray(w2[i]) ? w2[i] : (w2[i] ? [w2[i]] : [])\n                    const s1 = nodes1.join(',')\n                    const s2 = nodes2.join(',')\n                    if (s1 === s2) {\n                        if (nodes1.length === 0) {\n                            segments.push({ type: 'value', kind: 'unchanged', text: '(none)' })\n                        } else {\n                            nodes1.forEach((node, idx) => {\n                                if (idx > 0) segments.push({ type: 'nodesep' })\n                                segments.push({ type: 'value', kind: 'unchanged', text: node })\n                            })\n                        }\n                    } else {\n                        nodes1.forEach((node, idx) => {\n                            if (idx > 0) segments.push({ type: 'nodesep' })\n                            segments.push({ type: 'value', kind: 'removed', text: node })\n                        })\n                        if (nodes1.length && nodes2.length) segments.push({ type: 'arrow' })\n                        nodes2.forEach((node, idx) => {\n                            if (idx > 0) segments.push({ type: 'nodesep' })\n                            segments.push({ type: 'value', kind: 'added', text: node })\n                        })\n                    }\n                }\n                if (!segments.length) segments.push({ type: 'value', kind: 'unchanged', text: '(empty)' })\n                return segments\n            }\n\n            // Scalar / object\n            const f1 = this.formatCompact(this.value1)\n            const f2 = this.formatCompact(this.value2)\n            if (f1 === f2) {\n                segments.push({ type: 'value', kind: 'unchanged', text: f1 || '—' })\n            } else {\n                if (f1) segments.push({ type: 'value', kind: 'removed', text: f1 })\n                if (f1 && f2) segments.push({ type: 'arrow' })\n                if (f2) segments.push({ type: 'value', kind: 'added', text: f2 })\n            }\n            return segments\n        }\n    },\n    watch: {\n        value1: { immediate: true, handler: 'rebuildLines' },\n        value2: 'rebuildLines',\n        initiallyExpanded (val) {\n            if (!this.compact) this.collapsed = !val\n        }\n    },\n    methods: {\n        rebuildLines () {\n            if (!this.compact) {\n                this.prettified = false\n                this.lines = this.buildLines(this.value1, this.value2)\n            }\n        },\n        looksLikeJson (v) {\n            if (typeof v === 'string' && v.length >= 2) {\n                const trimmed = v.trim()\n                const first = trimmed[0]\n                const last = trimmed[trimmed.length - 1]\n                return (first === '{' && last === '}') || (first === '[' && last === ']')\n            }\n            return false\n        },\n        tryPrettify (v) {\n            if (this.looksLikeJson(v)) {\n                try { return JSON.stringify(JSON.parse(v), null, 2) } catch (_) { /* not valid JSON */ }\n            }\n            return null\n        },\n        prettify () {\n            const p1 = this.tryPrettify(this.value1)\n            const p2 = this.tryPrettify(this.value2)\n            if (p1 !== null || p2 !== null) {\n                this.prettified = true\n                this.lines = this.buildLines(\n                    p1 !== null ? p1 : this.value1,\n                    p2 !== null ? p2 : this.value2\n                )\n                this.collapsed = false\n            }\n        },\n        unprettify () {\n            this.prettified = false\n            this.lines = this.buildLines(this.value1, this.value2)\n        },\n        buildLines (v1Raw, v2Raw) {\n            const v1 = this.stringify(v1Raw)\n            const v2 = this.stringify(v2Raw)\n\n            if (!v1.includes('\\n') && !v2.includes('\\n')) {\n                const result = []\n                if (v1 !== '') result.push({ type: 'removed', text: v1, oldNum: 1, newNum: null })\n                if (v2 !== '') result.push({ type: 'added', text: v2, oldNum: null, newNum: 1 })\n                return result\n            }\n\n            const flat = []\n            let oldNum = 1\n            let newNum = 1\n            for (const part of diffLines(v1, v2)) {\n                const type = part.added ? 'added' : part.removed ? 'removed' : 'unchanged'\n                for (const text of part.value.replace(/\\n$/, '').split('\\n')) {\n                    if (type === 'removed') flat.push({ type, text, oldNum: oldNum++, newNum: null })\n                    else if (type === 'added') flat.push({ type, text, oldNum: null, newNum: newNum++ })\n                    else flat.push({ type, text, oldNum: oldNum++, newNum: newNum++ })\n                }\n            }\n            return this.collapseContext(flat)\n        },\n        collapseContext (flat) {\n            const result = []\n            let i = 0\n            while (i < flat.length) {\n                if (flat[i].type !== 'unchanged') {\n                    result.push(flat[i++])\n                    continue\n                }\n                let j = i\n                while (j < flat.length && flat[j].type === 'unchanged') j++\n                const count = j - i\n                const isLeading = i === 0\n                const isTrailing = j === flat.length\n\n                if (count <= CONTEXT * 2) {\n                    for (let k = i; k < j; k++) result.push(flat[k])\n                } else if (isLeading) {\n                    const hidden = flat.slice(i, j - CONTEXT)\n                    result.push({ type: 'collapsed', count: hidden.length, hiddenLines: hidden })\n                    for (let k = j - CONTEXT; k < j; k++) result.push(flat[k])\n                } else if (isTrailing) {\n                    for (let k = i; k < i + CONTEXT; k++) result.push(flat[k])\n                    const hidden = flat.slice(i + CONTEXT, j)\n                    if (hidden.length) result.push({ type: 'collapsed', count: hidden.length, hiddenLines: hidden })\n                } else {\n                    for (let k = i; k < i + CONTEXT; k++) result.push(flat[k])\n                    const hidden = flat.slice(i + CONTEXT, j - CONTEXT)\n                    result.push({ type: 'collapsed', count: hidden.length, hiddenLines: hidden })\n                    for (let k = j - CONTEXT; k < j; k++) result.push(flat[k])\n                }\n                i = j\n            }\n            return result\n        },\n        expandSection (index) {\n            this.lines.splice(index, 1, ...this.lines[index].hiddenLines)\n        },\n        formatCompact (v) {\n            if (v === undefined || v === null) return ''\n            if (typeof v === 'object' && 'x' in v && 'y' in v) return `(${v.x}, ${v.y})`\n            if (typeof v === 'object') return JSON.stringify(v)\n            return String(v)\n        },\n        stringify (v) {\n            if (v === undefined || v === null) return ''\n            if (typeof v === 'object') return JSON.stringify(v, null, 2)\n            return String(v)\n        },\n        lineClass (line) {\n            if (line.type === 'added') return 'bg-green-50 text-green-800'\n            if (line.type === 'removed') return 'bg-red-50 text-red-800'\n            return 'text-gray-400'\n        },\n        lineNumClass (line) {\n            if (line.type === 'added') return 'bg-green-100 text-green-600 border-green-200'\n            if (line.type === 'removed') return 'bg-red-100 text-red-500 border-red-200'\n            return 'bg-gray-50 text-gray-400 border-gray-200'\n        },\n        linePrefix (line) {\n            if (line.type === 'added') return '+'\n            if (line.type === 'removed') return '-'\n            return ' '\n        }\n    }\n}\n</script>\n\n<style scoped>\n.line-num {\n    display: inline-block;\n    width: 3rem;\n    min-width: 3rem;\n    text-align: right;\n    padding: 0 0.4rem;\n    user-select: none;\n}\n.diff-scroll-container {\n    overflow-x: auto;\n    padding-bottom: 0.5rem;\n}\n.diff-scroll-container:not(.diff-wrap) .diff-content {\n    width: max-content;\n    min-width: 100%;\n}\n.diff-scroll-container:not(.diff-wrap) .diff-content > div {\n    min-width: 100%;\n}\n</style>\n","<template>\n    <ff-dialog\n        ref=\"dialog\" :header=\"header\" confirm-label=\"Close\" :closeOnConfirm=\"true\" data-el=\"flow-view-dialog\"\n        boxClass=\"!min-w-[80%] !min-h-[80%] !w-[80%] !h-[80%]\" contentClass=\"overflow-hidden flex-grow\"\n        @confirm=\"confirm\"\n    >\n        <template #default>\n            <!-- Toolbar -->\n            <div class=\"flex gap-2 items-center\" data-el=\"snapshot-compare-toolbar\">\n                <ff-listbox\n                    v-model=\"compareSnapshot\"\n                    :options=\"compareSnapshotList\"\n                    data-el=\"snapshots-list\"\n                    label-key=\"label\"\n                    option-title-key=\"description\"\n                    class=\"flex-grow\"\n                />\n                <ff-kebab-menu v-if=\"hasCompared\" :menu-items-attrs=\"{ 'data-click-exclude': 'right-drawer' }\">\n                    <ff-kebab-item\n                        :icon=\"hidePositionChanges ? CheckIcon : null\"\n                        label=\"Simple view\"\n                        title=\"Hide changes to node positions (x, y)\"\n                        @click=\"hidePositionChanges = !hidePositionChanges\"\n                    />\n                    <ff-kebab-item\n                        :icon=\"expandedByDefault ? CheckIcon : null\"\n                        label=\"Expand all\"\n                        title=\"Expand all property panels when switching between changes\"\n                        @click=\"expandedByDefault = !expandedByDefault\"\n                    />\n                </ff-kebab-menu>\n            </div>\n\n            <!-- Loading state -->\n            <div v-if=\"loading\" class=\"flex-1 flex items-center justify-center text-sm text-gray-400\">\n                Loading snapshot…\n            </div>\n\n            <!-- Navigation bar — shown after comparison -->\n            <div v-if=\"hasCompared && !loading\" class=\"flex items-center gap-2 px-3 py-1.5 border-b border-gray-200 bg-white shrink-0\">\n                <div v-if=\"currentGroup\" class=\"flex-1 flex items-center gap-2 min-w-0\">\n                    <span class=\"text-xs font-semibold px-1.5 py-0.5 rounded capitalize shrink-0\" :class=\"diffTypeBadgeClass(currentGroup.diffType)\">{{ currentGroup.diffType }}</span>\n                    <span class=\"font-semibold text-sm text-gray-800 truncate\">{{ currentGroup.name }}</span>\n                    <span class=\"text-xs font-semibold text-gray-700 bg-gray-200 px-1.5 py-0.5 rounded shrink-0\">{{ currentGroup.type }}</span>\n                    <span v-if=\"currentGroupCategoryLabel\" class=\"text-xs font-semibold text-purple-600 bg-purple-50 px-1.5 py-0.5 rounded shrink-0\">{{ currentGroupCategoryLabel }}</span>\n                    <span v-if=\"currentGroupTabMove\" class=\"text-xs text-amber-600 bg-amber-50 px-1.5 py-0.5 rounded shrink-0\">\n                        {{ currentGroupTabMove.from }} → {{ currentGroupTabMove.to }}\n                    </span>\n                </div>\n                <div v-else class=\"flex-1 text-sm text-gray-400 text-center\">No differences found</div>\n                <!-- Prev / counter / Next grouped so the two buttons are adjacent -->\n                <div class=\"flex items-center gap-1 shrink-0\">\n                    <button\n                        class=\"px-2 py-0.5 text-sm rounded border border-gray-200 text-gray-500 hover:bg-gray-50 disabled:opacity-30 disabled:cursor-not-allowed\"\n                        :disabled=\"currentGroupIndex === 0\"\n                        title=\"Previous change (←)\"\n                        @click=\"navigate(-1)\"\n                    >\n                        ‹ Prev\n                    </button>\n                    <span class=\"text-xs text-gray-400 px-1\">{{ groupedChanges.length ? `${currentGroupIndex + 1} / ${groupedChanges.length}` : '0' }}</span>\n                    <button\n                        class=\"px-2 py-0.5 text-sm rounded border border-gray-200 text-gray-500 hover:bg-gray-50 disabled:opacity-30 disabled:cursor-not-allowed\"\n                        :disabled=\"currentGroupIndex >= groupedChanges.length - 1\"\n                        title=\"Next change (→)\"\n                        @click=\"navigate(1)\"\n                    >\n                        Next ›\n                    </button>\n                </div>\n            </div>\n\n            <!-- Main area: flow canvas (always visible) + property diff panel (when compared) -->\n            <div v-show=\"!loading\" class=\"ff-compare-main flex overflow-hidden\" :class=\"hasCompared ? 'ff-compare-main--with-nav' : ''\">\n                <!-- Flow canvas -->\n                <div\n                    ref=\"compareViewer\"\n                    data-el=\"ff-flow-compare-view\"\n                    class=\"ff-flow-compare-view flex-1 min-w-0 pt-4\"\n                    @click.stop.prevent\n                >\n&nbsp;\n                </div>\n\n                <!-- Drag handle -->\n                <div v-if=\"hasCompared\" class=\"ff-resize-handle shrink-0\" @mousedown.prevent=\"startResize\" />\n\n                <!-- Property diff sidebar -->\n                <div v-if=\"hasCompared\" class=\"ff-compare-sidebar border-l border-gray-200 overflow-y-auto bg-white shrink-0\" :style=\"{ width: sidebarWidth + 'px' }\">\n                    <div v-if=\"!currentGroupChanges.length\" class=\"px-3 py-4 text-xs text-gray-400 italic text-center\">\n                        No property changes for this node.\n                    </div>\n                    <SnapshotDiffChangePanel\n                        v-for=\"change in currentGroupChanges\"\n                        :key=\"change.prop\"\n                        :prop=\"change.prop\"\n                        :label=\"change.label\"\n                        :value1=\"change.value1\"\n                        :value2=\"change.value2\"\n                        :compact=\"isCompactProp(change.prop)\"\n                        :initially-expanded=\"expandedByDefault\"\n                    />\n                </div>\n            </div>\n        </template>\n        <template #actions>\n            <div class=\"flex justify-end\">\n                <ff-button data-action=\"dialog-confirm\" @click=\"confirm\">Close</ff-button>\n            </div>\n        </template>\n    </ff-dialog>\n</template>\n\n<script>\nimport FlowRenderer from '@flowfuse/flow-renderer'\nimport { CheckIcon } from '@heroicons/vue/outline'\n\nimport SnapshotsApi from '../../api/snapshots.js'\nimport Alerts from '../../services/alerts.js'\n\nimport SnapshotDiffChangePanel from './SnapshotDiffChangePanel.vue'\n\n// Props shown in compact (single-line) mode in the diff sidebar\nconst COMPACT_PROPS = new Set(['position', 'z', 'g', 'name', 'label', 'type', 'wires', 'disabled'])\n// Props to skip entirely in computeDiff — computed by Node-RED at render time, not user data\nconst IGNORED_PROPS = new Set(['id', 'w', 'h'])\n// Props that represent node position — can be toggled off by the user\nconst POSITION_PROPS = new Set(['x', 'y'])\n// Props shown in the nav header — skip when expanding all props for added/deleted nodes\nconst HEADER_PROPS = new Set(['id', 'type', 'z', 'name', 'label'])\n// Node categories that have no visual presence on the SVG canvas\nconst CONFIG_CATEGORIES = new Set(['global-config', 'flow-config'])\n\nconst SIDEBAR_MIN_WIDTH = 200\nconst SIDEBAR_MAX_WIDTH = 800\n\nexport default {\n    name: 'AssetCompareDialog',\n    components: { SnapshotDiffChangePanel },\n    props: {\n        title: {\n            type: String,\n            default: ''\n        }\n    },\n    setup () {\n        return {\n            /**\n             * Shows the compare flows dialog and presents the user with a list of snapshots to compare against\n             * @param {{flows: { flows: [] }}} v1Snapshot - A snapshot object as the base for comparison\n             * @param {Array<{label: string, value: string}>} snapshotList - Snapshots to compare against\n             */\n            show (v1Snapshot, snapshotList) {\n                this.payload = v1Snapshot\n                this.compareSnapshot = null\n                this.changes = []\n                this.rendererChanges = []\n                this.hasCompared = false\n                this.nodeMap = {}\n                this.compareSnapshotList = snapshotList.filter(s => s.value !== v1Snapshot?.id)\n                this.currentGroupIndex = 0\n                this.$refs.dialog.show()\n            }\n        }\n    },\n    data () {\n        return {\n            CheckIcon,\n            payload: [],\n            compareSnapshot: null,\n            compareSnapshotList: [],\n            changes: [],\n            rendererChanges: [],\n            hasCompared: false,\n            loading: false,\n            nodeMap: {},\n            currentGroupIndex: 0,\n            sidebarWidth: 380,\n            resizing: false,\n            resizeStartX: 0,\n            resizeStartWidth: 0,\n            hidePositionChanges: false,\n            expandedByDefault: true\n        }\n    },\n    computed: {\n        flow () {\n            return this.payload?.flows?.flows || []\n        },\n        header () {\n            return this.payload?.name || this.title || 'Flow'\n        },\n        groupedChanges () {\n            const groups = new Map()\n            for (const change of this.changes) {\n                if (this.hidePositionChanges && change.prop && POSITION_PROPS.has(change.prop)) continue\n                const key = change.item\n                if (!groups.has(key)) {\n                    const node = this.nodeMap[key] || {}\n                    groups.set(key, {\n                        nodeId: key,\n                        // Prefer explicit name/label; fall back to type (e.g. \"inject\")\n                        // before the raw UUID so the nav bar stays readable\n                        name: node.name || node.label || node.type || key,\n                        type: node.type || '',\n                        diffType: change.diffType,\n                        category: this.nodeCategory(node),\n                        propChanges: []\n                    })\n                }\n                const group = groups.get(key)\n                if (change.diffType === 'added' || change.diffType === 'deleted') {\n                    const node = this.nodeMap[key] || {}\n                    const isAdded = change.diffType === 'added'\n                    for (const [prop, val] of Object.entries(node)) {\n                        if (HEADER_PROPS.has(prop)) continue\n                        if (IGNORED_PROPS.has(prop)) continue\n                        if (this.hidePositionChanges && POSITION_PROPS.has(prop)) continue\n                        group.propChanges.push({ prop, value1: isAdded ? undefined : val, value2: isAdded ? val : undefined })\n                    }\n                } else if (change.diffType === 'changed') {\n                    group.propChanges.push({ prop: change.prop, value1: change.value1, value2: change.value2 })\n                }\n            }\n            // When hiding position changes, drop nodes that only had position diffs\n            if (this.hidePositionChanges) {\n                for (const [key, group] of groups) {\n                    if (group.diffType === 'changed' && group.propChanges.length === 0) {\n                        groups.delete(key)\n                    }\n                }\n            }\n            return [...groups.values()]\n        },\n        currentGroup () {\n            return this.groupedChanges[this.currentGroupIndex] || null\n        },\n        currentGroupChanges () {\n            return this.transformChanges(this.currentGroup?.propChanges || [])\n        },\n        currentGroupCategoryLabel () {\n            const cat = this.currentGroup?.category\n            if (cat === 'global-config') return 'Global Config'\n            if (cat === 'flow-config') return 'Flow Config'\n            return null\n        },\n        currentGroupTabMove () {\n            // Returns { from, to } if a changed node moved between tabs, null otherwise.\n            // Not shown for added/deleted nodes — the tab is part of their identity,\n            // not a move.\n            if (this.currentGroup?.diffType !== 'changed') return null\n            const zChange = this.currentGroup?.propChanges?.find(c => c.prop === 'z')\n            if (!zChange || zChange.value1 === zChange.value2) return null\n            return {\n                from: this.resolveTabName(zChange.value1),\n                to: this.resolveTabName(zChange.value2)\n            }\n        }\n    },\n    watch: {\n        compareSnapshot (val) {\n            if (val) this.renderComparison()\n        },\n        hidePositionChanges () {\n            // Clamp index — the list may have shrunk\n            if (this.currentGroupIndex >= this.groupedChanges.length) {\n                this.currentGroupIndex = Math.max(0, this.groupedChanges.length - 1)\n            }\n            this.highlightCurrent()\n        }\n    },\n    mounted () {\n        document.addEventListener('keydown', this.onKeyDown)\n    },\n    beforeUnmount () {\n        document.removeEventListener('keydown', this.onKeyDown)\n        document.removeEventListener('mousemove', this.onResize)\n        document.removeEventListener('mouseup', this.stopResize)\n    },\n    methods: {\n        confirm () {\n            this.cleanup()\n            this.$refs.dialog.close()\n        },\n        async renderComparison () {\n            this.cleanup()\n            this.hasCompared = false\n            this.loading = true\n            let compareSnapshot\n            try {\n                compareSnapshot = await SnapshotsApi.getFullSnapshot(this.compareSnapshot)\n            } finally {\n                this.loading = false\n            }\n            if (!compareSnapshot?.flows?.flows) {\n                Alerts.emit('Flows not found in the selected snapshot', 'warning')\n                return\n            }\n            const compareFlow = compareSnapshot.flows.flows\n\n            const map = {}\n            for (const node of [...compareFlow, ...this.flow]) {\n                if (node.id) map[node.id] = node\n            }\n            this.nodeMap = map\n\n            const flowRenderer = new FlowRenderer()\n            const result = flowRenderer.compare([compareFlow, this.flow], {\n                container: this.$refs.compareViewer,\n                // Explicit scope prevents the renderer from using Tailwind utility\n                // classes (e.g. flex-1) as CSS selectors, which would leak\n                // svg sizing rules to the rest of the page.\n                scope: 'ff-flow-compare-view',\n                persistentHighlight: true,\n                allChanges: true\n            })\n            this.rendererChanges = result?.changes || []\n            this.clearRendererHighlight = result?.clearHighlight || (() => {})\n            this.changes = this.computeDiff(compareFlow, this.flow)\n            this.currentGroupIndex = 0\n            this.hasCompared = true\n            await this.$nextTick()\n            await this.$nextTick()\n            this.highlightCurrent()\n        },\n        navigate (dir) {\n            const next = this.currentGroupIndex + dir\n            if (next < 0 || next >= this.groupedChanges.length) return\n            this.currentGroupIndex = next\n            this.highlightCurrent()\n        },\n        onKeyDown (e) {\n            if (!this.hasCompared) return\n            if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') return\n            if (e.key === 'ArrowLeft') { e.preventDefault(); this.navigate(-1) } else if (e.key === 'ArrowRight') { e.preventDefault(); this.navigate(1) }\n        },\n        highlightCurrent () {\n            const group = this.currentGroup\n            if (!group) return\n            this.clearRendererHighlight()\n            if (CONFIG_CATEGORIES.has(group.category)) return\n            // Always pass layerNo explicitly from our own diffType so the renderer\n            // shows the correct layer regardless of its internal change classification.\n            const layerNo = group.diffType === 'added' ? 1 : group.diffType === 'deleted' ? 0 : -1\n            // Jump the slider directly to the target and dispatch one input event so\n            // the renderer updates layer opacities immediately.\n            if (layerNo !== -1) {\n                const slider = this.$refs.compareViewer?.querySelector('.flow-compare-slider')\n                const target = layerNo === 1 ? 90 : 10\n                if (slider && parseInt(slider.value) !== target) {\n                    slider.value = target\n                    slider.dispatchEvent(new Event('input', { bubbles: true }))\n                }\n            }\n            if (group.type === 'tab') {\n                const proxy = this.rendererChanges.find(rc => rc.tab === group.nodeId && rc.highlight)\n                if (proxy) proxy.highlight(layerNo)\n            } else {\n                for (const rc of this.rendererChanges) {\n                    if (rc.item === group.nodeId && rc.highlight) {\n                        rc.highlight(layerNo)\n                    }\n                }\n            }\n        },\n        diffTypeBadgeClass (diffType) {\n            switch (diffType) {\n            case 'added': return 'bg-green-100 text-green-700'\n            case 'deleted': return 'bg-red-100 text-red-700'\n            case 'moved': return 'bg-yellow-100 text-yellow-700'\n            default: return 'bg-blue-100 text-blue-700'\n            }\n        },\n        cleanup () {\n            while (this.$refs.compareViewer?.firstChild) {\n                this.$refs.compareViewer.removeChild(this.$refs.compareViewer.firstChild)\n            }\n        },\n        startResize (e) {\n            this.resizing = true\n            this.resizeStartX = e.clientX\n            this.resizeStartWidth = this.sidebarWidth\n            document.addEventListener('mousemove', this.onResize)\n            document.addEventListener('mouseup', this.stopResize)\n        },\n        onResize (e) {\n            if (!this.resizing) return\n            const delta = this.resizeStartX - e.clientX\n            this.sidebarWidth = Math.max(SIDEBAR_MIN_WIDTH, Math.min(SIDEBAR_MAX_WIDTH, this.resizeStartWidth + delta))\n        },\n        stopResize () {\n            this.resizing = false\n            document.removeEventListener('mousemove', this.onResize)\n            document.removeEventListener('mouseup', this.stopResize)\n        },\n        isCompactProp (prop) {\n            return COMPACT_PROPS.has(prop)\n        },\n        transformChanges (changes) {\n            const result = []\n            let xChange = null\n            let yChange = null\n            for (const c of changes) {\n                if (c.prop === 'x') { xChange = c; continue }\n                if (c.prop === 'y') { yChange = c; continue }\n                if (c.prop === 'z') {\n                    result.push({ prop: 'z', label: 'Tab', value1: this.resolveTabName(c.value1), value2: this.resolveTabName(c.value2) })\n                    continue\n                }\n                if (c.prop === 'g') {\n                    result.push({ prop: 'g', label: 'Group', value1: this.resolveNodeName(c.value1), value2: this.resolveNodeName(c.value2) })\n                    continue\n                }\n                if (c.prop === 'disabled') {\n                    // Show as \"enabled\" / \"disabled\" rather than raw true/false\n                    result.push({ prop: 'disabled', label: 'Status', value1: this.resolveDisabled(c.value1), value2: this.resolveDisabled(c.value2) })\n                    continue\n                }\n                if (c.prop === 'wires') {\n                    result.push({ prop: 'wires', value1: this.resolveWires(c.value1), value2: this.resolveWires(c.value2) })\n                    continue\n                }\n                result.push(c)\n            }\n            if (xChange || yChange) {\n                const node = this.nodeMap[this.currentGroup?.nodeId] || {}\n                const v1 = { x: xChange ? xChange.value1 : node.x, y: yChange ? yChange.value1 : node.y }\n                const v2 = { x: xChange ? xChange.value2 : node.x, y: yChange ? yChange.value2 : node.y }\n                result.push({\n                    prop: 'position',\n                    value1: (v1.x !== undefined || v1.y !== undefined) ? v1 : undefined,\n                    value2: (v2.x !== undefined || v2.y !== undefined) ? v2 : undefined\n                })\n            }\n            // Compact props always appear first as a block\n            result.sort((a, b) => (this.isCompactProp(a.prop) ? 0 : 1) - (this.isCompactProp(b.prop) ? 0 : 1))\n            return result\n        },\n        resolveWires (wires) {\n            if (!Array.isArray(wires)) return wires\n            return wires.map(outputs =>\n                Array.isArray(outputs)\n                    ? outputs.map(id => {\n                        const node = this.nodeMap[id]\n                        return node ? (node.name || node.label || id) : id\n                    })\n                    : outputs\n            )\n        },\n        resolveTabName (tabId) {\n            if (!tabId) return tabId\n            const tab = this.nodeMap[tabId]\n            return tab ? (tab.label || tabId) : tabId\n        },\n        resolveNodeName (nodeId) {\n            if (!nodeId) return nodeId\n            const node = this.nodeMap[nodeId]\n            return node ? (node.name || node.label || nodeId) : nodeId\n        },\n        resolveDisabled (val) {\n            if (val === undefined || val === null) return undefined\n            return val ? 'disabled' : 'enabled'\n        },\n        nodeCategory (node) {\n            if (!node || !node.type) return 'node'\n            if (node.type === 'tab') return 'tab'\n            if (node.type === 'group') return 'group'\n            if (node.type === 'subflow') return 'subflow'\n            // Config nodes have no canvas position — works for all node packages\n            if (node.x === undefined && node.y === undefined) {\n                return node.z ? 'flow-config' : 'global-config'\n            }\n            return 'node'\n        },\n        computeDiff (flow1, flow2) {\n            const map1 = {}\n            const map2 = {}\n            for (const n of flow1) { if (n.id) map1[n.id] = n }\n            for (const n of flow2) { if (n.id) map2[n.id] = n }\n\n            const changes = []\n\n            for (const id of Object.keys(map1)) {\n                if (!map2[id]) changes.push({ item: id, diffType: 'deleted' })\n            }\n            for (const id of Object.keys(map2)) {\n                if (!map1[id]) changes.push({ item: id, diffType: 'added' })\n            }\n            for (const id of Object.keys(map1)) {\n                if (!map2[id]) continue\n                const n1 = map1[id]\n                const n2 = map2[id]\n                for (const prop of new Set([...Object.keys(n1), ...Object.keys(n2)])) {\n                    if (IGNORED_PROPS.has(prop)) continue\n                    const v1 = n1[prop]\n                    const v2 = n2[prop]\n                    if (JSON.stringify(v1) !== JSON.stringify(v2)) {\n                        changes.push({ item: id, diffType: 'changed', prop, value1: v1, value2: v2 })\n                    }\n                }\n            }\n            return changes\n        }\n    }\n}\n</script>\n\n<style scoped>\n/* The renderer applies -webkit-appearance:none but leaves the input box\n   with a white user-agent background. Make it transparent so only the\n   styled track is visible. */\n.ff-flow-compare-view :deep(input[type='range'].flow-compare-slider) {\n    background: transparent;\n}\n\n/* Smooth opacity transitions for SVG flow layers and tab labels.\n   The renderer normally steps opacity via a slow JS loop; we bypass that\n   loop and let CSS handle the fade (see highlightCurrent). */\n.ff-flow-compare-view :deep(.flow-layer-0),\n.ff-flow-compare-view :deep(.flow-layer-1) {\n    transition: opacity 250ms ease;\n}\n.ff-flow-compare-view :deep(.red-ui-tab-label) {\n    transition: opacity 250ms ease;\n}\n\n.ff-compare-main {\n    height: calc(100% - 2.5rem);\n}\n.ff-compare-main--with-nav {\n    height: calc(100% - 5rem);\n}\n.ff-resize-handle {\n    width: 4px;\n    cursor: col-resize;\n    background: transparent;\n    transition: background 0.15s;\n}\n.ff-resize-handle:hover {\n    background: #93c5fd; /* blue-300 */\n}\n</style>\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.flow-viewer-wrapper {\n    display: flex;\n    flex: 1 1 auto;\n    min-height: 0;\n    flex-direction: column;\n    position: relative;\n\n    .overlay {\n        position: absolute;\n        top: 0;\n        left: 0;\n        right: 0;\n        bottom: 0;\n        background-color: rgba(255, 255, 255, 0.4);\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        z-index: 1000;\n    }\n\n    .ff-flow-viewer {\n        display: flex;\n        flex-direction: column;\n        flex: 1 1 auto;\n        min-height: 0;\n        overflow: auto;\n        opacity: 1;\n        transition: ease-in-out .3s;\n\n        &.loading {\n            opacity: 0.5;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#snapshot-details-drawer {\n    flex: 1;\n\n    &, .container {\n        flex: 1;\n        display: flex;\n        flex-direction: column;\n        gap: 15px;\n        overflow: auto;\n    }\n\n    .description {\n        p {\n            white-space: break-spaces;\n        }\n    }\n\n    .flow-viewer {\n        .wrapper {\n            max-height: 250px;\n            overflow: auto;\n        }\n    }\n}\n","<template>\n    <div id=\"device-snapshots\" class=\"flex-1 flex flex-col overflow-auto\">\n        <div v-if=\"isOwnedByAnInstance || isUnassigned\" class=\"space-y-6\">\n            <EmptyState :feature-unavailable=\"!features.deviceEditor\">\n                <template #img>\n                    <img src=\"../../../../images/empty-states/instance-snapshots.png\">\n                </template>\n                <template #header>Snapshots are available when a Remote Instance is assigned to an Application</template>\n                <template #message>\n                    <p>\n                        Snapshots are point-in-time backups of your Node-RED Instances\n                        and capture the flows, credentials and runtime settings.\n                    </p>\n                    <p v-if=\"device.ownerType !== 'application'\" class=\"block\">\n                        A Remote Instance must first be <a class=\"ff-link\" href=\"https://flowfuse.com/docs/device-agent/register/#assign-the-device-to-an-application\" target=\"_blank\" rel=\"noreferrer\">assigned to an Application</a>, in order to create snapshots.\n                    </p>\n                    <p v-else-if=\"!developerMode\" class=\"block\">\n                        A Remote Instance must be in Developer Mode and online to create a Snapshot.\n                    </p>\n                </template>\n                <template v-if=\"hasPermission('device:snapshot:create', { application: device.application })\" #actions>\n                    <ff-button\n                        v-if=\"hasPermission('snapshot:import', { application: device.application })\"\n                        kind=\"secondary\" :disabled=\"busy || !features.deviceEditor || device.ownerType !== 'application'\"\n                        data-action=\"import-snapshot\"\n                        @click=\"$emit('show-import-snapshot-dialog')\"\n                    >\n                        <template #icon-left><UploadIcon /></template>Upload Snapshot\n                    </ff-button>\n                    <ff-button\n                        v-if=\"hasPermission('device:snapshot:create', { application: device.application })\"\n                        kind=\"primary\"\n                        :disabled=\"!developerMode || busy || !features.deviceEditor || device.ownerType !== 'application'\"\n                        data-action=\"create-snapshot\"\n                        @click=\"$emit('show-create-snapshot-dialog')\"\n                    >\n                        <template #icon-left><PlusSmIcon /></template>Create Snapshot\n                    </ff-button>\n                </template>\n            </EmptyState>\n        </div>\n        <div v-else class=\"space-y-6 flex-1 flex flex-col overflow-auto\">\n            <ff-loading v-if=\"loading\" message=\"Loading Snapshots...\" />\n            <template v-else-if=\"features.deviceEditor && snapshots.length > 0\">\n                <ff-data-table\n                    data-el=\"snapshots\"\n                    class=\"space-y-4\"\n                    :columns=\"columns\"\n                    :rows=\"snapshotsFiltered\"\n                    :rows-selectable=\"true\"\n                    :show-search=\"true\"\n                    search-placeholder=\"Search Snapshots...\"\n                    @row-selected=\"onRowSelected\"\n                >\n                    <template #actions>\n                        <DropdownMenu data-el=\"snapshot-filter\" buttonClass=\"ff-btn ff-btn--secondary\" :options=\"snapshotFilterOptions\">\n                            <FilterIcon class=\"ff-btn--icon ff-btn--icon-left\" aria-hidden=\"true\" />\n                            {{ snapshotFilter?.name || 'All Snapshots' }}\n                            <span class=\"sr-only\">Filter Snapshots</span>\n                        </DropdownMenu>\n                    </template>\n                </ff-data-table>\n            </template>\n            <template v-else-if=\"!loading\">\n                <EmptyState :feature-unavailable=\"!features.deviceEditor\" :feature-unavailable-message=\"'This requires Developer Mode on Devices, which is a FlowFuse Enterprise Feature'\">\n                    <template #img>\n                        <img src=\"../../../../images/empty-states/instance-snapshots.png\">\n                    </template>\n                    <template #header>Create your First Snapshot</template>\n                    <template #message>\n                        <p>\n                            Snapshots are point-in-time backups of your Node-RED Instances\n                            and capture the flows, credentials and runtime settings.\n                        </p>\n                        <p v-if=\"device.ownerType !== 'application'\" class=\"block\">\n                            A Remote Instance must first be <a class=\"ff-link\" href=\"https://flowfuse.com/docs/device-agent/register/#assign-the-device-to-an-application\" target=\"_blank\" rel=\"noreferrer\">assigned to an Application</a>, in order to create snapshots.\n                        </p>\n                        <p v-else-if=\"!developerMode\" class=\"block\">\n                            A Remote Instance must be in Developer Mode and online to create a Snapshot.\n                        </p>\n                    </template>\n                    <template v-if=\"hasPermission('device:snapshot:create', { application: device.application })\" #actions>\n                        <ff-button\n                            v-if=\"hasPermission('snapshot:import', { application: device.application })\"\n                            kind=\"secondary\" :disabled=\"busy || !features.deviceEditor || device.ownerType !== 'application'\"\n                            data-action=\"import-snapshot\"\n                            @click=\"$emit('show-import-snapshot-dialog')\"\n                        >\n                            <template #icon-left><UploadIcon /></template>Upload Snapshot\n                        </ff-button>\n                        <ff-button\n                            kind=\"primary\"\n                            :disabled=\"!canCreateSnapshot\"\n                            data-action=\"create-snapshot\"\n                            @click=\"$emit('show-create-snapshot-dialog')\"\n                        >\n                            <template #icon-left><PlusSmIcon /></template>Create Snapshot\n                        </ff-button>\n                    </template>\n                </EmptyState>\n            </template>\n        </div>\n    </div>\n</template>\n\n<script>\nimport { FilterIcon, PlusSmIcon, UploadIcon } from '@heroicons/vue/outline'\nimport { mapActions, mapState } from 'pinia'\nimport SemVer from 'semver'\nimport { markRaw } from 'vue'\n\nimport ApplicationApi from '../../../../api/application.js'\nimport DropdownMenu from '../../../../components/DropdownMenu.vue'\n\nimport EmptyState from '../../../../components/EmptyState.vue'\nimport SnapshotDetailsDrawer from '../../../../components/drawers/snapshots/SnapshotDetailsDrawer.vue'\nimport UserCell from '../../../../components/tables/cells/UserCell.vue'\nimport usePermissions from '../../../../composables/Permissions.js'\nimport { applySystemUserDetails } from '../../../../transformers/snapshots.transformer.js'\nimport { isAutoSnapshot } from '../../../../utils/snapshot.js'\nimport DaysSince from '../../../application/Snapshots/components/cells/DaysSince.vue'\nimport SnapshotName from '../../../application/Snapshots/components/cells/SnapshotName.vue'\nimport SnapshotSource from '../../../application/Snapshots/components/cells/SnapshotSource.vue'\n\nimport { useAccountSettingsStore } from '@/stores/account-settings.js'\nimport { useContextStore } from '@/stores/context.js'\n\nimport { useUxDrawersStore } from '@/stores/ux-drawers.js'\n\nexport default {\n    name: 'DeviceSnapshots',\n    components: {\n        DropdownMenu,\n        EmptyState,\n        FilterIcon,\n        PlusSmIcon,\n        UploadIcon\n    },\n    inheritAttrs: false,\n    props: {\n        device: {\n            type: Object,\n            required: true\n        },\n        showDeviceSnapshotsOnly: {\n            type: Boolean,\n            required: false,\n            default: false\n        },\n        reloadHooks: {\n            type: Array,\n            required: true,\n            default: () => []\n        }\n    },\n    emits: ['device-updated', 'show-import-snapshot-dialog', 'show-create-snapshot-dialog'],\n    setup () {\n        const { hasPermission } = usePermissions()\n        return { hasPermission }\n    },\n    data () {\n        return {\n            loading: false,\n            deviceCounts: {},\n            snapshots: [],\n            busyMakingSnapshot: false,\n            busyImportingSnapshot: false,\n            snapshotFilter: null,\n            snapshotFilters: {\n                All_Snapshots: {\n                    name: 'All Snapshots',\n                    selected: true,\n                    filter: null,\n                    action: () => {\n                        this.snapshotFilters.All_Snapshots.selected = true\n                        this.snapshotFilters.User_Snapshots.selected = false\n                        this.snapshotFilters.Auto_Snapshots.selected = false\n                        this.snapshotFilter = this.snapshotFilters.All_Snapshots\n                    }\n                },\n                User_Snapshots: {\n                    name: 'User Snapshots',\n                    selected: false,\n                    filter: (s) => !isAutoSnapshot(s),\n                    action: () => {\n                        this.snapshotFilters.All_Snapshots.selected = false\n                        this.snapshotFilters.User_Snapshots.selected = true\n                        this.snapshotFilters.Auto_Snapshots.selected = false\n                        this.snapshotFilter = this.snapshotFilters.User_Snapshots\n                    }\n                },\n                Auto_Snapshots: {\n                    name: 'Auto Snapshots',\n                    selected: false,\n                    filter: (s) => isAutoSnapshot(s),\n                    action: () => {\n                        this.snapshotFilters.All_Snapshots.selected = false\n                        this.snapshotFilters.User_Snapshots.selected = false\n                        this.snapshotFilters.Auto_Snapshots.selected = true\n                        this.snapshotFilter = this.snapshotFilters.Auto_Snapshots\n                    }\n                }\n            }\n        }\n    },\n    computed: {\n        ...mapState(useContextStore, ['team']),\n        ...mapState(useAccountSettingsStore, ['features']),\n        canCreateSnapshot () {\n            if (!this.developerMode || this.busy) {\n                return false\n            }\n            return this.isOwnedByAnInstance || this.isOwnedByAnApplication\n        },\n        columns () {\n            const cols = [\n                {\n                    label: 'Snapshot',\n                    class: ['w-56 sm:w-48'],\n                    component: {\n                        is: markRaw(SnapshotName),\n                        extraProps: {\n                            clippedDetails: true\n                        }\n                    }\n                },\n                {\n                    label: 'Source',\n                    class: ['w-56'],\n                    key: '_ownerSortKey',\n                    // sortable: !this.moreThanOnePage,\n                    component: {\n                        is: markRaw(SnapshotSource)\n                    }\n                },\n                {\n                    label: 'Node-RED version',\n                    class: ['w-56'],\n                    key: 'modules.node-red'\n                },\n                {\n                    label: 'Created By',\n                    class: ['w-48 hidden md:table-cell'],\n                    component: {\n                        is: markRaw(UserCell),\n                        map: {\n                            avatar: 'user.avatar',\n                            name: 'user.name',\n                            username: 'user.username'\n                        }\n                    }\n                },\n                {\n                    label: 'Date Created',\n                    class: ['w-48 hidden sm:table-cell'],\n                    component: { is: markRaw(DaysSince), map: { date: 'createdAt' } }\n                }\n            ]\n            return cols\n        },\n        snapshotList () {\n            return this.snapshots.map(s => {\n                return {\n                    label: s.name,\n                    description: s.description || '',\n                    value: s.id\n                }\n            })\n        },\n        snapshotsFiltered () {\n            if (this.snapshotFilter?.filter) {\n                return this.snapshots.filter(this.snapshotFilter.filter)\n            }\n            return this.snapshots\n        },\n        snapshotFilterOptions () {\n            return Object.values(this.snapshotFilters)\n        },\n        busy () {\n            return this.busyMakingSnapshot || this.busyImportingSnapshot\n        },\n        developerMode () {\n            return this.device?.mode === 'developer'\n        },\n        isOwnedByAnInstance () {\n            return this.device?.ownerType === 'instance'\n        },\n        isOwnedByAnApplication () {\n            return this.device?.ownerType === 'application'\n        },\n        isUnassigned () {\n            return !this.device?.ownerType\n        }\n    },\n    watch: {\n        team: 'fetchData',\n        device: 'fetchData',\n        showDeviceSnapshotsOnly: 'fetchData',\n        reloadHooks: {\n            handler: 'fetchData',\n            deep: true\n        }\n    },\n    mounted () {\n        this.fetchData()\n    },\n    methods: {\n        ...mapActions(useUxDrawersStore, ['openRightDrawer', 'closeRightDrawer']),\n        fetchData: async function () {\n            if (!this.features.deviceEditor || this.isOwnedByAnInstance || this.isUnassigned) {\n                return\n            }\n            if (this.device.id && this.device.application) {\n                this.loading = true\n                const ssFilter = {\n                    deviceId: this.showDeviceSnapshotsOnly ? this.device.id : null\n                }\n                const data = await ApplicationApi.getSnapshots(this.device.application.id, null, null, ssFilter) // TODO Move devices snapshots?\n\n                this.snapshots = data.snapshots.map(snapshot => {\n                    const ownerKey = this.getSortKeyForSnapshotSource(snapshot)\n                    return {\n                        ...snapshot,\n                        ...(ownerKey ? { _ownerSortKey: ownerKey } : { _ownerSortKey: undefined })\n                    }\n                })\n                this.snapshots = applySystemUserDetails(data.snapshots)\n                this.loading = false\n            }\n        },\n        getSortKeyForSnapshotSource (snapshot) {\n            if (snapshot.ownerType === 'device') {\n                return 'Device:' + snapshot.device?.name || 'No Name'\n            }\n\n            if (snapshot.ownerType === 'instance') {\n                return 'Instance:' + snapshot.instance?.name || 'No Name'\n            }\n\n            return 'Unassigned'\n        },\n        // enable/disable snapshot actions\n        canDeploy (_row) {\n            return (!this.developerMode || this.supportsDevModeSnapshotRestore()) && this.hasPermission('device:edit', { application: this.device.application })\n        },\n        canDeployReason (snapshot) {\n            if (!this.hasPermission('device:edit', { application: this.device.application })) {\n                return 'You do not have permission to deploy snapshots to this Remote Instance'\n            }\n            if (this.developerMode && !this.supportsDevModeSnapshotRestore()) {\n                return 'Snapshots deploys to Developer Mode Remote Instances requires Device Agent v3.8.0 or later'\n            }\n            return ''\n        },\n        supportsDevModeSnapshotRestore () {\n            return this.device.agentVersion && SemVer.gte(this.device.agentVersion, '3.8.0')\n        },\n        onRestoredSnapshot () {\n            setTimeout(() => { this.$emit('device-updated') }, 100)\n            this.fetchData()\n        },\n        onRowSelected (snapshot) {\n            this.openRightDrawer({\n                component: markRaw(SnapshotDetailsDrawer),\n                header: { title: 'Snapshot' },\n                props: {\n                    snapshot,\n                    snapshotList: this.snapshotList,\n                    instance: this.device,\n                    canSetDeviceTarget: false,\n                    canRestore: this.canDeploy(snapshot),\n                    canRestoreReason: this.canDeployReason(snapshot),\n                    isDevice: true,\n                    isDeviceDevMode: this.developerMode\n                },\n                on: {\n                    updatedSnapshot: () => this.fetchData(),\n                    restoredSnapshot: () => this.onRestoredSnapshot(),\n                    deletedSnapshot: () => {\n                        this.closeRightDrawer()\n                        this.fetchData()\n                    }\n                },\n                overlay: true,\n                wider: true\n            })\n        }\n    }\n}\n</script>\n\n<style>\n\ntbody .ff-data-table--row > .ff-data-table--cell > .deploy-this-snapshot-button {\n    display: none;\n}\n\ntbody tr.ff-data-table--row:hover .ff-data-table--cell .deploy-this-snapshot-button {\n    display: flex;\n}\n\n</style>\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.graph {\n    min-width: 64px;\n    padding: 15px;\n    position: relative;\n    overflow: hidden;\n\n    .icon-wrapper {\n        min-width: 34px;\n        min-height: 35px;\n        border: 2px solid $ff-blue-800;\n        border-radius: 50%;\n        padding: 5px;\n        background: #fff;\n        position: relative;\n        z-index: 10;\n        color: $ff-blue-800;\n    }\n\n    .connector {\n        border: 1px solid $ff-blue-800;\n        position: absolute;\n        left: 47%;  // compensates for border width\n        z-index: 5;\n\n        &.top {\n            top: -230px;\n            height: 250px;\n\n            &.snapshot {\n                transform: rotate(45deg);\n                top: -25%;\n                left: 80%;\n                height: 50px;\n                border-style: dashed;\n                border-color: $ff-grey-500;\n            }\n        }\n\n        &.bottom {\n            bottom: -200px;\n            height: 230px;\n            &.snapshot {\n                transform: rotate(-45deg);\n                top: 50%;\n                left: 83%;\n                height: 50px;\n                border-style: dashed;\n                border-color: $ff-grey-500;\n            }\n        }\n\n        &.through {\n            bottom: -100px;\n            height: 230px;\n            left: 30px;\n        }\n    }\n\n    &.is-snapshot {\n        padding-left: 45px;\n        min-width: 94px;\n\n        .connector {\n            &.top, &.bottom {\n                left: 65%;\n                border-color: $ff-grey-500;\n                border-style: dashed;\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.event {\n\n    .body {\n        padding: 15px 0;\n        overflow: hidden;\n\n        .content {\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n\n            .title {\n                overflow: hidden;\n                text-overflow: ellipsis;\n\n                i {\n                    opacity: .5;\n                }\n\n                a {\n                    color: $ff-blue-600;\n                }\n            }\n\n            .details {\n                font-size: 70%;\n                opacity: 0.8;\n            }\n        }\n\n        .username {\n            color: $ff-grey-600;\n        }\n    }\n\n    .actions {\n        padding: 15px 10px;\n        min-width: 40px;\n    }\n\n    &.is-snapshot {\n        background: $ff-grey-100;\n        color: $ff-grey-500;\n    }\n\n    &.load-more {\n        background: $ff-grey-200;\n        color: $ff-blue-500;\n        cursor: pointer;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#visual-timeline {\n    .timeline {\n        border: 1px solid $ff-grey-300;\n        border-radius: 3px;\n        overflow: auto;\n        li:last-child {\n            .connector.bottom {\n                display: none;\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#assign-device-dialog {\n    .ff-tile-selection {\n        margin-top: 1rem;\n        display: grid;\n        grid-template-columns: repeat(2, 1fr);\n        gap: 1rem;\n    }\n    .ff-tile-selection-option {\n        width: auto;\n        margin: 0;\n    }\n}\n","<template>\n    <main v-if=\"device\" class=\"ff-with-status-header flex-1 flex flex-col overflow-auto\">\n        <Teleport v-if=\"mounted\" to=\"#platform-banner\">\n            <SubscriptionExpiredBanner :team=\"team\" />\n            <TeamTrialBanner v-if=\"team.billing?.trial\" :team=\"team\" />\n        </Teleport>\n        <SectionNavigationHeader :tabs=\"navigation\">\n            <template #breadcrumbs>\n                <ff-nav-breadcrumb :to=\"{name: 'TeamDevices', params: {team_slug: team.slug}}\">Remote Instances</ff-nav-breadcrumb>\n                <ff-nav-breadcrumb>{{ device.name }}</ff-nav-breadcrumb>\n            </template>\n            <template #status>\n                <div class=\"flex flex-wrap gap-2\">\n                    <DeviceLastSeenBadge :last-seen-at=\"device.lastSeenAt\" :last-seen-ms=\"device.lastSeenMs\" :last-seen-since=\"device.lastSeenSince\" />\n                    <StatusBadge :status=\"device.status\" :instanceId=\"device.id\" instanceType=\"device\" />\n                    <DeviceModeBadge v-if=\"isDevModeAvailable \" :mode=\"device.mode\" />\n                </div>\n            </template>\n            <template #context>\n                <div v-if=\"device?.ownerType === 'application' && device.application\" data-el=\"device-assigned-application\">\n                    Application:\n                    <ff-team-link :to=\"{name: 'Application', params: {id: device.application?.id}}\" class=\"text-blue-600 cursor-pointer hover:text-blue-700 hover:underline\">{{ device.application?.name }}</ff-team-link>\n                </div>\n                <div v-else-if=\"device?.ownerType === 'instance' && device.instance\" data-el=\"device-assigned-instance\">\n                    Instance:\n                    <ff-team-link :to=\"{name: 'Instance', params: {id: device.instance.id}}\" class=\"text-blue-600 cursor-pointer hover:text-blue-700 hover:underline\">{{ device.instance.name }}</ff-team-link>\n                </div>\n                <div v-else data-el=\"device-assigned-none\">\n                    <span class=\"italic\">No Application or Instance Assigned</span> - <a class=\"ff-link\" data-action=\"assign-device\" @click=\"openAssignmentDialog\">Assign</a>\n                </div>\n            </template>\n            <template #tools>\n                <!--\n                    div style 34px is a workaround to prevent the Device Editor button growing taller than adjacent\n                    button (size difference is caused by odd padding in the toggle button, which though not visible\n                    is still there and affects the button height in this div group)\n                -->\n                <div class=\"flex gap-2 align-center\" style=\"height: 34px;\">\n                    <template v-if=\"isDevModeAvailable\">\n                        <template v-if=\"neverConnected\">\n                            <FinishSetupButton\n                                v-if=\"hasPermission('device:create', {application: device.application})\"\n                                :is-primary=\"neverConnected\"\n                                :device=\"device\"\n                            />\n                        </template>\n                        <template v-else>\n                            <DeveloperModeToggle\n                                data-el=\"device-devmode-toggle\"\n                                :device=\"device\"\n                                :disabled=\"disableModeToggle\"\n                                :disabledReason=\"disableModeToggleReason\"\n                                @mode-change=\"setDeviceMode\"\n                            />\n                            <device-editor-link\n                                :device=\"device\"\n                                :title=\"!editorAvailable ? 'You can edit flows directly when Developer Mode is enabled, and your Edge Instance is connected.' : 'Open Edge Instance Editor'\"\n                                :disabled=\"!editorAvailable\"\n                                :primary=\"editorAvailable\"\n                                data-action=\"open-editor\"\n                                @open-immersive-editor=\"openTunnel({launchEditor: true, event: $event, immersive: true})\"\n                                @open-editor=\"openTunnel({launchEditor: true, event: $event, immersive: false})\"\n                            />\n                        </template>\n                    </template>\n                    <DropdownMenu\n                        v-if=\"hasPermission('device:change-status', permissionContext) && actionsDropdownOptions.length\"\n                        data-el=\"device-actions-dropdown\"\n                        :buttonClass=\"`ff-btn ff-btn-icon ${ actionsButtonKind }`\"\n                        :options=\"actionsDropdownOptions\"\n                    >\n                        <CogIcon class=\"ff-btn--icon ff-btn--icon-left\" />\n                        Actions\n                    </DropdownMenu>\n                </div>\n            </template>\n        </SectionNavigationHeader>\n        <div class=\"mt-4 sm:mt-8 flex-1 flex flex-col overflow-auto\">\n            <Teleport v-if=\"mounted && isVisitingAdmin\" to=\"#platform-banner\">\n                <div class=\"ff-banner\" data-el=\"banner-device-as-admin\">You are viewing this device as an Administrator</div>\n            </Teleport>\n            <div class=\"px-3 pb-3 md:px-6 md:pb-6 flex-1 flex flex-col overflow-auto\">\n                <router-view :instance=\"device.instance\" :closingTunnel=\"closingTunnel\" :openingTunnel=\"openingTunnel\" :device=\"device\" @device-updated=\"loadDevice\" @close-tunnel=\"closeTunnel\" @open-tunnel=\"openTunnel\" @device-refresh=\"deviceRefresh\" @assign-device=\"openAssignmentDialog\" />\n            </div>\n        </div>\n        <!-- Dialogs -->\n        <!-- device tunnel connecting -->\n        <ff-dialog ref=\"dialog\" data-el=\"establish-device-tunnel-dialog\" header=\"Preparing the connection...\">\n            <template #default>\n                <div class=\"flex flex-col ml-6 mr-6\">\n                    <div class=\"mb-4\">\n                        <p>Connecting to the device</p>\n                    </div>\n                    <div class=\"flex justify-between items-center\">\n                        <div class=\"flex text-center\">\n                            <img class=\"h-16 w-16\" src=\"../../images/pictograms/cloud_teal.png\">\n                        </div>\n                        <div class=\"flex-grow m-4\">\n                            <div class=\"w-full\">\n                                <div class=\"h-1 w-full bg-teal-200 overflow-hidden\">\n                                    <div kind=\"secondary\" class=\"progress w-full h-full bg-teal-800 left-right\" />\n                                </div>\n                            </div>\n                        </div>\n                        <div class=\"flex text-center\">\n                            <img class=\"h-16 w-16\" src=\"../../images/pictograms/devices_red.png\">\n                        </div>\n                    </div>\n                </div>\n            </template>\n            <template #actions>\n                <ff-button data-action=\"tunnel-connect-cancel\" kind=\"secondary\" class=\"ml-4\" @click=\"closeTunnel()\">Cancel</ff-button>\n            </template>\n        </ff-dialog>\n        <AssignDeviceDialog\n            v-if=\"notAssigned\"\n            ref=\"assignment-dialog\"\n            data-el=\"assignment-dialog\"\n            @assign-option-selected=\"assignOptionSelected\"\n        />\n        <DeviceAssignInstanceDialog\n            v-if=\"notAssigned\"\n            ref=\"deviceAssignInstanceDialog\"\n            data-el=\"assignment-dialog-instance\"\n            @assign-device=\"assignDeviceToInstance\"\n        />\n        <DeviceAssignApplicationDialog\n            v-if=\"notAssigned\"\n            ref=\"deviceAssignApplicationDialog\"\n            data-el=\"assignment-dialog-application\"\n            @assign-device=\"assignDeviceToApplication\"\n        />\n    </main>\n</template>\n\n<script>\n\nimport { CogIcon } from '@heroicons/vue/solid/index.js'\nimport { mapActions, mapState } from 'pinia'\nimport semver from 'semver'\n\nimport deviceApi from '../../api/devices.js'\nimport DropdownMenu from '../../components/DropdownMenu.vue'\nimport FinishSetupButton from '../../components/FinishSetup.vue'\nimport SectionNavigationHeader from '../../components/SectionNavigationHeader.vue'\nimport StatusBadge from '../../components/StatusBadge.vue'\nimport SubscriptionExpiredBanner from '../../components/banners/SubscriptionExpired.vue'\nimport TeamTrialBanner from '../../components/banners/TeamTrial.vue'\nimport { useNavigationHelper } from '../../composables/NavigationHelper.js'\nimport usePermissions from '../../composables/Permissions.js'\nimport deviceActionsMixin from '../../mixins/DeviceActions.js'\n\nimport Alerts from '../../services/alerts.js'\nimport Dialog from '../../services/dialog.js'\n\nimport { DeviceStateMutator } from '../../utils/DeviceStateMutator.js'\nimport { createPollTimer } from '../../utils/timers.js'\n\nimport DeviceAssignApplicationDialog from '../team/Devices/dialogs/DeviceAssignApplicationDialog.vue'\nimport DeviceAssignInstanceDialog from '../team/Devices/dialogs/DeviceAssignInstanceDialog.vue'\n\nimport AssignDeviceDialog from './components/AssignDeviceDialog.vue'\n\nimport DeveloperModeToggle from './components/DeveloperModeToggle.vue'\nimport DeviceEditorLink from './components/DeviceEditorLink.vue'\nimport DeviceLastSeenBadge from './components/DeviceLastSeenBadge.vue'\nimport DeviceModeBadge from './components/DeviceModeBadge.vue'\n\nimport { useAccountSettingsStore } from '@/stores/account-settings.js'\nimport { useAccountStore } from '@/stores/account.js'\nimport { useContextStore } from '@/stores/context.js'\n\nimport { useUxStore } from '@/stores/ux.js'\n\n// constants\nconst POLL_TIME = 5000\n\nconst deviceTransitionStates = [\n    'loading',\n    'installing',\n    'starting',\n    'stopping',\n    'restarting',\n    'suspending',\n    'importing'\n]\n\nexport default {\n    name: 'DevicePage',\n    components: {\n        CogIcon,\n        DeviceEditorLink,\n        FinishSetupButton,\n        DeveloperModeToggle,\n        DeviceModeBadge,\n        DeviceLastSeenBadge,\n        DropdownMenu,\n        SectionNavigationHeader,\n        StatusBadge,\n        SubscriptionExpiredBanner,\n        TeamTrialBanner,\n        AssignDeviceDialog,\n        DeviceAssignApplicationDialog,\n        DeviceAssignInstanceDialog\n    },\n    mixins: [deviceActionsMixin],\n    setup () {\n        const { hasPermission, isVisitingAdmin } = usePermissions()\n        const { navigateTo, openInANewTab } = useNavigationHelper()\n\n        return { hasPermission, isVisitingAdmin, navigateTo, openInANewTab }\n    },\n    data: function () {\n        return {\n            mounted: false,\n            device: null,\n            agentSupportsDeviceAccess: false,\n            agentSupportsActions: false,\n            openingTunnel: false,\n            closingTunnel: false,\n            /** @type {import('../../utils/timers.js').PollTimer} */\n            pollTimer: null,\n            /** @type {DeviceStateMutator} */\n            deviceStateMutator: null\n        }\n    },\n    computed: {\n        ...mapState(useContextStore, ['team']),\n        ...mapState(useAccountSettingsStore, ['features']),\n        actionsButtonKind () {\n            switch (true) {\n            case this.neverConnected:\n                return 'ff-btn--secondary'\n            case this.editorAvailable:\n                return 'ff-btn--secondary'\n            default:\n                return 'ff-btn--primary'\n            }\n        },\n        permissionContext () {\n            if (this.device?.ownerType === 'application' || this.device?.ownerType === 'instance') {\n                return { application: this.device.application }\n            }\n            return {}\n        },\n        isDevModeAvailable: function () {\n            return !!this.features.deviceEditor\n        },\n        developerMode: function () {\n            return this.device && this.agentSupportsDeviceAccess && this.device.mode === 'developer'\n        },\n        deviceRunning () {\n            return this.device?.status === 'running'\n        },\n        disableModeToggle: function () {\n            return !this.isDevModeAvailable ||\n                !this.device ||\n                !this.agentSupportsDeviceAccess ||\n                !this.hasPermission('device:editor', this.permissionContext)\n        },\n        disableModeToggleReason: function () {\n            if (!this.device) {\n                return 'No Device selected'\n            }\n            if (!this.agentSupportsDeviceAccess) {\n                return 'Device Agent V0.8 or greater is required'\n            }\n            if (!this.hasPermission('device:editor', this.permissionContext)) {\n                return 'Only an Owner or Member can change the Device Mode'\n            }\n            return undefined\n        },\n        editorAvailable: function () {\n            return this.isDevModeAvailable &&\n                this.device &&\n                this.agentSupportsDeviceAccess &&\n                this.developerMode &&\n                this.device.status === 'running'\n        },\n        deviceEditorURL: function () {\n            return this.device.editor?.url || ''\n        },\n        neverConnected () {\n            return !this.device.lastSeenAt\n        },\n        notAssigned () {\n            const device = this.device\n            const hasApplication = device?.ownerType === 'application' && device.application\n            const hasInstance = device?.ownerType === 'instance' && device.instance\n            return !hasApplication && !hasInstance\n        },\n        navigation () {\n            return [\n                {\n                    label: 'Overview',\n                    to: { name: 'device-overview' },\n                    tag: 'device-overview'\n                },\n                {\n                    label: 'Version History',\n                    to: {\n                        name: 'device-version-history',\n                        params: { id: this.$route.params.id }\n                    },\n                    tag: 'version-history'\n                },\n                {\n                    label: 'Audit Log',\n                    to: { name: 'device-audit-log' },\n                    tag: 'device-audit-log'\n                },\n                {\n                    label: 'Node-RED Logs',\n                    to: { name: 'device-logs' },\n                    tag: 'device-logs'\n                    // icon: TerminalIcon\n                },\n                {\n                    label: 'Performance',\n                    to: { name: 'device-performance' },\n                    tag: 'device-performance'\n                },\n                {\n                    label: 'Settings',\n                    to: { name: 'device-settings' },\n                    tag: 'device-settings'\n                },\n                {\n                    label: 'Developer Mode',\n                    to: { name: 'device-developer-mode' },\n                    tag: 'device-devmode',\n                    hidden: !(this.isDevModeAvailable && this.device.mode === 'developer')\n                }\n            ]\n        },\n        actionsDropdownOptions () {\n            const flowActionsDisabled = !(this.device.status !== 'suspended')\n\n            const deviceStateChanging = this.device.pendingStateChange || this.device.optimisticStateChange\n\n            const result = [\n                // Start and Suspend are disabled until resolution of the feature is complete\n                // See comments in #3292\n                // {\n                //     name: 'Start',\n                //     action: this.startDevice,\n                //     disabled: deviceStateChanging || this.deviceRunning\n                // },\n                // { name: 'Suspend', class: ['text-red-700'], action: this.showConfirmSuspendDialog, disabled: deviceStateChanging || flowActionsDisabled }\n            ]\n\n            if (!this.neverConnected) {\n                // if we've never connected, we know we can't restart\n                result.push({ name: 'Restart', action: this.restartDevice, disabled: deviceStateChanging || flowActionsDisabled })\n            }\n\n            if (this.hasPermission('device:delete', this.permissionContext)) {\n                result.push(null)\n                result.push({ name: 'Delete', class: ['text-red-700'], action: this.showConfirmDeleteDialog })\n            }\n\n            return result\n        }\n    },\n    watch: {\n        device: 'deviceChanged'\n    },\n    async mounted () {\n        this.mounted = true\n        await this.loadDevice()\n        this.setContextualDevice(this.device)\n    },\n    beforeUnmount () {\n        this.setContextualDevice(null)\n    },\n    unmounted () {\n        this.pollTimer?.stop()\n        clearTimeout(this.openTunnelTimeout)\n    },\n    methods: {\n        ...mapActions(useUxStore, ['validateUserAction']),\n        ...mapActions(useContextStore, { setContextualDevice: 'setDevice' }),\n        pollTimerElapsed: async function () {\n            // Only refresh device via the timer if we are on the overview page, developer mode page\n            // the device status is empty or the device is in a transition state\n            // This is to prevent settings pages from refreshing the device state while modifying settings\n            // See `watch: { device: { handler () ...  in pages/device/Settings/General.vue for why that happens\n            const settingsPages = ['device-overview', 'device-developer-mode']\n            try {\n                if (settingsPages.includes(this.$route.name)) {\n                    await this.loadDevice()\n                } else if (typeof this.device?.status === 'undefined') {\n                    await this.loadDevice()\n                } else if (deviceTransitionStates.includes(this.device?.status)) {\n                    await this.loadDevice()\n                }\n            } catch (err) {\n                if (err.response.status === 404) {\n                    this.pollTimer?.stop()\n                }\n            }\n        },\n        loadDevice: async function () {\n            try {\n                this.device = await deviceApi.getDevice(this.$route.params.id)\n            } catch (err) {\n                if (err.status === 403) {\n                    this.pollTimer?.stop()\n                    clearTimeout(this.openTunnelTimeout)\n                    return this.$router.push({ name: 'Home' })\n                }\n            }\n            if (!this.pollTimer) {\n                this.pollTimer = createPollTimer(this.pollTimerElapsed, POLL_TIME)\n            }\n\n            if (this.deviceStateMutator) {\n                this.deviceStateMutator.clearState()\n            }\n            this.agentSupportsDeviceAccess = this.device.agentVersion && semver.gte(this.device.agentVersion, '0.8.0')\n            this.agentSupportsActions = this.device.agentVersion && semver.gte(this.device.agentVersion, '2.3.0')\n            useAccountStore().setTeam(this.device.team.slug)\n        },\n        deviceRefresh: async function () {\n            if (this.pollTimer.running) {\n                // If the poll timer is running, we don't need to manually refresh the device\n                return\n            }\n            this.loadDevice()\n        },\n        showOpenEditorDialog: async function () {\n            this.$refs['open-editor-dialog'].show()\n        },\n        setDeviceMode: async function (newMode, callback) {\n            try {\n                if (newMode !== 'autonomous' && newMode !== 'developer') {\n                    throw new Error('Unsupported mode')\n                }\n                // call to close tunnel regardless of selected mode being set\n                const disableResult = await deviceApi.disableEditorTunnel(this.device.id)\n                // set the selected mode\n                const setModeResult = await deviceApi.setMode(this.device.id, newMode)\n                // update the device properties to reflect immediate status\n                this.device.editor = {\n                    enabled: !!disableResult?.editor?.enabled,\n                    connected: !!disableResult?.editor?.connected,\n                    url: disableResult?.editor?.url\n                }\n                this.device.mode = setModeResult?.mode\n                callback(null, setModeResult)\n            } catch (error) {\n                if (callback) {\n                    callback(error)\n                } else {\n                    throw new Error('Unknown mode')\n                }\n            }\n        },\n        openAssignmentDialog () {\n            this.$refs['assignment-dialog'].show()\n        },\n        assignOptionSelected (option) {\n            if (option === 'instance') {\n                this.$refs.deviceAssignInstanceDialog.show(this.device)\n            } else if (option === 'application') {\n                this.$refs.deviceAssignApplicationDialog.show(this.device)\n            }\n        },\n        async assignDeviceToInstance (device, instanceId) {\n            this.device = await deviceApi.updateDevice(device.id, { instance: instanceId })\n\n            Alerts.emit('Device successfully assigned to instance.', 'confirmation')\n        },\n\n        async assignDeviceToApplication (device, applicationId) {\n            this.device = await deviceApi.updateDevice(device.id, { application: applicationId, instance: null })\n\n            Alerts.emit('Device successfully assigned to application.', 'confirmation')\n        },\n        openEditor ({ event = null, immersive = false } = {}) {\n            this.validateUserAction('hasOpenedDeviceEditor')\n            if (!immersive) {\n                this.openInANewTab(this.deviceEditorURL, `device-editor-${this.device.id}`)\n            } else {\n                this.navigateTo({ name: 'device-editor' }, event, { target: `device-editor-${this.device.id}` })\n            }\n        },\n        async openTunnel ({\n            event,\n            immersive = true,\n            launchEditor = false\n        } = {}) {\n            try {\n                if (this.deviceRunning) {\n                    if (this.device.editor?.enabled && this.device.editor?.connected && this.device.editor?.local) {\n                        this.openEditor({ event, immersive })\n                    } else {\n                        this.openingTunnel = true\n                        this.$refs.dialog.show()\n\n                        // Polls the tunnel status until we see it connected to the\n                        // 'local' platform instance - will give up after 10 attempts\n                        const pollTunnelStatus = (done, attempt = 0, timeout = 500) => {\n                            if (attempt < 10) {\n                                this.openTunnelTimeout = setTimeout(async () => {\n                                    await this.loadDevice()\n                                    if (this.device.editor?.enabled && this.device.editor?.connected) {\n                                        if (this.device.editor?.local) {\n                                            if (launchEditor) {\n                                                this.openEditor({ event, immersive })\n                                            }\n                                        } else {\n                                            pollTunnelStatus(done, attempt + 1, 200)\n                                            return\n                                        }\n                                    }\n                                    done()\n                                }, timeout)\n                            }\n                        }\n\n                        try {\n                            if (!this.device.editor?.enabled || !this.device.editor?.connected) {\n                                // * Enable Device Editor (Step 1) - (browser->frontendApi) User clicks button to \"Enable Editor\"\n                                const result = await deviceApi.enableEditorTunnel(this.device.id)\n                                this.updateTunnelStatus(result)\n                            }\n                            pollTunnelStatus(() => {\n                                this.$refs.dialog.close()\n                                this.openingTunnel = false\n                            })\n                        } catch (err) {\n                            this.$refs.dialog?.close()\n                            this.openingTunnel = false\n\n                            const enhancedError = new Error(`Failed to enable device editor tunnel: ${err.message}`)\n                            enhancedError.originalError = err\n                            enhancedError.deviceId = this.device?.id\n                            enhancedError.deviceStatus = this.device?.status\n                            enhancedError.context = 'openTunnel'\n\n                            throw enhancedError\n                        }\n                    }\n                } else {\n                    Alerts.emit('Unable to establish a connection to the device. Please check it is connected and running then try again', 'warning', 7500)\n                }\n            } catch (err) {\n                console.warn('Error in openTunnel', err)\n                if (Object.hasOwnProperty.call(err, 'context') && err.context === 'openTunnel') {\n                    throw err\n                }\n            }\n        },\n        async closeTunnel () {\n            this.closingTunnel = true\n            this.$refs.dialog.close()\n            clearTimeout(this.openTunnelTimeout)\n            try {\n                const result = await deviceApi.disableEditorTunnel(this.device.id)\n                this.updateTunnelStatus(result)\n                this.loadDevice(this.loadDevice())\n            } finally {\n                this.closingTunnel = false\n            }\n        },\n        updateTunnelStatus (status) {\n            this.device.editor = this.device.editor || {}\n            this.device.editor.url = status.url\n            this.device.editor.enabled = !!status.enabled\n            this.device.editor.connected = !!status.connected\n        },\n        deviceChanged () {\n            this.deviceStateMutator = new DeviceStateMutator(this.device)\n        },\n        showConfirmDeleteDialog () {\n            Dialog.show({\n                header: 'Delete Device',\n                kind: 'danger',\n                text: 'Are you sure you want to delete this device? Once deleted, there is no going back.',\n                confirmLabel: 'Delete'\n            }, async () => {\n                try {\n                    await deviceApi.deleteDevice(this.device.id)\n                    Alerts.emit('Successfully deleted the device', 'confirmation')\n                    // Trigger a refresh of team info to resync following device changes\n                    await useContextStore().refreshTeam()\n                    this.$router.push({ name: 'TeamDevices', params: { team_slug: this.team.slug } })\n                } catch (err) {\n                    Alerts.emit('Failed to delete device: ' + err.toString(), 'warning', 7500)\n                }\n            })\n        },\n        /**\n         * Checks agent version and shows warning if known old version is present. Returns true if the action can proceed\n         * @param {string} [message] - optional message to show in confirmation dialog. If omitted, no confirmation is shown\n         */\n        preActionChecks (message) {\n            if (this.device.agentVersion && !this.agentSupportsActions) {\n                // if agent version is present but is less than required version, show warning and halt\n                Alerts.emit('Device Agent V2.3 or greater is required to perform this action.', 'warning')\n                return false\n            }\n            if (!message) {\n                // no message means silent operation, no need to show confirmation\n                return true\n            }\n            if (!this.device.agentVersion) {\n                // if agent version is missing, be optimistic and give it a go, but show warning\n                Alerts.emit(`${message}.  NOTE: The device agent version is not known, the action may timeout`, 'warning')\n            } else {\n                Alerts.emit(message, 'confirmation')\n            }\n            return true\n        },\n        async startDevice () {\n            const preCheckOk = this.preActionChecks('Starting device...')\n            if (!preCheckOk) {\n                return\n            }\n            this.deviceStateMutator.setStateOptimistically('starting')\n            try {\n                await deviceApi.startDevice(this.device)\n                this.deviceStateMutator.setStateAsPendingFromServer()\n            } catch (err) {\n                let message = 'Device start request failed.'\n                if (err.response?.data?.error) {\n                    message = err.response.data.error\n                }\n                console.warn(message, err)\n                Alerts.emit(message, 'warning')\n                this.deviceStateMutator.restoreState()\n            }\n        },\n        async restartDevice () {\n            const preCheckOk = this.preActionChecks('Restarting device...')\n            if (!preCheckOk) {\n                return\n            }\n            this.deviceStateMutator.setStateOptimistically('restarting')\n            try {\n                await deviceApi.restartDevice(this.device)\n                this.deviceStateMutator.setStateAsPendingFromServer()\n            } catch (err) {\n                let message = 'Device restart request failed.'\n                if (err.response?.data?.error) {\n                    message = err.response.data.error\n                }\n                console.warn(message, err)\n                Alerts.emit(message, 'warning')\n            }\n        },\n        showConfirmSuspendDialog () {\n            const preCheckOk = this.preActionChecks() // silent check\n            if (!preCheckOk) {\n                return\n            }\n            Dialog.show({\n                header: 'Suspend Device',\n                text: 'Are you sure you want to suspend this device?',\n                confirmLabel: 'Suspend',\n                kind: 'danger'\n            }, () => {\n                this.deviceStateMutator.setStateOptimistically('suspending')\n                deviceApi.suspendDevice(this.device).then(() => {\n                    this.deviceStateMutator.setStateAsPendingFromServer()\n                    Alerts.emit('Device suspend request succeeded.', 'confirmation')\n                }).catch(err => {\n                    let message = 'Device suspend request failed.'\n                    if (err.response?.data?.error) {\n                        message = err.response.data.error\n                    }\n                    console.warn(message, err)\n                    Alerts.emit(message, 'warning')\n                })\n            })\n        }\n    }\n}\n</script>\n\n<style scoped>\n.progress {\n    animation: progress 1s infinite linear;\n}\n\n.left-right {\n    transform-origin: 0% 50%;\n}\n    @keyframes progress {\n    0% {\n        transform:  translateX(0) scaleX(0);\n    }\n    40% {\n        transform:  translateX(0) scaleX(0.4);\n    }\n    100% {\n        transform:  translateX(100%) scaleX(0.5);\n    }\n}\n</style>\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.drawer-trigger {\n    display: flex;\n    align-items: center;\n    gap: 1px;\n    position: fixed;\n    top: 70px;\n\n    .ff-layout--immersive--fullscreen & {\n        top: 10px;\n    }\n\n    &.nr5-plus {\n        top: 63px;\n        padding: 8px;\n\n        .ff-btn--icon {\n            display: none;\n        }\n\n        .ff-layout--immersive--fullscreen & {\n            top: 4px;\n        }\n    }\n\n    left: 0;\n    z-index: 100;\n    padding: 8px 2px 8px 8px;\n\n    /* Colors - matching original drawer trigger */\n    color: $ff-grey-400;\n    background: $ff-white;\n    border: 1px solid $ff-grey-400;\n    border-left: none;\n\n    /* Reset button styles */\n    font: inherit;\n\n    /* Visual effects */\n    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.10);\n    border-radius: 0 10px 10px 0;\n\n    /* Animation */\n    transform: translateX(0);\n    transition: transform ease-in-out 0.3s;\n\n    img {\n        height: 20px;\n    }\n\n    .ff-btn--icon {\n        color: $ff-grey-400;\n        width: 20px;\n        height: 20px;\n    }\n\n    &.hidden {\n        // Move completely off-screen: own width (100%) + extra margin (20px)\n        transform: translateX(calc(-100% - 20px));\n    }\n\n    &:hover {\n        cursor: pointer;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.resize-bar {\n    position: absolute;\n    right: 0;\n    top: 0;\n    width: 6px;\n    height: 100%;\n    border-right: 1px solid $ff-grey-400;\n    background: transparent;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 15;\n\n    &::before {\n        content: '...';\n        position: relative;\n        left: 3px;\n        writing-mode: vertical-rl;\n        line-height: 0.5;\n        letter-spacing: 4px;\n        color: $ff-grey-500;\n    }\n\n    &:hover {\n        cursor: ew-resize;\n\n        &::before {\n            color: $ff-grey-700;\n        }\n    }\n\n    &.horizontal {\n        width: 100%;\n        height: 6px;\n\n        &::before {\n            writing-mode: horizontal-tb;\n        }\n\n        &:hover {\n            cursor: ns-resize;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff--immersive-editor-wrapper .tabs-wrapper.drawer {\n    &.pinned {\n        position: relative;\n        left: auto;\n        top: auto;\n        height: 100%;\n        transform: none;\n        box-shadow: none;\n\n        &.open {\n            border-right: 1px solid $ff-grey-200;\n\n            &.side-right {\n                border-right: none;\n                border-left: 1px solid $ff-grey-200;\n            }\n        }\n    }\n\n    &:not(.pinned).side-right {\n        left: auto;\n        right: 0;\n        transform: translateX(100%);\n\n        &.open {\n            transform: translateX(0);\n            box-shadow: -5px 0 8px rgba(0, 0, 0, 0.10);\n        }\n    }\n\n    .ff-layout--immersive--fullscreen &:not(.pinned) {\n        top: 0;\n        height: 100%;\n    }\n\n    &.side-right .resize-bar {\n        left: 0;\n        right: auto;\n        border-right: none;\n        border-left: 1px solid $ff-grey-400;\n\n        &::before {\n            left: -3px;\n        }\n    }\n\n    .header,\n    .header--stacked {\n        min-height: 46px;\n    }\n\n    .drawer-header-btn {\n        align-self: stretch;\n        background: none;\n        border: none;\n        padding: 0 15px;\n        color: $ff-grey-500;\n        font: inherit;\n        display: flex;\n        align-items: center;\n        cursor: pointer;\n        transition: all 0.2s ease;\n\n        .ff-btn--icon {\n            width: 18px;\n            height: 18px;\n        }\n\n        &:hover {\n            background: $ff-grey-100;\n            color: $ff-grey-700;\n        }\n\n        &:active {\n            background: $ff-grey-200;\n        }\n    }\n\n    .editor-drawer-stack-title {\n        flex: 1;\n        font-weight: 600;\n        font-size: 14px;\n        color: $ff-grey-800;\n        padding: 0 10px;\n        display: flex;\n        align-items: center;\n        min-width: 0;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.status-wrapper {\n  display: flex;\n  justify-content: center;\n}\n.status-wrapper .status-text {\n    font-size: 1.5rem;\n    font-weight: bold;\n    display: block;\n    text-align: center;\n    padding: 24px;\n    text-transform: capitalize;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff--immersive-editor-wrapper {\n    &.remote-instance {\n        .device-actions-dropdown {\n            padding: 6px 9px;\n\n            svg {\n                margin: 0;\n            }\n        }\n    }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n@use \"../../ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-blueprint-groups {\n    h4 {\n        border-bottom: 1px solid $ff-grey-200;\n    }\n}\n\n.ff-blueprint-tile {\n    border: 2px solid $ff-grey-300;\n    border-radius: $ff-unit-sm;\n    display: flex;\n    flex-direction: column;\n    --tile-background: #{$ff-blue-100};\n    --tile-foreground: #{$ff-blue-300};\n}\n\n.ff-blueprint-tile-sm {\n    display: inline-flex;\n    flex-direction: row;\n    border: 1px solid $ff-grey-300;\n    border-radius: $ff-unit-sm;\n    --tile-background: #{$ff-blue-100};\n    --tile-foreground: #{$ff-blue-300};\n}\n\n.ff-blueprint-tile--header {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: var(--tile-background);\n    border-top-left-radius: 6px;\n    border-top-right-radius: 6px;\n    svg {\n        stroke: var(--tile-foreground);\n        path {\n            stroke-width: 1px;\n        }\n    }\n}\n\n.ff-blueprint-tile .ff-blueprint-tile--header {\n    overflow-y: hidden;\n    svg {\n        transform: scale(4);\n    }\n}\n\n.ff-blueprint-tile-sm .ff-blueprint-tile--header {\n    width: 32px;\n    border-radius: 0px;\n    border-top-left-radius: 6px;\n    border-bottom-left-radius: 6px;\n    svg {\n        transform: scale(1.5);\n    }\n}\n\n.ff-blueprint-tile--info {\n    padding: $ff-unit-md $ff-unit-xl $ff-unit-md $ff-unit-md;\n    label {\n        font-weight: 500;\n    }\n}\n\n.ff-blueprint-tile .ff-blueprint-tile--info {\n    padding: $ff-unit-md $ff-unit-sm;\n    display: flex;\n    flex-direction: column;\n    gap: $ff-unit-sm;\n    flex-grow: 1;\n    label {\n        font-size: 1.2rem;\n        font-weight: 600;\n    }\n}\n\n.ff-blueprint-tile--actions {\n    width: 100%;\n    display: flex;\n    gap: 5px;\n    padding: 0 $ff-unit-sm $ff-unit-md;\n    align-items: center;\n}\n\n.ff-blueprint-group--general {\n    --tile-background: #{$ff-blue-100};\n    --tile-foreground: #{$ff-blue-300};\n}\n\n.ff-blueprint-group--manufacturing {\n    --tile-background: #{$ff-teal-100};\n    --tile-foreground: #{$ff-teal-400};\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n@use '../../../stylesheets/components/blueprint-selection.scss' as *;\n.blueprint-group {\n  display: flex;\n  flex-wrap: wrap;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.blueprints-selector-dialog {\n    margin: 0 !important;\n    display: block;\n\n    .ff-dialog-box {\n      max-width: 90vw;\n      max-height: 80vh;\n      overflow: auto;\n\n      .ff-dialog-content {\n        display: flex;\n        flex-direction: row;\n        padding: 0;\n        overflow: auto;\n\n        .blueprints-container {\n          padding: 10px 10px 0;\n          overflow: auto;\n\n          .header {\n            padding: 0 0 10px;\n\n            h3 {\n              font-size: 30px;\n            }\n\n            p {\n              line-height: 20px;\n              padding-top: 10px;\n              color : $ff-grey-500;\n            }\n          }\n\n          .blueprint-selection-wrapper {\n            overflow: auto;\n            padding: 10px 0;\n          }\n\n          .ff-blueprint-groups {\n            h4 {\n              font-size: 25px;\n              line-height: 1.5;\n              margin-top: 10px;\n            }\n\n            .blueprint-group {\n              display: flex;\n              flex-direction: row;\n              flex-wrap: wrap;\n\n              .ff-blueprint-tile {\n                width: auto;\n                max-width: 250px;\n                flex: 1 1 200px;\n              }\n            }\n          }\n        }\n\n        .flow-viewer-container {\n          overflow: hidden;\n\n          .viewer {\n            height: 100%;\n            width: 100%;\n          }\n        }\n\n      }\n\n      .ff-dialog-actions {\n        border-top: 1px solid $ff-grey-400;\n      }\n    }\n}\n\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.instance-name-confirmation {\n  margin: 5px 0;\n  display: flex;\n  gap: 5px;\n  color: $ff-green-600;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-date-picker {\n    &.disabled {\n        input {\n            cursor: not-allowed !important;\n        }\n    }\n\n    .dp__action_button {\n        &.dp__action_select {\n            background: $ff-indigo-700;\n\n            &[disabled] {\n                background: $ff-grey-300;\n            }\n        }\n    }\n}\n\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.maintenance {\n    .scheduled-upgrade {\n        .days-selector {\n            .day-selector {\n                border: 1px solid $ff-indigo-200;\n                background: $ff-indigo-50;\n                padding: 5px 15px;\n                border-radius: 4px;\n                cursor: pointer;\n                transition: ease-in-out .3s;\n                flex: 1;\n                position: relative;\n                text-align: center;\n\n                &:hover {\n                    background: $ff-indigo-200;\n                }\n\n                &.selected {\n                    background: $ff-indigo-400;\n                    color: white;\n\n                    span {\n                        font-weight: 600;\n                    }\n                }\n\n                &.disabled {\n                    opacity: 0.5;\n                    cursor: not-allowed;\n                }\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.page-fade-enter-active, .page-fade-leave-active {\n    transition: opacity .2s ease-in-out;\n}\n\n.page-fade-enter, .page-fade-leave-to {\n    opacity: 0;\n}\n\n// Viewport-based responsive behavior (matches Tailwind sm: breakpoint)\n// Hide button text on narrow viewports (< 640px)\n@media (max-width: 639px) {\n  .upload-snapshot-text,\n  .create-snapshot-text {\n    display: none;\n  }\n}\n\n// Show button text on wider viewports (>= 640px)\n@media (min-width: 640px) {\n  .upload-snapshot-text,\n  .create-snapshot-text {\n    display: inline;\n  }\n}\n\n// Container query for drawer context - responsive button behavior\n// Breakpoint matches DRAWER_MOBILE_BREAKPOINT constant in Editor/index.vue\n// These override viewport-based rules when inside the drawer\n@container drawer (max-width: 639px) {\n  // Hide text when drawer is narrow - icon-only mode\n  .upload-snapshot-text,\n  .create-snapshot-text {\n    display: none;\n  }\n}\n\n@container drawer (min-width: 640px) {\n  // Show text when drawer is wide enough\n  .upload-snapshot-text,\n  .create-snapshot-text {\n    display: inline;\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#visual-timeline {\n    .timeline {\n        border: 1px solid $ff-grey-300;\n        border-radius: 3px;\n        overflow: auto;\n\n        li {\n\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.flex-break {\n    flex-basis: 100%;\n    height: 0;\n}\n.ff-file-upload {\n    width: 100%;\n    display: flex;\n    gap: $ff-unit-sm;\n    .ff-btn {\n        flex-shrink: 0;\n    }\n}\n.ff-file-upload--empty,\n.ff-file-upload--file {\n    flex-grow: 1;\n    border: 1px solid $ff-grey-300;\n    padding: $ff-unit-sm $ff-unit-md;\n    border-radius: $ff-unit-sm;\n    display: flex;\n    align-items: center;\n    gap: $ff-unit-sm;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow-x: hidden;\n}\n.ff-file-upload--empty {\n    color: $ff-grey-400;\n}\n.ff-file-upload--clear {\n    cursor: pointer;\n    &:hover {\n        color: $ff-blue-600;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-row-file {\n    position: relative;\n    &:hover {\n        color: $ff-blue-600;\n    }\n}\n\n.not-available {\n  opacity: .4;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-dropdown.visibility-selector {\n  min-width: 130px;\n\n  .ff-button {\n    padding-left: 0;\n    padding-right: 0;\n    border: none;\n    background: none !important;\n  }\n\n  .ff-options {\n    border: 1px solid $ff-grey-200 !important;\n\n    .ff-option {\n      background: white !important;\n      border: none !important;\n\n      &[disabled=\"true\"] {\n        color: $ff-grey-600;\n        cursor: not-allowed;\n      }\n\n      &:hover {\n        background-color: $ff-grey-200 !important;\n      }\n    }\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.banner-wrapper > div {\n  margin-top: 0;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-dialog-content .ff-devices-ul {\n    list-style-type: disc;\n    list-style-position: inside;\n    columns: 2;\n}\n.ff-dialog-content .ff-devices-ul li {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n// Viewport-based responsive behavior (matches Tailwind sm: breakpoint)\n// Hide button text on narrow viewports (< 640px)\n@media (max-width: 639px) {\n  .target-snapshot-text,\n  .add-remote-instance-text,\n  .bulk-actions-text {\n    display: none;\n  }\n}\n\n// Show button text on wider viewports (>= 640px)\n@media (min-width: 640px) {\n  .target-snapshot-text,\n  .add-remote-instance-text,\n  .bulk-actions-text {\n    display: inline;\n  }\n}\n\n// Container query for drawer context - responsive button behavior\n// Breakpoint matches DRAWER_MOBILE_BREAKPOINT constant in Editor/index.vue\n// These override viewport-based rules when inside the drawer\n@container drawer (max-width: 639px) {\n  // Hide text when drawer is narrow - icon-only mode\n  .target-snapshot-text,\n  .add-remote-instance-text,\n  .bulk-actions-text {\n    display: none;\n  }\n\n  // Adjust button padding for icon-only mode to prevent excessive spacing\n  .ff-btn[data-action=\"change-target-snapshot\"],\n  .ff-btn[data-action=\"register-device\"] {\n    padding-left: 0.5rem;\n    padding-right: 0.5rem;\n  }\n}\n\n@container drawer (min-width: 640px) {\n  // Show text when drawer is wide enough\n  .target-snapshot-text,\n  .add-remote-instance-text,\n  .bulk-actions-text {\n    display: inline;\n  }\n}\n\n// Status bars layout - responsive to both viewport and container\n.devices-status-bars-container {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n\n// On wider viewports (>= 640px), show side-by-side\n@media (min-width: 640px) {\n  .devices-status-bars-container {\n    flex-direction: row;\n\n    > * {\n      flex: 1;\n    }\n  }\n}\n\n// Container query for drawer context\n// Breakpoint matches DRAWER_MOBILE_BREAKPOINT constant in Editor/index.vue\n@container drawer (max-width: 639px) {\n  .devices-status-bars-container {\n    flex-direction: column;\n\n    > * {\n      flex: none;\n    }\n  }\n}\n\n@container drawer (min-width: 640px) {\n  .devices-status-bars-container {\n    flex-direction: row;\n\n    > * {\n      flex: 1;\n    }\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.step-slider {\n    width: 100%;\n\n    .wrapper {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: space-between;\n        position: relative;\n        max-width: 600px;\n        margin: auto;\n        min-height: 50px;\n\n        .progress {\n            position: absolute;\n            left: 0;\n            top: 15px;\n            height: 4px;\n            background: $ff-grey-300;\n            transform: translateY(-50%);\n            z-index: 1;\n            display: flex;\n            justify-content: space-between;\n            overflow: hidden;\n\n            &.multi-step {\n                width: 99%;\n            }\n            &.single-step {\n                width: 0;\n            }\n\n            .st {\n                position: relative;\n\n                span {\n                    width: 1000px;\n                    height: 4px;\n                    background: $ff-indigo-600;\n                    z-index: 3;\n                    display: block;\n                    right: 0;\n                    position: absolute;\n                    transform: translateX(-1000%);\n                    transition: transform .3s ease-in-out;\n                }\n\n                &.completed {\n                    span {\n                        transform: translateX(0);\n                    }\n                }\n            }\n        }\n\n        .steps {\n            width: 100%;\n            position: absolute;\n            left: 0;\n            top: 5px;\n            display: flex;\n\n            .step {\n                position: relative;\n                width: 20px;\n                height: 20px;\n                background-color: $ff-grey-400;\n                border-radius: 50%;\n                z-index: 2;\n                transition: ease-in-out .3s;\n\n                &.completed {\n                    background-color: $ff-indigo-600;\n                }\n\n                &.active {\n                    transform: scale(1.1);\n                    background-color: $ff-indigo-600;\n\n                    .label {\n                        color: $ff-indigo-700;\n                    }\n                }\n\n                &.disabled {\n                    cursor: default;\n                }\n\n                .label {\n                    position: absolute;\n                    left: 50%;\n                    transform: translate(-50%, 150%);\n                    font-weight: bold;\n                    color: $ff-grey-300;\n                    transition: ease-in-out .3s;\n                }\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-multi-step-form {\n    position: relative;\n    max-height: 100%;\n    height: 100%;\n    overflow: auto;\n    display: flex;\n    flex-direction: column;\n\n    .loading-overlay {\n        position: absolute;\n        top: 0;\n        left:0;\n        width: 100%;\n        height: 100%;\n        background: rgba(255,255,255, .6);\n        z-index: 100;\n    }\n\n    .content {\n        flex: 1;\n        max-height: 100%;\n        display: flex;\n        flex-direction: column;\n        overflow: auto;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-select-application-step {\n    .app-tile {\n        padding: 12px;\n        border: 2px solid $ff-grey-300;\n        width: 100%;\n        border-radius: 6px;\n        cursor: pointer;\n        transition: ease-in-out .3s;\n\n        &:hover {\n            border-color: $ff-indigo-400;\n        }\n\n        &.selected {\n            border-color: $ff-indigo-600;\n        }\n\n        .header {\n            .title {\n\n            }\n\n            .counters {\n                color: $ff-grey-400;\n                font-size: $ff-funit-xs;\n            }\n        }\n\n        .description {\n            color: $ff-grey-400;\n            font-size: $ff-funit-sm;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-duplication-step {\n    .form-group {\n        .title {\n            margin-bottom: 5px;\n            padding-bottom: 5px;\n            border-bottom: 1px solid $ff-grey-200;\n            display: flex;\n            justify-content: space-between;\n\n            label {\n\n                font-weight: 500;\n            }\n\n            .actions {\n                display: flex;\n                gap: 5px;\n            }\n        }\n\n        p {\n            margin-top: 5px;\n\n            &:nth-of-type(2) {\n                color: $ff-grey-500;\n                font-style: italic;\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-instance-step {\n    form {\n        .ff-instance-name {\n            .ff-input-wrapper {\n                button {\n                    padding: 5px 10px;\n                }\n            }\n        }\n    }\n}\n","<template>\n    <div id=\"instance-logs\" class=\"flex-1 flex flex-col overflow-auto\">\n        <ff-loading v-if=\"loading\" message=\"Loading Logs...\" />\n        <div v-if=\"showOfflineBanner\" class=\"ff-banner ff-banner-info my-2 rounded p-2 font-mono\">\n            <span>\n                <span>The Node-RED instance cannot be reached at this time. Please wait...</span>\n            </span>\n        </div>\n        <div v-if=\"!instance.meta || instance.meta.state === 'suspended'\" class=\"flex text-gray-500 justify-center italic mb-4 p-8\">\n            Logs unavailable\n        </div>\n        <div v-else :class=\"showOfflineBanner ? 'forge-log-offline-background' : ''\" class=\"w-full mx-auto text-xs border bg-gray-800 text-gray-200 rounded p-2 font-mono\">\n            <div v-if=\"prevCursor\" class=\"flex\">\n                <a class=\"text-center w-full hover:text-blue-400 cursor-pointer pb-1\" @click=\"loadPrevious\">Load earlier...</a>\n            </div>\n            <div v-if=\"filteredLogEntries.length > 0\">\n                <span\n                    v-for=\"(item, itemIdx) in filteredLogEntries\"\n                    :key=\"itemIdx\"\n                    class=\"whitespace-pre-wrap\"\n                    :class=\"'forge-log-entry-level-' + item.level\"\n                    data-el=\"instance-log-row\"\n                >\n                    <template v-if=\"instance.ha?.replicas !== undefined\">\n                        [{{ item.src }}]\n                    </template>\n                    <span>{{ item.date }}</span>\n                    <span>{{ \"  \" }}</span>\n                    <span>{{ `[${item.level || ''}]`.padEnd(10, ' ') }}</span>\n                    <span class=\"flex-grow break-all whitespace-pre-wrap inline-flex\">{{ item.msg }}</span>\n                    <br v-if=\"itemIdx !== filteredLogEntries.length - 1\">\n                </span>\n            </div>\n        </div>\n    </div>\n</template>\n\n<script>\n\nimport InstanceApi from '../../../api/instances.js'\nimport Alerts from '../../../services/alerts.js'\nimport { createPollTimer } from '../../../utils/timers.js'\n\nconst POLL_TIME = 5000\n\nexport default {\n    name: 'LogsShared',\n    inheritAttrs: false,\n    props: {\n        instance: {\n            type: Object,\n            required: true\n        },\n        filter: {\n            default: null,\n            type: String,\n            required: false\n        }\n    },\n    emits: ['ha-instance-detected', 'new-range'],\n    data () {\n        return {\n            doneInitialLoad: false,\n            loading: true,\n            logEntries: [],\n            prevCursor: null,\n            nextCursor: null,\n            checkInterval: null,\n            showOfflineBanner: false,\n            /** @type {import('../../../utils/timers.js').PollTimer} */\n            pollTimer: null\n        }\n    },\n    computed: {\n        filteredLogEntries: function () {\n            if (this.filter && this.filter !== 'all') {\n                return this.logEntries.filter(l => l.src === this.filter)\n            } else {\n                return this.logEntries\n            }\n        }\n    },\n    watch: {\n        instance: 'fetchData'\n    },\n    async mounted () {\n        if (!this.instance.meta || this.instance.meta.state === 'suspended') {\n            this.loading = false\n        }\n        await this.fetchData()\n        // since the fetchdata is async, we need to check if the current page is\n        // still the log page before starting the poll timer\n        if (this.shouldPoll()) {\n            this.pollTimer = createPollTimer(this.pollTimerElapsed, POLL_TIME)\n        }\n    },\n    unmounted () {\n        this.stopPolling()\n    },\n    beforeUnmount () {\n        this.stopPolling()\n    },\n    methods: {\n        clear: function () {\n            this.logEntries = []\n        },\n        shouldPoll: function () {\n            return Object.hasOwnProperty.call(this.$route, 'meta') &&\n                Object.hasOwnProperty.call(this.$route.meta, 'shouldPoll') &&\n                this.$route.meta.shouldPoll\n        },\n        pollTimerElapsed: function () {\n            if (this.instance.meta && this.instance.meta.state !== 'suspended') {\n                this.loadNext()\n            }\n        },\n        stopPolling: function () {\n            if (this.pollTimer) {\n                this.pollTimer.stop()\n                this.pollTimer = null\n            }\n        },\n        fetchData: async function () {\n            if (this.instance.id) {\n                if (this.instance.meta && this.instance.meta.state !== 'suspended') {\n                    await this.loadItems(this.instance.id)\n                    this.loading = false\n                } else {\n                    this.logEntries = []\n                    this.prevCursor = null\n                }\n            }\n        },\n        loadPrevious: async function () {\n            this.loadItems(this.instance.id, this.prevCursor)\n        },\n        loadNext: async function () {\n            this.loadItems(this.instance.id, this.nextCursor)\n        },\n        loadItems: async function (instanceId, cursor) {\n            // don't poll if the page is not the log page\n            if (!this.shouldPoll()) {\n                this.stopPolling()\n                return\n            }\n\n            try {\n                const entries = await InstanceApi.getInstanceLogs(instanceId, cursor, null, { showAlert: false })\n                this.showOfflineBanner = false\n                if (!cursor) {\n                    this.prevCursor = null\n                    this.logEntries = []\n                }\n                const toPrepend = []\n                if (entries.log.length > 0) {\n                    entries.log.forEach(l => {\n                        const d = new Date(parseInt(l.ts.substring(0, l.ts.length - 4)))\n                        l.date = `${d.toLocaleDateString()} ${d.toLocaleTimeString()}`\n                        if (typeof l.msg === 'undefined') {\n                            l.msg = 'undefined'\n                        } else if (typeof l.msg !== 'string') {\n                            l.msg = JSON.stringify(l.msg)\n                        }\n                        l.msg = l.msg.replace(/^[\\n]*/, '')\n                        if (!cursor || cursor[0] !== '-') {\n                            this.logEntries.push(l)\n                        } else {\n                            toPrepend.push(l)\n                        }\n                        if (l.src) {\n                            this.$emit('ha-instance-detected', l.src)\n                        }\n                    })\n                    if (toPrepend.length > 0) {\n                        this.logEntries = toPrepend.concat(this.logEntries)\n                    }\n                    if (!cursor || cursor[0] === '-') {\n                        this.prevCursor = entries.meta.previous_cursor\n                    }\n                    if (!cursor || cursor[0] !== '-') {\n                        this.nextCursor = entries.meta.next_cursor\n                    }\n                    if (entries.meta.first_entry && entries.meta.last_entry) {\n                        this.$emit('new-range', {\n                            first: entries.meta.first_entry,\n                            last: entries.meta.last_entry\n                        })\n                    }\n                }\n            } catch (error) {\n                // the page could have been switched while the async request was in progress, if so\n                // stop the polling and return immediately to avoid unnecessary error alerts\n                if (!this.shouldPoll()) {\n                    this.stopPolling()\n                    return\n                }\n                // log the error as warn for troubleshooting purposes\n                console.warn('Unable to retrieve Node-RED instance logs:', error)\n\n                // Error 503 is returned by the API when the launcher is offline.\n                // Error 500 is handled (and surfaced) by the `client.interceptors` in `../../../api/client.js`\n                // Error with data.code === 'project_suspended' is ignored - it is expected when the project is suspended\n                if (error.response?.status === 503) {\n                    if (this.showOfflineBanner === true) {\n                        return // only show the alert once\n                    }\n                    this.showOfflineBanner = true // show the \"offline\" banner\n                    Alerts.emit('The Node-RED instance cannot be reached at this time', 'warning', (POLL_TIME - 500))\n                } else if (error.response?.status !== 500 && error.response?.data?.code !== 'project_suspended') {\n                    // display an alert. Ensure it is visible for less time than\n                    // the polling interval to avoid multiple visible alerts\n                    const message = error.response?.data?.error || error.message\n                    Alerts.emit('Could not get Node-RED logs: ' + message, 'warning', (POLL_TIME - 500))\n                }\n            }\n        }\n    }\n}\n</script>\n\n<style scoped>\n.forge-log-offline-background {\n  background: repeating-linear-gradient(\n      -45deg,\n      #363848,\n      #363848 10px,\n      rgba(31, 41, 55, var(--tw-bg-opacity)) 10px,\n      rgba(31, 41, 55, var(--tw-bg-opacity)) 20px\n  );\n}\n</style>\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n@use \"../../ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-project-overview {\n    .ff-accordion--content {\n        transition: none;\n    }\n}\n\n.ff-instance-info {\n    margin-bottom: 12px;\n    h1 {\n        > div {\n            display: flex;\n            gap: 6px;\n        }\n        border-bottom: 0;\n        svg {\n            width: 20px;\n        }\n    }\n    table {\n        padding: 9px 12px;\n        background-color: white;\n        border-radius: 0.25rem;\n        border-collapse: separate;\n        border-width: 1px;\n        border-color: $ff-grey-300;\n        td {\n            height: 36px;\n        }\n        tr:not(:last-child) {\n            td {\n                border-bottom: 1px solid $ff-grey-100;\n            }\n        }\n    }\n    .ff-accordion {\n        margin-bottom: -1px;\n    }\n    .ff-accordion--content {\n        background-color: white;\n    }\n    &:last-child {\n        margin-bottom: 0;\n    }\n}","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n@use \"../../stylesheets/pages/project.scss\" as *;\n\n// Container query for drawer context\n// Breakpoint matches DRAWER_MOBILE_BREAKPOINT constant in Editor/index.vue\n@container drawer (min-width: 640px) {\n  .ff-project-overview .grid {\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n  }\n}\n\n// Ensure single column layout when container is smaller\n@container drawer (max-width: 639px) {\n  .ff-project-overview .grid {\n    grid-template-columns: repeat(1, minmax(0, 1fr));\n  }\n}\n\n// Info row: content left, action button(s) pushed right\n.info-row {\n  display: flex;\n  align-items: center;\n\n  &__content {\n    flex: 1;\n    min-width: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  &__action {\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 4px;\n    border: none;\n    background: transparent;\n    border-radius: 4px;\n    cursor: pointer;\n    color: $ff-color--action;\n    transition: color 0.15s ease, background-color 0.15s ease;\n\n    .ff-icon {\n      width: 20px;\n      height: 20px;\n\n      &.ff-icon-sm {\n        width: 16px;\n        height: 16px;\n      }\n    }\n\n    &:hover {\n      background-color: $ff-color--highlight;\n      color: $ff-white;\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      color: $ff-grey-300;\n\n      &:hover {\n        background-color: transparent;\n        color: $ff-grey-300;\n      }\n    }\n  }\n\n  .url-copier {\n    min-width: 0;\n\n    .text {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n  }\n}\n\n// Type field - ellipse from LEFT to show stack name\n.ff-instance-info table tr td.flex .flex-grow {\n  direction: rtl;\n  text-align: left;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-socket-status {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n}\n\n.ff-socket-status-icon {\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n    background-color: $ff-grey-500;\n}\n\n.ff-socket-status-icon-connected {\n    background-color: $ff-green-500;\n}\n\n.ff-socket-status-icon-disconnected {\n    background-color: $ff-red-500;\n}\n\n.ff-chart-section {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.action-button {\n  cursor: default;\n}\n\n// Container query for drawer context - responsive button behavior\n// Breakpoint matches DRAWER_MOBILE_BREAKPOINT constant in Editor/index.vue\n// When inside drawer, respond to drawer width instead of viewport\n@container drawer (min-width: 640px) {\n  .actions-text-container {\n    display: inline;\n  }\n}\n\n@container drawer (max-width: 639px) {\n  .actions-text-container {\n    display: none;\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n// Container query for drawer context - responsive button behavior\n// Breakpoint matches DRAWER_MOBILE_BREAKPOINT constant in Editor/index.vue\n// When inside drawer, respond to drawer width instead of viewport\n@container drawer (min-width: 640px) {\n  .dashboard-link-text {\n    display: inline;\n  }\n}\n\n@container drawer (max-width: 639px) {\n  .dashboard-link-text {\n    display: none;\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n// Split dropdown button: two halves styled as one cohesive element\n.editor-link-split {\n    display: inline-flex;\n    position: relative;\n}\n\n// Shared base styles for both halves (mirrors .ff-btn .ff-btn--secondary)\n.editor-link-split__action,\n.editor-link-split__toggle {\n    display: flex;\n    align-items: center;\n    gap: $ff-unit-xs;\n    font-size: $ff-funit-sm;\n    font-weight: 600;\n    line-height: 20px;\n    background-color: $ff-white;\n    color: $ff-color--action;\n    border: 1px solid $ff-color--action;\n    cursor: pointer;\n    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;\n\n    &:hover:not(:disabled) {\n        background-color: $ff-color--highlight;\n        border-color: $ff-color--highlight;\n        color: $ff-white;\n    }\n\n    &:disabled,\n    &.editor-link-split--disabled {\n        cursor: not-allowed;\n        border-color: $ff-grey-300;\n        color: $ff-grey-400;\n        background-color: $ff-grey-50;\n    }\n\n    .ff-btn--icon {\n        width: 20px;\n        height: 20px;\n    }\n}\n\n// Left half: main action button\n.editor-link-split__action {\n    padding: $ff-unit-sm 12px $ff-unit-sm $ff-unit-sm;\n    border-radius: $ff-unit-sm 0 0 $ff-unit-sm;\n    border-right: none;\n    white-space: nowrap;\n}\n\n// DropdownMenu wrapper: make all wrapper divs invisible to flex layout\n// so the MenuButton becomes a direct flex child of .editor-link-split\n.editor-link-split__dropdown,\n.editor-link-split__dropdown > div,\n.editor-link-split__dropdown > div > div {\n    display: contents;\n}\n\n// Right half: chevron dropdown trigger (square)\n.editor-link-split__toggle {\n    justify-content: center;\n    padding: $ff-unit-sm;\n    border-radius: 0 $ff-unit-sm $ff-unit-sm 0;\n    border-left: 1px solid $ff-color--action;\n\n    .ff-btn--icon {\n        width: 20px;\n        height: 20px;\n    }\n\n    &:hover:not(:disabled) {\n        border-left-color: $ff-color--highlight;\n    }\n\n    &:disabled,\n    &.editor-link-split--disabled {\n        border-left-color: $ff-grey-300;\n    }\n}\n\n// Primary variant: filled indigo background with white text\n.editor-link-split--primary {\n    .editor-link-split__action,\n    .editor-link-split__toggle {\n        background-color: $ff-color--action;\n        border-color: $ff-color--action;\n        color: $ff-white;\n\n        &:hover:not(:disabled) {\n            background-color: $ff-color--highlight;\n            border-color: $ff-color--highlight;\n        }\n    }\n\n    .editor-link-split__toggle {\n        border-left-color: rgba($ff-white, 0.3);\n\n        &:hover:not(:disabled) {\n            border-left-color: rgba($ff-white, 0.3);\n        }\n    }\n}\n\n// Icon-only minimal button: remove icon margins added by .ff-btn--icon-left\n.editor-link-minimal .ff-btn--icon-left {\n    margin-left: 0;\n    margin-right: 0;\n}\n\n// Override icon-right margin from DropdownMenu's ChevronDownIcon\n.editor-link-split__toggle .ff-btn--icon-right {\n    margin-left: 0;\n    margin-right: 0;\n}\n\n// Container query for drawer context - responsive button behavior\n// Breakpoint matches DRAWER_MOBILE_BREAKPOINT constant in Editor/index.vue\n// When inside drawer, respond to drawer width instead of viewport\n@container drawer (min-width: 640px) {\n  .editor-link-text {\n    display: inline;\n  }\n}\n\n@container drawer (max-width: 639px) {\n  .editor-link-text {\n    display: none;\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.blueprints-section {\n    display: flex;\n    flex-direction: column;\n    overflow: auto;\n    flex: 1;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.import-flows {\n    overflow: auto;\n\n    & > .wrapper {\n        display: flex;\n        flex-direction: row;\n        flex-wrap: wrap;\n        flex: 1;\n        overflow: auto;\n        min-height: 400px;\n\n        @media (max-width: 768px) {\n            flex-direction: column;\n            gap: 15px;\n        }\n\n        .preview {\n            flex: 1;\n            min-width: 0;\n            display: flex;\n            flex-direction: column;\n            max-height: 100%;\n\n            @media (max-width: 768px) {\n                max-width: 100%;\n                max-height: 400px;\n                order: 2;\n            }\n        }\n\n        .add-flows {\n            overflow: auto;\n            min-width: 350px;\n            max-width: 600px;\n            height: 100%;\n            flex: 1;\n\n            .content {\n                overflow: auto;\n                flex: 1;\n\n                .flow-input-wrapper {\n                    height: 100%;\n                    display: flex;\n\n                    textarea {\n                        background: none;\n                        border-color: $ff-grey-200;\n                        resize: none;\n                        min-height: 200px;\n                        transition: background-color ease-out .3s, border-color ease-out .3s;\n                        flex: 1;\n\n                        &:hover, &:focus {\n                            background: $ff-white;\n                            border-color: $ff-grey-300;\n                            resize: vertical;\n                        }\n\n                        &.has-content {\n                            border-color: $ff-grey-300;\n                        }\n\n                        @media (max-width: 768px) {\n                            max-height: 100%;\n                            min-height: 100px;\n                            background: $ff-white;\n                            border-color: $ff-grey-300;\n                            resize: none;\n                        }\n                    }\n                }\n\n                @media (max-width: 768px) {\n                    overflow: initial;\n                    gap: 0;\n                }\n            }\n\n            @media (max-width: 768px) {\n                width: 100%;\n                min-width: 100%;\n                max-width: fit-content;\n                height: auto;\n                flex: 0 0 auto;\n            }\n        }\n    }\n\n    .notice {\n        display: flex;\n        gap: 15px;\n        align-items: baseline;\n        font-size: 0.8rem;\n\n        .notice-element {\n\n            h3 {\n                font-weight: bold\n            }\n\n            p {\n                font-style: italic;\n                margin-bottom: 5px;\n            }\n        }\n\n        @media (max-width: 768px) {\n            flex: 0 0 auto;\n            align-items: flex-start;\n            justify-content: initial;\n            padding: 10px;\n            flex-direction: column;\n            overflow: auto;\n            height: fit-content;\n            max-height: 10vh;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-flows-step {\n    height: 100%;\n\n    .ff-blueprints {\n        overflow: auto;\n        min-width: 400px;\n        padding-right: 15px;\n\n        .ff-blueprint-tiles {\n            .ff-blueprint-tile {\n                max-width: 280px;\n                width: 100%;\n                height: 100%;\n            }\n        }\n    }\n\n    .ff-blueprint-categories {\n        min-width: 300px;\n        height: 100%;\n        overflow: auto;\n        display: flex;\n        flex-direction: column;\n\n        ul {\n            flex: 1;\n            height: 100%;\n            overflow: auto;\n\n            li:hover {\n                cursor: pointer;\n                color: $ff-blue-600;\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.instance-item {\n    display: grid;\n    grid-template-columns: repeat(6, 1fr);\n    gap: 15px;\n    background: $ff-grey-50;\n    border-bottom: 1px solid $ff-grey-300;\n    justify-content: space-between;\n    padding: 6px;\n    align-items: center;\n\n    .title {\n        grid-column-start: 2;\n        grid-column-end: 6;\n        display: flex;\n        gap: 15px;\n        justify-content: space-between;\n\n        h6 {\n            display: flex;\n            gap: 6px;\n        }\n    }\n\n    .actions {\n        grid-column-start: 6;\n        display: flex;\n        justify-content: flex-end;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.versions-list.ff-accordion {\n    margin: 0;\n\n    button {\n        display: grid;\n        grid-template-columns: repeat(12, 1fr);\n        background: $ff-white;\n        gap: 15px;\n        border: none;\n        border-bottom: 1px solid $ff-grey-300;\n\n        .version {\n            grid-column-start: 2;\n            display: flex;\n            justify-content: flex-start;\n            span {\n                color: $ff-black;\n                font-weight: 500;\n            }\n        }\n\n        .counter {\n            grid-column-start: 3;\n            grid-column-end: 6;\n            display: flex;\n            justify-content: flex-start;\n            gap: 2px;\n        }\n\n        .toggle {\n            grid-column-start: 12;\n            display: flex;\n            justify-content: flex-end;\n        }\n    }\n\n    &:last-child button {\n        border-bottom: none;\n    }\n\n    .instances-list {\n        .ff-show-more {\n            display: flex;\n            gap: 15px;\n            align-items: center;\n            justify-content: center;\n            color: $ff-grey-500;\n            line-height: 30px;\n            cursor: pointer;\n            transition: ease-in-out .3s;\n\n            &:hover {\n                    color: $ff-color--action\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.dependency-item {\n    border: 1px solid $ff-grey-300;\n    margin-bottom: 12px;\n\n    .dependency-header {\n        cursor: pointer;\n        background: $ff-grey-100;\n        display: flex;\n        padding: 6px 9px;\n        align-items: center;\n        gap: 15px;\n\n        .title {\n            flex: 1;\n            display: flex;\n            align-items: center;\n            gap: 15px;\n\n            h3, p {\n                margin: 0;\n                line-height: 1;\n            }\n\n            p {\n                color: $ff-grey-500;\n                font-weight: 400;\n                font-size: 80%;\n            }\n        }\n\n        .details {\n            display: flex;\n            flex-direction: column;\n            text-align: right;\n            font-size: 0.875rem;\n            font-weight: 500;\n        }\n\n        .ff-toggle {\n            transition: ease-in-out .3s;\n        }\n\n        &.open {\n            border-bottom: 1px solid $ff-grey-300;\n\n            .ff-toggle {\n                transform: rotate(90deg);\n            }\n        }\n    }\n\n    &:last-of-type {\n        .ff-accordion {\n            button {\n                border-bottom: none;\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.device-group {\n    .ff-target-snapshot-info{\n        border: 1px solid $ff-grey-300;\n        padding: 10px 15px;\n        display: flex;\n        gap: 20px;\n\n        .ff-title {\n            font-weight: 500;\n        }\n    }\n\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n@use \"../../ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-pipeline {\n    width: 100%;\n    border: 1px solid $ff-grey-300;\n    border-radius: 6px;\n    .ff-pipeline-banner {\n        height: 46px;\n    }\n    .ff-pipeline-banner,\n    .ff-pipeline-stage-banner {\n        padding: 0px 18px;\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        border-bottom: 1px solid $ff-grey-300;\n        background-color: $ff-grey-100;\n        border-top-left-radius: 6px;\n        border-top-right-radius: 6px;\n        gap: 48px;\n    }\n    .ff-pipeline-stage-banner {\n        height: 54px;\n        background-color: $ff-grey-50;\n        label {\n            font-weight: 500;\n        }\n    }\n    .ff-pipelines-stage-banner-error {\n        color: $ff-red-600;\n        font-size: 0.725rem;\n        font-weight: 500;\n        display: flex;\n        align-items: center;\n        gap: 2px;\n    }\n    .ff-pipeline-actions {\n        display: flex;\n        gap: 6px;\n    }\n    .ff-pipeline-stages {\n        padding: 24px;\n        border-bottom-left-radius: 6px;\n        border-bottom-right-radius: 6px;\n        display: flex;\n        align-items: stretch;\n        gap: 16px;\n        overflow-x: auto;\n    }\n}\n\n.ff-pipeline-stage {\n    border-radius: 6px;\n    border: 1px solid $ff-grey-400;\n    min-width: 275px;\n    background-color: white;\n    a:hover,\n    a:hover .ff-icon {\n        color: $ff-blue-600;\n    }\n    &.ff-pipeline-stage-ghost {\n        border-style: dashed;\n        padding: 48px 64px;\n        gap: 6px;\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n        color: $ff-grey-400;\n        &:hover {\n            border-style: solid;\n            cursor: pointer;\n            color: $ff-blue-600;\n            border-color: $ff-blue-600;\n        }\n    }\n    .ff-pipeline-stage-row {\n        padding: 9px 18px;\n        display: flex;\n        justify-content: space-between;\n        gap: 24px;\n        font-size: 0.9rem;    \n        label {\n            color: $ff-grey-500;\n        }\n        a.ff-link {\n            text-overflow: ellipsis;\n            overflow-x: hidden;\n        }\n    }\n    .ff-pipeline-stage-type {\n        padding: 9px 0px 0.75rem;\n        margin: 0 18px 0.75rem;\n        border-bottom: 1px solid $ff-grey-300;\n        display: flex;\n        align-items: flex-start;\n        gap: 6px;\n        font-size: 0.9rem;    \n        label {\n            color: $ff-grey-500;\n            font-size: 0.75em;\n            line-height: 0.825em;\n        }\n    }\n}\n\n.ff-pipeline-stage--error {\n    border-color: $ff-red-600;\n    .ff-pipeline-stage-banner {\n        background-color: $ff-red-50;\n        border-bottom: 1px solid $ff-red-600;\n    }\n}\n\n.animate-deploying {\n    animation-name: left-to-right;\n    animation-duration: 1s;\n    animation-iteration-count: infinite;\n    color: $ff-blue-600;\n}\n\n@keyframes left-to-right {\n    0% {\n        transform: translate(-24px, 0);\n        opacity: 0;\n    }\n    40% {\n        opacity: 1;\n    }\n    75% {\n        opacity: 0;\n    }\n    100% {\n        transform: translate(24px, 0);\n        opacity: 0;\n    }\n}","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.deployment-name__url {\n    :deep(.ff-icon) {\n        width: 14px;\n        height: 14px;\n    }\n    :deep(.ff-icon-button) {\n        background: transparent;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n\n    .error-banner {\n        padding: 9px;\n        background-color: $ff-red-50;\n        border: 1px solid $ff-red-300;\n        border-radius: 3px;\n        color: $ff-red-600;\n    }\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.role-row-cell {\n    display: flex;\n    flex-direction: column;\n    min-height: 40px;\n\n    .actual-role {\n        flex: 1;\n        display: flex;\n        justify-content: center;\n        flex-direction: column;\n    }\n\n    .team-role {\n        flex: 1;\n    }\n    .role {\n        font-weight: bold;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-icon-link {\ndisplay: flex;\njustify-content: space-between;\nalign-items: center;\nposition: relative;\n\nborder-radius: $ff-unit-sm;\nborder: 1px solid $ff-grey-300;\n\nheight: 28px;\npadding: $ff-unit-sm 5px;\n\nfont-size: $ff-funit-sm;\nline-height: 20px;\n\nsvg {\n  margin-right: 5px;\n}\n\n&:hover {\n  cursor: pointer;\n  border-color: $ff-blue-600;\n\n  color: $ff-blue-600;;\n  background-color: $ff-grey-50;\n\n  .ff-icon {\n      color: $ff-blue-600;\n  }\n}\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-icon-link {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  position: relative;\n\n  border-radius: $ff-unit-sm;\n  border: 1px solid $ff-grey-300;\n\n  height: 28px;\n  padding: $ff-unit-sm 5px;\n\n  font-size: $ff-funit-sm;\n  line-height: 20px;\n\n  svg {\n    margin-right: 5px;\n  }\n\n  &:hover {\n    cursor: pointer;\n    border-color: $ff-blue-600;\n\n    color: $ff-blue-600;;\n    background-color: $ff-grey-50;\n\n    .ff-icon {\n        color: $ff-blue-600;\n    }\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-counter {\n    border: 1px solid transparent;\n    transition: ease-in-out .15s;\n    will-change: border-color;\n\n    &.empty {\n        opacity: .3;\n    }\n\n    &:hover {\n        opacity: 1;\n\n        &.green {\n            border-color: $ff-green-500;\n        }\n        &.red {\n            border-color: $ff-red-500;\n        }\n        &.gray {\n            border-color: $ff-grey-500;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.application-wrapper {\n    position: relative;\n\n    .overlay {\n        position: absolute;\n        top:0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n        background: rgba(255, 255, 255, 0.4) !important;\n        border: none !important;\n    }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n@use \"../../ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-applications-list {\n    display: flex;\n    flex-direction: column;\n    gap: 18px;\n    > li {\n        > *:not(.ff-dialog-container) {\n            border-left: 1px solid $ff-grey-300;\n            border-right: 1px solid $ff-grey-300;\n            background-color: $ff-grey-50;\n        }\n\n        > section:last-of-type {\n            border-bottom-left-radius: 6px;\n            border-bottom-right-radius: 6px;\n            border-bottom: 1px solid $ff-grey-300;\n        }\n\n        > :first-child {\n            border-top-left-radius: 6px;\n            border-top-right-radius: 6px;\n            border-top: 1px solid $ff-grey-300;\n        }\n\n        > :last-child {\n            border-bottom-left-radius: 6px;\n            border-bottom-right-radius: 6px;\n            border-bottom: 1px solid $ff-grey-300;\n        }\n    }\n    .ff-application-list--app {\n        background-color: white !important;\n        display: flex;\n        justify-content: space-between;\n        padding: 12px;\n        border: 1px solid $ff-grey-300;\n        >span {\n            display: flex;\n            align-items: center;\n            gap: 1rem;\n        }\n        &:hover {\n            cursor: pointer;\n            border-color: $ff-blue-600;\n\n            .ff-application-list--icon,\n            .ff-application-list--icon .ff-icon {\n                color: $ff-blue-600;\n            }\n        }\n    }\n    .ff-applications-list--instance {\n        display: flex;\n        flex-direction: column;\n        span {\n            color: $ff-grey-400;\n            font-size: 0.75rem;;\n        }\n    }\n    .delimiter {\n        font-size: 0.875rem;\n        color: $ff-grey-500;\n        display: flex;\n        align-items: center;\n        gap: 6px;\n\n        &::after {\n            content: '';\n            height: 1px;\n            flex-grow: 1;\n            margin-left: 9px;\n            background-color: $ff-grey-300;\n        }\n    }\n}\n\n.ff-applications-list-instances {\n    padding: 12px;\n    padding-top: 6px;\n    display: flex;\n    flex-direction: column;\n    >label {\n        font-size: 0.875rem;\n        color: $ff-grey-500;\n        display: flex;\n        align-items: center;\n        gap: 12px;\n        &::after {\n            content: '';\n            height: 1px;\n            flex-grow: 1;\n            background-color: $ff-grey-300;\n        }\n    }\n    > .items-wrapper {\n        background-color: white;\n        border-color: $ff-grey-300;\n        border-width: 1px;\n        border-style: solid;\n        border-radius: 6px;\n        padding: 12px;\n        display: grid;\n        align-items: center;\n        grid-template-columns: 40px 1fr 100px minmax(auto, 220px) 350px;\n        &:hover {\n            cursor: pointer;\n            border-color: $ff-blue-600;\n            .ff-application-list--instance {\n                color: $ff-blue-600;\n            }\n            .ff-icon {\n                color: $ff-blue-600;\n            }\n        }\n    }\n\n    .actions {\n        display: flex;\n        justify-content: flex-end;\n        gap: 9px;\n    }\n}\n\n.ff-applications-list-instances {\n    flex: 1;\n    padding: 12px;\n    padding-top: 6px;\n\n    .items-wrapper {\n        display: flex;\n        flex: 1;\n        background: none;\n        border: none;\n        padding: 0;\n        gap: 5px;\n        margin-top: 10px;\n\n        .ff-counter {\n            min-width: 125px;\n        }\n    }\n\n    .empty-message {\n        min-height: 75px;\n        display: flex;\n        text-align: center;\n        align-items: center;\n        justify-content: center;\n        gap: 2px;\n        color: $ff-grey-500;\n    }\n}\n\n.ff-applications-list--details {\n    color: $ff-grey-400;\n    font-size: 0.875rem;\n    padding-bottom: 12px;\n    text-align: center;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n@use \"../../../stylesheets/components/applications-list\" as *;\n\n.no-results {\n  text-align: center;\n  color: $ff-grey-400;\n}\n\n.fade-slide-enter-active,\n.fade-slide-leave-active,\n.fade-slide-move {\n    transition: all 0.3s ease;\n}\n\n.fade-slide-enter-from {\n    opacity: 0;\n    transform: translateX(30px);\n}\n\n.fade-slide-enter-to {\n    opacity: 1;\n    transform: translateX(0);\n}\n\n.fade-slide-leave-from {\n    opacity: 1;\n    transform: translateX(0);\n}\n\n.fade-slide-leave-to {\n    opacity: 0;\n    transform: translateX(30px);\n}\n\n.fade-slide-move {\n    transition: transform 0.3s ease;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-admin-audit .ff-accordion {\n    margin-bottom: 12px;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.hosted-instances-usage {\n    tr:last-of-type {\n        td {\n            border-bottom: none;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-medium-tile {\n    position: relative;\n    border-radius: 6px;\n    border: 2px solid $ff-grey-300;\n    background: white;\n    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.25);\n    padding: 49px 24px 24px 24px;\n    width: 100%;\n    max-width: 300px;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n\n    .ff-ribbon {\n        --ribbon-overlap: 8px;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        height: 30px;\n        left: calc(-1 * var(--ribbon-overlap));\n        line-height: 1.3;\n        width: calc(100% + 2 * var(--ribbon-overlap));\n        margin: 0;\n        position: absolute;\n        top: 8px;\n        color: white;\n        border-top: 1px solid #363636;\n        border-bottom: 1px solid #202020;\n        border-radius: 2px 2px 0 0;\n        box-shadow: 0 1px 2px rgba(0,0,0,0.3);\n\n        &.red {\n            background: $ff-red-500;\n            &::before,\n            &::after {\n                border-color: $ff-red-900 transparent transparent transparent;\n            }\n        }\n\n        &.blue {\n            background: $ff-indigo-700;\n            &::before,\n            &::after {\n                border-color: $ff-indigo-900 transparent transparent transparent;\n            }\n        }\n\n        &::before,\n        &::after {\n            content: '';\n            display: block;\n            width: 0;\n            height: 0;\n            position: absolute;\n            bottom: calc((-2 * var(--ribbon-overlap)) - 1px);\n            z-index: -10;\n            border: var(--ribbon-overlap) solid;\n        }\n\n        &::before {left: 0}\n        &::after {right: 0}\n    }\n\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-accordion.broker-client {\n    margin-bottom: 0;\n\n    button {\n        border: none;\n        background: none;\n        display: grid;\n        grid-template-columns: repeat(6, 1fr);\n        gap: 15px;\n        padding: 0;\n\n        .username {\n            padding: 15px 10px;\n            grid-column: span 2;\n            overflow: hidden;\n\n            .ff-text-copier {\n                @include truncate;\n                & > span {\n                    @include truncate;\n                }\n                .title-wrapper {\n                    @include truncate;\n                }\n\n            }\n\n            .ff-icon {\n                margin-left: 0;\n                min-width: 20px;\n            }\n        }\n\n        .rules {\n            padding: 15px 10px;\n\n        }\n\n        .toggle {\n            grid-column: span 3;\n            text-align: right;\n            padding-right: 10px;\n            display: flex;\n            align-items: center;\n            justify-content: flex-end;\n\n            .edit, .delete {\n                padding: 24px 15px;\n                display: inline-block;\n                position: relative;\n                align-self: stretch;\n\n                .ff-icon-sm {\n                    position: absolute;\n                    top: 50%;\n                    left: 50%;\n                    transform: translate(-50%, -50%);\n                    transition: ease-in-out .3s;\n                }\n\n                &:hover {\n                    .ff-icon-sm {\n                        width: 20px;\n                        height: 20px;\n                    }\n                }\n            }\n\n            .edit:hover {\n                color: $ff-grey-700;\n            }\n            .delete:hover {\n                color: $ff-red-700;\n            }\n        }\n    }\n\n    .ff-accordion--content {\n        background: $ff-grey-100;\n        .acl-list {\n            .acl-wrapper {\n                border-bottom: 1px solid $ff-grey-200;\n                padding: 15px 10px;\n                gap: 10px;\n                font-size: 80%;\n\n                &:last-of-type {\n                    border: none;\n                }\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#client-dialog {\n\n    .headers {\n        label:first-of-type {\n            max-width: 200px;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n\n    .clients-wrapper {\n        border: 1px solid $ff-grey-300;\n        border-radius: 5px;\n        overflow: hidden;\n\n        .header {\n            background: $ff-grey-100;\n            padding: 10px;\n            border-bottom: 1px solid $ff-grey-300;\n\n            span {\n                &.username {\n                    grid-column: span 2;\n                }\n            }\n        }\n\n        .clients-list {\n            background: $ff-white;\n\n            .client {\n                border-bottom: 1px solid $ff-grey-300;\n\n                &:last-of-type {\n                    border-bottom: none;\n                }\n            }\n        }\n    }\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-topic-docs {\n    .ff-accordion {\n        margin: 0;\n\n        .ff-accordion--button{\n            font-weight: bold;\n            border: 1px solid $ff-blue-300;\n            background-color: $ff-blue-50;\n            border-radius: 6px;\n            padding: 12px;\n            font-weight: bold;\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n\n            &:hover {\n                cursor: pointer;\n                background-color: $ff-blue-100;\n            }\n        }\n\n        .ff-accordion--content {\n            border: 1px solid $ff-blue-300;\n            border-top: none;\n            border-radius: 0 0 6px 6px;\n            padding: 12px;\n\n            .ff-topic-docs-row-meta {\n                section {\n                    margin-bottom: 15px;\n\n                    label {\n                        display: block;\n                        font-weight: bold;\n                        margin-bottom: 3px;\n                    }\n                    .ff-empty-state {\n                        color: $ff-grey-400;\n                        background-color: $ff-grey-50;\n                        padding: 12px;\n                        margin-top: 6px;\n                    }\n                }\n            }\n        }\n\n        &.open {\n            .ff-accordion--button {\n                border-radius: 6px 6px 0 0;\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-return-link {\n    padding: 9px 12px;\n    border-radius: 6px;\n    border: 1px solid $ff-grey-200;\n    transition: border-color 0.3s;\n    display: inline-flex;\n    align-items: center;\n    gap: 9px;\n    &:hover {\n        border-color: $ff-indigo-500;\n        color: $ff-indigo-500;\n        cursor: pointer;\n    }\n}\n.ff-schema-docs-hierarchy {\n    margin: 24px 0;\n    display: flex;\n    gap: 12px;\n    flex-direction: column;\n}\nh1 {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.segment-wrapper {\n    .segment {\n        position: relative;\n        margin: 5px 0 0;\n        transition: ease .15s;\n        &:hover {\n            color: $ff-indigo-700;\n\n            cursor: pointer;\n        }\n\n        .diagram {\n            .connector-elbow {\n                border-left: 2px solid  $ff-indigo-300;\n                border-bottom: 2px solid  $ff-indigo-300;\n                border-bottom-left-radius: 7px;\n                display: inline-block;\n                position: absolute;\n                height: 50px;\n                width: 25px;\n                left: -23px;\n                top: -35px;\n            }\n            .connector-trunk {\n                width: 1px;\n                border-left: 2px solid $ff-indigo-300;\n                display: inline-block;\n                position: absolute;\n                height: 5000px;\n                left: -23px;\n                top: -5000px;\n            }\n        }\n\n        .content {\n            padding: 5px;\n            position: relative;\n\n            .chevron {\n                transition: ease .15s;\n            }\n\n            .title {\n                align-items: center;\n                display: flex;\n                gap: 3px;\n\n                .highlight {\n                    background-color: $ff-indigo-100;\n                }\n            }\n\n            .ff-text-copier {\n                display: none;\n                height: 17px;\n            }\n\n            &:hover {\n                .ff-text-copier {\n                    display: inline-block;\n                    color: $ff-grey-400;\n                }\n            }\n        }\n    }\n\n    .children {\n        overflow: hidden;\n    }\n    &.selected > {\n        .segment {\n            background: $ff-indigo-50;\n        }\n    }\n    &.open > {\n        .segment {\n            .content {\n                .title {\n                    color: $ff-indigo-700;\n                }\n\n                .chevron {\n                    transform: rotate(90deg)\n                }\n            }\n        }\n    }\n\n    &.empty > {\n        .segment {\n            .content {\n                .title {\n                    color: $ff-grey-600;\n                    font-size: 90%;\n                    font-weight: 300;\n\n                    .separator {\n                        color: $ff-black;\n                        font-weight: bold;\n                    }\n                }\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.unified-namespace-hierarchy {\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n    min-width: 0;\n    overflow: auto;\n\n    .topics {\n        background: $ff-white;\n        padding: 10px;\n        border-radius: 6px;\n        border: 1px solid $ff-grey-200;\n        overflow: auto;\n        height: 100%;\n    }\n}\n@media screen and (max-width: $ff-screen-md) {\n    .unified-namespace-hierarchy {\n        min-width: 100%;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-topic-inspecting {\n    background: $ff-white;\n    padding: 10px;\n    border-radius: 6px;\n    border: 1px solid $ff-grey-200;\n}\n\n.ff-topic-path {\n    display: flex;\n    background-color: $ff-indigo-50;\n    color: $ff-indigo-600;\n    border-radius: 6px;\n    border: 1px solid $ff-indigo-100;\n    padding: 6px;\n    font-weight: 600;\n    & > span:first-child {\n        flex-grow: 1\n    }\n    & > span:last-child {\n        flex-grow: 0\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.topic-schema {\n    background-color: $ff-indigo-50;\n    color: $ff-indigo-600;\n    border-radius: 6px;\n    border: 1px solid $ff-indigo-100;\n    padding: 10px 6px;\n    font-size: 0.875rem;\n    line-height: 1.25rem;\n    overflow: auto;\n    position: relative;\n\n    .topic-schema-unknown {\n        color: $ff-grey-500;\n        text-align: center;\n        font-style: italic;\n    }\n\n    .schema-container {\n        .show-more {\n            position: absolute;\n            bottom: 0;\n            left: 45%;\n        }\n\n    }\n\n    &.collapsed {\n        overflow: hidden;\n        box-shadow: inset 0 -30px 20px -20px rgba(49, 46, 129, 0.2);\n        padding-bottom: 35px;\n\n        .schema-container {\n            max-height: 400px;\n        }\n\n        .show-more {\n            padding: 10px;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.suggestion {\n    .content {\n        .format {\n            color: $ff-indigo-500;\n        }\n    }\n\n    .actions {\n        .preview {\n            color: $ff-grey-500\n        }\n        .accept {\n            color: $ff-green-500\n        }\n        .reject {\n            color: $ff-red-500\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-topic-inspecting {\n    display: flex;\n    flex-direction: column;\n    gap: 15px;\n    background: $ff-white;\n    padding: 10px;\n    border-radius: 6px;\n    border: 1px solid $ff-grey-200;\n    overflow: auto;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-topic-inspector {\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n    min-width: 0;\n    transition: width 0.3s;\n    overflow: auto;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-broker-hierarchy {\n    display: flex;\n    flex-direction: row;\n    gap: 12px;\n    overflow: auto;\n    //height: 100%;\n}\n\n@media screen and (max-width: $ff-screen-md) {\n    .ff-broker-hierarchy {\n        flex-wrap: wrap;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.broker-form {\n    .server, .credentials {\n        .title {\n            border-bottom: 1px solid $ff-grey-200;\n        }\n    }\n\n    .server {\n        &::after {\n            content: ' ';\n            width: 1px;\n            height: 10px;\n            background: red;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-box {\n    border: 1px solid $ff-color--border;\n    background: $ff-white;\n    padding: 10px;\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n\n    .ff-box-header {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        margin-bottom: 10px;\n\n        .ff-box-title {\n            margin: 0;\n            padding: 0;\n            font-size: 1.3rem;\n        }\n    }\n}\n","<template>\n    <KebabMenu class=\"relative ff-kebab-menu\" as=\"div\" data-el=\"kebab-menu\">\n        <MenuButton\n            ref=\"trigger\"\n            class=\"ff-btn ff-btn--tertiary ff-btn-icon transition-fade--color ff-kebab-menu__trigger\"\n            :disabled=\"disabled\"\n            @click=\"() => { $nextTick(() => { updateItemsPosition() } ) }\"\n            @keydown.space=\"() => { $nextTick(() => { updateItemsPosition() } ) }\"\n        >\n            <DotsVerticalIcon class=\"ff-icon\" />\n        </MenuButton>\n        <teleport to=\"body\">\n            <transition\n                leave-active-class=\"transition duration-100 ease-in\"\n                leave-from-class=\"opacity-100\"\n                leave-to-class=\"opacity-0\"\n            >\n                <MenuItems\n                    ref=\"menu-items\"\n                    as=\"ul\"\n                    class=\"ff-kebab-options\"\n                    data-el=\"kebab-options\"\n                    v-bind=\"menuItemsAttrs\"\n                    :style=\"{\n                        position: 'fixed',\n                        top: position.top + 'px',\n                        left: position.left + 'px'\n                    }\"\n                >\n                    <slot></slot>\n                </MenuItems>\n            </transition>\n        </teleport>\n    </KebabMenu>\n</template>\n\n<script>\nimport {\n    Menu,\n    MenuButton,\n    MenuItems\n} from '@headlessui/vue'\nimport { DotsVerticalIcon } from '@heroicons/vue/solid'\n\nimport TeleportedMenuMixin from '../../../mixins/TeleportedMenuMixin.js'\n\nexport default {\n    name: 'ff-kebab-menu',\n    components: {\n        DotsVerticalIcon,\n        KebabMenu: Menu,\n        MenuButton,\n        MenuItems\n    },\n    mixins: [TeleportedMenuMixin],\n    props: {\n        disabled: {\n            default: false,\n            required: false,\n            type: Boolean\n        },\n        menuItemsAttrs: {\n            default: () => ({}),\n            required: false,\n            type: Object\n        }\n    }\n}\n</script>\n\n<style scoped>\n.ff-kebab-menu__trigger {\n    border: 1px solid transparent;\n}\n</style>\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.minimal-status {\n    display: block;\n    height: 10px;\n    width: 10px;\n    border-radius: 50%;\n    transition: ease-in-out .3s;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.recently-modified {\n    & > p {\n        border-bottom: 1px solid $ff-grey-100;\n        margin-bottom: 10px;\n        line-height: 2rem;\n    }\n\n    .device-wrapper {\n        .device-tile {\n            border: 1px solid $ff-grey-100;\n            padding: 2px 10px;\n            border-radius: 5px;\n            display: flex;\n            width: 100%;\n            height: fit-content;\n            min-height: 55px;\n            justify-content: space-between;\n            align-items: center;\n            gap: 10px;\n            will-change: border-color;\n            transition: ease-in-out .3s;\n\n            &.has-more {\n                padding: 10px;\n            }\n\n            &:hover {\n                border-color: $ff-grey-200;\n            }\n\n            .details {\n                flex: 1;\n\n                .detail-wrapper {\n                    &:last-of-type {\n                        font-size: $ff-funit-sm;\n                        color: $ff-grey-400;\n                    }\n                }\n\n                .name {\n                    &:hover {\n                        color: $ff-indigo-700;\n                    }\n                }\n            }\n\n            .actions {\n                display: flex;\n                justify-content: space-between;\n                align-items: center;\n            }\n        }\n    }\n\n    .no-devices {\n        min-height: 130px;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.recently-modified {\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n\n    & > p {\n        border-bottom: 1px solid $ff-grey-100;\n        margin-bottom: 10px;\n        line-height: 2rem;\n    }\n\n    .instance-wrapper {\n        height: fit-content;\n\n        .instance-tile {\n            border: 1px solid $ff-grey-100;\n            padding: 2px 4px 2px 10px;\n            border-radius: 5px;\n            display: flex;\n            width: 100%;\n            height: fit-content;\n            min-height: 55px;\n            justify-content: space-between;\n            align-items: center;\n            gap: 10px;\n            will-change: border-color, background-color;\n            transition: ease-in-out 0.3s;\n            cursor: pointer;\n\n            &.has-more {\n                padding: 10px;\n            }\n\n            &:hover {\n                border-color: $ff-grey-300;\n                background-color: $ff-indigo-50;\n            }\n\n            .details {\n                flex: 1;\n\n                .detail-wrapper {\n                    .name {\n                        font-weight: 500;\n                    }\n\n                    &.detail {\n                        font-size: $ff-funit-sm;\n                        color: $ff-grey-400;\n                    }\n                }\n            }\n\n            .actions {\n                display: flex;\n                justify-content: space-between;\n                align-items: center;\n                gap: 4px;\n\n                .ff-kebab-menu .ff-btn {\n                    color: $ff-color--action;\n\n                    .ff-icon {\n                        width: 20px;\n                        height: 20px;\n                    }\n\n                    &:hover {\n                        background-color: $ff-color--highlight;\n                        color: $ff-white;\n                    }\n                }\n            }\n        }\n    }\n\n    .no-instances {\n        min-height: 130px;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-team-dashboard {\n    height: 100%;\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    overflow: auto;\n    container-type: inline-size;\n    container-name: team-dashboard;\n}\n\n.instances-section {\n    // Default: stacked (flex-wrap)\n    // When container is 640px+ wide, display side-by-side\n    @container team-dashboard (min-width: 640px) {\n        flex-wrap: nowrap;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.flow-categories-wrapper {\n    display: flex;\n    flex-direction: column;\n    flex-wrap: wrap;\n    gap: 20px;\n\n  .category {\n    margin-bottom: 20px;\n\n    .blueprint-tile {\n      max-width: 250px;\n      min-width: 200px;\n    }\n\n    .tiles-wrapper {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 15px;\n    }\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-registry-entry {\n    background-color: $ff-white;\n    padding: 12px;\n    border: 1px solid $ff-grey-200;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-registry-list {\n    display: grid;\n    gap: 6px;\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n\n.ff-code-previewer {\n    background-color: white;\n    border: 1px solid $ff-grey-300;\n    border-radius: 6px;\n    padding: 12px;\n    code {\n        border: none;\n        padding: unset;\n    }\n}","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-team-library .ff-breadcrumbs {\n    margin-top: 12px;\n    margin-bottom: 12px;\n}\n.breadcrumbs-wrapper {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\ntd {\n    .content {\n        overflow: hidden;\n        display: flex;\n        flex-direction: column;\n        transition: max-height 0.3s ease-in-out;\n        height: fit-content;\n        box-shadow: inset 0 2px 15px 0 rgba(0,0,0,0.1);\n        overflow-y: auto;\n\n        .application {\n            line-height: 29px;\n            display: grid;\n            grid-template-columns: 55px repeat(10, 1fr) 56px;\n            border-bottom: 1px solid $ff-grey-200;\n            transition: ease-in-out .3s;\n\n            .name {\n                grid-column: span 8;\n            }\n            .role {\n                padding-left: 15px;\n            }\n\n            .action {\n                .ff-icon {\n                    transition: ease-in-out .2s;\n                    opacity: 0;\n                }\n            }\n\n            &:hover {\n                background: $ff-grey-100;\n                .action {\n                    .ff-icon {\n                        opacity: 1;\n                    }\n                }\n            }\n\n            &:last-of-type {\n                border-bottom: none;\n            }\n        }\n\n    }\n\n    &.collapsed {\n        .content {\n            max-height: 0\n        }\n    }\n\n    &.expanded {\n        .content {\n            max-height: 200px;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-cpu-bar {\n    width: 100%;\n    height: 100%;\n    border-radius: 3px;\n    padding: 3px;\n    border: 1px solid;\n    border-color: $ff-grey-300;\n}\n\n.ff-cpu-bar--fill {\n    border-radius: 3px;\n    height: 12px;\n}\n\n.ff-cpu-bar--fill.high {\n    background-color: $ff-red-200;\n}\n\n.ff-cpu-bar--fill.medium {\n    background-color: $ff-yellow-200;\n}\n\n.ff-cpu-bar--fill.low {\n    background-color: $ff-green-200;\n}\n\n.ff-cpu-bar--label {\n    width: 48px;\n    text-align: right;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-pipeline-stage {\n    border: 1px solid $ff-grey-300;\n    border-radius: 6px;\n    overflow: hidden;\n    background: $ff-white;\n    padding: 12px;\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n    min-width: 225px;\n\n    .ff-pipeline-target {\n        display: flex;\n        flex-direction: row;\n        gap: 6px;\n        font-size: 11px;\n        align-items: center;\n        border: 1px solid $ff-grey-300;\n        padding: 6px;\n        border-radius: 6px;\n        transition: ease-in-out .3s;\n\n        &:hover {\n            color: $ff-indigo-700;\n            border-color: $ff-indigo-700;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-pipeline {\n    border: 1px solid $ff-grey-300;\n    border-radius: 5px;\n    overflow: hidden;\n\n    & > .ff-pipeline-header {\n        background: $ff-white;\n        padding: 15px;\n        border-bottom: 1px solid $ff-grey-300;\n        transition: ease-in-out .3s;\n\n        &:hover {\n            color: $ff-white;\n            background: $ff-indigo-700;\n            .ff-pipeline-application-name {\n                transition: ease-in-out .3s;\n                color:  $ff-grey-400;\n            }\n        }\n\n        &:has(.ff-pipeline-application-name:hover) {\n            color: $ff-grey-500;\n\n            .ff-pipeline-application-name:hover {\n                color: $ff-white;\n            }\n        }\n\n        .ff-application-name {\n            transition: ease-in-out .3s;\n            color: $ff-grey-400;\n\n            &:hover {\n                color: $ff-indigo-700;\n            }\n        }\n\n        .to {\n            display: flex;\n            flex: 1;\n            justify-content: end;\n        }\n    }\n\n    & > .ff-pipeline-content {\n        padding: 15px;\n        overflow: auto;\n\n        .ff-pipeline-stages-list {\n            display: flex;\n            flex-direction: row;\n            gap: 15px;\n\n            li {\n                display: flex;\n                gap: 15px;\n                align-items: center;\n\n                &:last-child > .ff-icon {\n                    display: none;\n                }\n            }\n        }\n\n        .ff-empty-stages-message {\n            text-align: center;\n            color: $ff-grey-500;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#team-pipelines {\n\n    .pipelines {\n        .pipelines-list {\n            display: flex;\n            flex-direction: column;\n            gap: 15px;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-team-properties-table {\n    padding: 9px 12px;\n    border-radius: 0.25rem;\n    background-color: white;\n    border-collapse: separate;\n    border-width: 1px;\n    border-color: $ff-grey-300;\n    min-width: 400px;\n    td {\n        height: 36px;\n    }\n    tr:not(:last-child) {\n        td,th {\n            border-bottom: 1px solid $ff-grey-100;\n        }\n    }\n    th {\n        font-weight: 600;\n        padding-right: 12px;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.rows-header {\n    margin-bottom: 15px;\n    padding-bottom: 15px;\n    border-bottom: 1px solid $ff-color--border;\n\n    .toggle-collapse, .refresh-table {\n        border: 1px solid transparent;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.text-cell {\n    overflow: auto;\n    max-height: 3rem;\n\n    .value {\n        background: none;\n        border: none;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#rows-list {\n    height: 100%;\n    width: 100%;\n    overflow: auto;\n\n    .header {\n        border-bottom: 1px solid $ff-color--border;\n        padding-bottom: 15px;\n        margin-bottom: 15px;\n        display: flex;\n        align-items: center;\n        height: 50px;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.column {\n    .col-section {\n\n        .ff-combobox, .ff-listbox {\n            min-width: 10px; // resetting min-width\n            max-width: 100%;\n            width: 100%;\n        }\n\n        .ff-input {\n            min-width: 10px;\n        }\n\n        .ff-checkbox {\n            span {\n                top: 8px;\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n\n#create-table {\n    height: 100%;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    background: $ff-grey-50;\n\n    > .header {\n        border-bottom: 1px solid $ff-grey-300;\n        padding: 10px 0;\n        width: 100%;\n        background: $ff-white;\n\n        .content {\n            padding: 0 12px;\n            display: flex;\n            align-items: baseline;\n\n            .title {\n                margin: 0;\n                color: $ff-grey-800;\n                font-weight: bold;\n                font-size: 1.25rem;\n                line-height: 1.75rem;\n            }\n        }\n    }\n\n    .content-wrapper {\n        flex: 1;\n        width: 100%;\n        background-color: $ff-grey-50;\n        overflow: auto;\n\n       .section {\n           padding-bottom: 15px;\n           margin-bottom: 15px;\n           border-bottom: 1px solid $ff-grey-200;\n\n           .header {\n               .title {\n                   color: $ff-grey-600;\n                   font-size: 10px;\n               }\n           }\n\n           .columns {\n               margin-bottom: 20px;\n           }\n       }\n    }\n\n    .footer {\n        padding: 10px 12px;\n        border-top: 1px solid $ff-grey-300;\n        background: $ff-white;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#table-schema {\n    height: 100%;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    background: $ff-grey-50;\n\n    > .header {\n        border-bottom: 1px solid $ff-grey-300;\n        padding: 10px 0;\n        width: 100%;\n        background: $ff-white;\n\n        .content {\n            padding: 0 12px;\n            display: flex;\n            align-items: baseline;\n\n            .title {\n                margin: 0;\n                color: $ff-grey-800;\n                font-weight: bold;\n                font-size: 1.25rem;\n                line-height: 1.75rem;\n            }\n        }\n    }\n\n    .content-wrapper {\n        flex: 1;\n        width: 100%;\n        background-color: $ff-grey-50;\n        overflow: auto;\n\n        .header {\n            .title {\n                color: $ff-grey-600;\n                font-size: 10px;\n            }\n        }\n    }\n\n    .footer {\n        background: $ff-white;\n        padding: 10px 12px;\n        border-top: 1px solid $ff-grey-300;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#tables-list {\n    display: flex;\n    flex-direction: column;\n    max-width: 20%;\n    min-width: 250px;\n\n    .header {\n        border-bottom: 1px solid $ff-color--border;\n        padding-bottom: 15px;\n        margin-bottom: 15px;\n\n        .ff-data-table--search {\n            min-width: 10px;\n        }\n    }\n\n    .list {\n        .item {\n            display: flex;\n            gap: 5px;\n            line-height: 2;\n            align-items: center;\n            transition: ease-in-out .3s;\n            cursor: pointer;\n\n            &:hover, &.active {\n                color: $ff-indigo-500;\n                background-color: $ff-grey-100;\n            }\n\n            &:hover {\n                .icon-toggle {\n                    .ff-icon:first-child {\n                        display: none;\n                    }\n                    .ff-icon:last-child {\n                        display: inline-block;\n                    }\n                }\n            }\n\n            .icon-toggle {\n                width: 24px;\n                .ff-icon:first-child {\n                    display: inline-block;\n                }\n                .ff-icon:last-child {\n                    display: none;\n                }\n\n                .edit {\n                    &:hover {\n                        transform: scale(1.4);\n                    }\n                }\n            }\n        }\n    }\n\n    .empty-state {\n        flex: 1;\n        display: flex;\n        flex-direction: column;\n        text-align: center;\n        justify-content: center;\n        color: $ff-grey-400;\n        line-height: 1.6;\n\n        .cta {\n            cursor: pointer;\n            color: $ff-indigo-500;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#table-explorer {\n    display: flex;\n    gap: 15px;\n    height: 100%;\n    width: 100%;\n    overflow: auto;\n\n    &.collapsed {\n        gap: 0;\n        #tables-list {\n            max-width: 0;\n            min-width: 0;\n            overflow: hidden;\n            padding: 0;\n            border-right-color: transparent;\n        }\n    }\n\n    #tables-list {\n        border-right: 1px solid $ff-color--border;\n        padding-right: 10px;\n        transition: ease-in-out .3s, border-right-color ease-out .3s;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#table-credentials {\n    .title {\n        display: flex;\n        gap: 5px;\n        align-items: center;\n        margin-bottom: 10px;\n\n        h3 {\n            margin: 0;\n            padding: 0;\n        }\n    }\n\n    .client-details,\n    .database-details {\n        padding: 10px;\n        background: $ff-white;\n        border: 1px solid $ff-color--border;\n        border-radius: 5px;\n\n        .item {\n            display: flex;\n            margin-bottom: 10px;\n\n            dt {\n                font-weight: 500;\n                max-width: 30%;\n                flex: 1\n            }\n\n            dd {\n                flex: 1;\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#add-database {\n    height: 100%;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.database-form {\n    .database, .credentials {\n        .title {\n            border-bottom: 1px solid $ff-grey-200;\n        }\n    }\n    dl {\n        padding: 10px;\n        max-width: 600px;\n\n        dt, dd {\n            margin: 0;\n        }\n\n        dt {\n            font-weight: 600;\n        }\n        dd {\n            text-indent: 10px;\n            margin-bottom: 10px;\n        }\n    }\n\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-select-team-step {\n    .team-tile {\n        padding: 12px;\n        border: 2px solid $ff-grey-300;\n        width: 100%;\n        border-radius: 6px;\n        cursor: pointer;\n        transition: ease-in-out .3s;\n\n        &:hover {\n            border-color: $ff-indigo-400;\n        }\n\n        &.selected {\n            border-color: $ff-indigo-600;\n        }\n\n        .header {\n            .title {\n\n            }\n\n            .counters {\n                color: $ff-grey-400;\n                font-size: $ff-funit-xs;\n            }\n        }\n\n        .description {\n            color: $ff-grey-400;\n            font-size: $ff-funit-sm;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.education-modal {\n  position: absolute;\n  top: 65px;\n  right: 5px;\n  width: 350px;\n  background: $ff-white;\n  border: 1px solid $ff-grey-300;\n  box-shadow: -6px 6px 10px rgba(0, 0, 0, .2);\n  margin: 0;\n\n  .ff-dialog-content {\n    padding: 10px 10px 5px 10px;\n\n    p {\n      line-height: 1.5;\n    }\n  }\n\n  .ff-dialog-actions {\n    padding: 5px 10px 10px 10px;\n  }\n\n  .title {\n    margin-bottom: 20px;\n    text-align: center;\n    border-bottom: 1px solid $ff-grey-200;\n    padding-bottom: 15px;\n  }\n\n  .options {\n    li {\n      margin-bottom: 5px;\n\n      a {\n        transition: ease-in-out .3s;\n        position: relative;\n        line-height: 2;\n        display: flex;\n        justify-content: space-between;\n        width: 100%;\n        border: 1px solid $ff-grey-200;\n        align-items: center;\n        padding: 5px;\n        color: $ff-black;\n\n        &:hover {\n          text-decoration: none;\n          border: 1px solid $ff-blue-700;\n          color: $ff-blue-700;\n        }\n      }\n    }\n  }\n\n  .actions {\n    display: flex;\n    justify-content: flex-end;\n  }\n\n  .loader-wrapper {\n    position: relative;\n\n    .loader {\n      position: absolute;\n      z-index: 1000;\n      right: 0;\n      bottom: -7px;\n      height: 10px;\n      width: 100%;\n    }\n\n  }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-layout--docs {\n    background-color: white;\n    &-contents {\n        max-width: 1012px;\n        margin: auto;\n        padding: 16px;\n    }\n    h1 {\n        margin: 16px 0;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n/* Hide the ::after divider that the header navigation adds to all children */\n.expert-button-wrapper::after {\n    display: none !important;\n}\n\n/* Dual-background gradient border technique from flowfuse.com */\n.expert-button {\n    background: linear-gradient(white, white) padding-box,\n                linear-gradient(135deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    border: 1px solid transparent;\n    animation: gradient-border-rotate 4s linear infinite;\n\n    &:hover {\n        border: 2px solid transparent;\n        margin: -1px;\n    }\n}\n\n@keyframes gradient-border-rotate {\n    0% {\n        background: linear-gradient(white, white) padding-box,\n                    linear-gradient(0deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    }\n    10% {\n        background: linear-gradient(white, white) padding-box,\n                    linear-gradient(36deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    }\n    20% {\n        background: linear-gradient(white, white) padding-box,\n                    linear-gradient(72deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    }\n    30% {\n        background: linear-gradient(white, white) padding-box,\n                    linear-gradient(108deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    }\n    40% {\n        background: linear-gradient(white, white) padding-box,\n                    linear-gradient(144deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    }\n    50% {\n        background: linear-gradient(white, white) padding-box,\n                    linear-gradient(180deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    }\n    60% {\n        background: linear-gradient(white, white) padding-box,\n                    linear-gradient(216deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    }\n    70% {\n        background: linear-gradient(white, white) padding-box,\n                    linear-gradient(252deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    }\n    80% {\n        background: linear-gradient(white, white) padding-box,\n                    linear-gradient(288deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    }\n    90% {\n        background: linear-gradient(white, white) padding-box,\n                    linear-gradient(324deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    }\n    100% {\n        background: linear-gradient(white, white) padding-box,\n                    linear-gradient(360deg, $ff-red-600, #5048e5, $ff-red-600) border-box;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.notifications-button-wrapper {\n\n  .notifications-button {\n    color: $ff-grey-800;\n    display: flex;\n    align-items: center;\n    flex: 1;\n    justify-content: center;\n    width: 100%;\n    height: 100%;\n    padding: 18px;\n    position: relative;\n\n    > * {\n      pointer-events: none;\n    }\n\n    svg {\n      flex: 1;\n      width: 24px;\n      height: 24px;\n      transition: ease-in-out .1s;\n      object-fit: contain;\n    }\n\n    &:hover {\n      svg {\n        will-change: transform ;\n        color: $ff-indigo-600;\n        transform: scale(1.25) translateZ(0); /* Using slight adjustments to whole values */\n        backface-visibility: hidden;\n        perspective: 1000px;\n        stroke-width: 1.5px;\n        shape-rendering: geometricPrecision;\n        text-rendering: geometricPrecision;\n      }\n    }\n\n    .ff-notification-pill {\n      bottom: 10px;\n      right: 5px;\n      position: absolute;\n      font-size: 0.65rem;\n      padding: 0 7px;\n      background-color: $ff-red-500;\n    }\n  }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n\n.ff-dropdown-option-list {\n  max-height: 200px;\n  overflow-y: auto;\n}\n\n.ff-dropdown-option-list::-webkit-scrollbar {\n  width: 8px;\n  background-color: $ff-grey-600;\n}\n\n.ff-dropdown-option-list::-webkit-scrollbar-thumb {\n  background-color: $ff-grey-300;\n}\n\n.ff-dropdown-option-list::-webkit-scrollbar-thumb:hover {\n  background-color: $ff-grey-400;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n@use \"../stylesheets/components/team-list.scss\" as *;\n\n.ff-team-selection {\n    &.ff-listbox {\n        button {\n            border-radius: 0;\n            border: none;\n            background: none;\n\n            button {\n                padding: 0;\n\n            }\n            .icon {\n                svg {\n                    color: $ff-grey-800;\n                    width: 80%;\n                    padding-left: 10px;\n                }\n            }\n        }\n    }\n}\n.ff-options .ff-team-selection-option {\n    border-color: $ff-color--border;\n    color: $ff-grey-800;\n    border-bottom: 1px solid $ff-color--border;\n    display: flex;\n    align-items: center;\n\n    .ff-option-content {\n        padding: 12px 12px 12px 18px;\n        display: flex;\n        align-items: center;\n        gap: 15px;\n        width: 100%;\n\n        &.selected {\n            background: $ff-grey-200;\n        }\n\n        .ff-icon {\n            width: 1.25rem;\n            height: 1.25rem;\n        }\n    }\n}\n\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.section {\n    margin-bottom: 15px;\n\n    & > .title {\n        position: relative;\n        margin-bottom: 5px;\n        display: flex;\n        align-items: self-end;\n        gap: 5px;\n\n        .icon {\n            color: $ff-indigo-700;\n        }\n\n        .counter {\n            opacity: .6;\n            font-size: 90%;\n        }\n\n        &:after {\n            height: 2px;\n            background: $ff-grey-200;\n            content: '';\n            flex: 1;\n            align-self: center;\n        }\n\n        .text {\n            &:focus {\n                outline: 2px solid $ff-indigo-700;\n                outline-offset: 2px;\n            }\n        }\n    }\n\n    .results {\n        .result-wrapper {\n            transition: ease-in-out .3s;\n            padding: 2px 10px;\n            border-radius: 5px;\n            max-height: 90vh;\n            overflow: auto;\n\n            .result {\n                display: flex;\n                gap: 10px;\n                align-items: center;\n                line-height: 25px;\n\n                .icon {}\n                .title {}\n                .details {\n                    flex: 1;\n                    opacity: .4;\n                    font-size: 90%;\n                }\n                .actions {\n                    display: flex;\n                    gap: 5px;\n                }\n\n                &:focus {\n                    background: $ff-indigo-50;\n                    border: none;\n                    outline: none;\n                }\n            }\n\n            &:hover {\n                background: $ff-indigo-50;\n            }\n\n            &.show-more {\n                text-align: center;\n                margin: 3px 0;\n\n                a {\n                    padding: 5px 0;\n                    width: 100%;\n                    display: block;\n                    opacity: .6;\n\n                    &:focus {\n                        background: $ff-indigo-50;\n                        border: none;\n                        outline: none;\n                    }\n                }\n            }\n        }\n    }\n\n    &:last-of-type {\n        margin-bottom: 0;\n    }\n}\n\n@media screen and (max-width: 480px) {\n    .section {\n        .results {\n            .result-wrapper {\n                .result {\n                    .actions {\n                        display: none;\n                        background: red;\n                    }\n                }\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#global-search {\n    .input-trigger {\n        display: block;\n        height: 34px;\n    }\n    .icon-trigger {\n        display: none;\n        cursor: pointer;\n        padding: 5px;\n        transition: ease-in-out .1s;\n        object-fit: contain;\n    }\n    .ff-icon-sm.search {\n        display: none;\n    }\n\n    &.focused {\n        .input-trigger, .icon-trigger {\n            display: none;\n        }\n\n        .ff-icon-sm.search {\n            display: inline;\n        }\n    }\n\n}\n@media screen and (max-width: 1023px) {\n    #global-search {\n        .input-trigger {\n            display: none;\n        }\n        .icon-trigger {\n            display: inline-block;\n            align-self: flex-end;\n\n            &:hover {\n                will-change: transform ;\n                transform: scale(1.25) translateZ(0); /* Using slight adjustments to whole values */\n                backface-visibility: hidden;\n                perspective: 1000px;\n                stroke-width: 1.5px;\n                shape-rendering: geometricPrecision;\n                text-rendering: geometricPrecision;\n                color: $ff-indigo-500;\n            }\n        }\n    }\n}\n\n//@media screen and (max-width: 639px) {\n//    #global-search {\n//        .content-wrapper {\n//            .search-wrapper {\n//                .input-wrapper {\n//                    flex-direction: row\n//                }\n//            }\n//        }\n//    }\n//}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#global-search {\n    padding: 0;\n    display: flex;\n    flex: 1;\n    justify-content: flex-end;\n    max-width: 100%;\n\n    .content-wrapper {\n        position: relative;\n        justify-content: flex-end;\n        display: flex;\n        flex-direction: column;\n        gap: 10px;\n        width: 100%;\n\n        .search-wrapper {\n            display: flex;\n            gap: 5px;\n            align-items: center;\n            width: 100%;\n\n            .mobile-search {\n                display: none;\n                cursor: pointer;\n                color: $ff-white;\n                min-width: 20px;\n                min-height: 20px;\n            }\n\n            .close-button {\n                display: none;\n            }\n\n            .input-wrapper {\n                flex: 1;\n                display: flex;\n                flex-direction: column;\n                position: relative;\n                width: 100%;\n\n                .ff-icon-sm.close,\n                .ff-icon-sm.search {\n                    color: $ff-grey-400;\n                    position: absolute;\n                    z-index: 1;\n                    top: 8px;\n\n                    &.search {\n                        left: 7px;\n                    }\n\n                    &.close {\n                        right: 7px;\n                    }\n                }\n\n                input {\n                    color: transparent;\n                    padding: 6px 27px;\n                    background: $ff-grey-50;\n                    border-color: $ff-color--border;\n                    width: 100%;\n                    line-height: 20px;\n                    height: 34px;\n                    box-sizing: border-box;\n\n                    &.overlay-input {\n                        display: none;\n                    }\n                }\n            }\n        }\n\n        .results-wrapper {\n            background: $ff-white;\n            min-width: 100%;\n            z-index: 120;\n            padding: 5px 5px 15px 5px;\n\n            .result-badge {\n                padding: 0 5px;\n                width: 50px;\n                max-height: 25px;\n                display: flex;\n                justify-content: center;\n                align-items: center;\n                gap: 5px;\n                border: 1px solid $ff-indigo-700;\n                color: $ff-indigo-700;\n                border-radius: 5px;\n                background: $ff-white;\n            }\n        }\n    }\n\n    &.focused {\n        .content-wrapper {\n            position: fixed;\n            width: 60vw;\n            background: white;\n            top: 15px;\n            left: 20vw;\n            z-index: 120;\n            border: none;\n            border-radius: 5px;\n\n            .search-wrapper {\n                .input-wrapper {\n                    .ff-icon-sm.search,\n                    .ff-icon-sm.close {\n                        color: $ff-grey-500;\n                    }\n\n                    input {\n                        color: $ff-grey-500;\n                        flex: 1;\n                        background: white;\n                        display: none;\n                        width: 100%;\n\n                        &.overlay-input {\n                            display: block;\n                            transition: ease-in-out .3s;\n                            height: 34px;\n                            line-height: 20px;\n                            padding: 6px 27px;\n                            box-sizing: border-box;\n\n                            &.has-results {\n                                border-bottom-left-radius: 0;\n                                border-bottom-right-radius: 0;\n                            }\n                        }\n                    }\n                }\n            }\n\n            .results-wrapper {\n                overflow: auto;\n                max-height: 90vh;\n\n                .ff-icon-sm {\n                    min-width: 16px;\n                }\n            }\n        }\n\n        .overlay {\n            position: absolute;\n            width: 100vw;\n            height: 100vh;\n            background: rgba(0, 0, 0, .3);\n            left: 0;\n            top: 0;\n            z-index: 110;\n        }\n    }\n\n}\n\n@media screen and (max-width: 1023px) {\n    #global-search {\n        padding: 0px;\n        input.qwe {\n            background: red !important;\n        }\n        &.focused {\n            .content-wrapper {\n                width: 100%;\n                top: 0;\n                left: 0;\n                border-top-left-radius: 0;\n                border-top-right-radius: 0;\n\n                .search-wrapper {\n                    margin: 5px;\n                    padding-right: 10px;\n                    .close-button {\n                        display: block;\n                    }\n\n                }\n            }\n        }\n    }\n}\n@media screen and (max-width: 639px) {\n    #global-search {\n        .content-wrapper {\n            padding: 5px 0;\n\n            .search-wrapper {\n                .mobile-search {\n                    display: block;\n                }\n\n                .close,\n                .search,\n                input {\n                    display: none;\n                }\n\n                input {\n                    &.has-results {\n                        border-bottom-left-radius: 5px !important;\n                        border-bottom-right-radius: 5px !important;\n                    }\n                }\n\n            }\n        }\n\n        &.focused {\n            .content-wrapper {\n                padding: 10px;\n                .mobile-search {\n                    display: none;\n                }\n\n                .search-wrapper {\n                    .close,\n                    .search,\n                    input {\n                        display: block;\n                    }\n                }\n            }\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-layout--immersive {\n    height: 100vh;\n    display: flex;\n    flex-direction: column;\n\n    &--wrapper {\n        display: flex;\n        flex-direction: row;\n        flex: 1;\n        height: calc(100vh - 60px);\n        margin-top: 60px;\n    }\n\n    &--fullscreen &--wrapper {\n        height: 100vh;\n        margin-top: 0;\n    }\n\n    @media screen and (max-width: 1023px) {\n        .ff-header {\n            padding-left: 16px;\n        }\n    }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n\n.ff-notification-interview {\n  max-width: 450px;\n  background-color: $ff-white;\n  box-shadow: -6px 6px 6px #00000040;\n  border-radius: 0 6px 6px 0;\n  padding: 12px 9px 12px 18px;\n  border: 1px solid $ff-blue-700;\n  border-left: 8px solid $ff-blue-700;\n\n  h3 {\n    font-size: 1.1rem;\n    margin-bottom: 12px;\n  }\n\n  p {\n    font-size: 1.1rem;\n  }\n\n  &--actions {\n    margin-top: 24px;\n    gap: 12px;\n    display: flex;\n    flex-direction: row-reverse;\n    justify-content: space-between;\n    font-size: 1rem;\n\n    .ff-btn.ff-btn--primary {\n      background-color: $ff-blue-700;\n      border-color: $ff-blue-700;\n\n      &:hover {\n        background-color: $ff-blue-800;\n      }\n    }\n  }\n}\n\n$ff-notifications-drawer-side-padding: 6px;\n\n.ff-notifications-drawer {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  padding: 0 !important;\n\n  > .header {\n    width: 100%;\n    padding: 1rem 1.5rem;\n    border-bottom: 1px solid $ff-grey-200;\n    background: white;\n    flex-shrink: 0;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    box-sizing: border-box;\n\n    .title {\n      font-size: 1rem;\n      font-weight: 600;\n      color: #374151;\n      margin: 0;\n      line-height: 1.5rem;\n      flex: 1;\n    }\n\n    .header-actions {\n      display: flex;\n      align-items: center;\n      gap: 0.75rem;\n\n      .ff-checkbox {\n        margin: 0;\n      }\n\n      .header-button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        width: 30px;\n        height: 30px;\n        padding: 0;\n        background: none;\n        border: none;\n        border-radius: 5px;\n        cursor: pointer;\n        color: inherit;\n        font: inherit;\n        transition: background-color 0.15s ease;\n\n        &:hover {\n          cursor: pointer;\n          background: $ff-grey-100;\n        }\n      }\n    }\n  }\n\n  > .controls {\n    width: 100%;\n    border-bottom: 1px solid $ff-grey-300;\n    background: white;\n    display: flex;\n    flex-direction: column;\n    box-sizing: border-box;\n\n    .actions {\n      display: flex;\n      gap: 5px;\n      padding: 10px 12px;\n\n      .forge-badge {\n        background-color: $ff-grey-100;\n        border-radius: 5px;\n\n        &:hover {\n          cursor: pointer;\n          background-color: $ff-grey-300\n        }\n\n        &.disabled {\n          color: $ff-grey-400;\n\n          &:hover {\n            cursor: not-allowed;\n          }\n        }\n      }\n    }\n  }\n\n  .messages-wrapper {\n    flex: 1;\n    width: 100%;\n    background-color: $ff-grey-100;\n    overflow: auto;\n    $read: $ff-grey-400;\n    $info: blue;\n    $warning: $ff-yellow-600;\n    $error: $ff-red-500;\n\n    .message-wrapper {\n      display: flex;\n      flex-direction: row;\n      color: $ff-grey-400;\n      background-color: $ff-white;\n      border-bottom: 1px solid $ff-grey-300;\n      border-left: 3px solid rgba(0, 0, 0, 0);\n      transition: ease-in-out .3s;\n      cursor: pointer;\n\n      .counter {\n        margin-top: 0.2rem;\n\n        .ff-notification-pill {\n          background-color: $read;\n          color: white;\n          padding: 2px 7px;\n          border-radius: 6px;\n          font-size: 0.65rem;\n        }\n      }\n\n      .action {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        width: 40px;\n        cursor: default;\n\n        .ff-checkbox {\n          height: 13px;\n          width: 13px;\n          padding: 0;\n\n          span {\n            margin: 0;\n            padding: 0;\n          }\n        }\n      }\n\n      &:hover .title {\n        color: $ff-blue-500;\n      }\n\n      &.unread {\n        border-left: 3px solid $info;\n        border-left-color: $ff-blue-500;\n        color: $ff-grey-800;\n\n        &.warning {\n          border-left: 3px solid $warning;\n\n          .counter .ff-notification-pill {\n            background-color: $warning;\n          }\n        }\n\n        &.error {\n          border-left: 3px solid $error;\n\n          .counter .ff-notification-pill {\n            background-color: $error;\n          }\n        }\n\n        .counter .ff-notification-pill {\n          background-color: $info;\n        }\n      }\n\n      .body {\n        flex: 1;\n        display: flex;\n        flex-direction: column;\n        padding: 9px $ff-notifications-drawer-side-padding*2 9px $ff-notifications-drawer-side-padding;\n\n        .header {\n          gap: 5px;\n          display: flex;\n          justify-content: space-between;\n          align-items: center;\n\n          .ff-icon {\n            height: 20px;\n            min-width: 20px;\n            min-height: 20px;\n            max-width: fit-content;\n            max-height: fit-content;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n          }\n\n          .title {\n            flex: 1;\n            transition: ease-in-out .3s;\n            margin: 0;\n          }\n\n          input {\n            &:hover {\n              cursor: pointer;\n            }\n          }\n        }\n\n        .text {\n          display: flex;\n          margin: 10px 0;\n          align-items: center;\n          line-height: 1.5rem;\n        }\n\n        .footer {\n          display: flex;\n          text-align: right;\n          color: $ff-grey-400;\n          font-size: 80%;\n          padding: 0 $ff-notifications-drawer-side-padding;\n          justify-content: flex-end;\n        }\n      }\n\n      &:hover {\n        background-color: $ff-grey-100;\n      }\n    }\n  }\n\n  .empty {\n    flex: 1;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    color: $ff-grey-400;\n    width: 100%;\n    background-color: $ff-grey-100;\n  }\n\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.fade-enter-active,\n.fade-leave-active {\n    transition: opacity .1s ease-in;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n#right-drawer {\n    position: fixed;\n    border-left: 1px solid $ff-grey-300;\n    background: $ff-grey-50;\n    height: calc(100% - 60px);\n    top: 60px;\n    right: -1000px;\n    z-index: 110;\n    width: 100%;\n    max-width: 0;\n    min-width: 0;\n    transition: right .3s ease-in-out, width .3s ease-in-out, max-width .3s ease-in-out, min-width .3s ease-in-out, box-shadow .3s ease-in-out, border-color .3s ease-in-out;\n    box-shadow: -5px 4px 8px -4px rgba(0, 0, 0, 0.1);\n    display: flex;\n    flex-direction: column;\n    overflow: hidden; // Changed from auto to hidden - let child components handle their own scrolling\n\n    // Hide border when closed to prevent visible grey line\n    &:not(.open) {\n        border-left-color: transparent;\n    }\n\n    // Hide border on small viewports where drawer is full-width\n    @media (max-width: 479px) {\n        border-left: none;\n    }\n\n    .resize-bar {\n        position: absolute;\n        left: -4px; // Center on border (50% of 8px width)\n        top: 0;\n        bottom: 0;\n        width: 8px;\n        cursor: ew-resize;\n        background: transparent;\n        z-index: 1001;\n\n        // Hide resize bar on small viewports where drawer is full-width\n        @media (max-width: 479px) {\n            display: none;\n        }\n    }\n\n    .header {\n        background: white;\n        flex-shrink: 0;\n    }\n\n    &.open {\n        right: 0;\n        width: 100%;\n\n        // On small viewports: use 100% width (no minimum)\n        max-width: 100vw;\n        min-width: 0;\n\n        // On viewports 480-767px: use 480px minimum but no max-width constraint\n        // (pinning is disabled, so let JS control the width)\n        @media (min-width: 480px) and (max-width: 767px) {\n            min-width: 480px;\n            max-width: none;\n        }\n\n        // On viewports >= 768px: apply max-width constraints (pinning is enabled)\n        @media (min-width: 768px) {\n            max-width: 90vw;\n            min-width: 480px;\n\n            &.wider {\n                max-width: 90vw;\n            }\n        }\n    }\n\n    &.fixed {\n        position: relative; // Changed from initial to relative for resize bar positioning\n        height: 100%;\n        top: 0; // Reset top offset to prevent gap at top\n        box-shadow: none; // Remove shadow when pinned\n        flex-shrink: 0; // Prevent flex from shrinking the drawer below its set width\n        min-width: unset; // Remove responsive min-width constraint\n        max-width: none; // Remove responsive max-width constraint\n\n        // Hide drawer when pinned but closed to prevent grey block\n        &:not(.open) {\n            width: 0 !important;\n            min-width: 0 !important;\n            max-width: 0 !important;\n            overflow: hidden;\n            opacity: 0;\n            pointer-events: none;\n        }\n    }\n\n    &.resizing {\n        transition: none; // Disable transition while actively resizing for smooth dragging\n        max-width: none !important; // Remove max-width constraint to allow free resizing\n        min-width: unset !important; // Remove min-width constraint to allow free resizing\n    }\n\n    &.manually-resized {\n        max-width: none !important; // Keep custom width after manual resize\n        min-width: unset !important; // Keep custom width after manual resize\n    }\n\n    &.pinning {\n        transition: none !important; // Disable all transitions while pinning to prevent visual jump\n    }\n\n    &.opening {\n        // Only animate position during open, not width changes\n        transition: right .3s ease-in-out, box-shadow .3s ease-in-out, border-color .3s ease-in-out !important;\n    }\n\n    &.closing {\n        // Only animate position during close, not width changes\n        transition: right .3s ease-in-out, box-shadow .3s ease-in-out, border-color .3s ease-in-out !important;\n\n        // Maintain current width/max-width/min-width during slide-out to prevent shrinking animation\n        // These will be overridden by inline styles from drawerStyle\n        max-width: none !important;\n        min-width: unset !important;\n    }\n}\n",".ff-layout--box.ff-login {\n    flex-direction: column;\n    min-height: 660px;\n    overflow: auto;\n\n    .ff-layout--box--wrapper {\n        max-width: 1048px;\n        min-height: 660px;\n        min-width: 400px;\n\n        .ff-layout--box--right {\n            padding: 0;\n            display: flex;\n            justify-content: center;\n            align-items: center;\n\n        }\n        .ff-layout--box--content {\n            max-width: 380px;\n        }\n    }\n}\n","@use '../ui-components/stylesheets/ff-colors.scss' as *;\n@use '../ui-components/stylesheets/ff-utility.scss' as *;\n\n@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n$sidenav_width: 250px;\n$transition_time: .15s;\n\n/*\n    Layout - Box\n        used in login/setup/signup screens\n*/\n\n$nav_height: 60px;\n\n.ff-layout--box {\n    font-family: 'Heebo', system-ui, sans-serif;\n    background-color: $ff-white;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 100%;\n    min-height: inherit;\n    background-image: url(\"./images/ff-bg-flow.jpg\");\n    background-size: cover;\n    background-repeat: no-repeat;\n    background-position-y: 0%;\n    color: $ff-grey-700;\n    .ff-error-inline {\n        font-size: 0.875rem;;\n        display: block;\n        margin-top: 0.25rem;\n        color: $ff-red-200;\n    }\n\n    &.ff--center-box {\n        flex-direction: column;\n        min-height: fit-content;\n        overflow: auto;\n\n        .ff-layout--box--wrapper {\n            display: flex;\n            width: 100%;\n            max-height: fit-content;\n            height: fit-content;\n\n            .ff-layout--box--left,\n            .ff-layout--box--right {\n                width: 100%;\n            }\n        }\n    }\n}\n\n.ff-layout--box--wrapper {\n    width: calc(100% - 48px);\n    height: 60%;\n    display: grid;\n}\n.ff-layout--box--left {\n    .ff-logo {\n        max-width: 150px;\n        margin-bottom: 16px;\n    }\n}\n.ff-layout--box--right {\n    .ff-logo {\n        max-width: 200px;\n        margin: auto;\n        margin-bottom: 48px;\n    }\n}\n\n.ff-layout--box--left,\n.ff-layout--box--right {\n    height: 100%;\n    justify-content: center;\n    align-items: center;\n}\n\n.ff-layout--box--left {\n    h1 {\n        max-width: 420px;\n    }\n    h3 {\n        font-size: 1.25rem;\n    }\n    p {\n        font-weight: 300;\n        line-height: 1.5rem;\n    }\n}\n\n.ff-layout--box--content {\n    width: 100%;\n}\n\n.ff-layout--box--right .ff-layout--box--content {\n    min-height: 400px;\n    padding: 64px 24px;\n    @apply rounded-xl;\n    color: $ff-grey-700;\n    h2 {\n        margin-top: -12px;\n        margin-bottom: 24px;\n    }\n    h5 {\n        font-weight: bold;\n        margin-bottom: 0.75rem;\n    }\n    label {\n        display: block;\n        color: $ff-grey-700;\n        margin-bottom: 4px;\n    }\n    .ff-radio-btn label {\n        font-weight: normal;\n    }\n    p {\n        margin-bottom: 1rem;\n    }\n    a {\n        color: $ff-blue-600;\n    }\n    .ff-input:not(.ff-input--error) {\n        border-color: $ff-grey-300;\n    }\n    .ff-input {\n        border-width: 2px;\n        &:focus-within {\n            border-color: $ff-indigo-600;\n        }\n    }\n    .ff-radio-btn {\n        .checkbox {\n          border: 1px solid $ff-grey-400;\n        }\n    }\n\n    .ff-error-inline {\n        margin-bottom: 12px;\n    }\n\n    .ff-actions {\n        margin-top: 18px;\n    }\n    .ff-btn {\n        text-transform: uppercase;\n        width: 100%;\n        margin-bottom: 6px;\n    }\n    .ff-btn.ff-btn--primary {\n        background-color: $ff-indigo-600;\n        color: white;\n        &:hover {\n            background-color: $ff-indigo-700;\n        }\n        &:disabled {\n            background-color: $ff-grey-300;\n            color: $ff-grey-400;\n        }\n    }\n    .ff-btn.ff-btn--tertiary {\n        color: $ff-indigo-500;\n        font-weight: normal;\n        border: 1px solid transparent;\n        &:hover {\n            background-color: transparent;\n            border-color: $ff-indigo-600;\n        }\n    }\n}\n\n/*\n    Layout - Platform / Plain\n        used in all other pages\n*/\n\n.ff-layout--platform,\n.ff-layout--plain {\n    min-height: inherit;\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n}\n\n.ff-layout--platform--wrapper{\n    padding-top: $nav_height;\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    overflow: hidden;\n    display: flex;\n    flex-direction: row;\n\n    .ff-view {\n        display: flex;\n        flex-direction: column;\n        position: relative;\n        overflow-y: auto;\n        overflow-x: hidden;\n        width: 100%;\n        height: 100%;\n        transition: ease-in-out margin-left .3s;\n    }\n    main {\n        background-color: $ff-grey-50;\n    }\n    .ff-page-header {\n        background-color: $ff-white;\n        border-color: $ff-color--border;\n    }\n}\n\n.ff-layout--plain--wrapper {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n\n    main {\n        background-color: $ff-grey-50;\n        flex: 1;\n    }\n}\n\n.ff-notifications {\n    position: absolute;\n    right: 12px;\n    top: $nav_height + 12px;\n    z-index: 130;\n    min-width: 350px;\n}\n\n.ff-notification-toast {\n    min-height: $nav_height;\n    margin-bottom: $ff-unit-md;\n}\n\n.notifications-list-move,\n.notifications-list-enter-active,\n.notifications-list-leave-active {\n    transition: all 0.3s ease;\n}\n\n.notifications-list-enter-from,\n.notifications-list-leave-to {\n    opacity: 0;\n    transform: translateX(200px);\n}\n\n.notifications-list-leave-active {\n    position: absolute;\n}\n\n.ff-team-selection {\n    position: relative;\n    display: flex;\n    justify-content: space-between;\n    min-width: $sidenav_width;\n    .ff-dropdown-options {\n        position: absolute;\n        min-width: $sidenav_width;\n        display: block;\n        z-index: 10;\n        border-bottom: 0;\n        max-height: initial;\n        &.active {\n            display: block;\n        }\n        .ff-dropdown-option {\n            padding: 0;\n            border-bottom: none;\n        }\n    }\n}\n.ff-team-selection-name {\n    margin-left: 10px;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    label {\n        font-size: 0.7rem;\n        line-height: 0.7rem;\n        color: $ff-grey-500;\n        margin-left: 0;\n    }\n    h5 {\n        color: $ff-grey-800;\n        white-space: nowrap;\n    }\n}\n.ff-team-selection > div {\n    flex-grow: 1;\n    display: flex;\n    align-items: center;\n    cursor: pointer;\n}\n.ff-banner {\n    background-color: $ff-grey-800;\n    color: $ff-grey-300;\n    padding: 8px;\n    text-align: center;\n    border-bottom: 2px solid $ff-red-500;\n\n    &.ff-banner-info {\n        background-color: $ff-blue-100;\n        color: $ff-grey-700;\n        text-align: left;\n        border-bottom: none;\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        padding-left: 16px;\n        padding-right: 16px;\n    }\n\n    &.ff-banner-warning {\n        background-color: $ff-red-700;\n        color: $ff-grey-50;\n        text-align: left;\n        border-bottom: 2px solid $ff-red-800;\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        padding-left: 16px;\n        padding-right: 16px;\n    }\n}\n.ff-header {\n    z-index: 120;\n    background-color: $ff-white;\n    height: $nav_height;\n    border-bottom: 1px solid $ff-color--border;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    position: fixed;\n    width: 100%;\n    .ff-logo-wrapper {\n        display: flex;\n        align-items: center;\n        min-width: min-content;\n    }\n    img.ff-logo {\n        padding-top: 18px;\n        padding-bottom: 18px;\n        height: $nav_height;\n        width: auto;\n        &:hover {\n            cursor: pointer;\n        }\n    }\n    .ff-header--mobile-toggle {\n        padding: 16px;\n        svg {\n            fill: $ff-grey-800;\n            min-width: 24px;\n        }\n        &.active {\n            cursor: pointer;\n            background-color: $ff-grey-700;\n        }\n    }\n    .ff-header--mobile-usertoggle {\n        padding: 16px;\n        display: flex;\n        align-items: center;\n        img {\n            padding: 0;\n            min-width: 24px;\n        }\n        &.active {\n            cursor: pointer;\n            background-color: $ff-grey-100;\n        }\n    }\n    .ff-navigation {\n        position: absolute;\n        display: flex;\n        flex-direction: column;\n        top: 100%;\n        //margin-top: 2px;\n        img {\n            padding: 0;\n            margin-right: 9px;\n        }\n        .ff-user {\n            display: flex;\n            align-items: center;\n            margin-left: -2px;\n            position: relative;\n            transition: ease-in-out .1s;\n            object-fit: contain;\n            will-change: transform;\n            .ff-notification-pill {\n                font-size: 0.65rem;\n                padding: 0px 6px;\n                background-color: $ff-red-600;\n                border: 1px solid $ff-grey-800;\n                position: absolute;\n                bottom: -9px;\n                line-height: 0.85rem;\n                right: 0;\n            }\n            &:hover {\n                transform: scale(1.25) translateZ(0); /* Using slight adjustments to whole values */\n                backface-visibility: hidden;\n                perspective: 1000px;\n                stroke-width: 1.5px;\n                shape-rendering: geometricPrecision;\n                text-rendering: geometricPrecision;\n            }\n        }\n    }\n    .ff-border-left {\n        border-width: 0 0 0 1px;\n        border-color: $ff-grey-500;\n    }\n    .ff-navigation-right {\n        height: 100%;\n        ul {\n            background: $ff-white;\n            border: 1px solid $ff-color--border;\n\n            .ff-nav-item {\n                transition: ease-in-out .3s;\n                &:hover {\n                    background: $ff-grey-100;\n                    label, svg {\n                        color: $ff-indigo-700;\n                        fill: $ff-indigo-700;\n                    }\n                }\n            }\n        }\n    }\n    .ff-desktop-navigation-right {\n        & > * {\n            position: relative;\n            &:after {\n                position: absolute;\n                content: '';\n                width: 1px;\n                height: 15px;\n                background: $ff-color--border;\n                top: 40%;\n            }\n        }\n    }\n    .ff-mobile-navigation-right {\n        img,\n        button {\n            cursor: pointer;\n        }\n    }\n\n@media screen and (max-width: 1023px) {\n    .ff-mobile-navigation-right {\n        .ff-header--mobile-teamtoggle {\n            display: flex;\n            align-items: center;\n            .ff-avatar {\n                border: 2px solid #1f2937;\n                transition: ease-in-out .1s;\n            }\n            &:hover {\n                .ff-avatar {\n                    will-change: transform;\n                    transform: scale(1.25) translateZ(0);\n                    backface-visibility: hidden;\n                    perspective: 1000px;\n                    border-color: $ff-indigo-600;\n                }\n            }\n        }\n    }\n}\n    .ff-dropdown {\n        color: white;\n        min-width: $sidenav_width;\n        position: relative;\n        top: 0;\n        margin-top: 0;\n        .ff-dropdown-selected {\n            background: none;\n            padding: 16px 16px 16px 24px;\n            display: flex;\n            flex: 1;\n            justify-content: space-between;\n            align-items: center;\n            border: none;\n            border-radius: 0;\n        }\n        .ff-dropdown-options {\n            width: 100%;\n            border-color: $ff-color--border;\n            border-right: 0;\n\n            .ff-dropdown-option {\n                &:hover {\n                    label, svg {\n                        color: $ff-indigo-700;\n                        fill: $ff-indigo-700;\n                    }\n                }\n            }\n        }\n    }\n    .ff-user-options {\n        width: auto;\n        min-width: $nav_height;\n\n        &.ff-navigation {\n            left: auto;\n        }\n        .ff-dropdown-options {\n            width: $sidenav_width;\n        }\n    }\n}\n\n.ff-user-options {\n    .ff-dropdown-options {\n        max-height: initial;\n        .ff-dropdown-option {\n            border-bottom: none;\n\n            &.danger {\n                label, svg {\n                    color: $ff-red-700;\n                    fill: $ff-red-700;\n                }\n            }\n        }\n    }\n}\n\n\n.ff-navigation,\n.ff-team-selection ul {\n    .ff-nav-item {\n        &:hover {\n            cursor: pointer;\n        }\n    }\n}\n\n.ff-navigation .ff-nav-item {\n    border-bottom: 1px solid $ff-grey-600;\n    padding: 16px 16px 16px 24px;\n    display: grid;\n    grid-template-columns: 20px 1fr;\n    svg {\n        fill: $ff-grey-500;\n        width: 20px;\n    }\n    svg.hollow {\n        fill: none;\n        stroke: $ff-white;\n    }\n    label {\n        margin-left: 12px;\n        color: $ff-grey-800;\n        white-space: nowrap;\n        pointer-events: none;\n    }\n}\n\n.ff-team-selection ul .ff-nav-item {\n    border-bottom: 1px solid $ff-grey-600;\n    padding: 16px 16px 16px 22px;\n    display: grid;\n    align-items: center;\n    grid-template-columns: 24px 1fr;\n    height: $nav_height;\n    svg {\n        fill: $ff-white;\n        width: 20px;\n    }\n    label {\n        margin-left: 12px;\n        color: $ff-white;\n        white-space: nowrap;\n        pointer-events: none;\n    }\n}\n\n.ff-navigation {\n    position: fixed;\n    left: -$sidenav_width;\n    z-index: 10;\n    transition: 0.3s left, 0.3s right;\n    -webkit-transition: 0.3s left, 0.3s right;\n    width: $sidenav_width;\n    // handle router-link active styling for primary options\n    .ff-side-navigation--primary {\n        width: 100%;\n        transition: $transition_time width;\n        -webkit-transition: $transition_time width;\n        .router-link-active {\n            li {\n                label {\n                    color: $ff-teal-300;\n                }\n                svg {\n                    fill: $ff-teal-300;\n                    &.hollow {\n                        fill: none;\n                        stroke: $ff-teal-300;\n                    }\n                }\n            }\n        }\n    }\n    // nested menu options, including router-link highlighting\n    .ff-side-navigation--nested {\n        width: 0;\n        overflow: hidden;\n        .ff-nested-title {\n            color: $ff-teal-300;\n            font-weight: bold;\n            font-size: 1.1rem;\n            padding: 12px 16px;\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n        }\n        .ff-nav-item {\n            padding: 12px 16px;\n        }\n        .router-link-active {\n            li {\n                background-color: $ff-grey-600;\n            }\n            label {\n                color: $ff-teal-300;\n            }\n            svg {\n                fill: $ff-teal-300;\n                &.hollow {\n                    fill: none;\n                    stroke: $ff-teal-300;\n                }\n            }\n        }\n    }\n    // navigation-right = the admin/user settings\n    &.ff-navigation-right {\n        left: initial;\n        right: -$sidenav_width;\n        .ff-nav-item {\n            &.danger {\n                label, svg {\n                    color: $ff-red-700;\n                    fill: $ff-red-700;\n                }\n            }\n            &.create {\n                background: $ff-grey-100;\n                border-bottom: none;\n            }\n        }\n\n        &.without-divider {\n            .ff-nav-item:last-child {\n                border-top: unset;\n            }\n        }\n    }\n    &.open {\n        left: 0;\n    }\n    &.closed {\n        left: -$sidenav_width;\n    }\n    &.ff-navigation-right.open {\n        left: initial;\n        right: 0;\n    }\n    .ff-navigation-divider {\n        background-color: $ff-grey-900;\n        color: white;\n        padding: 6px 12px;\n        height: 32px;\n        display: block;\n        font-size: 0.85rem;\n        border-bottom: 1px solid $ff-grey-600;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n        overflow: hidden;\n    }\n    .ff-dropdown-options .ff-dropdown-option {\n        padding: 0;\n    }\n    .ff-nav-item {\n        display: flex;\n        justify-content: space-between;\n        border-bottom: 1px solid $ff-color--border;\n    }\n    .disabled {\n        pointer-events: none;\n        opacity: 0.5;\n    }\n    .ff-notification-pill {\n        padding: 2px 12px;\n        background-color: $ff-red-600;\n        border: 1px solid $ff-red-700;\n    }\n    .ff-side-navigation--options-back {\n        li {\n            border-top: 1px solid $ff-grey-600;\n        }\n    }\n}\n\n/* MOBILE LAYOUT */\n@media screen and (min-width: $ff-screen-lg) {\n    /* Box */\n    .ff-layout--box--wrapper {\n        width: 85%;\n    }\n    .ff-navigation {\n        left: 0;\n        position: relative;\n    }\n    .ff-header {\n        .ff-header--mobile-toggle {\n            display: none;\n        }\n        .ff-header--mobile-usertoggle,\n        .ff-header--mobile-teamtoggle,\n        .ff-header--mobile-notificationstoggle,\n        .ff-header--mobile-experttoggle {\n            display: none;\n        }\n        .ff-logo-wrapper {\n            width: 250px;\n        }\n        img.ff-logo {\n            padding: 18px;\n        }\n    }\n}\n\n#ff-app {\n    #left-drawer {\n        min-width: $sidenav_width;\n        position: relative;\n        transition: ease-in-out left .3s;\n        height: 100%;\n        z-index: 100;\n        left: 0;\n        background: $ff-color--context-menu;\n        border-right: 1px solid $ff-color--border;\n        overflow: auto;\n\n        .ff-main-navigation {\n            .ff-menu-groups {\n                padding-top: 10px;\n\n                .ff-menu-group {\n                    padding: 5px;\n\n                    .ff-group-title {\n                        margin: 10px 0 15px;\n                        padding: 0 10px;\n                        text-transform: uppercase;\n                        color: $ff-color--disabled;\n                        font-size: 11px;\n                    }\n\n                    .ff-menu-entries {\n\n                        .ff-menu-entry {\n                            margin: 0 10px 5px 10px;\n\n                            &:last-of-type {\n                                margin-bottom: 0;\n                            }\n\n                            .ff-nav-item {\n                                padding: 5px 10px;\n                                border-radius: 5px;\n                                .ff-tooltip-container {\n                                    max-height: 20px;\n                                }\n\n                                & > div {\n                                    gap: 5px;\n                                }\n\n                                &:hover {\n                                    background: $ff-color--highlight--light;\n                                }\n                            }\n\n                            .router-link-active {\n                                .ff-nav-item {\n                                    background: $ff-color--action;\n                                    color: white;\n                                }\n                            }\n\n                            .disabled {\n                                .ff-nav-item {\n                                    color: $ff-color--disabled;\n                                    cursor: not-allowed;\n                                }\n                            }\n                        }\n                    }\n                }\n            }\n        }\n    }\n\n    &.hidden-left-drawer {\n        #left-drawer {\n            left: -$sidenav_width;\n\n            &.active {\n                left: -$sidenav_width;\n            }\n        }\n        .ff-view {\n            margin-left:  -$sidenav_width;\n        }\n    }\n}\n\n\n/* CSS Media Query for Mobile */\n@media screen and (max-width: 1023px) {\n    #ff-app {\n        #left-drawer {\n            left: -$sidenav_width;\n            transition: ease-in-out .3s;\n            will-change: box-shadow;\n\n            &.active {\n                box-shadow: 6px 0 12px rgba(0, 0, 0, 0.2);\n                left: 0;\n            }\n        }\n\n        .ff-view {\n            margin-left:  -$sidenav_width;\n        }\n    }\n}\n",".fade-enter-active,\n.fade-leave-active {\n  transition: opacity 0.3s ease;\n}\n\n.fade-enter-from,\n.fade-leave-to {\n  opacity: 0;\n}\n\n\n.mobile-menu-fade-enter-active,\n.mobile-menu-fade-leave-active {\n  transition: opacity 0.1s ease-in;\n}\n\n.mobile-menu-fade-enter-from,\n.mobile-menu-fade-leave-to {\n  opacity: 0;\n}\n\n\n.primary-fade-enter-active,\n.primary-fade-leave-active {\n  transition: opacity 0.1s ease-in;\n}\n.primary-fade-enter-from,\n.primary-fade-leave-to {\n  opacity: 0;\n}\n\n.page-fade-enter-active, .page-fade-leave-active {\n  transition: opacity .2s ease-in-out;\n}\n\n.page-fade-enter, .page-fade-leave-to {\n  opacity: 0;\n}\n",".jiggle {\n  animation: jiggle 0.3s infinite;\n}\n@keyframes jiggle {\n  0%, 100% {\n    transform: rotate(0deg);\n  }\n  25% {\n    transform: rotate(3deg);\n  }\n  50% {\n    transform: rotate(-3deg);\n  }\n  75% {\n    transform: rotate(3deg);\n  }\n}\n\n.pulse-scale {\n  animation: pulse-scale 1.5s infinite ease-in-out;\n}\n\n@keyframes pulse-scale {\n  0% {\n    transform: scale(1);\n  }\n  50% {\n    transform: scale(1.5);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n.pulse {\n  animation: pulse-animation 2s infinite;\n}\n@keyframes pulse-animation {\n  0% {\n    box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);\n  }\n  100% {\n    box-shadow: 0 0 0 20px rgba(0, 0, 0, 0);\n  }\n}\n","@use \"../../ui-components/stylesheets/ff-colors.scss\" as *;\n\n.ff-chart {\n    padding: 8px 18px;\n    border: 1px solid $ff-grey-300;\n    border-radius: 6px;\n    background-color: white;\n    h3 {\n        margin: 0;\n    }\n}\n\n.ff-chart-device-status {\n    display: flex;\n    gap: 4px;\n    label {\n        display: block;\n    }\n    .ff-chart-bar {\n        text-align: right;\n        border-right: 1px solid;\n        border-color: var(--bar-border);\n        color: var(--text-color);\n        transition: 0.3s opacity;\n        >div, >label {\n            padding: 3px 6px;\n            font-size: 0.875rem;\n            font-weight: 600;\n        }\n        > div {\n            border-width: 1px 0px 1px 1px;\n            border-style: solid;\n            background-color: var(--bar-bg);\n            border-color: var(--bar-border);\n            transition: 0.3s background-color, 0.3s color, 0.3s opacity;\n        }\n        &:hover {\n            >div {\n                background-color: var(--bar-border);\n            }\n        }\n        label {\n            text-transform: capitalize;\n        }\n        &:hover {\n            cursor: pointer;\n        }\n        &--error {\n            --bar-bg: #{$ff-red-200};\n            --bar-border: #{$ff-red-300};\n            --text-color: #{$ff-red-600};\n        }\n        &--never,\n        &--stopped {\n            --bar-bg: #{$ff-grey-200};\n            --bar-border: #{$ff-grey-300};\n            --text-color: #{$ff-grey-600};\n        }\n        &--offline {\n            --bar-bg: #{$ff-grey-50};\n            --bar-border: #{$ff-grey-300};\n            --text-color: #{$ff-grey-600};\n        }\n        &--safe {\n            --bar-bg: #{$ff-yellow-200};\n            --bar-border: #{$ff-yellow-300};\n            --text-color: #{$ff-yellow-600};\n        }\n        &--running {\n            --bar-bg: #{$ff-green-200};\n            --bar-border: #{$ff-green-300};\n            --text-color: #{$ff-green-600};\n        }\n        &.ghost {\n            opacity: 0.15;\n        }\n    }\n}\n","@use '../ui-components/stylesheets/ff-colors.scss' as *;\n\n@use \"./layouts.scss\" as *;\n@use \"./transitions.scss\" as *;\n@use \"./animations.scss\" as *;\n@use \"./components/charts.scss\" as *;\n\n/* Define Font Family */\n/* latin */\n@font-face {\n    font-family: 'Heebo';\n    font-style: normal;\n    font-weight: 400;\n    src: url('./assets/fonts/Heebo-Regular.ttf') format('ttf');\n    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;\n}\n\n/* Define Global Styles */\n\nhtml, body, #app {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n}\n\nh1, h2, h3 {\n    font-weight: 500;\n}\n\n#ff-app {\n    flex: 1;\n    background-color: $ff-grey-300;\n}\n\n.ff-link {\n    color: $ff-blue-700;\n    &:hover {\n        cursor: pointer;\n        color: $ff-blue-900;\n        text-decoration: underline;\n    }\n}\n\n.ff-avatar {\n    width: 24px;\n    height: 24px;\n    border-radius: 4px;\n}\n.ff-avatar-large {\n    width: 48px;\n    height: 48px;\n    border-radius: 8px;\n}\n.ff-bg-dark {\n    background-color: $ff-grey-800;\n    .ff-btn.ff-btn--primary {\n        background-color: $ff-teal-600;\n        &:hover {\n            background-color: $ff-teal-700;\n        }\n    }\n}\n\n.ff-loading {\n    width: 100%;\n    height: 100%;\n    h4 {\n        font-size: 1.5rem;\n        margin-top: 1rem;\n        font-weight: 600;\n    }\n    &.theme-light {\n        color: $ff-grey-900;\n    }\n    &.theme-dark {\n        color: white;\n    }\n}\n\n.ff-icon.ff-clickable {\n    cursor: pointer;\n    path, circle, rect {\n        transition: 0.3s color, 0.3s stroke, 0.3s fill;\n        -webkit-transition: 0.3s color, 0.3s stroke, 0.3s fill;\n    }\n    &:hover {\n        color: $ff-blue-600;\n    }\n}\n\n.ff-icon-xl {\n    width: 48px;\n    height: 48px;\n    stroke-width: 1px;\n}\n\n.ff-dialog-box a {\n    color: $ff-blue-600;\n    &:hover {\n        color: $ff-blue-800;\n    }\n}\n\n.ff-dialog-box--info {\n    p {\n        margin-bottom: 12px;\n    }\n    img {\n        width: 150px;\n        height: 150px;\n    }\n}\n\n.ff-no-data {\n    background-color: $ff-grey-100;\n    color: $ff-grey-400;\n    font-size: 0.875rem;\n    border: $ff-grey-200 solid 1px;\n    padding: 12px;\n    text-align: center;\n\n    &.ff-no-data-large {\n        padding: 64px 12px;\n    }\n\n    &--boxed {\n        @extend .ff-no-data;\n\n       .message {\n           display: block;\n           text-align: center;\n           margin: 10px 0 10px;\n           padding: 10px 0 10px;\n           border: 1px solid $ff-grey-300;\n       }\n    }\n}\n\nlabel {\n    cursor: inherit;\n}\n\n::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */\n    color: $ff-grey-400 !important;\n    opacity: 1; /* Firefox */\n}\n\n/* Ensure headlessui MenuItem pointer for active `menuitem` anchors */\n[role=\"menu\"] a[role=\"menuitem\"] {\n    cursor: pointer\n}\n\n.ff-dialog-fixed-height .ff-dialog-content {\n    overflow-y: visible;\n}\n\n.ff-breadcrumbs {\n    display: flex;\n    align-items: center;\n    label {\n        color: $ff-blue-600;\n        cursor: pointer;\n        &:hover {\n            text-decoration: underline;\n        }\n    }\n    span:last-child label {\n        pointer-events: none;\n        color: black;\n    }\n}\n\n// Handle nested buttons in a data table\n\n.ff-data-table--cell a:not(.ff-btn):hover,\n.ff-data-table--cell a:hover svg.ff-icon {\n    color: $ff-blue-600;\n}\n\n.ff-data-table--data .ff-data-table--row--nested .ff-data-table--cell {\n    background-color: $ff-grey-50;\n    &:first-child {\n        padding-left: 36px;\n    }\n}\n\n.ff-data-table--data .ff-data-table--row--nested.selectable:hover .ff-data-table--cell {\n    background-color: $ff-grey-100;\n}\n\n.ff-page-banner {\n    border-radius: 5px;\n    background-color: $ff-blue-100;\n    color: $ff-grey-600;\n    text-align: left;\n    border: 1px solid $ff-blue-300;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 8px 16px;\n\n    &.minimal {\n        background: none;\n        border: none;\n        border-radius: 0;\n    }\n}\n\n.clipped-overflow {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n\n  // number of lines to clip to\n  &--two-lines {\n    -webkit-line-clamp: 2;\n  }\n  &--three-lines {\n    -webkit-line-clamp: 3;\n  }\n  &--four-lines {\n    -webkit-line-clamp: 4;\n  }\n}\n","@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n@layer base {\n    /* .forge-block {\n        @apply bg-white;\n        @apply shadow;\n        @apply rounded;\n        @apply mx-2;\n        @apply sm:mx-4;\n        @apply py-6;\n        @apply px-2;\n        @apply sm:px-6;\n        @apply lg:px-8;\n        @apply mb-1;\n    } */\n\n    .forge-inner-block {\n        @apply py-6;\n    }\n\n    .forge-link {\n        @apply underline;\n        @apply hover:cursor-pointer;\n        @apply hover:text-blue-600;\n    }\n\n    .forge-button {\n        @apply px-3;\n        @apply py-1;\n        @apply bg-blue-900;\n        @apply border;\n        @apply border-blue-900;\n        @apply hover:bg-indigo-700;\n        @apply text-white;\n        @apply hover:text-gray-100;\n        @apply focus:text-gray-300;\n        @apply rounded-md;\n        @apply inline-flex;\n        @apply items-center;\n        @apply text-sm;\n        @apply focus:outline-none;\n        @apply focus:ring-2;\n        @apply focus:ring-offset-2;\n        @apply focus:ring-offset-gray-600;\n        @apply focus:ring-gray-400;\n\n        @apply disabled:opacity-30;\n        @apply disabled:cursor-not-allowed;\n    }\n\n    .forge-button-secondary {\n        @apply forge-button;\n        @apply bg-gray-100;\n        @apply border-gray-300;\n        @apply hover:bg-gray-300;\n        @apply hover:border-gray-300;\n        @apply text-gray-500;\n        @apply hover:text-gray-600;\n        @apply focus:text-gray-700;\n    }\n\n    .forge-button-tertiary {\n        @apply forge-button-secondary;\n        @apply bg-white;\n        @apply hover:bg-gray-100;\n    }\n\n    .forge-button-inline {\n        @apply forge-button-secondary;\n        @apply border-transparent;\n        @apply bg-white;\n        @apply hover:bg-gray-100;\n    }\n\n    .forge-button-inline-inactive {\n        @apply forge-button-inline;\n        pointer-events: none;\n    }\n\n    .forge-button-danger {\n        @apply forge-button;\n        @apply bg-white;\n        @apply border-red-700;\n        @apply hover:bg-red-700;\n        @apply text-red-700;\n        @apply hover:text-white;\n        @apply focus:text-white;\n        @apply focus:bg-red-700;\n\n        @apply disabled:border-gray-500;\n        @apply disabled:text-gray-600;\n        @apply disabled:bg-white;\n        @apply disabled:cursor-not-allowed;\n    }\n\n    .forge-button-small {\n        @apply px-2;\n        @apply py-1;\n        @apply text-xs;\n    }\n\n\n    .forge-button-set > :first-child {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n        border-right: none;\n    }\n    .forge-button-set > :last-child button {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n        border-left: none;\n    }\n\n    .forge-nav-item {\n        @apply flex items-center;\n        @apply pb-3;\n        @apply border-b-4 border-b-transparent;\n    }\n    .forge-nav-item:not(.forge-nav-item-active) {\n        @apply text-sm;\n    }\n    .forge-nav-item:not(.forge-nav-item-active):hover {\n        @apply text-blue-700;\n        @apply border-b-4;\n        @apply border-gray-400;\n    }\n\n    .forge-nav-item-active {\n        @apply text-sm;\n        @apply text-blue-700;\n        @apply border-b-4;\n        @apply border-blue-700;\n    }\n    .forge-badge {\n        @apply border;\n        @apply rounded-full;\n        @apply text-xs;\n        @apply px-2;\n        @apply py-1;\n        @apply inline-flex;\n        @apply items-center;\n    }\n    .forge-status-error,\n    .forge-status-crashed {\n        @apply bg-red-100;\n        @apply border-red-400;\n        @apply text-red-600;\n    }\n    .forge-status-suspended {\n        @apply bg-red-200;\n        @apply border-red-400;\n        @apply text-red-600;\n    }\n    .forge-status-stopped {\n        @apply bg-gray-100;\n        @apply border-gray-300;\n        @apply border-dashed;\n        @apply text-gray-700;\n    }\n    .forge-status-info {\n        @apply bg-gray-100;\n        @apply border-gray-300;\n        @apply border-dashed;\n        @apply text-gray-800;\n    }\n    .forge-status-starting {\n        @apply bg-green-100;\n        @apply border-green-300;\n        @apply border-dashed;\n        @apply text-green-700;\n    }\n    .forge-status-safe {\n        @apply bg-yellow-200;\n        @apply border-yellow-400;\n        @apply text-yellow-600;\n    }\n    .forge-status-warning {\n        @apply bg-yellow-400;\n        @apply border-yellow-700;\n        @apply text-yellow-900;\n    }\n    .forge-status-success,\n    .forge-status-connected,\n    .forge-status-running {\n        @apply bg-green-200;\n        @apply border-green-400;\n        @apply text-green-700;\n    }\n    .forge-status-importing {\n        @apply bg-green-100;\n        @apply border-green-300;\n        @apply border-dashed;\n        @apply text-green-700;\n    }\n\n    .forge-minimal-status-error,\n    .forge-minimal-status-crashed{\n        @apply bg-red-600;\n    }\n    .forge-minimal-status-stopped,\n    .forge-minimal-status-suspended,\n    .forge-minimal-status-suspending,\n    .forge-minimal-status-info,\n    .forge-minimal-status-offline{\n        @apply bg-gray-300;\n    }\n    .forge-minimal-status-success,\n    .forge-minimal-status-connected,\n    .forge-minimal-status-protected,\n    .forge-minimal-status-running,\n    .forge-minimal-status-importing,\n    .forge-minimal-status-safe,\n    .forge-minimal-status-warning,\n    .forge-minimal-status-starting,\n    .forge-minimal-status-info,\n    .forge-minimal-status-pushing,\n    .forge-minimal-status-pulling,\n    .forge-minimal-status-loading,\n    .forge-minimal-status-rollback,\n    .forge-minimal-status-installing,\n    .forge-minimal-status-updating,\n    .forge-minimal-status-restarting{\n        @apply bg-green-400;\n    }\n\n    .forge-badge-devmode {\n        @apply bg-purple-100;\n        @apply border-purple-600;\n        @apply text-purple-700;\n    }\n    .forge-badge-fleetmode {\n        @apply bg-teal-100;\n        @apply border-teal-600;\n        @apply text-teal-700;\n    }\n\n    th {\n        @apply text-left;\n        @apply font-medium;\n    }\n\n    input[type=\"text\"],\n    input[type=\"password\"],\n    input[type=\"radio\"],\n    input[type=\"checkbox\"],\n    select,\n    textarea,\n    .uneditable {\n        @apply text-sm;\n        @apply appearance-none;\n        @apply rounded;\n        @apply relative;\n        @apply font-normal;\n        @apply px-2;\n        @apply py-1;\n        @apply border;\n        @apply border-gray-300;\n        @apply placeholder-gray-500;\n        @apply text-gray-600;\n    }\n    input[type=\"radio\"],\n    input[type=\"checkbox\"] {\n        @apply mr-2;\n        @apply p-2;\n    }\n    .uneditable {\n        @apply border-opacity-0;\n    }\n\n    input[type=\"text\"]:focus,\n    input[type=\"password\"]:focus,\n    input[type=\"radio\"]:focus,\n    input[type=\"checkbox\"]:focus,\n    select:focus,\n    textarea:focus {\n        @apply outline-none;\n        @apply ring-0;\n        @apply border-indigo-500;\n    }\n    input[type=\"text\"]:disabled,\n    input[type=\"password\"]:disabled,\n    input[type=\"radio\"]:disabled,\n    input[type=\"checkbox\"]:disabled,\n    select:disabled,\n    textarea:disabled {\n        @apply cursor-not-allowed;\n        @apply opacity-60;\n    }\n\n    /* Make sure forge-log-entry-level-* all appear in tailwind.config.js safelist */\n    .forge-log-entry-level-system {\n        @apply text-blue-400;\n    }\n    .forge-log-entry-level-info {\n        @apply text-gray-100;\n    }\n    .forge-log-entry-level-warn {\n        @apply text-yellow-300;\n    }\n    .forge-log-entry-level-error {\n        @apply text-red-400;\n    }\n}\n\n@layer components {\n    .ff-layout--box--left,\n    .ff-layout--box--right {\n        @apply p-0 md:p-12;\n    }\n    .ff-layout--box--right .ff-layout--box--content {\n        @apply rounded-none md:rounded-xl m-auto;\n    }\n}\n","/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */\n\n/*\nDocument\n========\n*/\n\n/**\nUse a better box model (opinionated).\n*/\n\n*,\n::before,\n::after {\n\tbox-sizing: border-box;\n}\n\n/**\nUse a more readable tab size (opinionated).\n*/\n\nhtml {\n\t-moz-tab-size: 4;\n\ttab-size: 4;\n}\n\n/**\n1. Correct the line height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n*/\n\nhtml {\n\tline-height: 1.15; /* 1 */\n\t-webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/*\nSections\n========\n*/\n\n/**\nRemove the margin in all browsers.\n*/\n\nbody {\n\tmargin: 0;\n}\n\n/**\nImprove consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n*/\n\nbody {\n\tfont-family:\n\t\tsystem-ui,\n\t\t-apple-system, /* Firefox supports this but not yet `system-ui` */\n\t\t'Segoe UI',\n\t\tRoboto,\n\t\tHelvetica,\n\t\tArial,\n\t\tsans-serif,\n\t\t'Apple Color Emoji',\n\t\t'Segoe UI Emoji';\n}\n\n/*\nGrouping content\n================\n*/\n\n/**\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n*/\n\nhr {\n\theight: 0; /* 1 */\n\tcolor: inherit; /* 2 */\n}\n\n/*\nText-level semantics\n====================\n*/\n\n/**\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr[title] {\n\ttext-decoration: underline dotted;\n}\n\n/**\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n\tfont-weight: bolder;\n}\n\n/**\n1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n2. Correct the odd 'em' font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n\tfont-family:\n\t\tui-monospace,\n\t\tSFMono-Regular,\n\t\tConsolas,\n\t\t'Liberation Mono',\n\t\tMenlo,\n\t\tmonospace; /* 1 */\n\tfont-size: 1em; /* 2 */\n}\n\n/**\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n\tfont-size: 80%;\n}\n\n/**\nPrevent 'sub' and 'sup' elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n\tfont-size: 75%;\n\tline-height: 0;\n\tposition: relative;\n\tvertical-align: baseline;\n}\n\nsub {\n\tbottom: -0.25em;\n}\n\nsup {\n\ttop: -0.5em;\n}\n\n/*\nTabular data\n============\n*/\n\n/**\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n*/\n\ntable {\n\ttext-indent: 0; /* 1 */\n\tborder-color: inherit; /* 2 */\n}\n\n/*\nForms\n=====\n*/\n\n/**\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n\tfont-family: inherit; /* 1 */\n\tfont-size: 100%; /* 1 */\n\tline-height: 1.15; /* 1 */\n\tmargin: 0; /* 2 */\n}\n\n/**\nRemove the inheritance of text transform in Edge and Firefox.\n1. Remove the inheritance of text transform in Firefox.\n*/\n\nbutton,\nselect { /* 1 */\n\ttext-transform: none;\n}\n\n/**\nCorrect the inability to style clickable types in iOS and Safari.\n*/\n\nbutton,\n[type='button'],\n[type='reset'],\n[type='submit'] {\n\t-webkit-appearance: button;\n}\n\n/**\nRemove the inner border and padding in Firefox.\n*/\n\n::-moz-focus-inner {\n\tborder-style: none;\n\tpadding: 0;\n}\n\n/**\nRestore the focus styles unset by the previous rule.\n*/\n\n:-moz-focusring {\n\toutline: 1px dotted ButtonText;\n}\n\n/**\nRemove the additional ':invalid' styles in Firefox.\nSee: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737\n*/\n\n:-moz-ui-invalid {\n\tbox-shadow: none;\n}\n\n/**\nRemove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.\n*/\n\nlegend {\n\tpadding: 0;\n}\n\n/**\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n\tvertical-align: baseline;\n}\n\n/**\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n\theight: auto;\n}\n\n/**\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n\t-webkit-appearance: textfield; /* 1 */\n\toutline-offset: -2px; /* 2 */\n}\n\n/**\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n\t-webkit-appearance: none;\n}\n\n/**\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to 'inherit' in Safari.\n*/\n\n::-webkit-file-upload-button {\n\t-webkit-appearance: button; /* 1 */\n\tfont: inherit; /* 2 */\n}\n\n/*\nInteractive\n===========\n*/\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n\tdisplay: list-item;\n}\n","/**\n * Manually forked from SUIT CSS Base: https://github.com/suitcss/base\n * A thin layer on top of normalize.css that provides a starting point more\n * suitable for web applications.\n */\n\n/**\n * Removes the default spacing and border for appropriate elements.\n */\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n  margin: 0;\n}\n\nbutton {\n  background-color: transparent;\n  background-image: none;\n}\n\nfieldset {\n  margin: 0;\n  padding: 0;\n}\n\nol,\nul {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n/**\n * Tailwind custom reset styles\n */\n\n/**\n * 1. Use the user's configured `sans` font-family (with Tailwind's default\n *    sans-serif font stack as a fallback) as a sane default.\n * 2. Use Tailwind's default \"normal\" line-height so the user isn't forced\n *    to override it to ensure consistency even when using the default theme.\n */\n\nhtml {\n  font-family: theme('fontFamily.sans', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"); /* 1 */\n  line-height: 1.5; /* 2 */\n}\n\n\n/**\n * Inherit font-family and line-height from `html` so users can set them as\n * a class directly on the `html` element.\n */\n\nbody {\n  font-family: inherit;\n  line-height: inherit;\n}\n\n/**\n * 1. Prevent padding and border from affecting element width.\n *\n *    We used to set this in the html element and inherit from\n *    the parent element for everything else. This caused issues\n *    in shadow-dom-enhanced elements like <details> where the content\n *    is wrapped by a div with box-sizing set to `content-box`.\n *\n *    https://github.com/mozdevs/cssremedy/issues/4\n *\n *\n * 2. Allow adding a border to an element by just adding a border-width.\n *\n *    By default, the way the browser specifies that an element should have no\n *    border is by setting it's border-style to `none` in the user-agent\n *    stylesheet.\n *\n *    In order to easily add borders to elements by just setting the `border-width`\n *    property, we change the default border-style for all elements to `solid`, and\n *    use border-width to hide them instead. This way our `border` utilities only\n *    need to set the `border-width` property instead of the entire `border`\n *    shorthand, making our border utilities much more straightforward to compose.\n *\n *    https://github.com/tailwindcss/tailwindcss/pull/116\n */\n\n*,\n::before,\n::after {\n  box-sizing: border-box; /* 1 */\n  border-width: 0; /* 2 */\n  border-style: solid; /* 2 */\n  border-color: currentColor; /* 2 */\n}\n\n/*\n * Ensure horizontal rules are visible by default\n */\n\nhr {\n  border-top-width: 1px;\n}\n\n/**\n * Undo the `border-style: none` reset that Normalize applies to images so that\n * our `border-{width}` utilities have the expected effect.\n *\n * The Normalize reset is unnecessary for us since we default the border-width\n * to 0 on all elements.\n *\n * https://github.com/tailwindcss/tailwindcss/issues/362\n */\n\nimg {\n  border-style: solid;\n}\n\ntextarea {\n  resize: vertical;\n}\n\ninput::placeholder,\ntextarea::placeholder {\n  opacity: 1;\n  color: theme('colors.gray.400', #a1a1aa);\n}\n\nbutton,\n[role=\"button\"] {\n  cursor: pointer;\n}\n\n/**\n * Override legacy focus reset from Normalize with modern Firefox focus styles.\n *\n * This is actually an improvement over the new defaults in Firefox in our testing,\n * as it triggers the better focus styles even for links, which still use a dotted\n * outline in Firefox by default.\n */\n \n:-moz-focusring {\n\toutline: auto;\n}\n\ntable {\n  border-collapse: collapse;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  font-size: inherit;\n  font-weight: inherit;\n}\n\n/**\n * Reset links to optimize for opt-in styling instead of\n * opt-out.\n */\n\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\n/**\n * Reset form element properties that are easy to forget to\n * style explicitly so you don't inadvertently introduce\n * styles that deviate from your design system. These styles\n * supplement a partial reset that is already applied by\n * normalize.css.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  padding: 0;\n  line-height: inherit;\n  color: inherit;\n}\n\n/**\n * Use the configured 'mono' font family for elements that\n * are expected to be rendered with a monospace font, falling\n * back to the system monospace stack if there is no configured\n * 'mono' font family.\n */\n\npre,\ncode,\nkbd,\nsamp {\n  font-family: theme('fontFamily.mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n}\n\n/**\n * 1. Make replaced elements `display: block` by default as that's\n *    the behavior you want almost all of the time. Inspired by\n *    CSS Remedy, with `svg` added as well.\n *\n *    https://github.com/mozdevs/cssremedy/issues/14\n * \n * 2. Add `vertical-align: middle` to align replaced elements more\n *    sensibly by default when overriding `display` by adding a\n *    utility like `inline`.\n *\n *    This can trigger a poorly considered linting error in some\n *    tools but is included by design.\n * \n *    https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210\n */\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n  display: block; /* 1 */\n  vertical-align: middle; /* 2 */\n}\n\n/**\n * Constrain images and videos to the parent width and preserve\n * their intrinsic aspect ratio.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nvideo {\n  max-width: 100%;\n  height: auto;\n}\n\n/**\n * Ensure the default browser behavior of the `hidden` attribute.\n */\n\n[hidden] {\n  display: none;\n}\n",null,"@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-divider {\n    width: 100%;\n    height: 1px;\n    background-color: $ff-grey-200;\n    margin-top: 12px;\n    margin-bottom: 12px;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-combobox {\n    min-width: 200px;\n\n    &[data-headlessui-state=\"open\"] {\n        input {\n            border-bottom-left-radius: 0;\n            border-bottom-right-radius: 0;\n        }\n    }\n\n    .ff-combobox-input {\n        padding: 5px 2.5rem 5px 10px;\n        border: 1px solid $ff-grey-300;\n        font-size: $ff-funit-md;\n        line-height: 1.5;\n        &:focus {\n            border-color: $ff-grey-300;\n            outline: none;\n        }\n    }\n\n    .ff-options {\n        background: $ff-grey-50;\n        box-shadow: 0 6px 9px 0 #00000038;\n        max-height: 14rem;\n        z-index: 100;\n        overflow-y: auto;\n        padding: 0;\n        border-left: 1px solid $ff-grey-200;\n        border-right: 1px solid $ff-grey-200;\n        border-bottom: 1px solid $ff-grey-200;\n    }\n\n    .ff-option {\n        cursor: pointer;\n        border-bottom: 1px solid $ff-grey-200;\n\n        &:last-of-type {\n            border-bottom: none;\n        }\n\n        .ff-option-content {\n            padding: $ff-unit-sm $ff-unit-md;\n            border: 1px solid transparent;\n\n            &.selected {\n                background-color: $ff-grey-200;\n            }\n\n            &.active {\n                border: 1px solid $ff-indigo-300;\n            }\n\n            &.selected.active {\n                border-color: transparent;\n            }\n        }\n\n        &:hover {\n            background-color: $ff-grey-200;\n            .ff-option-content.active {\n                border-color: transparent;\n            }\n        }\n    }\n}\n"],"names":[],"sourceRoot":""}