@graupl/graupl 1.0.0-beta.23 → 1.0.0-beta.24

package/dist/css/component.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../../node_modules/@graupl/core/src/scss/mixins/_layer.scss","component.css","../../node_modules/@graupl/core/src/scss/component/alert/_index.scss","../../node_modules/@graupl/core/src/scss/base/button/_mixins.scss","../../node_modules/@graupl/core/src/scss/base/button/_variables.scss","../../node_modules/@graupl/core/src/scss/mixins/_animation.scss","../../node_modules/@graupl/core/src/scss/component/alert/_variables.scss","../../node_modules/@graupl/core/src/scss/component/accordion/_index.scss","../../node_modules/@graupl/core/src/scss/component/accordion/_variables.scss","../../node_modules/@graupl/core/src/scss/component/accordion/_defaults.scss","../../node_modules/@graupl/core/src/scss/component/badge/_index.scss","../../node_modules/@graupl/core/src/scss/component/badge/_variables.scss","../../node_modules/@graupl/core/src/scss/component/card/_index.scss","../../node_modules/@graupl/core/src/scss/component/card/_variables.scss","../../node_modules/@graupl/core/src/scss/mixins/_container.scss","../../node_modules/@graupl/core/src/scss/component/carousel/_index.scss","../../node_modules/@graupl/core/src/scss/component/carousel/_variables.scss","../../node_modules/@graupl/core/src/scss/component/disclosure/_index.scss","../../node_modules/@graupl/core/src/scss/component/disclosure/_variables.scss","../../node_modules/@graupl/core/src/scss/component/input-group/_index.scss","../../node_modules/@graupl/core/src/scss/component/input-group/_variables.scss","../../node_modules/@graupl/core/src/scss/mixins/_screen.scss","../../node_modules/@graupl/core/src/scss/component/list/_index.scss","../../node_modules/@graupl/core/src/scss/component/list/_variables.scss","../../node_modules/@graupl/core/src/scss/component/menu/_index.scss","../../node_modules/@graupl/core/src/scss/component/menu/_variables.scss","../../node_modules/@graupl/core/src/scss/component/navigation/_index.scss","../../node_modules/@graupl/core/src/scss/component/navigation/_variables.scss"],"names":[],"mappings":"AASI,gBCqxBJ,CDrxBI,mBEIF,iBCCA,kBAAA,CASA,ohBC8LqB,CD/LrB,kdC0KoB,CD3KpB,0dCsJoB,CDlJpB,cAAA,CAZA,YAAA,CAWA,2GCUiB,CDnBjB,sBAAA,CAEA,+CCCkB,CDFlB,6CCFiB,CDIjB,uNCYe,CDXf,6CCqCiB,CDpCjB,mVFHA,CEaI,kDACE,oFFRN,CEOI,+BACE,kFFLN,CEII,uBACE,kFFFN,CECI,8CACE,kFFIN,CELI,gDACE,0DFUN,CEXI,0BAKI,kBFUR,CEJc,8FACE,sDFShB,CEVc,wCACE,sDFYhB,CExBI,6LAYY,sDF+BhB,CE3CI,2BAKI,kBFsCR,CEhCc,sEACE,sDFqChB,CEtCc,yCACE,sDFwChB,CEpDI,4MAYY,sDF2DhB,CEvEI,qCAKI,kBFkER,CE5Dc,0FACE,sDFiEhB,CElEc,mDACE,sDFoEhB,CEhFI,mPAYY,sDFuFhB,CEnGI,0BAKI,kBF8FR,CExFc,oEACE,sDF6FhB,CE9Fc,wCACE,sDFgGhB,CEjGc,kKACE,sDF+GhB,CI9IA,uCHEA,iBCwCE,sLFwGA,CACF,CACF,CDtJI,wBEUF,OACE,wBAAA,CASA,+gBImDkB,CJpDlB,6cI8FiB,CJ/FjB,qdI0EiB,CJ/EjB,YAAA,CAQA,2MIKQ,CJZR,wFAAA,CACA,6GAAA,CACA,mNIJY,CJKZ,+ODkJF,CC5IE,YACE,YD8IJ,CC3IE,qBACE,YAAA,CACA,SD6IJ,CC1IE,YACE,YD4IJ,CI3KA,uCHmCI,cACE,0KD2IJ,CACF,CCvIA,cACE,mBAAA,CACA,eAAA,CACA,wHDyIF,CCtIA,YACE,mBAAA,CACA,aAAA,CACA,kHDwIF,CCrIA,cACE,mBAAA,CACA,eAAA,CACA,wHDuIF,CCpIA,iBAGE,qBAAA,CAFA,mBAAA,CACA,aDuIF,CCnIA,aACE,+CDqIF,CACF,CD1MI,oBEyEF,OACE,oOAAA,CACA,0OAAA,CACA,kDAAA,CACA,kEAAA,CACA,8DAAA,CACA,8DAAA,CACA,gEAAA,CACA,oEAAA,CAGA,0NIpDe,CJmDf,wOIhCiB,CJkCjB,gMDmIF,CChII,eAEI,wIAAA,CAAA,6IAAA,CAAA,+IAAA,CAAA,8IAAA,CAAA,8CAAA,CAAA,6IAAA,CAAA,qJAAA,CAAA,mJAAA,CAAA,mJAAA,CAAA,oJAAA,CAAA,sJD2IR,CC7II,iBAEI,8IAAA,CAAA,mJAAA,CAAA,qJAAA,CAAA,oJAAA,CAAA,8CAAA,CAAA,mJAAA,CAAA,2JAAA,CAAA,yJAAA,CAAA,yJAAA,CAAA,0JAAA,CAAA,4JDwJR,CC1JI,gBAEI,2IAAA,CAAA,gJAAA,CAAA,kJAAA,CAAA,iJAAA,CAAA,8CAAA,CAAA,gJAAA,CAAA,wJAAA,CAAA,sJAAA,CAAA,sJAAA,CAAA,uJAAA,CAAA,yJDqKR,CC5JA,iBChDA,qNC8BkB,CD/BlB,0OCiKoB,CD/JpB,iMFgNA,CE5ME,yBAEI,yIAAA,CAAA,gJAAA,CAAA,+IAAA,CAAA,oJAAA,CAAA,sJAAA,CAAA,kJAAA,CAAA,yJFmNN,CErNE,2BAEI,+IAAA,CAAA,sJAAA,CAAA,qJAAA,CAAA,0JAAA,CAAA,4JAAA,CAAA,wJAAA,CAAA,+JF4NN,CE9NE,0BAEI,4IAAA,CAAA,mJAAA,CAAA,kJAAA,CAAA,uJAAA,CAAA,yJAAA,CAAA,qJAAA,CAAA,4JFqON,CE1NI,kDAEE,6PAAA,CADA,oRAAA,CAEA,oOFiON,CEpOI,+BAEE,2PAAA,CADA,kRAAA,CAEA,kOFsON,CEzOI,uBAEE,2PAAA,CADA,kRAAA,CAEA,kOF2ON,CE9OI,8CAEE,iNAAA,CADA,gPAAA,CAEA,iNFqPN,CExPI,gDAEE,wPAAA,CADA,yRAAA,CAEA,mPF+PN,CEvPc,8FAEE,8NAAA,CADA,2KAAA,CAEA,6JFmQhB,CEtQc,wCAEE,8NAAA,CADA,2KAAA,CAEA,6JFwQhB,CE3Qc,mQAEE,8NAAA,CADA,2KAAA,CAEA,6JFgThB,CEnTc,yCAEE,8NAAA,CADA,2KAAA,CAEA,6JFqThB,CExTc,sSAEE,8NAAA,CADA,2KAAA,CAEA,6JF6VhB,CEhWc,mDAEE,8NAAA,CADA,2KAAA,CAEA,6JFkWhB,CErWc,uTAEE,8NAAA,CADA,2KAAA,CAEA,6JF0YhB,CE7Yc,wCAEE,8NAAA,CADA,2KAAA,CAEA,6JF+YhB,CElZc,kKAEE,8NAAA,CADA,2KAAA,CAEA,6JFwahB,CCpZA,aACE,gOI4CgB,CJ3ChB,8II+CoB,CJ9CpB,kLIkDsB,CJjDtB,gJDsZF,CACF,CDlgBI,mBOEF,uBJGA,kBAAA,CASA,ohBC8LqB,CD/LrB,kdC0KoB,CD3KpB,0dCsJoB,CDlJpB,cAAA,CAZA,YAAA,CAWA,2GCUiB,CDnBjB,sBAAA,CAEA,+CCCkB,CDFlB,6CCFiB,CDIjB,uNCYe,CDXf,6CCqCiB,CDpCjB,mVFygBA,CE/fI,8DACE,oFFogBN,CErgBI,qCACE,kFFugBN,CExgBI,6BACE,kFF0gBN,CE3gBI,0DACE,kFFghBN,CEjhBI,4DACE,0DFshBN,CEvhBI,gCAKI,kBFshBR,CEhhBc,gHACE,sDFqhBhB,CEthBc,8CACE,sDFwhBhB,CEpiBI,iOAYY,sDF2iBhB,CEvjBI,iCAKI,kBFkjBR,CE5iBc,kFACE,sDFijBhB,CEljBc,+CACE,sDFojBhB,CEhkBI,gPAYY,sDFukBhB,CEnlBI,2CAKI,kBF8kBR,CExkBc,sGACE,sDF6kBhB,CE9kBc,yDACE,sDFglBhB,CE5lBI,uRAYY,sDFmmBhB,CE/mBI,gCAKI,kBF0mBR,CEpmBc,gFACE,sDFymBhB,CE1mBc,8CACE,sDF4mBhB,CE7mBc,gMACE,sDF2nBhB,CI1pBA,uCEAA,uBJ0CE,sLFonBA,CACF,CACF,CDlqBI,wBOQF,WACE,YAAA,CACA,uBAAA,CAEA,sNCgBY,CDjBZ,+NN8pBF,CM1pBI,6CAEE,uQN6pBN,CMjpBA,gBAKE,4jBC8B2B,CD/B3B,0fC2E0B,CD5E1B,kgBCuD0B,CDpD1B,iBAAA,CALA,eAAA,CACA,6INupBF,CMjpBE,6CAEE,YNkpBJ,CM/oBE,6CAGE,SAAA,CADA,2ENipBJ,CM7oBE,sDAEE,YN8oBJ,CM1oBA,uBAEE,mQC2D4B,CD1D5B,4DCgE8B,CD/D9B,kWCuF+B,CD1F/B,SN+oBF,CMzoBI,8DACE,mGN8oBN,CMzoBI,qCACE,iGN2oBN,CM5oBI,6BACE,iGN8oBN,CMzoBI,0DACE,iGN8oBN,CMzoBI,4DACE,kGN8oBN,CMzoBI,4IACE,oGNopBN,CMhpBE,6BAGE,kBAAA,CAFA,WEjEiC,CFkEjC,YAAA,CAEA,sBAAA,CACA,gBAAA,CACA,mECmPmC,CDlPnC,gJNkpBJ,CM9oBI,iDACE,mFNgpBN,CM3oBA,uBACE,4hBCoE2B,CDnE3B,mQN6oBF,CM1oBA,sBACE,4PCkG0B,CDjG1B,gQN4oBF,CM1oBE,mEAGE,kBAAA,CADA,YAAA,CAEA,0BAAA,CACA,UN4oBJ,CMxoBA,wBACE,YAAA,CACA,uBAAA,CAKA,8PC6HyB,CD9HzB,SAAA,CAHA,sQCqH6B,CDpH7B,0EC0M+B,CDzM/B,iPN4oBF,CMvoBA,qBACE,6PNyoBF,CMtoBA,uBACE,mQNwoBF,CACF,CDrxBI,oBOkJA,uCAEE;;;0MNkpBJ,CACF,CDvyBI,oBOsKF,WACE,wNCjImB,CDkInB,oMNooBF,CMjoBA,gBACE,qPNmoBF,CMhoBA,uBJ5HA,qNC8BkB,CD/BlB,0OCiKoB,CD/JpB,iMFgwBA,CE5vBE,+BAEI,yIAAA,CAAA,gJAAA,CAAA,+IAAA,CAAA,oJAAA,CAAA,sJAAA,CAAA,kJAAA,CAAA,yJFmwBN,CErwBE,iCAEI,+IAAA,CAAA,sJAAA,CAAA,qJAAA,CAAA,0JAAA,CAAA,4JAAA,CAAA,wJAAA,CAAA,+JF4wBN,CE9wBE,gCAEI,4IAAA,CAAA,mJAAA,CAAA,kJAAA,CAAA,uJAAA,CAAA,yJAAA,CAAA,qJAAA,CAAA,4JFqxBN,CE1wBI,8DAEE,6PAAA,CADA,oRAAA,CAEA,oOFixBN,CEpxBI,qCAEE,2PAAA,CADA,kRAAA,CAEA,kOFsxBN,CEzxBI,6BAEE,2PAAA,CADA,kRAAA,CAEA,kOF2xBN,CE9xBI,0DAEE,iNAAA,CADA,gPAAA,CAEA,iNFqyBN,CExyBI,4DAEE,wPAAA,CADA,yRAAA,CAEA,mPF+yBN,CEvyBc,gHAEE,8NAAA,CADA,2KAAA,CAEA,6JFmzBhB,CEtzBc,8CAEE,8NAAA,CADA,2KAAA,CAEA,6JFwzBhB,CE3zBc,mTAEE,8NAAA,CADA,2KAAA,CAEA,6JFg2BhB,CEn2Bc,+CAEE,8NAAA,CADA,2KAAA,CAEA,6JFq2BhB,CEx2Bc,sVAEE,8NAAA,CADA,2KAAA,CAEA,6JF64BhB,CEh5Bc,yDAEE,8NAAA,CADA,2KAAA,CAEA,6JFk5BhB,CEr5Bc,uWAEE,8NAAA,CADA,2KAAA,CAEA,6JF07BhB,CE77Bc,8CAEE,8NAAA,CADA,2KAAA,CAEA,6JF+7BhB,CEl8Bc,gMAEE,8NAAA,CADA,2KAAA,CAEA,6JFw9BhB,CMv3BE,mEAEE,8OC6CwB,CD5CxB,gJCoCsB,CDnCtB,sLCuCwB,CDtCxB,oJNy3BJ,CACF,CDnjCI,wBUgKF,OAEE,kBAAA,CAKA,+gBCrEkB,CDoElB,6cC3FiB,CD0FjB,qdCjHiB,CD6GjB,YAAA,CAOA,2GCnKc,CD8Jd,sBAAA,CACA,oNT05BF,CACF,CD/jCI,oBU8KF,OAEE,oNCrKe,CDoKf,yOC/JiB,CDiKjB,gMTo5BF,CSh5BI,eAEI,wIAAA,CAAA,+ITk5BR,CSp5BI,iBAEI,8IAAA,CAAA,qJTs5BR,CSx5BI,gBAEI,2IAAA,CAAA,kJT05BR,CACF,CDllCI,wBYCF,MASE,0gBCoEiB,CDrEjB,wcC+GgB,CDhHhB,gdC2FgB,CDjGhB,YAAA,CASA,uMCkCO,CDzCP,6EAAA,CAQA,iBAAA,CAPA,gNCOW,CDTX,iBAAA,CAGA,2CCqBa,CDpBb,4IXylCF,CWllCE,gBAEE,iJXmlCJ,CW3kCE,2BAEE,iJX4kCJ,CWpkCE,YACE,+DXskCJ,CWlkCI,uCAEE,2EAAA,CACA,uEAAA,CAEA,oJACE,CAKF,0EX6jCN,CW3jCM,uEACE,6sBX6jCR,CW7iCI,gDAEE,oJX8iCN,CWviCM,gFACE,qtBXyiCR,CWthCA,YACE,eAAA,CACA,kOXwhCF,CWthCE,gBAGE,qsBAAA,CADA,WAAA,CAcA,mBAAA,CAAA,gBAAA,CAfA,UX2hCJ,CWxgCA,cACE,YAAA,CAEA,qBAAA,CAEA,gOCsDe,CDzDf,iBAAA,CAEA,yOX2gCF,CWvgCA,WACE,aXygCF,CWlgCA,yBACE,aXugCF,CapoCA,4BFmIM,oIAME,yCAAA,CACA,0CAAA,CAEA,6EX8/BN,CW3/BI,mFAIE,iJX0/BN,CWl/BI,iDAEE,iJXm/BN,CACF,CI7pCA,uCOqLE,MACE,0EX2+BF,CACF,CACF,CDrqCI,oBY8LF,MAEE,mNC7Ic,CD4Id,sOCrIgB,CDuIhB,+LX0+BF,CWv+BA,YACE,8NCVe,CDWf,6ICPmB,CDQnB,iLCJqB,CDKrB,+IXy+BF,CACF,CDlrCI,mBeCF,kBZIA,kBAAA,CASA,ohBC8LqB,CD/LrB,kdC0KoB,CD3KpB,0dCsJoB,CDlJpB,cAAA,CAZA,YAAA,CAWA,2GCUiB,CDnBjB,sBAAA,CAEA,+CCCkB,CDFlB,6CCFiB,CDIjB,uNCYe,CDXf,6CCqCiB,CDpCjB,mVFurCA,CE7qCI,oDACE,oFFkrCN,CEnrCI,gCACE,kFFqrCN,CEtrCI,wBACE,kFFwrCN,CEzrCI,gDACE,kFF8rCN,CE/rCI,kDACE,0DFosCN,CErsCI,2BAKI,kBFosCR,CE9rCc,iGACE,sDFmsChB,CEpsCc,yCACE,sDFssChB,CEltCI,mMAYY,sDFytChB,CEruCI,4BAKI,kBFguCR,CE1tCc,wEACE,sDF+tChB,CEhuCc,0CACE,sDFkuChB,CE9uCI,kNAYY,sDFqvChB,CEjwCI,sCAKI,kBF4vCR,CEtvCc,4FACE,sDF2vChB,CE5vCc,oDACE,sDF8vChB,CE1wCI,yPAYY,sDFixChB,CE7xCI,2BAKI,kBFwxCR,CElxCc,sEACE,sDFuxChB,CExxCc,yCACE,sDF0xChB,CE3xCc,uKACE,sDFyyChB,CIx0CA,uCUDA,kBZ2CE,sLFkyCA,CACF,Cc10CA,cZAA,kBAAA,CASA,ohBC8LqB,CD/LrB,kdC0KoB,CD3KpB,0dCsJoB,CDlJpB,cAAA,CAZA,YAAA,CAWA,2GCUiB,CDnBjB,sBAAA,CAEA,+CCCkB,CDFlB,6CCFiB,CDIjB,uNCYe,CDXf,6CCqCiB,CDpCjB,mVFm1CA,CEz0CI,4CACE,oFF80CN,CE/0CI,4BACE,kFFi1CN,CEl1CI,oBACE,kFFo1CN,CEr1CI,wCACE,kFF01CN,CE31CI,0CACE,0DFg2CN,CEj2CI,uBAKI,kBFg2CR,CE11Cc,qFACE,sDF+1ChB,CEh2Cc,qCACE,sDFk2ChB,CE92CI,2KAYY,sDFq3ChB,CEj4CI,wBAKI,kBF43CR,CEt3Cc,gEACE,sDF23ChB,CE53Cc,sCACE,sDF83ChB,CE14CI,0LAYY,sDFi5ChB,CE75CI,kCAKI,kBFw5CR,CEl5Cc,oFACE,sDFu5ChB,CEx5Cc,gDACE,sDF05ChB,CEt6CI,iOAYY,sDF66ChB,CEz7CI,uBAKI,kBFo7CR,CE96Cc,8DACE,sDFm7ChB,CEp7Cc,qCACE,sDFs7ChB,CEv7Cc,mJACE,sDFq8ChB,CIp+CA,uCUGA,cZuCE,sLF87CA,CACF,CACF,CD5+CI,wBeWF,UACE,YAAA,CAEA,mJAAA,CACA,4NAAA,CACA,iBAAA,CACA,4NCYe,CDhBf,iBdw+CF,Cch+CM,2DACE,0Edk+CR,Cch+CQ,kEACE,cdk+CV,Cc99CM,uDACE,gEdg+CR,Cc99CQ,8DACE,cdg+CV,Ccx9CM,+DACE,gEd09CR,Ccx9CQ,sEACE,cd09CV,Cct9CM,2DACE,0Edw9CR,Cct9CQ,kEACE,cdw9CV,Ccj9CA,4BACE,YAAA,CAEA,kBAAA,CACA,6OACE,CAGF,6IAAA,CACA,mBAAA,CAPA,Sdu9CF,Cc78CA,kBACE,mBd+8CF,Cc78CE,2BACE,kBd+8CJ,Cc58CE,8BACE,+CC3BkB,CD4BlB,oBd88CJ,Cc38CE,+BACE,iDC5BmB,CD6BnB,oBd68CJ,Cc18CE,uBACE,cd48CJ,Cc18CI,8BACE,+CChCgB,CDiChB,oBd48CN,Ccx8CE,2BACE,kBd08CJ,Ccx8CI,kCACE,mDCrCoB,CDsCpB,oBd08CN,Ccr8CA,yBACE,YAAA,CAEA,eAAA,CACA,2BAAA,CAGA,iBAAA,CADA,iBAAA,CADA,yQClE8B,CD+D9B,Sd48CF,Ccp8CA,eAEE,eAAA,CACA,oDCtFsB,CDuFtB,SAAA,CAHA,Udy8CF,Ccp8CE,sBAEE,cdw8CJ,Ccj8CE,8CAHE,SAAA,CAHA,+EAAA,CAFA,Sd+8CJ,Ccv8CE,wBAEE,0Edq8CJ,Cc/7CI,+BACE,cdi8CN,Cc77CE,oBAGE,SAAA,CADA,gEAAA,CADA,Sdi8CJ,Cc77CI,2BACE,cd+7CN,Cc17CA,wBACE,YAAA,CAKA,uGCxEyB,CDqEzB,cAAA,CACA,sBAAA,CACA,wQC3E6B,CD6E7B,mBAAA,CALA,Sdi8CF,Ccz7CA,cACE,iCAAA,CAEA,mBd07CF,CACF,CDrmDI,oBe+KF,kBZ5HA,qNC8BkB,CD/BlB,0OCiKoB,CD/JpB,iMFujDA,CEnjDE,0BAEI,yIAAA,CAAA,gJAAA,CAAA,+IAAA,CAAA,oJAAA,CAAA,sJAAA,CAAA,kJAAA,CAAA,yJF0jDN,CE5jDE,4BAEI,+IAAA,CAAA,sJAAA,CAAA,qJAAA,CAAA,0JAAA,CAAA,4JAAA,CAAA,wJAAA,CAAA,+JFmkDN,CErkDE,2BAEI,4IAAA,CAAA,mJAAA,CAAA,kJAAA,CAAA,uJAAA,CAAA,yJAAA,CAAA,qJAAA,CAAA,4JF4kDN,CEjkDI,oDAEE,6PAAA,CADA,oRAAA,CAEA,oOFwkDN,CE3kDI,gCAEE,2PAAA,CADA,kRAAA,CAEA,kOF6kDN,CEhlDI,wBAEE,2PAAA,CADA,kRAAA,CAEA,kOFklDN,CErlDI,gDAEE,iNAAA,CADA,gPAAA,CAEA,iNF4lDN,CE/lDI,kDAEE,wPAAA,CADA,yRAAA,CAEA,mPFsmDN,CE9lDc,iGAEE,8NAAA,CADA,2KAAA,CAEA,6JF0mDhB,CE7mDc,yCAEE,8NAAA,CADA,2KAAA,CAEA,6JF+mDhB,CElnDc,2QAEE,8NAAA,CADA,2KAAA,CAEA,6JFupDhB,CE1pDc,0CAEE,8NAAA,CADA,2KAAA,CAEA,6JF4pDhB,CE/pDc,8SAEE,8NAAA,CADA,2KAAA,CAEA,6JFosDhB,CEvsDc,oDAEE,8NAAA,CADA,2KAAA,CAEA,6JFysDhB,CE5sDc,+TAEE,8NAAA,CADA,2KAAA,CAEA,6JFivDhB,CEpvDc,yCAEE,8NAAA,CADA,2KAAA,CAEA,6JFsvDhB,CEzvDc,uKAEE,8NAAA,CADA,2KAAA,CAEA,6JF+wDhB,Cc/qDA,cZhIA,qNC8BkB,CD/BlB,0OCiKoB,CD/JpB,iMFmzDA,CE/yDE,sBAEI,yIAAA,CAAA,gJAAA,CAAA,+IAAA,CAAA,oJAAA,CAAA,sJAAA,CAAA,kJAAA,CAAA,yJFszDN,CExzDE,wBAEI,+IAAA,CAAA,sJAAA,CAAA,qJAAA,CAAA,0JAAA,CAAA,4JAAA,CAAA,wJAAA,CAAA,+JF+zDN,CEj0DE,uBAEI,4IAAA,CAAA,mJAAA,CAAA,kJAAA,CAAA,uJAAA,CAAA,yJAAA,CAAA,qJAAA,CAAA,4JFw0DN,CE7zDI,4CAEE,6PAAA,CADA,oRAAA,CAEA,oOFo0DN,CEv0DI,4BAEE,2PAAA,CADA,kRAAA,CAEA,kOFy0DN,CE50DI,oBAEE,2PAAA,CADA,kRAAA,CAEA,kOF80DN,CEj1DI,wCAEE,iNAAA,CADA,gPAAA,CAEA,iNFw1DN,CE31DI,0CAEE,wPAAA,CADA,yRAAA,CAEA,mPFk2DN,CE11Dc,qFAEE,8NAAA,CADA,2KAAA,CAEA,6JFs2DhB,CEz2Dc,qCAEE,8NAAA,CADA,2KAAA,CAEA,6JF22DhB,CE92Dc,2OAEE,8NAAA,CADA,2KAAA,CAEA,6JFm5DhB,CEt5Dc,sCAEE,8NAAA,CADA,2KAAA,CAEA,6JFw5DhB,CE35Dc,8QAEE,8NAAA,CADA,2KAAA,CAEA,6JFg8DhB,CEn8Dc,gDAEE,8NAAA,CADA,2KAAA,CAEA,6JFq8DhB,CEx8Dc,+RAEE,8NAAA,CADA,2KAAA,CAEA,6JF6+DhB,CEh/Dc,qCAEE,8NAAA,CADA,2KAAA,CAEA,6JFk/DhB,CEr/Dc,mJAEE,8NAAA,CADA,2KAAA,CAEA,6JF2gEhB,CACF,CD/lEI,wBiB2HF,YAEE,gDCnEoB,CDkEpB,6CCpFiB,CDwFjB,gFCpDiB,CDkDjB,eAAA,CACA,ubhBw+DF,CgBp+DE,iBACE,sEAAA,CACA,yEAAA,CACA,mEhBs+DJ,CgBl+DE,0BACE,+EAAA,CACA,kFAAA,CACA,4EhBo+DJ,CgBh+DE,iBACE,sEAAA,CACA,4EAAA,CACA,mEhBk+DJ,CgB79DA,oBAKE,glBCQ+B,CDT/B,8gBCd8B,CDa9B,shBCpC8B,CDkC9B,aAAA,CACA,0PhBk+DF,CgB39DA,mBd7JA,kBAAA,CASA,ohBC8LqB,CD/LrB,kdC0KoB,CD3KpB,0dCsJoB,CDlJpB,cAAA,CAZA,YAAA,CAWA,2GCUiB,CDnBjB,sBAAA,CAEA,+CCCkB,CDFlB,6CCFiB,CDIjB,uNCYe,CDXf,6CCqCiB,CDpCjB,mVFioEA,CEvnEI,sDACE,oFF4nEN,CE7nEI,iCACE,kFF+nEN,CEhoEI,yBACE,kFFkoEN,CEnoEI,kDACE,kFFwoEN,CEzoEI,oDACE,0DF8oEN,CE/oEI,4BAKI,kBF8oER,CExoEc,oGACE,sDF6oEhB,CE9oEc,0CACE,sDFgpEhB,CE5pEI,yMAYY,sDFmqEhB,CE/qEI,6BAKI,kBF0qER,CEpqEc,0EACE,sDFyqEhB,CE1qEc,2CACE,sDF4qEhB,CExrEI,wNAYY,sDF+rEhB,CE3sEI,uCAKI,kBFssER,CEhsEc,8FACE,sDFqsEhB,CEtsEc,qDACE,sDFwsEhB,CEptEI,+PAYY,sDF2tEhB,CEvuEI,4BAKI,kBFkuER,CE5tEc,wEACE,sDFiuEhB,CEluEc,0CACE,sDFouEhB,CEruEc,4KACE,sDFmvEhB,CIlxEA,uCYgKA,mBdtHE,sLF4uEA,CACF,CgBpnEE,yBACE,mDCiBsB,CDhBtB,aAAA,CACA,gECOwB,CDNxB,yJhBsnEJ,CgBnnEE,6CACE,mGhBqnEJ,CIhyEA,uCYgLE,YACE,qRhBmnEF,CgBhnEA,mBACE,oGhBknEF,CACF,CACF,CD3yEI,oBiB8LF,YACE,+NC3LoB,CD4LpB,4MhBgnEF,CgB5mEA,oBACE,sPhB8mEF,CgB1mEA,mBdtJA,qNC8BkB,CD/BlB,0OCiKoB,CD/JpB,iMFowEA,CEhwEE,2BAEI,yIAAA,CAAA,gJAAA,CAAA,+IAAA,CAAA,oJAAA,CAAA,sJAAA,CAAA,kJAAA,CAAA,yJFuwEN,CEzwEE,6BAEI,+IAAA,CAAA,sJAAA,CAAA,qJAAA,CAAA,0JAAA,CAAA,4JAAA,CAAA,wJAAA,CAAA,+JFgxEN,CElxEE,4BAEI,4IAAA,CAAA,mJAAA,CAAA,kJAAA,CAAA,uJAAA,CAAA,yJAAA,CAAA,qJAAA,CAAA,4JFyxEN,CE9wEI,sDAEE,6PAAA,CADA,oRAAA,CAEA,oOFqxEN,CExxEI,iCAEE,2PAAA,CADA,kRAAA,CAEA,kOF0xEN,CE7xEI,yBAEE,2PAAA,CADA,kRAAA,CAEA,kOF+xEN,CElyEI,kDAEE,iNAAA,CADA,gPAAA,CAEA,iNFyyEN,CE5yEI,oDAEE,wPAAA,CADA,yRAAA,CAEA,mPFmzEN,CE3yEc,oGAEE,8NAAA,CADA,2KAAA,CAEA,6JFuzEhB,CE1zEc,0CAEE,8NAAA,CADA,2KAAA,CAEA,6JF4zEhB,CE/zEc,mRAEE,8NAAA,CADA,2KAAA,CAEA,6JFo2EhB,CEv2Ec,2CAEE,8NAAA,CADA,2KAAA,CAEA,6JFy2EhB,CE52Ec,sTAEE,8NAAA,CADA,2KAAA,CAEA,6JFi5EhB,CEp5Ec,qDAEE,8NAAA,CADA,2KAAA,CAEA,6JFs5EhB,CEz5Ec,uUAEE,8NAAA,CADA,2KAAA,CAEA,6JF87EhB,CEj8Ec,0CAEE,8NAAA,CADA,2KAAA,CAEA,6JFm8EhB,CEt8Ec,4KAEE,8NAAA,CADA,2KAAA,CAEA,6JF49EhB,CACF,CDhjFI,wBmBCF,aAKE,kBAAA,CAJA,YAAA,CAKA,+NCiBc,CDrBd,wFCD8B,CDE9B,0ECIgC,CDHhC,8ElBojFF,CkBhjFE,mBACE,yDlBkjFJ,CkB/iFE,6DAGE,yDlBijFJ,CkB9iFE,wBACE,uDlBgjFJ,CkB7iFE,oBACE,+FCMmC,CDLnC,qFCUqC,CDTrC,gFlB+iFJ,CoB3jFA,mCFiBE,oBACE,wFC9B4B,CD+B5B,0ECzB8B,CD0B9B,8ElB6iFF,CACF,CACF,CDjlFI,wBsBCF,MAOE,0gBC8DiB,CD/DjB,wcCsGgB,CDvGhB,0MCkFgB,CDtFhB,YAAA,CAQA,2MC2BO,CD5BP,eAAA,CALA,4MCmBU,CDlBV,gNrBwlFF,CqBhlFA,iBAVE,iBrBmmFF,CqBzlFA,WAOE,miBC+JsB,CDhKtB,ieC2MqB,CD5MrB,yeCuLqB,CD1LrB,gOC6GgB,CD5GhB,gDC2HkB,CD1HlB,iJrBqlFF,CqB/kFI,kCACE,uDrBolFN,CACF,CD7mFI,oBsB+BF,MAEE,mNCUc,CDXd,sOCkBgB,CDhBhB,+LrBilFF,CqB9kFA,WAEE,wNC8GmB,CD/GnB,gPCyHqB,CDvHrB,oMrBglFF,CACF,CDznFI,wBwBEF,MACE,+OAAA,CACA,iPAAA,CACA,qjBAAA,CACA,+eAAA,CACA,0EAAA,CACA,6HAAA,CACA,uFAAA,CACA,8DAAA,CACA,kIAAA,CACA,+LAAA,CACA,qJAAA,CACA,gHAAA,CACA,8HAAA,CACA,2LAAA,CACA,iJAAA,CACA,4GAAA,CACA,sFAAA,CACA,yIAAA,CACA,mGAAA,CACA,0EAAA,CACA,sIAAA,CACA,mMAAA,CACA,yJAAA,CACA,oHAAA,CACA,4FAAA,CACA,+IAAA,CACA,yGAAA,CACA,gFAAA,CAOA,0gBCwCiB,CDzCjB,wcCmFgB,CDpFhB,0MC+DgB,CDlEhB,uCCYW,CDXX,oDC7BkB,CDmClB,uMCTO,CDUP,iBAAA,CAFA,eAAA,CAJA,gNvB+nFF,CuBvnFE,WACE,0DvBynFJ,CuBtnFE,WACE,0DvBwnFJ,CuBpnFA,SASE,yhBC+IoB,CDhJpB,udC0LmB,CD3LnB,+dCsKmB,CD5KnB,0CCsHc,CDnHd,QAAA,CACA,0DCsEqB,CDhErB,yQC8FU,CD5FV,gKCgNY,CDjNZ,iBAAA,CAFA,eAAA,CAJA,yNCqFc,CDzFd,gDCuMe,CDtMf,uCvBgoFF,CuBpnFE,cACE,gEvBsnFJ,CuBnnFE,cACE,gEvBqnFJ,CuBjnFA,WAIE,kBAAA,CAHA,YAAA,CAEA,cAAA,CAEA,sBAAA,CAEA,gDCwMkB,CDzMlB,4DCqMkB,CDrMlB,uDCqMkB,CDnMlB,+NCmNgB,CDzNhB,iBvBynFF,CuBhnFA,WAQE,miBC4bsB,CD7btB,ieCweqB,CDzerB,mOCodqB,CDzdrB,YAAA,CAUA,wPC+QY,CDvRZ,gOCiOgB,CD3NhB,oECyUwB,CDzUxB,4DCyUwB,CDxUxB,yECwX8B,CDtX9B,8GC8VkC,CDtWlC,gDCoPkB,CDnPlB,kPCqOmB,CDxOnB,UvB4nFF,CuBhnFE,mBACE,+HAAA,CACA,4LAAA,CACA,kJAAA,CACA,6GvBknFJ,CuB/mFE,yBACE,6HAAA,CACA,0LAAA,CACA,gJAAA,CACA,2GvBinFJ,CuB9mFE,iBACE,qFAAA,CACA,wIAAA,CACA,kGAAA,CACA,yEvBgnFJ,CuB7mFE,kBACE,oIAAA,CACA,iMAAA,CACA,uJAAA,CACA,kHvB+mFJ,CuB1mFI,mRAKE,wFAAA,CACA,2IAAA,CACA,qGAAA,CACA,4EvBwmFN,CuBpmFE,kBACE,2OAAA,CACA,ifAAA,CACA,2iBAAA,CACA,qeAAA,CACA,uCAAA,CACA,+CAAA,CACA,6CAAA,CACA,6CAAA,CACA,8CAAA,CACA,gDAAA,CACA,yWAAA,CACA,wMAAA,CACA,gEAAA,CACA,+GAAA,CACA,2GAAA,CACA,2GAAA,CACA,qFAAA,CACA,kFvBsmFJ,CuBlmFA,gBAEE,kBAAA,CADA,YAAA,CAEA,6BvBomFF,CuBlmFE,sBACE,gDCkcmB,CDjcnB,aAAA,CACA,6DCwbqB,CDvbrB,sJvBomFJ,CuBjmFE,0CACE,6FvBmmFJ,CIlxFA,uCmBoLE,WACE,4LvBimFF,CuB9lFA,sBACE,8FvBgmFF,CACF,CACF,CD7xFI,oBwBiMF,MACE,2OAAA,CACA,oQAAA,CACA,uRAAA,CACA,ySAAA,CACA,yRAAA,CACA,uTAAA,CACA,4UAAA,CACA,+VAAA,CACA,qRAAA,CACA,mTAAA,CACA,wUAAA,CACA,yVAAA,CACA,sQAAA,CACA,iQAAA,CACA,wTAAA,CACA,0UAAA,CACA,4SAAA,CACA,4SAAA,CACA,qWAAA,CACA,iXAAA,CACA,uLAAA,CACA,wPAAA,CACA,4OAAA,CACA,8PAAA,CAGA,mNC1Kc,CDyKd,sOClKgB,CDoKhB,+LvB8lFF,CuB3lFA,SAEE,oPClDiB,CDiDjB,qQC1CmB,CD4CnB,2NvB6lFF,CuB1lFA,WAEE,sPC8ImB,CD/InB,yQCmWqB,CDjWrB,6NCqKc,CDpKd,2RvB4lFF,CuB1lFE,mBACE,oTAAA,CACA,sRAAA,CACA,4VAAA,CACA,yUvB4lFJ,CuBzlFE,yBACE,kTAAA,CACA,oRAAA,CACA,wVAAA,CACA,uUvB2lFJ,CuBxlFE,iBACE,gQAAA,CACA,qQAAA,CACA,yUAAA,CACA,uTvB0lFJ,CuBvlFE,kBACE,0SAAA,CACA,0SAAA,CACA,+WAAA,CACA,mWvBylFJ,CuBrlFI,uIAKE,oPAAA,CACA,mLAAA,CACA,0PAAA,CACA,wOvBmlFN,CuB/kFE,kBACE,wOAAA,CACA,oNAAA,CACA,6PAAA,CACA,wRAAA,CACA,+PAAA,CACA,+SAAA,CACA,oRAAA,CACA,2PAAA,CACA,2SAAA,CACA,0OAAA,CACA,0OAAA,CACA,yQAAA,CACA,kRAAA,CACA,6QAAA,CACA,mTAAA,CACA,0PAAA,CACA,yLAAA,CACA,uMvBilFJ,CACF,CDz3FI,wB0BGF,YACE,YAAA,CACA,wDACE,CAEF,mCAAA,CACA,iBzBu3FF,CyBr3FE,kBACE,czBu3FJ,CyBr3FI,uBACE,0DzBu3FN,CyBp3FI,uBACE,0DzBs3FN,CyBh3FA,mBAGE,kBAAA,CAOA,2kBCuF8B,CDxF9B,ygBC6D6B,CD9D7B,ihBCuC6B,CD9C7B,YAAA,CACA,gBAAA,CAEA,sBAAA,CAEA,0DCb2B,CDY3B,wDChB0B,CDkB1B,wPzBq3FF,CyBh3FE,0BACE,mDC+OsB,CD9OtB,azBk3FJ,CyB72FA,qBAGE,kBAAA,CAFA,YAAA,CAKA,wHCiF4B,CDhF5B,2HCoF8B,CDzF9B,kBAAA,CAEA,0BAAA,CACA,gQCkG0B,CD/F1B,8EC+HkC,CD/HlC,sEC+HkC,CD9HlC,mFCsJwC,CDrJxC,wHzB+2FF,CyB72FE,6BACE,6JAAA,CACA,0NAAA,CACA,gLzB+2FJ,CyB52FE,mCACE,2JAAA,CACA,wNAAA,CACA,8KzB82FJ,CyB32FE,2BACE,yGAAA,CACA,4JAAA,CACA,sHzB62FJ,CyB12FE,4BACE,kKAAA,CACA,+NAAA,CACA,qLzB42FJ,CyBv2FI,uXAKE,4GAAA,CACA,+JAAA,CACA,yHzBq2FN,CoBh7FA,mCKkFE,YACE,mCAAA,CACA,kCAAA,CACA,iCAAA,CACA,2BzBi2FF,CACF,CoBj8FA,mCKqGE,YACE,+DAAA,CAEA,qCzB81FF,CyB11FA,mBACE,YzB41FF,CACF,CACF,CDh9FI,oB0ByHF,YACE,uOAAA,CACA,mNAAA,CACA,0OAAA,CACA,sNAAA,CAEA,yNC3HoB,CD4HpB,qMzBy1FF,CyBr1FA,mBAEE,oQChG2B,CD+F3B,+RC/B6B,CDiC7B,2OzBu1FF,CyBr1FE,yBACE,sRAAA,CACA,2RzBu1FJ,CyBl1FA,qBACE,6OCQwB,CDPxB,qTzBo1FF,CyBl1FE,6BACE,0TAAA,CACA,0YzBo1FJ,CyBj1FE,mCACE,wTAAA,CACA,sYzBm1FJ,CyBh1FE,2BACE,gRAAA,CACA,8VzBk1FJ,CyB/0FE,4BACE,+TAAA,CACA,8YzBi1FJ,CyB50FI,uXAKE,mRAAA,CACA,oWzB00FN,CACF","file":"component.css"}
+{"version":3,"sourceRoot":null,"mappings":"AESI,mBCuMF,8yEGjLI,uIAAA,yIAAA,iIAAA,2GAAA,m/DFIF,uIGxBF,uCJqMA,yMQkHA,ozELnSI,mJAAA,qJAAA,6IAAA,uHAAA,2yEFIF,+JGxBF,uCIuTA,+MOjEA,+yEZlOI,yIAAA,2IAAA,mIAAA,6GAAA,uiEFIF,2IGxBF,uCWsPA,0MAKA,2yEZvOI,iIAAA,mIAAA,2HAAA,qGAAA,u1DFIF,2HGxBF,uCW2PA,uMhB7PE,wBC8MF,6xEAcE,yBAKA,4CAMA,yBAMF,+JAOA,qJAOA,+JAOA,8DAOA,6DIvQA,uCJ6QE,iLQiDF,0dAQI,4SAeJ,q1DAQE,0DAKA,mIAMA,mEAOF,whCL3VI,iLAAA,mLAAA,2KAAA,gIAAA,0zEKwWF,ybAYE,qIAOJ,oyBAMA,8gBAIE,yIAUF,qkCAWA,gRAKA,wRJnbA,uCIybE,uFAKA,+dAIE,kHAKA,yTEzSJ,wyDEqDA,0mEAcE,8JAWA,yKAUA,4EAOE,qZAcE,gwBAmBF,iMAUE,gxBAsBN,4PAIE,wuBAqBF,wgBASA,yBAKA,mCEzVA,0BFwWM,qSAaA,iOAaA,gMR9YN,uCQ6ZE,kFG3JF,4nBAYM,qIAIE,iFAMF,wHAIE,6EAWF,gIAIE,qFAMF,qIAIE,iFASR,6cAaA,sCAIE,8CAKA,qGAMA,0GAMA,sCAGE,qGAOF,8CAGE,6GAQJ,uYAWA,yGAOE,wIAQA,qMAOE,8CAMF,yGAME,0CAOJ,sdAWA,oEE3TA,koBAQE,sOAOA,0QAOA,yOAQF,o4DASA,gzEd5II,2IAAA,6IAAA,qIAAA,+GAAA,2lEFIF,+IGxBF,uCagKA,2MAGE,uTAOA,iJb1KF,uCagLE,gSAIA,yHEtHF,6fASE,6EAKA,uHAOA,gFAKA,2RE5EF,iCFqFE,wQGoCF,4yDAaA,o6DAWI,0FEuGJ,qhMAyCE,sEAKA,sEAMF,szEAgBE,+EAKA,+EAMF,yaAYA,gvErB3UI,uhBAAA,mhBAAA,iWAAA,yiBAAA,+8DqBmWF,+lGAuBF,8EAKE,2SAOA,wIpB1ZF,uCoBiaE,wMAKA,sHE7OF,wIASE,iCAIE,kFAKA,kFAOJ,oiEAYE,8FAOF,y2BvBjNI,4gBAAA,0gBAAA,4VAAA,yhBAAA,27EkBRJ,iCKiPE,kJL1PF,iCKoQE,mHAOA,iCG4EF,2iDAYA,khEAaA,yyE1B/VI,6HAAA,+HAAA,uHAAA,iGAAA,+uDFIF,mHGxBF,uCyBmXA,oMAAA,i1D1B/VI,+IAAA,iJAAA,yIAAA,oGAAA,wvDAAA,qH0BiXJ,iwEAYE,qLAMA,iNAMA,sLzB7ZF,uCyBoaE,2T9BtaA,oBCuRF,k6EMxPE,4+CAAA,0iDAAA,2gDNiRF,opBG1RI,0yBAAA,wyBAAA,msBAAA,uzBAAA,q+EGSF,6hCAAA,ykCAAA,mjCNsRF,gsBQoLA,0pBA0BA,oxBAOA,4lBLpfI,szBAAA,ozBAAA,+sBAAA,m0BAAA,6xFGSF,miCAAA,+kCAAA,yjCEifF,01BL1fI,miCAAA,iiCAAA,+4BAAA,gjCAAA,62FK2gBJ,8/BAOE,6qDE1XF,uoBJ/IE,wSAAA,sTAAA,+SMwYF,uiCAmBA,0rBTpaI,4yBAAA,0yBAAA,qsBAAA,yzBAAA,yhFGSF,8hCAAA,0kCAAA,ojCSmbF,sxBZ5bI,28BAAA,y8BAAA,k3BAAA,ogCAAA,ylFAAA,oyBAAA,kyBAAA,6rBAAA,izBAAA,y0EGSF,0hCAAA,skCAAA,gjCSocF,swBZ7cI,26BAAA,y6BAAA,01BAAA,g+BAAA,63EcwKJ,4aAMA,2QAKA,spBdnLI,8yBAAA,4yBAAA,usBAAA,2zBAAA,6kFGSF,+hCAAA,2kCAAA,qjCgByIF,ioBAuBA,0pBEiPA,4/OAgDA,ouBAOA,sgCrBjdI,6sCAAA,usCAAA,+lCAAA,kwCAAA,q8EqBieF,sgJE/NF,w2BAyBA,oyBvB3RI,s8BAAA,o8BAAA,02BAAA,m9BAAA,isFuB0SJ,yjBvB1SI,gsBAAA,8rBAAA,smBAAA,usBAAA,qsF0BwZJ,ioBA4BA,uvB1BpbI,gyBAAA,8xBAAA,yrBAAA,6yBAAA,iuEGSF,whCAAA,okCAAA,8iCuBkbF,i3B1B3bI,6hCAAA,2hCAAA,25BAAA,0iCAAA,i0EAAA,+jC0B4cJ,owB9BleE,oBSodA","sources":["dist/css/component.css","var/www/html/node_modules/@graupl/core/src/scss/theme/typography/_defaults.scss","var/www/html/node_modules/@graupl/core/src/scss/mixins/_layer.scss","var/www/html/node_modules/@graupl/core/src/scss/component/alert/_index.scss","var/www/html/node_modules/@graupl/core/src/scss/base/button/_mixins.scss","var/www/html/node_modules/@graupl/core/src/scss/base/button/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/mixins/_state.scss","var/www/html/node_modules/@graupl/core/src/scss/mixins/_animation.scss","var/www/html/node_modules/@graupl/core/src/scss/component/alert/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/mixins/_theme.scss","var/www/html/node_modules/@graupl/core/src/scss/component/accordion/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/component/accordion/_index.scss","var/www/html/node_modules/@graupl/core/src/scss/component/accordion/_defaults.scss","var/www/html/node_modules/@graupl/core/src/scss/component/badge/_index.scss","var/www/html/node_modules/@graupl/core/src/scss/component/badge/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/component/card/_index.scss","var/www/html/node_modules/@graupl/core/src/scss/component/card/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/mixins/_container.scss","var/www/html/node_modules/@graupl/core/src/scss/component/carousel/_index.scss","var/www/html/node_modules/@graupl/core/src/scss/component/carousel/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/component/disclosure/_index.scss","var/www/html/node_modules/@graupl/core/src/scss/component/disclosure/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/component/input-group/_index.scss","var/www/html/node_modules/@graupl/core/src/scss/component/input-group/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/mixins/_screen.scss","var/www/html/node_modules/@graupl/core/src/scss/component/list/_index.scss","var/www/html/node_modules/@graupl/core/src/scss/component/list/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/component/menu/_index.scss","var/www/html/node_modules/@graupl/core/src/scss/component/menu/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/component/navigation/_index.scss","var/www/html/node_modules/@graupl/core/src/scss/component/navigation/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/component/tabs/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/component/tabs/_index.scss"],"sourcesContent":["@charset \"UTF-8\";\n/* stylelint-disable-next-line scss/dollar-variable-colon-space-after */\n@layer graupl.base {\n  .alert-dismisser {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-width: var(--graupl-button-min-width, 44px);\n    min-height: var(--graupl-button-min-height, 44px);\n    padding: var(--graupl-button-padding, var(--graupl-button-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-button-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    transform: var(--graupl-button-transform, none);\n    transition: var(--graupl-button-transition, background var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), color var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    border-width: var(--graupl-button-border-width, var(--graupl-button-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-button-border-style, var(--graupl-button-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-button-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-button-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-button-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-button-border-radius, var(--graupl-button-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    font-size: var(--graupl-button-font-size, var(--graupl-font-base, calc(1 * var(--graupl-font-size-base, 1rem))));\n    cursor: pointer;\n  }\n  .alert-dismisser:visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .alert-dismisser.visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .alert-dismisser:focus-visible {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .alert-dismisser.focus {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .alert-dismisser:hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .alert-dismisser.hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .alert-dismisser:active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .alert-dismisser.active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .alert-dismisser:disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[disabled].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser[aria-disabled=true].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser.disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .alert-dismisser:disabled {\n    cursor: not-allowed;\n  }\n  .alert-dismisser[disabled] {\n    cursor: not-allowed;\n  }\n  .alert-dismisser[aria-disabled=true] {\n    cursor: not-allowed;\n  }\n  .alert-dismisser.disabled {\n    cursor: not-allowed;\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .alert-dismisser {\n      --graupl-button-transition: var(--graupl-button-transition-reduced-motion, background var(--graupl-transition-timing-function, ease), color var(--graupl-transition-timing-function, ease));\n    }\n  }\n}\n@layer graupl.component {\n  .alert {\n    --graupl-button-border: 0;\n    display: grid;\n    grid-template-columns: [content-start] 1fr [content-end dismiss-start] auto [dismiss-end];\n    grid-template-rows: [header-start] auto [header-end body-start] auto [body-end footer-start] auto [footer-end];\n    padding: var(--graupl-alert-padding, var(--graupl-alert-padding-y, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))) var(--graupl-alert-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    transition: var(--graupl-alert-transition, opacity var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    border-width: var(--graupl-alert-border-width, var(--graupl-alert-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-alert-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-alert-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-alert-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-alert-border-style, var(--graupl-alert-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-alert-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-alert-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-alert-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-alert-border-radius, var(--graupl-alert-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-alert-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-alert-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-alert-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    gap: var(--graupl-alert-gap, var(--graupl-alert-column-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-alert-row-gap, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))));\n  }\n  .alert.hide {\n    display: none;\n  }\n  .alert.transitioning {\n    display: grid;\n    opacity: 0;\n  }\n  .alert.show {\n    display: grid;\n  }\n  .alert-header {\n    grid-column: content;\n    grid-row: header;\n    padding: var(--graupl-alert-header-padding, var(--graupl-alert-header-padding-y, 0) var(--graupl-alert-header-padding-x, 0));\n  }\n  .alert-body {\n    grid-column: content;\n    grid-row: body;\n    padding: var(--graupl-alert-body-padding, var(--graupl-alert-body-padding-y, 0) var(--graupl-alert-body-padding-x, 0));\n  }\n  .alert-footer {\n    grid-column: content;\n    grid-row: footer;\n    padding: var(--graupl-alert-footer-padding, var(--graupl-alert-footer-padding-y, 0) var(--graupl-alert-footer-padding-x, 0));\n  }\n  .alert-dismisser {\n    grid-column: dismiss;\n    grid-row: 1/-1;\n    align-self: flex-start;\n  }\n  .alert-title {\n    margin: var(--graupl-alert-title-margin, 0 0 0 0);\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .alert {\n      --graupl-alert-transition: var(--graupl-alert-transition-reduced-motion, opacity var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    }\n  }\n}\n@layer graupl.theme {\n  .alert {\n    --graupl-button-background: var(--graupl-alert-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    --graupl-button-focus-background: var(--graupl-alert-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    --graupl-link-color: var(--graupl-alert-link-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))))));\n    --graupl-link-visited-color: var(--graupl-alert-link-visited-color, var(--graupl-alert-link-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))))));\n    --graupl-link-focus-color: var(--graupl-alert-link-focus-color, var(--graupl-alert-link-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))))));\n    --graupl-link-hover-color: var(--graupl-alert-link-hover-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))))));\n    --graupl-link-active-color: var(--graupl-alert-link-active-color, var(--graupl-alert-link-hover-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%)))))));\n    --graupl-link-disabled-color: var(--graupl-alert-link-disabled-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    border-color: var(--graupl-alert-border-color, var(--graupl-alert-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background-color: var(--graupl-alert-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-alert-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .alert.primary {\n    --graupl-alert-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n    --graupl-alert-background: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n    --graupl-alert-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-alert-title-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-light--primary--800, var(--graupl-primary--800, hsl(219, 90%, 20%))));\n    --graupl-alert-button-border-color: transparent;\n    --graupl-alert-link-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-light--primary--800, var(--graupl-primary--800, hsl(219, 90%, 20%))));\n    --graupl-alert-link-visited-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-light--primary--800, var(--graupl-primary--800, hsl(219, 90%, 20%))));\n    --graupl-alert-link-focus-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-light--primary--800, var(--graupl-primary--800, hsl(219, 90%, 20%))));\n    --graupl-alert-link-hover-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n    --graupl-alert-link-active-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n    --graupl-alert-link-disabled-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-light--primary--400, var(--graupl-primary--400, hsl(219, 75%, 55%))));\n  }\n  .alert.secondary {\n    --graupl-alert-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n    --graupl-alert-background: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n    --graupl-alert-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-alert-title-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-light--secondary--800, var(--graupl-secondary--800, hsl(235, 30%, 20%))));\n    --graupl-alert-button-border-color: transparent;\n    --graupl-alert-link-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-light--secondary--800, var(--graupl-secondary--800, hsl(235, 30%, 20%))));\n    --graupl-alert-link-visited-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-light--secondary--800, var(--graupl-secondary--800, hsl(235, 30%, 20%))));\n    --graupl-alert-link-focus-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-light--secondary--800, var(--graupl-secondary--800, hsl(235, 30%, 20%))));\n    --graupl-alert-link-hover-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n    --graupl-alert-link-active-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n    --graupl-alert-link-disabled-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))));\n  }\n  .alert.tertiary {\n    --graupl-alert-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n    --graupl-alert-background: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n    --graupl-alert-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-alert-title-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-light--tertiary--800, var(--graupl-tertiary--800, hsl(340, 75%, 20%))));\n    --graupl-alert-button-border-color: transparent;\n    --graupl-alert-link-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-light--tertiary--800, var(--graupl-tertiary--800, hsl(340, 75%, 20%))));\n    --graupl-alert-link-visited-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-light--tertiary--800, var(--graupl-tertiary--800, hsl(340, 75%, 20%))));\n    --graupl-alert-link-focus-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-light--tertiary--800, var(--graupl-tertiary--800, hsl(340, 75%, 20%))));\n    --graupl-alert-link-hover-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n    --graupl-alert-link-active-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n    --graupl-alert-link-disabled-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-light--tertiary--400, var(--graupl-tertiary--400, hsl(340, 60%, 55%))));\n  }\n  .alert-dismisser {\n    border-color: var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .alert-dismisser:visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .alert-dismisser.visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .alert-dismisser:focus-visible {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .alert-dismisser.focus {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .alert-dismisser:hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .alert-dismisser.hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .alert-dismisser:active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .alert-dismisser.active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .alert-dismisser:disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser:disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[disabled].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser[aria-disabled=true].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .alert-dismisser.primary {\n    --graupl-button-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n  }\n  .alert-dismisser.secondary {\n    --graupl-button-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n  }\n  .alert-dismisser.tertiary {\n    --graupl-button-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n  }\n  .alert-title {\n    color: var(--graupl-alert-title-color, var(--graupl-alert-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    font-size: var(--graupl-alert-title-font-size, var(--graupl-h4-font-size, var(--graupl-font-2xl, calc(1.728 * var(--graupl-font-size-base, 1rem)))));\n    font-weight: var(--graupl-alert-title-font-weight, var(--graupl-h4-font-weight, var(--graupl-heading-font-weight, var(--graupl-font-weight-bold, var(--graupl-font-weight-bold, 700)))));\n    line-height: var(--graupl-alert-title-line-height, var(--graupl-h4-line-height, var(--graupl-heading-line-height, var(--graupl-line-height, 1.2em))));\n  }\n}\n/* stylelint-disable scss/operator-no-newline-after -- Prettier wants to format it this way. */\n/* stylelint-enable  scss/operator-no-newline-after */\n@layer graupl.base {\n  .accordion-item-toggle {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-width: var(--graupl-button-min-width, 44px);\n    min-height: var(--graupl-button-min-height, 44px);\n    padding: var(--graupl-button-padding, var(--graupl-button-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-button-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    transform: var(--graupl-button-transform, none);\n    transition: var(--graupl-button-transition, background var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), color var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    border-width: var(--graupl-button-border-width, var(--graupl-button-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-button-border-style, var(--graupl-button-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-button-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-button-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-button-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-button-border-radius, var(--graupl-button-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    font-size: var(--graupl-button-font-size, var(--graupl-font-base, calc(1 * var(--graupl-font-size-base, 1rem))));\n    cursor: pointer;\n  }\n  .accordion-item-toggle:visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .accordion-item-toggle.visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .accordion-item-toggle:focus-visible {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .accordion-item-toggle.focus {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .accordion-item-toggle:hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .accordion-item-toggle.hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .accordion-item-toggle:active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .accordion-item-toggle.active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .accordion-item-toggle:disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled {\n    cursor: not-allowed;\n  }\n  .accordion-item-toggle[disabled] {\n    cursor: not-allowed;\n  }\n  .accordion-item-toggle[aria-disabled=true] {\n    cursor: not-allowed;\n  }\n  .accordion-item-toggle.disabled {\n    cursor: not-allowed;\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .accordion-item-toggle {\n      --graupl-button-transition: var(--graupl-button-transition-reduced-motion, background var(--graupl-transition-timing-function, ease), color var(--graupl-transition-timing-function, ease));\n    }\n  }\n}\n@layer graupl.component {\n  .accordion {\n    display: flex;\n    flex-flow: column nowrap;\n    padding: var(--graupl-accordion-padding, var(--graupl-accordion-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-accordion-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    gap: var(--graupl-accordion-gap, var(--graupl-accordion-column-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-accordion-row-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n  }\n  .accordion > .accordion-item:not(:first-child) {\n    /* stylelint-disable scss/operator-no-newline-after -- Prettier wants to format it this way. */\n    margin-top: calc(-1 * min(var(--graupl-accordion-item-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))), var(--graupl-accordion-item-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem)))));\n    /* stylelint-enable  scss/operator-no-newline-after */\n  }\n  .accordion-item {\n    overflow: hidden;\n    transition: var(--graupl-accordion-item-transition, height var(--graupl-accordion-transition-duration, var(--graupl-transition-duration-slow, 300ms)) var(--graupl-accordion-transition-timing-function, var(--graupl-transition-timing-function, ease)));\n    border-width: var(--graupl-accordion-item-border-width, var(--graupl-accordion-item-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-accordion-item-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-accordion-item-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-accordion-item-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-accordion-item-border-style, var(--graupl-accordion-item-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-accordion-item-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-accordion-item-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-accordion-item-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-accordion-item-border-radius, var(--graupl-accordion-item-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-accordion-item-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-accordion-item-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-accordion-item-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    isolation: isolate;\n  }\n  .accordion-item.hide .accordion-item-content {\n    display: none;\n  }\n  .accordion-item.show .accordion-item-content {\n    transform: var(--graupl-accordion-item-content-open-transform, translateY(0));\n    opacity: 1;\n  }\n  .accordion-item.transitioning .accordion-item-content {\n    display: flex;\n  }\n  .accordion-item-toggle {\n    z-index: 2;\n    padding: var(--graupl-accordion-item-toggle-padding, var(--graupl-accordion-item-toggle-padding-y, var(--graupl-button-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))))) var(--graupl-accordion-item-toggle-padding-x, var(--graupl-button-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))))));\n    transform: var(--graupl-accordion-item-toggle-transform, none);\n    transition: var(--graupl-accordion-item-toggle-transition, background var(--graupl-accordion-transition-duration, var(--graupl-transition-duration-slow, 300ms)) var(--graupl-accordion-transition-timing-function, var(--graupl-transition-timing-function, ease)), color var(--graupl-accordion-transition-duration, var(--graupl-transition-duration-slow, 300ms)) var(--graupl-accordion-transition-timing-function, var(--graupl-transition-timing-function, ease)), transform var(--graupl-accordion-transition-duration, var(--graupl-transition-duration-slow, 300ms)) var(--graupl-accordion-transition-timing-function, var(--graupl-transition-timing-function, ease)));\n  }\n  .accordion-item-toggle:visited {\n    transform: var(--graupl-accordion-item-toggle-visited-transform, var(--graupl-accordion-item-toggle-transform, none));\n  }\n  .accordion-item-toggle.visited {\n    transform: var(--graupl-accordion-item-toggle-visited-transform, var(--graupl-accordion-item-toggle-transform, none));\n  }\n  .accordion-item-toggle:focus-visible {\n    transform: var(--graupl-accordion-item-toggle-focus-transform, var(--graupl-accordion-item-toggle-transform, none));\n  }\n  .accordion-item-toggle.focus {\n    transform: var(--graupl-accordion-item-toggle-focus-transform, var(--graupl-accordion-item-toggle-transform, none));\n  }\n  .accordion-item-toggle:hover {\n    transform: var(--graupl-accordion-item-toggle-hover-transform, var(--graupl-accordion-item-toggle-transform, none));\n  }\n  .accordion-item-toggle.hover {\n    transform: var(--graupl-accordion-item-toggle-hover-transform, var(--graupl-accordion-item-toggle-transform, none));\n  }\n  .accordion-item-toggle:active {\n    transform: var(--graupl-accordion-item-toggle-active-transform, none);\n  }\n  .accordion-item-toggle.active {\n    transform: var(--graupl-accordion-item-toggle-active-transform, none);\n  }\n  .accordion-item-toggle:disabled {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled:visited {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.visited {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled:focus-visible {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.focus {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled:hover {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.hover {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled:active {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.active {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled[aria-selected=true] {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.selected {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled[aria-current=true] {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle:disabled.current {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled] {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled]:visited {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].visited {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled]:focus-visible {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].focus {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled]:hover {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].hover {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled]:active {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].active {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled][aria-selected=true] {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].selected {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled][aria-current=true] {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[disabled].current {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true] {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true]:visited {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].visited {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true]:focus-visible {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].focus {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true]:hover {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].hover {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true]:active {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].active {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true][aria-selected=true] {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].selected {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true][aria-current=true] {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle[aria-disabled=true].current {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled:visited {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.visited {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled:focus-visible {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.focus {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled:hover {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.hover {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled:active {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.active {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled[aria-selected=true] {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.selected {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled[aria-current=true] {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle.disabled.current {\n    transform: var(--graupl-accordion-item-toggle-disabled-transform, none);\n  }\n  .accordion-item-toggle::after {\n    content: \"▼\";\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-left: auto;\n    transform: var(--graupl-accordion-item-toggle-pseudo-transform, none);\n    transition: var(--graupl-accordion-item-toggle-pseudo-transition, transform var(--graupl-accordion-transition-duration, var(--graupl-transition-duration-slow, 300ms)) var(--graupl-accordion-transition-timing-function, var(--graupl-transition-timing-function, ease)));\n  }\n  .accordion-item-toggle[aria-expanded=true]::after {\n    transform: var(--graupl-accordion-item-toggle-pseudo-open-transform, rotate(-180deg));\n  }\n  .accordion-item-header {\n    margin: var(--graupl-accordion-item-header-margin, calc(-1 * min(var(--graupl-accordion-item-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))), var(--graupl-accordion-item-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))), var(--graupl-accordion-item-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))), var(--graupl-accordion-item-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))))));\n    padding: var(--graupl-accordion-item-header-padding, var(--graupl-accordion-item-header-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-accordion-item-header-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n  }\n  .accordion-item-title {\n    margin: var(--graupl-accordion-item-title-margin, var(--graupl-accordion-item-title-margin-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-accordion-item-title-margin-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    padding: var(--graupl-accordion-item-title-padding, var(--graupl-accordion-item-title-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-accordion-item-title-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n  }\n  .accordion-item-title,\n  .accordion-item-title .accordion-item-toggle {\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    width: 100%;\n  }\n  .accordion-item-content {\n    display: flex;\n    flex-flow: column nowrap;\n    padding: var(--graupl-accordion-item-content-padding, var(--graupl-accordion-item-content-padding-y, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))) var(--graupl-accordion-item-content-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    transform: var(--graupl-accordion-item-content-transform, translateY(-100%));\n    transition: var(--graupl-accordion-item-content-transition, opacity var(--graupl-accordion-transition-duration, var(--graupl-transition-duration-slow, 300ms)) var(--graupl-accordion-transition-timing-function, var(--graupl-transition-timing-function, ease)) transform var(--graupl-accordion-transition-duration, var(--graupl-transition-duration-slow, 300ms)) var(--graupl-accordion-transition-timing-function, var(--graupl-transition-timing-function, ease)));\n    opacity: 0;\n    gap: var(--graupl-accordion-item-content-gap, var(--graupl-accordion-item-content-column-gap, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-accordion-item-content-row-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n  }\n  .accordion-item-body {\n    padding: var(--graupl-accordion-item-body-padding, var(--graupl-accordion-item-body-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-accordion-item-body-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n  }\n  .accordion-item-footer {\n    padding: var(--graupl-accordion-item-footer-padding, var(--graupl-accordion-item-footer-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-accordion-item-footer-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .accordion-item {\n      transition: var(--graupl-accordion-item-transition-reduced-motion, none);\n    }\n    .accordion-item-toggle {\n      transition: var(--graupl-accordion-item-toggle-transition-reduced-motion, background var(--graupl-accordion-transition-duration, var(--graupl-transition-duration-slow, 300ms)) var(--graupl-accordion-transition-timing-function, var(--graupl-transition-timing-function, ease)), color var(--graupl-accordion-transition-duration, var(--graupl-transition-duration-slow, 300ms)) var(--graupl-accordion-transition-timing-function, var(--graupl-transition-timing-function, ease)));\n    }\n    .accordion-item-toggle::after {\n      transition: var(--graupl-accordion-item-toggle-pseudo-transition-reduced-motion, none);\n    }\n    .accordion-item-toggle .accordion-item-content {\n      transition: var(--graupl-accordion-item-content-transition-reduced-motion, opacity var(--graupl-accordion-transition-duration, var(--graupl-transition-duration-slow, 300ms)) var(--graupl-accordion-transition-timing-function, var(--graupl-transition-timing-function, ease)));\n    }\n  }\n}\n@layer graupl.state {\n  .accordion-item .accordion-item-toggle {\n    /* stylelint-disable scss/operator-no-newline-after -- Prettier wants to format it this way. */\n    --graupl-focus-outline-offset: calc(\n      -1 *\n        (\n          min(\n              var(--graupl-accordion-item-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))),\n              var(--graupl-accordion-item-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))),\n              var(--graupl-accordion-item-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))),\n              var(--graupl-accordion-item-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem)))\n            ) +\n            var(--graupl-focus-width, var(--graupl-border-width, 0.125rem))\n        )\n    );\n    /* stylelint-enable  scss/operator-no-newline-after */\n  }\n}\n@layer graupl.theme {\n  .accordion {\n    border-color: var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .accordion-item {\n    border-color: var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-accordion-item-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-accordion-item-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .accordion-item-content {\n    background: var(--graupl-accordion-item-content-background, var(--graupl-accordion-item-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-accordion-item-content-color, var(--graupl-accordion-item-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .accordion-item-toggle {\n    border-color: var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .accordion-item-toggle:visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .accordion-item-toggle.visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .accordion-item-toggle:focus-visible {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .accordion-item-toggle.focus {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .accordion-item-toggle:hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .accordion-item-toggle.hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .accordion-item-toggle:active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle:disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[disabled].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle[aria-disabled=true].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .accordion-item-toggle.primary {\n    --graupl-button-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n  }\n  .accordion-item-toggle.secondary {\n    --graupl-button-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n  }\n  .accordion-item-toggle.tertiary {\n    --graupl-button-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n  }\n  .accordion-item-toggle {\n    border-color: var(--graupl-accordion-item-toggle-border-color, var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-accordion-item-toggle-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-accordion-item-toggle-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .accordion-item-toggle:visited {\n    border-color: var(--graupl-accordion-item-toggle-visited-border-color, var(--graupl-accordion-item-toggle-border-color, var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    color: var(--graupl-accordion-item-toggle-visited-color, var(--graupl-accordion-item-toggle-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-accordion-item-toggle-visited-background, var(--graupl-accordion-item-toggle-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .accordion-item-toggle.visited {\n    border-color: var(--graupl-accordion-item-toggle-visited-border-color, var(--graupl-accordion-item-toggle-border-color, var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    color: var(--graupl-accordion-item-toggle-visited-color, var(--graupl-accordion-item-toggle-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-accordion-item-toggle-visited-background, var(--graupl-accordion-item-toggle-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .accordion-item-toggle:focus-visible {\n    border-color: var(--graupl-accordion-item-toggle-focus-border-color, var(--graupl-accordion-item-toggle-border-color, var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    color: var(--graupl-accordion-item-toggle-focus-color, var(--graupl-accordion-item-toggle-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-accordion-item-toggle-focus-background, var(--graupl-accordion-item-toggle-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .accordion-item-toggle.focus {\n    border-color: var(--graupl-accordion-item-toggle-focus-border-color, var(--graupl-accordion-item-toggle-border-color, var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    color: var(--graupl-accordion-item-toggle-focus-color, var(--graupl-accordion-item-toggle-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-accordion-item-toggle-focus-background, var(--graupl-accordion-item-toggle-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .accordion-item-toggle:hover {\n    border-color: var(--graupl-accordion-item-toggle-hover-border-color, var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-accordion-item-toggle-hover-color, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    background: var(--graupl-accordion-item-toggle-hover-background, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .accordion-item-toggle.hover {\n    border-color: var(--graupl-accordion-item-toggle-hover-border-color, var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-accordion-item-toggle-hover-color, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    background: var(--graupl-accordion-item-toggle-hover-background, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .accordion-item-toggle:active {\n    border-color: var(--graupl-accordion-item-toggle-active-border-color, var(--graupl-accordion-item-toggle-hover-border-color, var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    color: var(--graupl-accordion-item-toggle-active-color, var(--graupl-accordion-item-toggle-hover-color, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    background: var(--graupl-accordion-item-toggle-active-background, var(--graupl-accordion-item-toggle-hover-background, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .accordion-item-toggle.active {\n    border-color: var(--graupl-accordion-item-toggle-active-border-color, var(--graupl-accordion-item-toggle-hover-border-color, var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    color: var(--graupl-accordion-item-toggle-active-color, var(--graupl-accordion-item-toggle-hover-color, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    background: var(--graupl-accordion-item-toggle-active-background, var(--graupl-accordion-item-toggle-hover-background, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .accordion-item-toggle:disabled {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled:visited {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled.visited {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled:focus-visible {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled.focus {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled:hover {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled.hover {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled:active {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled.active {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled[aria-selected=true] {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled.selected {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled[aria-current=true] {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle:disabled.current {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled] {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled]:visited {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled].visited {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled]:focus-visible {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled].focus {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled]:hover {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled].hover {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled]:active {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled].active {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled][aria-selected=true] {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled].selected {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled][aria-current=true] {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[disabled].current {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true] {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true]:visited {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true].visited {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true].focus {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true]:hover {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true].hover {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true]:active {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true].active {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true].selected {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle[aria-disabled=true].current {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled:visited {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled.visited {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled:focus-visible {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled.focus {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled:hover {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled.hover {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled:active {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled.active {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled[aria-selected=true] {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled.selected {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled[aria-current=true] {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-toggle.disabled.current {\n    border-color: var(--graupl-accordion-item-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-accordion-item-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-accordion-item-toggle-disabled-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .accordion-item-title {\n    --graupl-accordion-item-toggle-color: var(--graupl-accordion-item-title-color, var(--graupl-accordion-item-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    --graupl-accordion-item-toggle-background: var(--graupl-accordion-item-title-background, var(--graupl-accordion-item-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    --graupl-accordion-item-toggle-border-color: var(--graupl-accordion-item-title-border-color, var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .accordion-item-title,\n  .accordion-item-title .accordion-item-toggle {\n    border-color: var(--graupl-accordion-item-title-border-color, var(--graupl-accordion-item-border-color, var(--graupl-accordion-border-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-accordion-item-title-background, var(--graupl-accordion-item-background, var(--graupl-accordion-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-accordion-item-title-color, var(--graupl-accordion-item-color, var(--graupl-accordion-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    font-family: var(--graupl-accordion-item-title-font-family, var(--graupl-h5-font-family, var(--graupl-heading-font-family, var(--graupl-root-font-family, system-ui, -apple-system, blinkmacsystemfont, Segoe UI, roboto, Helvetica Neue, arial, sans-serif))));\n    font-size: var(--graupl-accordion-item-title-font-size, var(--graupl-h5-font-size, var(--graupl-font-xl, calc(1.44 * var(--graupl-font-size-base, 1rem)))));\n    font-weight: var(--graupl-accordion-item-title-font-weight, var(--graupl-h5-font-weight, var(--graupl-heading-font-weight, var(--graupl-font-weight-bold, var(--graupl-font-weight-bold, 700)))));\n    line-height: var(--graupl-accordion-item-title-line-height, var(--graupl-h5-line-height, var(--graupl-heading-line-height, var(--graupl-line-height, 1.2em))));\n  }\n}\n@layer graupl.component {\n  .badge {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: var(--graupl-badge-padding, var(--graupl-badge-padding-y, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)))) var(--graupl-badge-padding-x, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))));\n    border-width: var(--graupl-badge-border-width, var(--graupl-badge-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-badge-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-badge-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-badge-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-badge-border-style, var(--graupl-badge-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-badge-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-badge-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-badge-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-badge-border-radius, var(--graupl-badge-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-badge-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-badge-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-badge-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    font-size: var(--graupl-badge-font-size, var(--graupl-font-sm, calc(0.833 * var(--graupl-font-size-base, 1rem))));\n  }\n}\n@layer graupl.theme {\n  .badge {\n    border-color: var(--graupl-badge-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-badge-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-badge-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .badge.primary {\n    --graupl-badge-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n    --graupl-badge-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n  }\n  .badge.secondary {\n    --graupl-badge-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n    --graupl-badge-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n  }\n  .badge.tertiary {\n    --graupl-badge-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n    --graupl-badge-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n  }\n}\n@layer graupl.component {\n  .card {\n    display: grid;\n    position: relative;\n    grid-template-columns: [image-start content-start] 1fr [image-end content-end];\n    padding: var(--graupl-card-padding, var(--graupl-card-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-card-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    transform: var(--graupl-card-transform, none);\n    transition: var(--graupl-card-transition, transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    border-width: var(--graupl-card-border-width, var(--graupl-card-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-card-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-card-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-card-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-card-border-style, var(--graupl-card-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-card-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-card-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-card-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-card-border-radius, var(--graupl-card-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-card-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-card-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-card-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    gap: var(--graupl-card-gap, var(--graupl-card-column-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-card-row-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    isolation: isolate;\n  }\n  .card, .card.top {\n    grid-template-rows: [image-start] var(--graupl-card-image-ratio, auto) [image-end content-start] var(--graupl-card-content-ratio, 1fr) [content-end];\n  }\n  .card.bottom, .card.inverse {\n    grid-template-rows: [content-start] var(--graupl-card-content-ratio, 1fr) [content-end image-start] var(--graupl-card-image-ratio, auto) [image-end];\n  }\n  .card:hover {\n    --graupl-card-transform: var(--graupl-card-hover-transform, none);\n  }\n  .card.horizontal, .card.horizontal.left {\n    --graupl-card-content-ratio: var(--graupl-horizontal-card-content-ratio, 3fr);\n    --graupl-card-image-ratio: var(--graupl-horizontal-card-image-ratio, 2fr);\n    grid-template-columns: [image-start] var(--graupl-card-image-ratio, auto) [image-end content-start] var(--graupl-card-content-ratio, 1fr) [content-end];\n    grid-template-rows: [image-start content-start] 1fr [image-end content-end];\n  }\n  .card.horizontal .card-image img, .card.horizontal.left .card-image img {\n    border-radius: calc(var(--graupl-card-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) - min(var(--graupl-card-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))), var(--graupl-card-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))))) 0 0 calc(var(--graupl-card-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))) - min(var(--graupl-card-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))), var(--graupl-card-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem)))));\n  }\n  .card.horizontal.right, .card.horizontal.inverse {\n    grid-template-columns: [content-start] var(--graupl-card-content-ratio, 1fr) [content-end image-start] var(--graupl-card-image-ratio, auto) [image-end];\n  }\n  .card.horizontal.right .card-image img, .card.horizontal.inverse .card-image img {\n    border-radius: 0 calc(var(--graupl-card-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) - min(var(--graupl-card-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))), var(--graupl-card-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))))) calc(var(--graupl-card-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) - min(var(--graupl-card-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))), var(--graupl-card-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))))) 0;\n  }\n  .card-image {\n    grid-area: image;\n    padding: var(--graupl-card-image-padding, var(--graupl-card-image-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-card-image-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n  }\n  .card-image img {\n    width: 100%;\n    height: 100%;\n    border-radius: calc(var(--graupl-card-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) - min(var(--graupl-card-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))), var(--graupl-card-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))))) calc(var(--graupl-card-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) - min(var(--graupl-card-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))), var(--graupl-card-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))))) 0 0;\n    object-fit: cover;\n  }\n  .card-content {\n    display: flex;\n    grid-area: content;\n    flex-direction: column;\n    padding: var(--graupl-card-content-padding, var(--graupl-card-content-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-card-content-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    gap: var(--graupl-card-content-gap, var(--graupl-card-content-column-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-card-content-row-gap, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))));\n  }\n  .card-body {\n    flex: 1 0 auto;\n  }\n  .card-footer {\n    flex: 0 0 auto;\n  }\n  .card-title {\n    flex: 0 0 auto;\n  }\n  @container (width <= 767px) {\n    .card.horizontal, .card.horizontal.left, .card.horizontal.top, .card.horizontal.right, .card.horizontal.bottom, .card.horizontal.inverse {\n      --graupl-horizontal-card-image-ratio: auto;\n      --graupl-horizontal-card-content-ratio: 1fr;\n      grid-template-columns: [image-start content-start] 1fr [image-end content-end];\n    }\n    .card.horizontal, .card.horizontal.left, .card.horizontal.right, .card.horizontal.top {\n      grid-template-rows: [image-start] var(--graupl-card-image-ratio, auto) [image-end content-start] var(--graupl-card-content-ratio, 1fr) [content-end];\n    }\n    .card.horizontal.bottom, .card.horizontal.inverse {\n      grid-template-rows: [content-start] var(--graupl-card-content-ratio, 1fr) [content-end image-start] var(--graupl-card-image-ratio, auto) [image-end];\n    }\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .card {\n      --graupl-card-transition: var(--graupl-card-transition-reduced-motion, none);\n    }\n  }\n}\n@layer graupl.theme {\n  .card {\n    --graupl-color: var(--graupl-card-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    --graupl-background: var(--graupl-card-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    border-color: var(--graupl-card-border-color, var(--graupl-card-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-card-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-card-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .card-title {\n    color: var(--graupl-card-title-color, var(--graupl-card-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    font-size: var(--graupl-card-title-font-size, var(--graupl-h4-font-size, var(--graupl-font-2xl, calc(1.728 * var(--graupl-font-size-base, 1rem)))));\n    font-weight: var(--graupl-card-title-font-weight, var(--graupl-h4-font-weight, var(--graupl-heading-font-weight, var(--graupl-font-weight-bold, var(--graupl-font-weight-bold, 700)))));\n    line-height: var(--graupl-card-title-line-height, var(--graupl-h4-line-height, var(--graupl-heading-line-height, var(--graupl-line-height, 1.2em))));\n  }\n}\n@layer graupl.base {\n  .carousel-control {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-width: var(--graupl-button-min-width, 44px);\n    min-height: var(--graupl-button-min-height, 44px);\n    padding: var(--graupl-button-padding, var(--graupl-button-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-button-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    transform: var(--graupl-button-transform, none);\n    transition: var(--graupl-button-transition, background var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), color var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    border-width: var(--graupl-button-border-width, var(--graupl-button-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-button-border-style, var(--graupl-button-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-button-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-button-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-button-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-button-border-radius, var(--graupl-button-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    font-size: var(--graupl-button-font-size, var(--graupl-font-base, calc(1 * var(--graupl-font-size-base, 1rem))));\n    cursor: pointer;\n  }\n  .carousel-control:visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-control.visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-control:focus-visible {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-control.focus {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-control:hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-control.hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-control:active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .carousel-control.active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .carousel-control:disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[disabled].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control[aria-disabled=true].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control.disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-control:disabled {\n    cursor: not-allowed;\n  }\n  .carousel-control[disabled] {\n    cursor: not-allowed;\n  }\n  .carousel-control[aria-disabled=true] {\n    cursor: not-allowed;\n  }\n  .carousel-control.disabled {\n    cursor: not-allowed;\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .carousel-control {\n      --graupl-button-transition: var(--graupl-button-transition-reduced-motion, background var(--graupl-transition-timing-function, ease), color var(--graupl-transition-timing-function, ease));\n    }\n  }\n  .carousel-tab {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-width: var(--graupl-button-min-width, 44px);\n    min-height: var(--graupl-button-min-height, 44px);\n    padding: var(--graupl-button-padding, var(--graupl-button-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-button-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    transform: var(--graupl-button-transform, none);\n    transition: var(--graupl-button-transition, background var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), color var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    border-width: var(--graupl-button-border-width, var(--graupl-button-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-button-border-style, var(--graupl-button-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-button-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-button-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-button-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-button-border-radius, var(--graupl-button-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    font-size: var(--graupl-button-font-size, var(--graupl-font-base, calc(1 * var(--graupl-font-size-base, 1rem))));\n    cursor: pointer;\n  }\n  .carousel-tab:visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-tab.visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-tab:focus-visible {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-tab.focus {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-tab:hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-tab.hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .carousel-tab:active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .carousel-tab.active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .carousel-tab:disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[disabled].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab[aria-disabled=true].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab.disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .carousel-tab:disabled {\n    cursor: not-allowed;\n  }\n  .carousel-tab[disabled] {\n    cursor: not-allowed;\n  }\n  .carousel-tab[aria-disabled=true] {\n    cursor: not-allowed;\n  }\n  .carousel-tab.disabled {\n    cursor: not-allowed;\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .carousel-tab {\n      --graupl-button-transition: var(--graupl-button-transition-reduced-motion, background var(--graupl-transition-timing-function, ease), color var(--graupl-transition-timing-function, ease));\n    }\n  }\n}\n@layer graupl.component {\n  .carousel {\n    display: grid;\n    position: relative;\n    grid-template-columns: [slide-start controls-start] auto [tabs-start] var(--graupl-carousel-tabs-width, 1fr) [tabs-end] auto [controls-end slide-end];\n    grid-template-rows: [slide-start controls-start] var(--graupl-carousel-controls-height, auto) [controls-end] var(--graupl-carousel-slide-height, 1fr) [tabs-start] var(--graupl-carousel-tabs-height, auto) [tabs-end slide-end];\n    isolation: isolate;\n    padding: var(--graupl-carousel-padding, var(--graupl-carousel-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-carousel-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n  }\n  .carousel[data-graupl-action=next] .carousel-item.previous {\n    transform: translateX(calc(-1 * var(--graupl-carousel-item-max-width, 100%)));\n  }\n  .carousel[data-graupl-action=next] .carousel-item.previous.active {\n    transform: none;\n  }\n  .carousel[data-graupl-action=next] .carousel-item.next {\n    transform: translateX(var(--graupl-carousel-item-max-width, 100%));\n  }\n  .carousel[data-graupl-action=next] .carousel-item.next.active {\n    transform: none;\n  }\n  .carousel[data-graupl-action=previous] .carousel-item.previous {\n    transform: translateX(var(--graupl-carousel-item-max-width, 100%));\n  }\n  .carousel[data-graupl-action=previous] .carousel-item.previous.active {\n    transform: none;\n  }\n  .carousel[data-graupl-action=previous] .carousel-item.next {\n    transform: translateX(calc(-1 * var(--graupl-carousel-item-max-width, 100%)));\n  }\n  .carousel[data-graupl-action=previous] .carousel-item.next.active {\n    transform: none;\n  }\n  .carousel-control-container {\n    display: grid;\n    z-index: 1;\n    grid-area: controls;\n    grid-template-columns: [autoplay-start] var(--graupl-carousel-control-width, 4rem) [autoplay-end] 1fr [previous-start] var(--graupl-carousel-control-width, 4rem) [previous-end next-start] var(--graupl-carousel-control-width, 4rem) [next-end];\n    grid-template-rows: [autoplay-start next-start previous-start] var(--graupl-carousel-control-height, 3rem) [previous-end next-end autoplay-end];\n    pointer-events: none;\n  }\n  .carousel-control {\n    pointer-events: auto;\n  }\n  .carousel-control.autoplay {\n    grid-area: autoplay;\n  }\n  .carousel-control.play::before {\n    content: var(--graupl-carousel-play-content, '▶');\n    display: inline-block;\n  }\n  .carousel-control.pause::before {\n    content: var(--graupl-carousel-pause-content, '❚❚');\n    display: inline-block;\n  }\n  .carousel-control.next {\n    grid-area: next;\n  }\n  .carousel-control.next::before {\n    content: var(--graupl-carousel-next-content, '▶');\n    display: inline-block;\n  }\n  .carousel-control.previous {\n    grid-area: previous;\n  }\n  .carousel-control.previous::before {\n    content: var(--graupl-carousel-previous-content, '◀');\n    display: inline-block;\n  }\n  .carousel-item-container {\n    display: grid;\n    z-index: 0;\n    grid-area: slide;\n    grid-template-areas: \"items\";\n    padding: var(--graupl-carousel-item-container-padding, var(--graupl-carousel-item-container-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-carousel-item-container-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    overflow-x: hidden;\n    isolation: isolate;\n  }\n  .carousel-item {\n    z-index: -1;\n    grid-area: items;\n    max-width: var(--graupl-carousel-item-max-width, 100%);\n    opacity: 0;\n  }\n  .carousel-item.active {\n    z-index: 1;\n    transform: none;\n    transition: transform var(--graupl-carousel-transition-duration, 500ms) ease-in-out;\n    opacity: 1;\n  }\n  .carousel-item.previous {\n    z-index: 1;\n    transform: translateX(calc(-1 * var(--graupl-carousel-item-max-width, 100%)));\n    transition: transform var(--graupl-carousel-transition-duration, 500ms) ease-in-out;\n    opacity: 1;\n  }\n  .carousel-item.previous.active {\n    transform: none;\n  }\n  .carousel-item.next {\n    z-index: 1;\n    transform: translateX(var(--graupl-carousel-item-max-width, 100%));\n    opacity: 1;\n  }\n  .carousel-item.next.active {\n    transform: none;\n  }\n  .carousel-tab-container {\n    display: flex;\n    z-index: 1;\n    grid-area: tabs;\n    justify-content: center;\n    padding: var(--graupl-carousel-tab-container-padding, var(--graupl-carousel-tab-container-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-carousel-tab-container-padding-x, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))));\n    gap: var(--graupl-carousel-tab-container-gap, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))));\n    pointer-events: none;\n  }\n  .carousel-tab {\n    --graupl-button-border-radius: 50%;\n    pointer-events: auto;\n  }\n}\n@layer graupl.theme {\n  .carousel-control {\n    border-color: var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .carousel-control:visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-control.visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-control:focus-visible {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-control.focus {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-control:hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .carousel-control.hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .carousel-control:active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control:disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[disabled].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control[aria-disabled=true].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-control.primary {\n    --graupl-button-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n  }\n  .carousel-control.secondary {\n    --graupl-button-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n  }\n  .carousel-control.tertiary {\n    --graupl-button-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n  }\n  .carousel-control {\n    border-color: var(--graupl-carousel-control-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-carousel-control-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-carousel-control-color, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-control:visited {\n    border-color: var(--graupl-carousel-control-visited-border-color, var(--graupl-carousel-control-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-control-visited-color, var(--graupl-carousel-control-color, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-carousel-control-visited-background, var(--graupl-carousel-control-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .carousel-control.visited {\n    border-color: var(--graupl-carousel-control-visited-border-color, var(--graupl-carousel-control-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-control-visited-color, var(--graupl-carousel-control-color, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-carousel-control-visited-background, var(--graupl-carousel-control-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .carousel-control:focus-visible {\n    border-color: var(--graupl-carousel-control-focus-border-color, var(--graupl-carousel-control-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-control-focus-color, var(--graupl-carousel-control-color, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-carousel-control-focus-background, var(--graupl-carousel-control-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .carousel-control.focus {\n    border-color: var(--graupl-carousel-control-focus-border-color, var(--graupl-carousel-control-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-control-focus-color, var(--graupl-carousel-control-color, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-carousel-control-focus-background, var(--graupl-carousel-control-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .carousel-control:hover {\n    border-color: var(--graupl-carousel-control-hover-border-color, var(--graupl-carousel-control-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-control-hover-color, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    background: var(--graupl-carousel-control-hover-background, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-control.hover {\n    border-color: var(--graupl-carousel-control-hover-border-color, var(--graupl-carousel-control-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-control-hover-color, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    background: var(--graupl-carousel-control-hover-background, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-control:active {\n    border-color: var(--graupl-carousel-control-active-border-color, var(--graupl-carousel-control-hover-border-color, var(--graupl-carousel-control-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    color: var(--graupl-carousel-control-active-color, var(--graupl-carousel-control-hover-color, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    background: var(--graupl-carousel-control-active-background, var(--graupl-carousel-control-hover-background, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .carousel-control.active {\n    border-color: var(--graupl-carousel-control-active-border-color, var(--graupl-carousel-control-hover-border-color, var(--graupl-carousel-control-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    color: var(--graupl-carousel-control-active-color, var(--graupl-carousel-control-hover-color, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    background: var(--graupl-carousel-control-active-background, var(--graupl-carousel-control-hover-background, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .carousel-control:disabled {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled:visited {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled.visited {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled:focus-visible {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled.focus {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled:hover {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled.hover {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled:active {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled.active {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled[aria-selected=true] {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled.selected {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled[aria-current=true] {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control:disabled.current {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled] {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled]:visited {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled].visited {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled]:focus-visible {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled].focus {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled]:hover {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled].hover {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled]:active {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled].active {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled][aria-selected=true] {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled].selected {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled][aria-current=true] {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[disabled].current {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true] {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true]:visited {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true].visited {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true].focus {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true]:hover {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true].hover {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true]:active {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true].active {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true].selected {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control[aria-disabled=true].current {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled:visited {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled.visited {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled:focus-visible {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled.focus {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled:hover {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled.hover {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled:active {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled.active {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled[aria-selected=true] {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled.selected {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled[aria-current=true] {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-control.disabled.current {\n    border-color: var(--graupl-carousel-control-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-control-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-control-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab {\n    border-color: var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .carousel-tab:visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-tab.visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-tab:focus-visible {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-tab.focus {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-tab:hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .carousel-tab.hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .carousel-tab:active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab:disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[disabled].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab[aria-disabled=true].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .carousel-tab.primary {\n    --graupl-button-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n  }\n  .carousel-tab.secondary {\n    --graupl-button-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n  }\n  .carousel-tab.tertiary {\n    --graupl-button-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n  }\n  .carousel-tab {\n    border-color: var(--graupl-carousel-tab-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-carousel-tab-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-carousel-tab-color, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-tab:visited {\n    border-color: var(--graupl-carousel-tab-visited-border-color, var(--graupl-carousel-tab-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-tab-visited-color, var(--graupl-carousel-tab-color, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-carousel-tab-visited-background, var(--graupl-carousel-tab-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .carousel-tab.visited {\n    border-color: var(--graupl-carousel-tab-visited-border-color, var(--graupl-carousel-tab-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-tab-visited-color, var(--graupl-carousel-tab-color, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-carousel-tab-visited-background, var(--graupl-carousel-tab-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .carousel-tab:focus-visible {\n    border-color: var(--graupl-carousel-tab-focus-border-color, var(--graupl-carousel-tab-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-tab-focus-color, var(--graupl-carousel-tab-color, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-carousel-tab-focus-background, var(--graupl-carousel-tab-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .carousel-tab.focus {\n    border-color: var(--graupl-carousel-tab-focus-border-color, var(--graupl-carousel-tab-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-tab-focus-color, var(--graupl-carousel-tab-color, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-carousel-tab-focus-background, var(--graupl-carousel-tab-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .carousel-tab:hover {\n    border-color: var(--graupl-carousel-tab-hover-border-color, var(--graupl-carousel-tab-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-tab-hover-color, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    background: var(--graupl-carousel-tab-hover-background, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-tab.hover {\n    border-color: var(--graupl-carousel-tab-hover-border-color, var(--graupl-carousel-tab-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-carousel-tab-hover-color, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    background: var(--graupl-carousel-tab-hover-background, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .carousel-tab:active {\n    border-color: var(--graupl-carousel-tab-active-border-color, var(--graupl-carousel-tab-hover-border-color, var(--graupl-carousel-tab-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    color: var(--graupl-carousel-tab-active-color, var(--graupl-carousel-tab-hover-color, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    background: var(--graupl-carousel-tab-active-background, var(--graupl-carousel-tab-hover-background, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .carousel-tab.active {\n    border-color: var(--graupl-carousel-tab-active-border-color, var(--graupl-carousel-tab-hover-border-color, var(--graupl-carousel-tab-border-color, var(--graupl-carousel-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    color: var(--graupl-carousel-tab-active-color, var(--graupl-carousel-tab-hover-color, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    background: var(--graupl-carousel-tab-active-background, var(--graupl-carousel-tab-hover-background, var(--graupl-carousel-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .carousel-tab:disabled {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled:visited {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled.visited {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled:focus-visible {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled.focus {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled:hover {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled.hover {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled:active {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled.active {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled[aria-selected=true] {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled.selected {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled[aria-current=true] {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab:disabled.current {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled] {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled]:visited {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled].visited {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled]:focus-visible {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled].focus {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled]:hover {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled].hover {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled]:active {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled].active {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled][aria-selected=true] {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled].selected {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled][aria-current=true] {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[disabled].current {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true] {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true]:visited {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true].visited {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true].focus {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true]:hover {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true].hover {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true]:active {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true].active {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true].selected {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab[aria-disabled=true].current {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled:visited {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled.visited {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled:focus-visible {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled.focus {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled:hover {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled.hover {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled:active {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled.active {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled[aria-selected=true] {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled.selected {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled[aria-current=true] {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .carousel-tab.disabled.current {\n    border-color: var(--graupl-carousel-tab-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    color: var(--graupl-carousel-tab-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-carousel-tab-disabled-background, var(--graupl-carousel-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n}\n@layer graupl.component {\n  .disclosure {\n    display: var(--graupl-disclosure-display, flex);\n    block-size: var(--graupl-disclosure-block-size, 0);\n    overflow: hidden;\n    transition: var(--graupl-disclosure-transition, opacity var(--graupl-disclosure-transition-duration, var(--graupl-transition-duration-fast, 150ms)) var(--graupl-disclosure-transition-timing-function, var(--graupl-transition-timing-function, ease)), block-size var(--graupl-disclosure-transition-duration, var(--graupl-transition-duration-fast, 150ms)) var(--graupl-disclosure-transition-timing-function, var(--graupl-transition-timing-function, ease)));\n    opacity: var(--graupl-disclosure-opacity, var(--graupl-disclosure-hide-opacity, 0));\n  }\n  .disclosure.hide {\n    --graupl-disclosure-display: var(--graupl-disclosure-hide-display, flex);\n    --graupl-disclosure-block-size: var(--graupl-disclosure-hide-block-size, 0);\n    --graupl-disclosure-opacity: var(--graupl-disclosure-hide-opacity, 0);\n  }\n  .disclosure.transitioning {\n    --graupl-disclosure-display: var(--graupl-disclosure-transitioning-display, flex);\n    --graupl-disclosure-block-size: var(--graupl-disclosure-transitioning-block-size, 0);\n    --graupl-disclosure-opacity: var(--graupl-disclosure-transitioning-opacity, 0);\n  }\n  .disclosure.show {\n    --graupl-disclosure-display: var(--graupl-disclosure-show-display, flex);\n    --graupl-disclosure-block-size: var(--graupl-disclosure-show-block-size, 100%);\n    --graupl-disclosure-opacity: var(--graupl-disclosure-show-opacity, 1);\n  }\n  .disclosure-content {\n    flex: 1 1 auto;\n    padding: var(--graupl-disclosure-content-padding, var(--graupl-disclosure-content-padding-y, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))) var(--graupl-disclosure-content-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    border-width: var(--graupl-disclosure-content-border-width, var(--graupl-disclosure-content-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-disclosure-content-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-disclosure-content-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-disclosure-content-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-disclosure-content-border-style, var(--graupl-disclosure-content-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-disclosure-content-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-disclosure-content-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-disclosure-content-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-disclosure-content-border-radius, var(--graupl-disclosure-content-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-disclosure-content-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-disclosure-content-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-disclosure-content-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n  }\n  .disclosure-toggle {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-width: var(--graupl-button-min-width, 44px);\n    min-height: var(--graupl-button-min-height, 44px);\n    padding: var(--graupl-button-padding, var(--graupl-button-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-button-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    transform: var(--graupl-button-transform, none);\n    transition: var(--graupl-button-transition, background var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), color var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    border-width: var(--graupl-button-border-width, var(--graupl-button-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-button-border-style, var(--graupl-button-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-button-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-button-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-button-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-button-border-radius, var(--graupl-button-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    font-size: var(--graupl-button-font-size, var(--graupl-font-base, calc(1 * var(--graupl-font-size-base, 1rem))));\n    cursor: pointer;\n  }\n  .disclosure-toggle:visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .disclosure-toggle.visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .disclosure-toggle:focus-visible {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .disclosure-toggle.focus {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .disclosure-toggle:hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .disclosure-toggle.hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .disclosure-toggle:active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .disclosure-toggle.active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .disclosure-toggle:disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[disabled].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle[aria-disabled=true].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle.disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .disclosure-toggle:disabled {\n    cursor: not-allowed;\n  }\n  .disclosure-toggle[disabled] {\n    cursor: not-allowed;\n  }\n  .disclosure-toggle[aria-disabled=true] {\n    cursor: not-allowed;\n  }\n  .disclosure-toggle.disabled {\n    cursor: not-allowed;\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .disclosure-toggle {\n      --graupl-button-transition: var(--graupl-button-transition-reduced-motion, background var(--graupl-transition-timing-function, ease), color var(--graupl-transition-timing-function, ease));\n    }\n  }\n  .disclosure-toggle::after {\n    content: var(--graupl-disclosure-toggle-content, '↓');\n    display: block;\n    transform: var(--graupl-disclosure-toggle-transform, rotate(0deg));\n    transition: var(--graupl-disclosure-toggle-transition, transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n  }\n  .disclosure-toggle[aria-expanded=true]::after {\n    --graupl-disclosure-toggle-transform: var(--graupl-disclosure-toggle-open-transform, rotate(-180deg));\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .disclosure {\n      --graupl-disclosure-transition: var(--graupl-disclosure-transition-reduced-motion, opacity var(--graupl-disclosure-transition-duration, var(--graupl-transition-duration-fast, 150ms)) var(--graupl-disclosure-transition-timing-function, var(--graupl-transition-timing-function, ease)));\n    }\n    .disclosure-toggle {\n      --graupl-disclosure-toggle-transition: var(--graupl-disclosure-toggle-transition-reduced-motion, none);\n    }\n  }\n}\n@layer graupl.theme {\n  .disclosure {\n    background: var(--graupl-disclosure-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-disclosure-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .disclosure-content {\n    border-color: var(--graupl-disclosure-content-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .disclosure-toggle {\n    border-color: var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .disclosure-toggle:visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .disclosure-toggle.visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .disclosure-toggle:focus-visible {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .disclosure-toggle.focus {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .disclosure-toggle:hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .disclosure-toggle.hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .disclosure-toggle:active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .disclosure-toggle.active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .disclosure-toggle:disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle:disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[disabled].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle[aria-disabled=true].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .disclosure-toggle.primary {\n    --graupl-button-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n  }\n  .disclosure-toggle.secondary {\n    --graupl-button-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n  }\n  .disclosure-toggle.tertiary {\n    --graupl-button-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n  }\n}\n@layer graupl.component {\n  .input-group {\n    display: grid;\n    grid-template-areas: var(--graupl-input-group-grid-template-areas, \"label\" \"input\" \"help\");\n    grid-template-columns: var(--graupl-input-group-grid-template-columns, 100%);\n    grid-template-rows: var(--graupl-input-group-grid-template-rows, auto auto auto);\n    align-items: center;\n    gap: var(--graupl-input-group-gap, var(--graupl-input-group-row-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)))) var(--graupl-input-group-column-gap, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))));\n  }\n  .input-group label {\n    grid-area: var(--graupl-input-group-label-grid-area, label);\n  }\n  .input-group input,\n  .input-group textarea,\n  .input-group select {\n    grid-area: var(--graupl-input-group-input-grid-area, input);\n  }\n  .input-group .help-text {\n    grid-area: var(--graupl-input-group-help-grid-area, help);\n  }\n  .input-group.inline {\n    grid-template-areas: var(--graupl-input-group-inline-grid-template-areas, \"label input\" \"- help\");\n    grid-template-columns: var(--graupl-input-group-inline-grid-template-columns, auto 1fr);\n    grid-template-rows: var(--graupl-input-group-inline-grid-template-rows, auto auto);\n  }\n  @media screen and (width <= 575px) {\n    .input-group.inline {\n      grid-template-areas: var(--graupl-input-group-grid-template-areas, \"label\" \"input\" \"help\");\n      grid-template-columns: var(--graupl-input-group-grid-template-columns, 100%);\n      grid-template-rows: var(--graupl-input-group-grid-template-rows, auto auto auto);\n    }\n  }\n}\n@layer graupl.component {\n  .list {\n    display: grid;\n    position: relative;\n    margin: var(--graupl-list-margin, var(--graupl-list-margin-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-list-margin-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    padding: var(--graupl-list-padding, var(--graupl-list-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-list-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    border-width: var(--graupl-list-border-width, var(--graupl-list-border-top-width, 0) var(--graupl-list-border-right-width, 0) var(--graupl-list-border-bottom-width, 0) var(--graupl-list-border-left-width, 0));\n    border-style: var(--graupl-list-border-style, var(--graupl-list-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-list-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-list-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-list-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-list-border-radius, var(--graupl-list-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-list-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-list-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-list-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    list-style: none;\n    gap: var(--graupl-list-gap, var(--graupl-list-column-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)))) var(--graupl-list-row-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)))));\n  }\n  .list-item {\n    position: relative;\n    padding: var(--graupl-list-item-padding, var(--graupl-list-item-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-list-item-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    transform: var(--graupl-list-item-transform, none);\n    transition: var(--graupl-list-item-transition, transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    border-width: var(--graupl-list-item-border-width, var(--graupl-list-item-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-list-item-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-list-item-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-list-item-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-list-item-border-style, var(--graupl-list-item-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-list-item-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-list-item-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-list-item-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-list-item-border-radius, var(--graupl-list-item-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-list-item-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-list-item-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-list-item-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n  }\n  .list-item:hover {\n    --graupl-list-item-transform: $list-item-hover-transform;\n  }\n  .list-item.hover {\n    --graupl-list-item-transform: $list-item-hover-transform;\n  }\n}\n@layer graupl.theme {\n  .list {\n    border-color: var(--graupl-list-border-color, var(--graupl-list-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-list-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-list-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .list-item {\n    border-color: var(--graupl-list-item-border-color, var(--graupl-list-item-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-list-item-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-list-item-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n}\n@layer graupl.component {\n  .menu {\n    --graupl-link-padding: var(--graupl-menu-link-padding, var(--graupl-menu-link-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-menu-link-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    --graupl-link-border-width: var(--graupl-menu-link-border-width, var(--graupl-menu-link-border-top-width, 0) var(--graupl-menu-link-border-right-width, 0) var(--graupl-menu-link-border-bottom-width, 0) var(--graupl-menu-link-border-left-width, 0));\n    --graupl-link-border-radius: var(--graupl-menu-link-border-radius, var(--graupl-menu-link-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-menu-link-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-menu-link-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-menu-link-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    --graupl-link-border-style: var(--graupl-menu-link-border-style, var(--graupl-menu-link-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-menu-link-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-menu-link-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-menu-link-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    --graupl-link-text-decoration: var(--graupl-menu-link-text-decoration, none);\n    --graupl-link-text-decoration-thickness: var(--graupl-menu-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    --graupl-link-text-decoration-style: var(--graupl-menu-link-text-decoration-style, solid);\n    --graupl-link-transform: var(--graupl-menu-link-transform, none);\n    --graupl-link-visited-text-decoration: var(--graupl-menu-link-visited-text-decoration, var(--graupl-menu-link-text-decoration, none));\n    --graupl-link-visited-text-decoration-thickness: var(--graupl-menu-link-visited-text-decoration-thickness, var(--graupl-menu-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    --graupl-link-visited-text-decoration-style: var(--graupl-menu-link-visited-text-decoration-style, var(--graupl-menu-link-text-decoration-style, solid));\n    --graupl-link-visited-transform: var(--graupl-menu-link-visited-transform, var(--graupl-menu-link-transform, none));\n    --graupl-link-focus-text-decoration: var(--graupl-menu-link-focus-text-decoration, var(--graupl-menu-link-text-decoration, none));\n    --graupl-link-focus-text-decoration-thickness: var(--graupl-menu-link-focus-text-decoration-thickness, var(--graupl-menu-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    --graupl-link-focus-text-decoration-style: var(--graupl-menu-link-focus-text-decoration-style, var(--graupl-menu-link-text-decoration-style, solid));\n    --graupl-link-focus-transform: var(--graupl-menu-link-focus-transform, var(--graupl-menu-link-transform, none));\n    --graupl-link-hover-text-decoration: var(--graupl-menu-link-hover-text-decoration, none);\n    --graupl-link-hover-text-decoration-thickness: var(--graupl-menu-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    --graupl-link-hover-text-decoration-style: var(--graupl-menu-link-hover-text-decoration-style, solid);\n    --graupl-link-hover-transform: var(--graupl-menu-link-hover-transform, none);\n    --graupl-link-active-text-decoration: var(--graupl-menu-link-active-text-decoration, var(--graupl-menu-link-hover-text-decoration, none));\n    --graupl-link-active-text-decoration-thickness: var(--graupl-menu-link-active-text-decoration-thickness, var(--graupl-menu-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    --graupl-link-active-text-decoration-style: var(--graupl-menu-link-active-text-decoration-style, var(--graupl-menu-link-hover-text-decoration-style, solid));\n    --graupl-link-active-transform: var(--graupl-menu-link-active-transform, var(--graupl-menu-link-hover-transform, none));\n    --graupl-link-disabled-text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    --graupl-link-disabled-text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    --graupl-link-disabled-text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    --graupl-link-disabled-transform: var(--graupl-menu-link-disabled-transform, none);\n    display: var(--graupl-menu-display, flex);\n    flex-direction: var(--graupl-menu-flex-direction, row);\n    padding: var(--graupl-menu-padding, var(--graupl-menu-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-menu-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    border-width: var(--graupl-menu-border-width, var(--graupl-menu-border-top-width, 0) var(--graupl-menu-border-right-width, 0) var(--graupl-menu-border-bottom-width, 0) var(--graupl-menu-border-left-width, 0));\n    border-style: var(--graupl-menu-border-style, var(--graupl-menu-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-menu-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-menu-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-menu-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-menu-border-radius, var(--graupl-menu-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-menu-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-menu-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-menu-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    list-style: none;\n    gap: var(--graupl-menu-gap, var(--graupl-menu-column-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-menu-row-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    isolation: isolate;\n  }\n  .menu.show {\n    --graupl-menu-display: var(--graupl-menu-show-display, flex);\n  }\n  .menu.hide {\n    --graupl-menu-display: var(--graupl-menu-hide-display, none);\n  }\n  .submenu {\n    display: var(--graupl-submenu-display, none);\n    position: var(--graupl-submenu-position, absolute);\n    z-index: var(--graupl-submenu-z-index, 2);\n    flex: 1 1;\n    flex-direction: var(--graupl-submenu-flex-direction, column);\n    padding: var(--graupl-submenu-padding, var(--graupl-submenu-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-submenu-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    border-width: var(--graupl-submenu-border-width, var(--graupl-submenu-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-submenu-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-submenu-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-submenu-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-submenu-border-style, var(--graupl-submenu-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-submenu-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-submenu-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-submenu-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-submenu-border-radius, var(--graupl-submenu-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-submenu-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-submenu-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-submenu-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    list-style: none;\n    gap: var(--graupl-submenu-gap, var(--graupl-submenu-column-gap, var(--graupl-menu-column-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))))) var(--graupl-submenu-row-gap, var(--graupl-menu-row-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))))));\n    isolation: isolate;\n    inset: var(--graupl-submenu-inset, var(--graupl-submenu-top, 100%) var(--graupl-submenu-right, auto) var(--graupl-submenu-bottom, auto) var(--graupl-submenu-left, 0));\n  }\n  .submenu.show {\n    --graupl-submenu-display: var(--graupl-submenu-show-display, flex);\n  }\n  .submenu.hide {\n    --graupl-submenu-display: var(--graupl-submenu-hide-display, none);\n  }\n  .menu-item {\n    display: flex;\n    position: relative;\n    flex-wrap: wrap;\n    align-items: center;\n    justify-content: center;\n    min-width: var(--graupl-menu-item-min-width, min-content);\n    max-width: var(--graupl-menu-item-max-width, 100%);\n    padding: var(--graupl-menu-item-padding, var(--graupl-menu-item-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-menu-item-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n  }\n  .menu-link {\n    display: flex;\n    width: 100%;\n    padding: var(--graupl-menu-link-padding, var(--graupl-menu-link-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-menu-link-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    transform: var(--graupl-menu-link-transform, none);\n    transition: var(--graupl-menu-link-transition, background var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), color var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    border-width: var(--graupl-menu-link-border-width, var(--graupl-menu-link-border-top-width, 0) var(--graupl-menu-link-border-right-width, 0) var(--graupl-menu-link-border-bottom-width, 0) var(--graupl-menu-link-border-left-width, 0));\n    border-style: var(--graupl-menu-link-border-style, var(--graupl-menu-link-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-menu-link-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-menu-link-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-menu-link-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-menu-link-border-radius, var(--graupl-menu-link-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-menu-link-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-menu-link-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-menu-link-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    text-decoration: var(--graupl-menu-link-text-decoration, none);\n    text-decoration-style: var(--graupl-menu-link-text-decoration-style, solid);\n    gap: var(--graupl-menu-link-gap, var(--graupl-menu-link-column-gap, var(--graupl-menu-link-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))))) var(--graupl-menu-link-row-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    text-decoration-thickness: var(--graupl-menu-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n  }\n  .menu-link:visited {\n    text-decoration: var(--graupl-menu-link-visited-text-decoration, var(--graupl-menu-link-text-decoration, none));\n    text-decoration-thickness: var(--graupl-menu-link-visited-text-decoration-thickness, var(--graupl-menu-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-menu-link-visited-text-decoration-style, var(--graupl-menu-link-text-decoration-style, solid));\n    transform: var(--graupl-menu-link-visited-transform, var(--graupl-menu-link-transform, none));\n  }\n  .menu-link.visited {\n    text-decoration: var(--graupl-menu-link-visited-text-decoration, var(--graupl-menu-link-text-decoration, none));\n    text-decoration-thickness: var(--graupl-menu-link-visited-text-decoration-thickness, var(--graupl-menu-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-menu-link-visited-text-decoration-style, var(--graupl-menu-link-text-decoration-style, solid));\n    transform: var(--graupl-menu-link-visited-transform, var(--graupl-menu-link-transform, none));\n  }\n  .menu-link:focus-visible {\n    text-decoration: var(--graupl-menu-link-focus-text-decoration, var(--graupl-menu-link-text-decoration, none));\n    text-decoration-thickness: var(--graupl-menu-link-focus-text-decoration-thickness, var(--graupl-menu-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-menu-link-focus-text-decoration-style, var(--graupl-menu-link-text-decoration-style, solid));\n    transform: var(--graupl-menu-link-focus-transform, var(--graupl-menu-link-transform, none));\n  }\n  .menu-link.focus {\n    text-decoration: var(--graupl-menu-link-focus-text-decoration, var(--graupl-menu-link-text-decoration, none));\n    text-decoration-thickness: var(--graupl-menu-link-focus-text-decoration-thickness, var(--graupl-menu-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-menu-link-focus-text-decoration-style, var(--graupl-menu-link-text-decoration-style, solid));\n    transform: var(--graupl-menu-link-focus-transform, var(--graupl-menu-link-transform, none));\n  }\n  .menu-link:hover {\n    text-decoration: var(--graupl-menu-link-hover-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-hover-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-hover-transform, none);\n  }\n  .menu-link.hover {\n    text-decoration: var(--graupl-menu-link-hover-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-hover-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-hover-transform, none);\n  }\n  .menu-link:active {\n    text-decoration: var(--graupl-menu-link-active-text-decoration, var(--graupl-menu-link-hover-text-decoration, none));\n    text-decoration-thickness: var(--graupl-menu-link-active-text-decoration-thickness, var(--graupl-menu-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-menu-link-active-text-decoration-style, var(--graupl-menu-link-hover-text-decoration-style, solid));\n    transform: var(--graupl-menu-link-active-transform, var(--graupl-menu-link-hover-transform, none));\n  }\n  .menu-link.active {\n    text-decoration: var(--graupl-menu-link-active-text-decoration, var(--graupl-menu-link-hover-text-decoration, none));\n    text-decoration-thickness: var(--graupl-menu-link-active-text-decoration-thickness, var(--graupl-menu-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-menu-link-active-text-decoration-style, var(--graupl-menu-link-hover-text-decoration-style, solid));\n    transform: var(--graupl-menu-link-active-transform, var(--graupl-menu-link-hover-transform, none));\n  }\n  .menu-link:disabled {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled:visited {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled.visited {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled:focus-visible {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled.focus {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled:hover {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled.hover {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled:active {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled.active {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled[aria-selected=true] {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled.selected {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled[aria-current=true] {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link:disabled.current {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled] {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled]:visited {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled].visited {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled]:focus-visible {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled].focus {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled]:hover {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled].hover {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled]:active {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled].active {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled][aria-selected=true] {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled].selected {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled][aria-current=true] {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[disabled].current {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true] {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true]:visited {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true].visited {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true]:focus-visible {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true].focus {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true]:hover {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true].hover {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true]:active {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true].active {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true][aria-selected=true] {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true].selected {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true][aria-current=true] {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link[aria-disabled=true].current {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled:visited {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled.visited {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled:focus-visible {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled.focus {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled:hover {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled.hover {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled:active {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled.active {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled[aria-selected=true] {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled.selected {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled[aria-current=true] {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.disabled.current {\n    text-decoration: var(--graupl-menu-link-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-menu-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-menu-link-disabled-text-decoration-style, solid);\n    transform: var(--graupl-menu-link-disabled-transform, none);\n  }\n  .menu-link.button {\n    --graupl-menu-link-padding: var(--graupl-button-padding, var(--graupl-button-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-button-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    --graupl-menu-link-border-width: var(--graupl-button-border-width, var(--graupl-button-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    --graupl-menu-link-border-radius: var(--graupl-button-border-radius, var(--graupl-button-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    --graupl-menu-link-border-style: var(--graupl-button-border-style, var(--graupl-button-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-button-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-button-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-button-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    --graupl-menu-link-text-decoration: none;\n    --graupl-menu-link-visited-text-decoration: none;\n    --graupl-menu-link-focus-text-decoration: none;\n    --graupl-menu-link-hover-text-decoration: none;\n    --graupl-menu-link-active-text-decoration: none;\n    --graupl-menu-link-disabled-text-decoration: none;\n    --graupl-menu-link-transition: var(--graupl-button-transition, background var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), color var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    --graupl-menu-link-transition-reduced-motion: var(--graupl-button-transition-reduced-motion, background var(--graupl-transition-timing-function, ease), color var(--graupl-transition-timing-function, ease));\n    --graupl-menu-link-transform: var(--graupl-button-transform, none);\n    --graupl-menu-link-visited-transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n    --graupl-menu-link-focus-transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n    --graupl-menu-link-hover-transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n    --graupl-menu-link-active-transform: var(--graupl-button-active-transform, scale(0.95));\n    --graupl-menu-link-disabled-transform: var(--graupl-button-disabled-transform, none);\n  }\n  .submenu-toggle {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .submenu-toggle::after {\n    content: var(--graupl-submenu-toggle-content, '↓');\n    display: block;\n    transform: var(--graupl-submenu-toggle-transform, rotate(0deg));\n    transition: var(--graupl-submenu-toggle-transition, transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n  }\n  .submenu-toggle[aria-expanded=true]::after {\n    --graupl-submenu-toggle-transform: var(--graupl-submenu-toggle-open-transform, rotate(-180deg));\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .menu-link {\n      --graupl-menu-link-transition: var(--graupl-menu-link-transition-reduced-motion, background var(--graupl-transition-timing-function, ease), color var(--graupl-transition-timing-function, ease));\n    }\n    .submenu-toggle::after {\n      --graupl-submenu-toggle-transition: var(--graupl-submenu-toggle-transition-reduced-motion, none);\n    }\n  }\n}\n@layer graupl.theme {\n  .menu {\n    --graupl-link-color: var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    --graupl-link-background: var(--graupl-menu-link-background, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    --graupl-link-border-color: var(--graupl-menu-link-border-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    --graupl-link-text-decoration-color: var(--graupl-menu-link-text-decoration-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    --graupl-link-visited-color: var(--graupl-menu-link-visited-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    --graupl-link-visited-background: var(--graupl-menu-link-visited-background, var(--graupl-menu-link-background, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    --graupl-link-visited-border-color: var(--graupl-menu-link-visited-border-color, var(--graupl-menu-link-border-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    --graupl-link-visited-text-decoration-color: var(--graupl-menu-link-visited-text-decoration-color, var(--graupl-menu-link-visited-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    --graupl-link-focus-color: var(--graupl-menu-link-focus-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    --graupl-link-focus-background: var(--graupl-menu-link-focus-background, var(--graupl-menu-link-background, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    --graupl-link-focus-border-color: var(--graupl-menu-link-focus-border-color, var(--graupl-menu-link-border-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    --graupl-link-focus-text-decoration-color: var(--graupl-menu-link-focus-text-decoration-color, var(--graupl-menu-link-focus-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    --graupl-link-hover-color: var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    --graupl-link-hover-background: var(--graupl-menu-link-hover-background, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    --graupl-link-hover-border-color: var(--graupl-menu-link-hover-border-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    --graupl-link-hover-text-decoration-color: var(--graupl-menu-link-hover-text-decoration-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    --graupl-link-active-color: var(--graupl-menu-link-active-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    --graupl-link-active-background: var(--graupl-menu-link-active-background, var(--graupl-menu-link-hover-background, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    --graupl-link-active-border-color: var(--graupl-menu-link-active-border-color, var(--graupl-menu-link-hover-border-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n    --graupl-link-active-text-decoration-color: var(--graupl-menu-link-active-text-decoration-color, var(--graupl-menu-link-active-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n    --graupl-link-disabled-color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    --graupl-link-disabled-background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    --graupl-link-disabled-border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    --graupl-link-disabled-text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    border-color: var(--graupl-menu-border-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .submenu {\n    border-color: var(--graupl-submenu-border-color, var(--graupl-menu-border-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-submenu-background, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-submenu-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .menu-link {\n    border-color: var(--graupl-menu-link-border-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-menu-link-background, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration-color: var(--graupl-menu-link-text-decoration-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .menu-link:visited {\n    border-color: var(--graupl-menu-link-visited-border-color, var(--graupl-menu-link-border-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-menu-link-visited-background, var(--graupl-menu-link-background, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-menu-link-visited-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    text-decoration-color: var(--graupl-menu-link-visited-text-decoration-color, var(--graupl-menu-link-visited-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .menu-link.visited {\n    border-color: var(--graupl-menu-link-visited-border-color, var(--graupl-menu-link-border-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-menu-link-visited-background, var(--graupl-menu-link-background, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-menu-link-visited-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    text-decoration-color: var(--graupl-menu-link-visited-text-decoration-color, var(--graupl-menu-link-visited-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .menu-link:focus-visible {\n    border-color: var(--graupl-menu-link-focus-border-color, var(--graupl-menu-link-border-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-menu-link-focus-background, var(--graupl-menu-link-background, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-menu-link-focus-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    text-decoration-color: var(--graupl-menu-link-focus-text-decoration-color, var(--graupl-menu-link-focus-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .menu-link.focus {\n    border-color: var(--graupl-menu-link-focus-border-color, var(--graupl-menu-link-border-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-menu-link-focus-background, var(--graupl-menu-link-background, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-menu-link-focus-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    text-decoration-color: var(--graupl-menu-link-focus-text-decoration-color, var(--graupl-menu-link-focus-color, var(--graupl-menu-link-color, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .menu-link:hover {\n    border-color: var(--graupl-menu-link-hover-border-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    background: var(--graupl-menu-link-hover-background, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    text-decoration-color: var(--graupl-menu-link-hover-text-decoration-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .menu-link.hover {\n    border-color: var(--graupl-menu-link-hover-border-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    background: var(--graupl-menu-link-hover-background, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    text-decoration-color: var(--graupl-menu-link-hover-text-decoration-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .menu-link:active {\n    border-color: var(--graupl-menu-link-active-border-color, var(--graupl-menu-link-hover-border-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n    background: var(--graupl-menu-link-active-background, var(--graupl-menu-link-hover-background, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    color: var(--graupl-menu-link-active-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    text-decoration-color: var(--graupl-menu-link-active-text-decoration-color, var(--graupl-menu-link-active-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n  }\n  .menu-link.active {\n    border-color: var(--graupl-menu-link-active-border-color, var(--graupl-menu-link-hover-border-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n    background: var(--graupl-menu-link-active-background, var(--graupl-menu-link-hover-background, var(--graupl-menu-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    color: var(--graupl-menu-link-active-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    text-decoration-color: var(--graupl-menu-link-active-text-decoration-color, var(--graupl-menu-link-active-color, var(--graupl-menu-link-hover-color, var(--graupl-menu-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n  }\n  .menu-link:disabled {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled:visited {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled.visited {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled:focus-visible {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled.focus {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled:hover {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled.hover {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled:active {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled.active {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled[aria-selected=true] {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled.selected {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled[aria-current=true] {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link:disabled.current {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled] {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled]:visited {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled].visited {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled]:focus-visible {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled].focus {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled]:hover {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled].hover {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled]:active {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled].active {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled][aria-selected=true] {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled].selected {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled][aria-current=true] {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[disabled].current {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true] {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true]:visited {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true].visited {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true].focus {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true]:hover {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true].hover {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true]:active {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true].active {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true].selected {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link[aria-disabled=true].current {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled:visited {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled.visited {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled:focus-visible {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled.focus {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled:hover {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled.hover {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled:active {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled.active {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled[aria-selected=true] {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled.selected {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled[aria-current=true] {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.disabled.current {\n    border-color: var(--graupl-menu-link-disabled-border-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-menu-link-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    text-decoration-color: var(--graupl-menu-link-disabled-text-decoration-color, var(--graupl-menu-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n  }\n  .menu-link.button {\n    --graupl-menu-link-background: var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    --graupl-menu-link-color: var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    --graupl-menu-link-border-color: var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    --graupl-menu-link-visited-background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    --graupl-menu-link-visited-color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    --graupl-menu-link-visited-border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    --graupl-menu-link-focus-background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    --graupl-menu-link-focus-color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    --graupl-menu-link-focus-border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    --graupl-menu-link-hover-background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    --graupl-menu-link-hover-color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    --graupl-menu-link-hover-border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    --graupl-menu-link-active-background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    --graupl-menu-link-active-color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    --graupl-menu-link-active-border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    --graupl-menu-link-disabled-background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    --graupl-menu-link-disabled-color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    --graupl-menu-link-disabled-border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n}\n@layer graupl.component {\n  .navigation {\n    display: grid;\n    grid-template-areas: \"branding - toggle\" \"menu menu menu\";\n    grid-template-columns: auto 1fr auto;\n    isolation: isolate;\n  }\n  .navigation .menu {\n    grid-area: menu;\n  }\n  .navigation .menu.show {\n    --graupl-menu-display: var(--graupl-menu-show-display, flex);\n  }\n  .navigation .menu.hide {\n    --graupl-menu-display: var(--graupl-menu-hide-display, none);\n  }\n  .navigation-toggle {\n    display: flex;\n    grid-area: toggle;\n    align-items: center;\n    justify-content: center;\n    min-width: var(--graupl-navigation-toggle-min-width, 44px);\n    min-height: var(--graupl-navigation-toggle-min-height, 44px);\n    padding: var(--graupl-navigation-toggle-padding, var(--graupl-navigation-toggle-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-navigation-toggle-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    border-width: var(--graupl-navigation-toggle-border-width, var(--graupl-navigation-toggle-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-navigation-toggle-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-navigation-toggle-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-navigation-toggle-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-navigation-toggle-border-style, var(--graupl-navigation-toggle-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-navigation-toggle-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-navigation-toggle-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-navigation-toggle-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-navigation-toggle-border-radius, var(--graupl-navigation-toggle-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-navigation-toggle-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-navigation-toggle-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-navigation-toggle-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n  }\n  .navigation-toggle::before {\n    content: var(--graupl-navigation-toggle-content, '☰');\n    display: block;\n  }\n  .navigation-branding {\n    display: flex;\n    grid-area: branding;\n    align-items: center;\n    justify-content: flex-start;\n    padding: var(--graupl-navigation-branding-padding, var(--graupl-navigation-branding-padding-y, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)))) var(--graupl-navigation-branding-padding-x, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))));\n    font-size: var(--graupl-navigation-branding-font-size, var(--graupl-font-lg, calc(1.2 * var(--graupl-font-size-base, 1rem))));\n    font-weight: var(--graupl-navigation-branding-font-weight, var(--graupl-font-weight-bold, var(--graupl-font-weight-bold, 700)));\n    text-decoration: var(--graupl-navigation-branding-text-decoration, none);\n    text-decoration-style: var(--graupl-navigation-branding-text-decoration-style, solid);\n    text-decoration-thickness: var(--graupl-navigation-branding-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n  }\n  .navigation-branding:visited {\n    text-decoration: var(--graupl-navigation-branding-visited-text-decoration, var(--graupl-navigation-branding-text-decoration, none));\n    text-decoration-thickness: var(--graupl-navigation-branding-visited-text-decoration-thickness, var(--graupl-navigation-branding-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-navigation-branding-visited-text-decoration-style, var(--graupl-navigation-branding-text-decoration-style, solid));\n  }\n  .navigation-branding.visited {\n    text-decoration: var(--graupl-navigation-branding-visited-text-decoration, var(--graupl-navigation-branding-text-decoration, none));\n    text-decoration-thickness: var(--graupl-navigation-branding-visited-text-decoration-thickness, var(--graupl-navigation-branding-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-navigation-branding-visited-text-decoration-style, var(--graupl-navigation-branding-text-decoration-style, solid));\n  }\n  .navigation-branding:focus-visible {\n    text-decoration: var(--graupl-navigation-branding-focus-text-decoration, var(--graupl-navigation-branding-text-decoration, none));\n    text-decoration-thickness: var(--graupl-navigation-branding-focus-text-decoration-thickness, var(--graupl-navigation-branding-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-navigation-branding-focus-text-decoration-style, var(--graupl-navigation-branding-text-decoration-style, solid));\n  }\n  .navigation-branding.focus {\n    text-decoration: var(--graupl-navigation-branding-focus-text-decoration, var(--graupl-navigation-branding-text-decoration, none));\n    text-decoration-thickness: var(--graupl-navigation-branding-focus-text-decoration-thickness, var(--graupl-navigation-branding-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-navigation-branding-focus-text-decoration-style, var(--graupl-navigation-branding-text-decoration-style, solid));\n  }\n  .navigation-branding:hover {\n    text-decoration: var(--graupl-navigation-branding-hover-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-hover-text-decoration-style, solid);\n  }\n  .navigation-branding.hover {\n    text-decoration: var(--graupl-navigation-branding-hover-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-hover-text-decoration-style, solid);\n  }\n  .navigation-branding:active {\n    text-decoration: var(--graupl-navigation-branding-active-text-decoration, var(--graupl-navigation-branding-hover-text-decoration, none));\n    text-decoration-thickness: var(--graupl-navigation-branding-active-text-decoration-thickness, var(--graupl-navigation-branding-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-navigation-branding-active-text-decoration-style, var(--graupl-navigation-branding-hover-text-decoration-style, solid));\n  }\n  .navigation-branding.active {\n    text-decoration: var(--graupl-navigation-branding-active-text-decoration, var(--graupl-navigation-branding-hover-text-decoration, none));\n    text-decoration-thickness: var(--graupl-navigation-branding-active-text-decoration-thickness, var(--graupl-navigation-branding-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n    text-decoration-style: var(--graupl-navigation-branding-active-text-decoration-style, var(--graupl-navigation-branding-hover-text-decoration-style, solid));\n  }\n  .navigation-branding:disabled {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled:visited {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled.visited {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled:focus-visible {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled.focus {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled:hover {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled.hover {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled:active {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled.active {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled[aria-selected=true] {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled.selected {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled[aria-current=true] {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding:disabled.current {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled] {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled]:visited {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled].visited {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled]:focus-visible {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled].focus {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled]:hover {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled].hover {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled]:active {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled].active {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled][aria-selected=true] {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled].selected {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled][aria-current=true] {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[disabled].current {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true] {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true]:visited {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true].visited {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true]:focus-visible {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true].focus {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true]:hover {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true].hover {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true]:active {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true].active {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true][aria-selected=true] {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true].selected {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true][aria-current=true] {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding[aria-disabled=true].current {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled:visited {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled.visited {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled:focus-visible {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled.focus {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled:hover {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled.hover {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled:active {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled.active {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled[aria-selected=true] {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled.selected {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled[aria-current=true] {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  .navigation-branding.disabled.current {\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration, none);\n    text-decoration-thickness: var(--graupl-navigation-branding-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n    text-decoration-style: var(--graupl-navigation-branding-disabled-text-decoration-style, solid);\n  }\n  @media screen and (width <= 767px) {\n    .navigation {\n      --graupl-menu-flex-direction: column;\n      --graupl-submenu-position: relative;\n      --graupl-menu-item-min-width: 100%;\n      --graupl-submenu-inset: auto;\n    }\n  }\n  @media screen and (768px <= width) {\n    .navigation {\n      --graupl-menu-hide-display: var(--graupl-menu-show-display, flex);\n      grid-template-areas: \"branding - menu\";\n    }\n    .navigation-toggle {\n      display: none;\n    }\n  }\n}\n@layer graupl.theme {\n  .navigation {\n    --graupl-menu-background: var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    --graupl-menu-color: var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    background: var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .navigation-toggle {\n    border-color: var(--graupl-navigation-toggle-border-color, var(--graupl-navigation-toggle-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-navigation-toggle-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .navigation-toggle:visited {\n    border-color: var(--graupl-navigation-toggle-visited-border-color, var(--graupl-navigation-toggle-border-color, var(--graupl-navigation-toggle-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-navigation-toggle-visited-background, var(--graupl-navigation-toggle-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-navigation-toggle-visited-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .navigation-toggle.visited {\n    border-color: var(--graupl-navigation-toggle-visited-border-color, var(--graupl-navigation-toggle-border-color, var(--graupl-navigation-toggle-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-navigation-toggle-visited-background, var(--graupl-navigation-toggle-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-navigation-toggle-visited-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .navigation-toggle:focus-visible {\n    border-color: var(--graupl-navigation-toggle-focus-border-color, var(--graupl-navigation-toggle-border-color, var(--graupl-navigation-toggle-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-navigation-toggle-focus-background, var(--graupl-navigation-toggle-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-navigation-toggle-focus-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .navigation-toggle.focus {\n    border-color: var(--graupl-navigation-toggle-focus-border-color, var(--graupl-navigation-toggle-border-color, var(--graupl-navigation-toggle-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-navigation-toggle-focus-background, var(--graupl-navigation-toggle-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-navigation-toggle-focus-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .navigation-toggle:hover {\n    border-color: var(--graupl-navigation-toggle-hover-border-color, var(--graupl-navigation-toggle-hover-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    background: var(--graupl-navigation-toggle-hover-background, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-navigation-toggle-hover-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .navigation-toggle.hover {\n    border-color: var(--graupl-navigation-toggle-hover-border-color, var(--graupl-navigation-toggle-hover-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    background: var(--graupl-navigation-toggle-hover-background, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-navigation-toggle-hover-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .navigation-toggle:active {\n    border-color: var(--graupl-navigation-toggle-active-border-color, var(--graupl-navigation-toggle-hover-border-color, var(--graupl-navigation-toggle-hover-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n    background: var(--graupl-navigation-toggle-active-background, var(--graupl-navigation-toggle-hover-background, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    color: var(--graupl-navigation-toggle-active-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .navigation-toggle.active {\n    border-color: var(--graupl-navigation-toggle-active-border-color, var(--graupl-navigation-toggle-hover-border-color, var(--graupl-navigation-toggle-hover-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n    background: var(--graupl-navigation-toggle-active-background, var(--graupl-navigation-toggle-hover-background, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    color: var(--graupl-navigation-toggle-active-color, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .navigation-toggle:disabled {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled:visited {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled.visited {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled:focus-visible {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled.focus {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled:hover {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled.hover {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled:active {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled.active {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled[aria-selected=true] {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled.selected {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled[aria-current=true] {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle:disabled.current {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled] {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled]:visited {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled].visited {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled]:focus-visible {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled].focus {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled]:hover {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled].hover {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled]:active {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled].active {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled][aria-selected=true] {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled].selected {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled][aria-current=true] {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[disabled].current {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true] {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true]:visited {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true].visited {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true].focus {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true]:hover {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true].hover {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true]:active {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true].active {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true].selected {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle[aria-disabled=true].current {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled:visited {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled.visited {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled:focus-visible {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled.focus {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled:hover {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled.hover {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled:active {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled.active {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled[aria-selected=true] {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled.selected {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled[aria-current=true] {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-toggle.disabled.current {\n    border-color: var(--graupl-navigation-toggle-disabled-border-color, var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n    background: var(--graupl-navigation-toggle-disabled-background, var(--graupl-navigation-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-navigation-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .navigation-branding {\n    color: var(--graupl-navigation-branding-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration-color: var(--graupl-navigation-branding-text-decoration-color, var(--graupl-navigation-branding-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:visited {\n    color: var(--graupl-navigation-branding-visited-color, var(--graupl-navigation-branding-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    text-decoration: var(--graupl-navigation-branding-visited-text-decoration-color, var(--graupl-navigation-branding-visited-color, var(--graupl-navigation-branding-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .navigation-branding.visited {\n    color: var(--graupl-navigation-branding-visited-color, var(--graupl-navigation-branding-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    text-decoration: var(--graupl-navigation-branding-visited-text-decoration-color, var(--graupl-navigation-branding-visited-color, var(--graupl-navigation-branding-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .navigation-branding:focus-visible {\n    color: var(--graupl-navigation-branding-focus-color, var(--graupl-navigation-branding-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    text-decoration: var(--graupl-navigation-branding-focus-text-decoration-color, var(--graupl-navigation-branding-focus-color, var(--graupl-navigation-branding-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .navigation-branding.focus {\n    color: var(--graupl-navigation-branding-focus-color, var(--graupl-navigation-branding-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    text-decoration: var(--graupl-navigation-branding-focus-text-decoration-color, var(--graupl-navigation-branding-focus-color, var(--graupl-navigation-branding-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .navigation-branding:hover {\n    color: var(--graupl-navigation-branding-hover-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-hover-text-decoration-color, var(--graupl-navigation-branding-hover-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.hover {\n    color: var(--graupl-navigation-branding-hover-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-hover-text-decoration-color, var(--graupl-navigation-branding-hover-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:active {\n    color: var(--graupl-navigation-branding-active-color, var(--graupl-navigation-branding-hover-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    text-decoration: var(--graupl-navigation-branding-active-text-decoration-color, var(--graupl-navigation-branding-active-color, var(--graupl-navigation-branding-hover-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .navigation-branding.active {\n    color: var(--graupl-navigation-branding-active-color, var(--graupl-navigation-branding-hover-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    text-decoration: var(--graupl-navigation-branding-active-text-decoration-color, var(--graupl-navigation-branding-active-color, var(--graupl-navigation-branding-hover-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .navigation-branding:disabled {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled:visited {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled.visited {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled:focus-visible {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled.focus {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled:hover {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled.hover {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled:active {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled.active {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled[aria-selected=true] {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled.selected {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled[aria-current=true] {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding:disabled.current {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled] {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled]:visited {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled].visited {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled]:focus-visible {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled].focus {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled]:hover {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled].hover {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled]:active {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled].active {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled][aria-selected=true] {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled].selected {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled][aria-current=true] {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[disabled].current {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true] {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true]:visited {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true].visited {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true]:focus-visible {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true].focus {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true]:hover {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true].hover {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true]:active {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true].active {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true][aria-selected=true] {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true].selected {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true][aria-current=true] {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding[aria-disabled=true].current {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled:visited {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled.visited {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled:focus-visible {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled.focus {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled:hover {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled.hover {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled:active {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled.active {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled[aria-selected=true] {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled.selected {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled[aria-current=true] {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .navigation-branding.disabled.current {\n    color: var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    text-decoration: var(--graupl-navigation-branding-disabled-text-decoration-color, var(--graupl-navigation-branding-disabled-color, var(--graupl-navigation-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n}\n/* stylelint-disable scss/operator-no-newline-after -- Prettier wants to format it this way. */\n/* stylelint-enable  scss/operator-no-newline-after */\n@layer graupl.component {\n  .tabs {\n    display: grid;\n    grid-template-columns: [list-start content-start] 1fr [content-end list-end];\n    grid-template-rows: [list-start] auto [content-start list-end] 1fr [content-end];\n    padding: var(--graupl-tabs-padding, var(--graupl-tabs-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-tabs-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    border-width: var(--graupl-tabs-border-width, var(--graupl-tabs-border-top-width, 0rem) var(--graupl-tabs-border-right-width, 0rem) var(--graupl-tabs-border-bottom-width, 0rem) var(--graupl-tabs-border-left-width, 0rem));\n    border-style: var(--graupl-tabs-border-style, var(--graupl-tabs-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-tabs-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-tabs-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-tabs-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-tabs-border-radius, var(--graupl-tabs-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    isolation: isolate;\n  }\n  .tab-list {\n    display: flex;\n    grid-area: list;\n    flex-wrap: wrap;\n    margin: var(--graupl-tabs-tab-list-margin, 0 0 calc(-1 * max(var(--graupl-tabs-tab-list-border-bottom-width, 0rem), var(--graupl-tabs-tab-toggle-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))))) 0);\n    padding: var(--graupl-tabs-tab-list-padding, var(--graupl-tabs-tab-list-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-tabs-tab-list-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n    border-width: var(--graupl-tabs-tab-list-border-width, var(--graupl-tabs-tab-list-border-top-width, 0rem) var(--graupl-tabs-tab-list-border-right-width, 0rem) var(--graupl-tabs-tab-list-border-bottom-width, 0rem) var(--graupl-tabs-tab-list-border-left-width, 0rem));\n    border-style: var(--graupl-tabs-tab-list-border-style, var(--graupl-tabs-tab-list-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-tabs-tab-list-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-tabs-tab-list-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-tabs-tab-list-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-tabs-tab-list-border-radius, var(--graupl-tabs-tab-list-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-tab-list-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-tab-list-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-tab-list-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    gap: var(--graupl-tabs-tab-list-gap, var(--graupl-tabs-tab-list-column-gap, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-tabs-tab-list-row-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)))));\n  }\n  .tab-toggle {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-width: var(--graupl-button-min-width, 44px);\n    min-height: var(--graupl-button-min-height, 44px);\n    padding: var(--graupl-button-padding, var(--graupl-button-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-button-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    transform: var(--graupl-button-transform, none);\n    transition: var(--graupl-button-transition, background var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), color var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n    border-width: var(--graupl-button-border-width, var(--graupl-button-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-button-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-button-border-style, var(--graupl-button-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-button-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-button-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-button-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-button-border-radius, var(--graupl-button-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-button-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    font-size: var(--graupl-button-font-size, var(--graupl-font-base, calc(1 * var(--graupl-font-size-base, 1rem))));\n    cursor: pointer;\n  }\n  .tab-toggle:visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .tab-toggle.visited {\n    transform: var(--graupl-button-visited-transform, var(--graupl-button-transform, none));\n  }\n  .tab-toggle:focus-visible {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .tab-toggle.focus {\n    transform: var(--graupl-button-focus-transform, var(--graupl-button-transform, none));\n  }\n  .tab-toggle:hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .tab-toggle.hover {\n    transform: var(--graupl-button-hover-transform, var(--graupl-button-transform, none));\n  }\n  .tab-toggle:active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .tab-toggle.active {\n    transform: var(--graupl-button-active-transform, scale(0.95));\n  }\n  .tab-toggle:disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[disabled].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true]:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true]:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true]:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true]:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true][aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true][aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled:visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled.visited {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled:focus-visible {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled.focus {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled:hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled.hover {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled:active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled.active {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled[aria-selected=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled.selected {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled[aria-current=true] {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle.disabled.current {\n    transform: var(--graupl-button-disabled-transform, none);\n  }\n  .tab-toggle:disabled {\n    cursor: not-allowed;\n  }\n  .tab-toggle[disabled] {\n    cursor: not-allowed;\n  }\n  .tab-toggle[aria-disabled=true] {\n    cursor: not-allowed;\n  }\n  .tab-toggle.disabled {\n    cursor: not-allowed;\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .tab-toggle {\n      --graupl-button-transition: var(--graupl-button-transition-reduced-motion, background var(--graupl-transition-timing-function, ease), color var(--graupl-transition-timing-function, ease));\n    }\n  }\n  .tab-toggle {\n    z-index: 2;\n    flex: 1 1 auto;\n    padding: var(--graupl-tabs-tab-toggle-padding, var(--graupl-tabs-tab-toggle-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-tabs-tab-toggle-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n    border-width: var(--graupl-tabs-tab-toggle-border-width, var(--graupl-tabs-tab-toggle-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-tabs-tab-toggle-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-tabs-tab-toggle-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-tabs-tab-toggle-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-tabs-tab-toggle-border-style, var(--graupl-tabs-tab-toggle-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-tabs-tab-toggle-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-tabs-tab-toggle-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-tabs-tab-toggle-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-tabs-tab-toggle-border-radius, var(--graupl-tabs-tab-toggle-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-tab-toggle-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-tab-toggle-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-tab-toggle-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n  }\n  .tab-toggle:visited {\n    transform: var(--graupl-tabs-tab-toggle-visited-transform, var(--graupl-tabs-tab-toggle-transform, none));\n  }\n  .tab-toggle.visited {\n    transform: var(--graupl-tabs-tab-toggle-visited-transform, var(--graupl-tabs-tab-toggle-transform, none));\n  }\n  .tab-toggle:focus-visible {\n    transform: var(--graupl-tabs-tab-toggle-focus-transform, var(--graupl-tabs-tab-toggle-transform, none));\n  }\n  .tab-toggle.focus {\n    transform: var(--graupl-tabs-tab-toggle-focus-transform, var(--graupl-tabs-tab-toggle-transform, none));\n  }\n  .tab-toggle:hover {\n    transform: var(--graupl-tabs-tab-toggle-hover-transform, var(--graupl-tabs-tab-toggle-transform, none));\n  }\n  .tab-toggle.hover {\n    transform: var(--graupl-tabs-tab-toggle-hover-transform, var(--graupl-tabs-tab-toggle-transform, none));\n  }\n  .tab-toggle:active {\n    transform: var(--graupl-tabs-tab-toggle-active-transform, none);\n  }\n  .tab-toggle.active {\n    transform: var(--graupl-tabs-tab-toggle-active-transform, none);\n  }\n  .tab-toggle:disabled {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled:visited {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled.visited {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled:focus-visible {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled.focus {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled:hover {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled.hover {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled:active {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled.active {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled[aria-selected=true] {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled.selected {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled[aria-current=true] {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle:disabled.current {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled] {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled]:visited {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled].visited {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled]:focus-visible {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled].focus {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled]:hover {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled].hover {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled]:active {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled].active {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled][aria-selected=true] {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled].selected {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled][aria-current=true] {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[disabled].current {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true] {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true]:visited {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].visited {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true]:focus-visible {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].focus {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true]:hover {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].hover {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true]:active {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].active {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true][aria-selected=true] {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].selected {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true][aria-current=true] {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-disabled=true].current {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled:visited {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled.visited {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled:focus-visible {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled.focus {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled:hover {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled.hover {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled:active {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled.active {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled[aria-selected=true] {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled.selected {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled[aria-current=true] {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle.disabled.current {\n    transform: var(--graupl-tabs-tab-toggle-disabled-transform, none);\n  }\n  .tab-toggle[aria-selected=true] {\n    transform: var(--graupl-tabs-tab-toggle-selected-transform, none);\n  }\n  .tab-toggle.selected {\n    transform: var(--graupl-tabs-tab-toggle-selected-transform, none);\n  }\n  .tab-content {\n    display: var(--graupl-tabs-tab-content-display, none);\n    z-index: 1;\n    grid-area: content;\n    padding: var(--graupl-tabs-tab-content-padding, var(--graupl-tabs-tab-content-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-tabs-tab-content-padding-x, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))));\n    transition: var(--graupl-tabs-tab-content-transition, opacity var(--graupl-tabs-tab-content-transition-duration, var(--graupl-transition-duration-fast, 150ms)) var(--graupl-tabs-tab-content-transition-timing-function, var(--graupl-transition-timing-function, ease)));\n    border-width: var(--graupl-tabs-tab-content-border-width, var(--graupl-tabs-tab-content-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-tabs-tab-content-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-tabs-tab-content-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-tabs-tab-content-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n    border-style: var(--graupl-tabs-tab-content-border-style, var(--graupl-tabs-tab-content-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-tabs-tab-content-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-tabs-tab-content-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-tabs-tab-content-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n    border-radius: var(--graupl-tabs-tab-content-border-radius, var(--graupl-tabs-tab-content-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-tab-content-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-tab-content-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-tabs-tab-content-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n    opacity: var(--graupl-tabs-tab-content-opacity, var(--graupl-tabs-tab-content-hide-opacity, 0));\n  }\n  .tab-content.hide {\n    --graupl-tabs-tab-content-display: var(--graupl-tabs-tab-content-hide-display, none);\n    --graupl-tabs-tab-content-opacity: var(--graupl-tabs-tab-content-hide-opacity, 0);\n  }\n  .tab-content.transitioning {\n    --graupl-tabs-tab-content-display: var(--graupl-tabs-tab-content-transitioning-display, block);\n    --graupl-tabs-tab-content-opacity: var(--graupl-tabs-tab-content-transitioning-opacity, 0);\n  }\n  .tab-content.show {\n    --graupl-tabs-tab-content-display: var(--graupl-tabs-tab-content-show-display, block);\n    --graupl-tabs-tab-content-opacity: var(--graupl-tabs-tab-content-show-opacity, 1);\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .tab-content {\n      --graupl-tabs-tab-content-transition: var(--graupl-tabs-tab-content-transition-reduced-motion, opacity var(--graupl-tabs-tab-content-transition-duration, var(--graupl-transition-duration-fast, 150ms)) var(--graupl-tabs-tab-content-transition-timing-function, var(--graupl-transition-timing-function, ease)));\n    }\n  }\n}\n@layer graupl.theme {\n  .tabs {\n    border-color: var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .tab-list {\n    border-color: var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .tab-toggle {\n    border-color: var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n  }\n  .tab-toggle:visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .tab-toggle.visited {\n    border-color: var(--graupl-button-visited-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-visited-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-visited-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .tab-toggle:focus-visible {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .tab-toggle.focus {\n    border-color: var(--graupl-button-focus-border-color, var(--graupl-button-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-focus-background, var(--graupl-button-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-button-focus-color, var(--graupl-button-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n  .tab-toggle:hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .tab-toggle.hover {\n    border-color: var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    background: var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n    color: var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n  }\n  .tab-toggle:active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .tab-toggle.active {\n    border-color: var(--graupl-button-active-border-color, var(--graupl-button-hover-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-button-active-background, var(--graupl-button-hover-background, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n    color: var(--graupl-button-active-color, var(--graupl-button-hover-color, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n  }\n  .tab-toggle:disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true]:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true]:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true]:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled:visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.visited {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled:focus-visible {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.focus {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled:hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.hover {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled:active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.active {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled[aria-selected=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.selected {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled[aria-current=true] {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.current {\n    border-color: var(--graupl-button-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-button-disabled-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n    color: var(--graupl-button-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.primary {\n    --graupl-button-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n  }\n  .tab-toggle.secondary {\n    --graupl-button-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n  }\n  .tab-toggle.tertiary {\n    --graupl-button-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n    --graupl-button-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n    --graupl-button-hover-background: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-hover-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n    --graupl-button-disabled-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n    --graupl-button-disabled-border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n  }\n  .tab-toggle {\n    border-color: var(--graupl-tabs-tab-toggle-border-color, var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-tabs-tab-toggle-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-color, var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n  }\n  .tab-toggle:visited {\n    border-color: var(--graupl-tabs-tab-toggle-visited-border-color, var(--graupl-tabs-tab-toggle-border-color, var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    background: var(--graupl-tabs-tab-toggle-visited-background, var(--graupl-tabs-tab-toggle-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n    color: var(--graupl-tabs-tab-toggle-visited-color, var(--graupl-tabs-tab-toggle-color, var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .tab-toggle.visited {\n    border-color: var(--graupl-tabs-tab-toggle-visited-border-color, var(--graupl-tabs-tab-toggle-border-color, var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    background: var(--graupl-tabs-tab-toggle-visited-background, var(--graupl-tabs-tab-toggle-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n    color: var(--graupl-tabs-tab-toggle-visited-color, var(--graupl-tabs-tab-toggle-color, var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .tab-toggle:focus-visible {\n    border-color: var(--graupl-tabs-tab-toggle-focus-border-color, var(--graupl-tabs-tab-toggle-border-color, var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    background: var(--graupl-tabs-tab-toggle-focus-background, var(--graupl-tabs-tab-toggle-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n    color: var(--graupl-tabs-tab-toggle-focus-color, var(--graupl-tabs-tab-toggle-color, var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .tab-toggle.focus {\n    border-color: var(--graupl-tabs-tab-toggle-focus-border-color, var(--graupl-tabs-tab-toggle-border-color, var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    background: var(--graupl-tabs-tab-toggle-focus-background, var(--graupl-tabs-tab-toggle-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n    color: var(--graupl-tabs-tab-toggle-focus-color, var(--graupl-tabs-tab-toggle-color, var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n  }\n  .tab-toggle:hover {\n    border-color: var(--graupl-tabs-tab-toggle-hover-border-color, var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-tabs-tab-toggle-hover-background, var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    color: var(--graupl-tabs-tab-toggle-hover-color, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .tab-toggle.hover {\n    border-color: var(--graupl-tabs-tab-toggle-hover-border-color, var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    background: var(--graupl-tabs-tab-toggle-hover-background, var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    color: var(--graupl-tabs-tab-toggle-hover-color, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n  }\n  .tab-toggle:active {\n    border-color: var(--graupl-tabs-tab-toggle-active-border-color, var(--graupl-tabs-tab-toggle-hover-border-color, var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    background: var(--graupl-tabs-tab-toggle-active-background, var(--graupl-tabs-tab-toggle-hover-background, var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-tabs-tab-toggle-active-color, var(--graupl-tabs-tab-toggle-hover-color, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n  }\n  .tab-toggle.active {\n    border-color: var(--graupl-tabs-tab-toggle-active-border-color, var(--graupl-tabs-tab-toggle-hover-border-color, var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    background: var(--graupl-tabs-tab-toggle-active-background, var(--graupl-tabs-tab-toggle-hover-background, var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-tabs-tab-toggle-active-color, var(--graupl-tabs-tab-toggle-hover-color, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n  }\n  .tab-toggle:disabled {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled:visited {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.visited {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled:focus-visible {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.focus {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled:hover {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.hover {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled:active {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.active {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled[aria-selected=true] {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.selected {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled[aria-current=true] {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle:disabled.current {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled] {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled]:visited {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].visited {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled]:focus-visible {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].focus {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled]:hover {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].hover {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled]:active {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].active {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled][aria-selected=true] {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].selected {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled][aria-current=true] {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[disabled].current {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true] {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true]:visited {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].visited {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true]:focus-visible {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].focus {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true]:hover {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].hover {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true]:active {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].active {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true][aria-selected=true] {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].selected {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true][aria-current=true] {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-disabled=true].current {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled:visited {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.visited {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled:focus-visible {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.focus {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled:hover {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.hover {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled:active {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.active {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled[aria-selected=true] {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.selected {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled[aria-current=true] {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle.disabled.current {\n    border-color: var(--graupl-tabs-tab-toggle-disabled-border-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n    background: var(--graupl-tabs-tab-toggle-disabled-background, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n    color: var(--graupl-tabs-tab-toggle-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n  }\n  .tab-toggle[aria-selected=true] {\n    border-color: var(--graupl-tabs-tab-toggle-selected-border-color, var(--graupl-tabs-tab-toggle-hover-border-color, var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    background: var(--graupl-tabs-tab-toggle-selected-background, var(--graupl-tabs-tab-toggle-hover-background, var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-tabs-tab-toggle-selected-color, var(--graupl-tabs-tab-toggle-hover-color, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n  }\n  .tab-toggle.selected {\n    border-color: var(--graupl-tabs-tab-toggle-selected-border-color, var(--graupl-tabs-tab-toggle-hover-border-color, var(--graupl-tabs-tab-list-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n    background: var(--graupl-tabs-tab-toggle-selected-background, var(--graupl-tabs-tab-toggle-hover-background, var(--graupl-tabs-tab-list-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n    color: var(--graupl-tabs-tab-toggle-selected-color, var(--graupl-tabs-tab-toggle-hover-color, var(--graupl-tabs-tab-list-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n  }\n  .tab-content {\n    border-color: var(--graupl-tabs-tab-content-border-color, var(--graupl-tabs-border-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n    background: var(--graupl-tabs-tab-content-background, var(--graupl-tabs-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n    color: var(--graupl-tabs-tab-content-color, var(--graupl-tabs-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n  }\n}","// @graupl/core typography theme default values.\n//\n// Generally, these should not be used directly when styling components unless a static value is needed.\n// They are mainly used to provide class selectors, fallbacks for custom properties, or loop values.\n//\n// They should not be used to define direct property values (i.e. font-size, color, etc.).\n// Those should be defined as custom properties in the `_variables.scss` file.\n\n@use \"../../defaults\" as root-defaults;\n@use \"sass:map\";\n\n// font properties.\n$selector-base: root-defaults.$element-selector-base !default;\n$modifier-selector-base: root-defaults.$modifier-selector-base !default;\n$paragraph-selector-base: $selector-base !default;\n$paragraph-selector: \"p\";\n$small-selector-base: $selector-base !default;\n$small-selector: \"small\";\n$h1-selector-base: $selector-base !default;\n$h1-selector: \"h1\" !default;\n$h2-selector-base: $selector-base !default;\n$h2-selector: \"h2\" !default;\n$h3-selector-base: $selector-base !default;\n$h3-selector: \"h3\" !default;\n$h4-selector-base: $selector-base !default;\n$h4-selector: \"h4\" !default;\n$h5-selector-base: $selector-base !default;\n$h5-selector: \"h5\" !default;\n$h6-selector-base: $selector-base !default;\n$h6-selector: \"h6\" !default;\n$root-selector-base: \":\" !default;\n$root-selector: \"root\" !default;\n$bold-selector-base: $selector-base !default;\n$bold-selector: \"b\" !default;\n$strong-selector-base: $selector-base !default;\n$strong-selector: \"strong\" !default;\n$body-selector-base: $selector-base !default;\n$body-selector: \"body\" !default;\n$generate-base-font-sizes: root-defaults.$generate-base-font-sizes !default;\n$generate-base-font-weights: root-defaults.$generate-base-font-weights !default;\n$font-size-base: 1rem !default;\n$root-font-size: clamp(0.85rem, calc(0.8rem + 0.5vw), 1.25rem) !default;\n$line-height: 1.2em !default;\n\n// Multipliers for font sizes.\n// This uses a minor third scale.\n// See: https://typescale.com/?size=16&scale=1.250&text=A%20Visual%20Type%20Scale&font=Lato&fontweight=400&bodyfont=body_font_default&bodyfontweight=400&lineheight=1.75&backgroundcolor=%23ffffff&fontcolor=%23000000\n$-font-size-multipliers: (\n  xs: 0.694,\n  sm: 0.833,\n  base: 1,\n  lg: 1.2,\n  xl: 1.44,\n  2xl: 1.728,\n  3xl: 2.074,\n  4xl: 2.488,\n  5xl: 2.986,\n);\n$font-size-multipliers: () !default;\n\n// Merge the font size multipliers with the default ones.\n@if $generate-base-font-sizes {\n  $font-size-multipliers: map.merge(\n    $-font-size-multipliers,\n    $font-size-multipliers\n  );\n}\n\n// Weights.\n$-font-weights: (\n  light: 300,\n  normal: 400,\n  bold: 700,\n);\n$font-weights: () !default;\n\n// Merge the custom font weights with the default ones.\n@if $generate-base-font-weights {\n  $font-weights: map.merge($-font-weights, $font-weights);\n}\n\n/* stylelint-disable-next-line scss/dollar-variable-colon-space-after */\n$root-font-family:\n  system-ui,\n  -apple-system,\n  blinkmacsystemfont,\n  \"Segoe UI\",\n  roboto,\n  \"Helvetica Neue\",\n  arial,\n  sans-serif !default;\n","// @graupl/core layer mixins.\n//\n// These should be used to define the layers of your components to ensure that\n// they are output in the correct order in the final compiled CSS.\n\n@use \"../defaults\" as root-defaults;\n\n@mixin layer($layer) {\n  @if root-defaults.$use-layers {\n    @layer #{root-defaults.$id}.#{$layer} {\n      @content;\n    }\n  } @else {\n    @content;\n  }\n}\n","// @graupl/core alert component styles.\n//\n// This module provides the alert component styles.\n//\n// The following selectors are generated by default:\n// - `.alert`: The alert container.\n// - `.alert-body`: The alert body content.\n// - `.alert-header`: The alert header content.\n// - `.alert-footer`: The alert footer content.\n// - `.alert-title`: The alert title element.\n// - `.alert-dismisser`: The alert dismisser control.\n// - `.show`: Modifier applied when the alert is shown.\n// - `.hide`: Modifier applied when the alert is hidden.\n// - `.transitioning`: Modifier applied while the alert is transitioning.\n//\n// The following custom properties can be used to customize the alert component:\n// | Property                                   | Description                                | Default Value                                                                                                                                                                        |\n// | ---                                        | ---                                        | ---                                                                                                                                                                                  |\n// | `--graupl-alert-padding-x`                 | Horizontal padding of the alert.           | `var(--graupl-spacer-5)`                                                                                                                                                             |\n// | `--graupl-alert-padding-y`                 | Vertical padding of the alert.             | `var(--graupl-spacer-5)`                                                                                                                                                             |\n// | `--graupl-alert-padding`                   | Shorthand padding of the alert.            | `var(--graupl-alert-padding-y) var(--graupl-alert-padding-x)`                                                                                                                        |\n// | `--graupl-alert-gap`                       | Gap inside the alert (column/row).         | `var(--graupl-alert-column-gap) var(--graupl-alert-row-gap)`                                                                                                                         |\n// | `--graupl-alert-background`                | Background colour of the alert.            | `var(--graupl-background)`                                                                                                                                                           |\n// | `--graupl-alert-color`                     | Text colour of the alert.                  | `var(--graupl-color)`                                                                                                                                                                |\n// | `--graupl-alert-border-width`              | Border width of the alert.                 | `var(--graupl-border-top-width) var(--graupl-border-right-width) var(--graupl-border-bottom-width) var(--graupl-border-left-width)`                                                  |\n// | `--graupl-alert-border-style`              | Border style of the alert.                 | `var(--graupl-border-top-style) var(--graupl-border-right-style) var(--graupl-border-bottom-style) var(--graupl-border-left-style)`                                                  |\n// | `--graupl-alert-border-radius`             | Border radius of the alert.                | `var(--graupl-border-top-left-radius) var(--graupl-border-top-right-radius) var(--graupl-border-bottom-right-radius) var(--graupl-border-bottom-left-radius)`                        |\n// | `--graupl-alert-border-color`              | Border colour of the alert.                | `var(--graupl-alert-color)`                                                                                                                                                          |\n// | `--graupl-alert-transition`                | Transition applied to alert appearance.    | `opacity var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function), transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)` |\n// | `--graupl-alert-transition-reduced-motion` | Transition when reduced motion is enabled. | `opacity var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)`                                                                                            |\n// | `--graupl-alert-header-padding`            | Padding for the alert header.              | `0 0`                                                                                                                                                                                |\n// | `--graupl-alert-body-padding`              | Padding for the alert body.                | `0 0`                                                                                                                                                                                |\n// | `--graupl-alert-footer-padding`            | Padding for the alert footer.              | `0 0`                                                                                                                                                                                |\n// | `--graupl-alert-title-color`               | Text colour of the alert title.            | `var(--graupl-alert-color)`                                                                                                                                                          |\n// | `--graupl-alert-title-font-size`           | Font size of the alert title.              | `var(--graupl-h4)`                                                                                                                                                                   |\n// | `--graupl-alert-title-font-weight`         | Font weight of the alert title.            | `var(--graupl-font-weight-h4)`                                                                                                                                                       |\n// | `--graupl-alert-title-font-family`         | Font family of the alert title.            | `var(--graupl-font-family-h4)`                                                                                                                                                       |\n// | `--graupl-alert-title-line-height`         | Line height of the alert title.            | `var(--graupl-line-height-h4)`                                                                                                                                                       |\n// | `--graupl-alert-title-margin`              | Margin for the alert title.                | `0 0 0 0`                                                                                                                                                                            |\n// | `--graupl-alert-link-color`                | Link colour inside alerts.                 | `unset` (inherits)                                                                                                                                                                   |\n// | `--graupl-alert-link-visited-color`        | Visited link colour inside alerts.         | `unset`                                                                                                                                                                              |\n// | `--graupl-alert-link-focus-color`          | Focused link colour inside alerts.         | `unset`                                                                                                                                                                              |\n// | `--graupl-alert-link-hover-color`          | Hovered link colour inside alerts.         | `unset`                                                                                                                                                                              |\n// | `--graupl-alert-link-active-color`         | Active link colour inside alerts.          | `unset`                                                                                                                                                                              |\n// | `--graupl-alert-link-disabled-color`       | Disabled link colour inside alerts.        | `unset`                                                                                                                                                                              |\n//\n// The following sass variables can be used to customize the generation of the alert component:\n// | Variable                          | Description                                   | Default Value       |\n// | ---                               | ---                                           | ---                 |\n// | `$selector-base`                  | Selector base for the component.              | `\".\"`               |\n// | `$modifier-selector-base`         | Selector base for component modifiers.        | `\".\"`               |\n// | `$generate-base-theme-map`        | Flag to generate the base theme map.          | `true`              |\n// | `$themeable`                      | Flag to generate theme modifiers.             | `true`              |\n// | `$alert-selector-base`            | Selector base for the alert container.        | `$selector-base`    |\n// | `$alert-selector`                 | Selector for the alert container.             | `\"alert\"`           |\n// | `$alert-theme-selector-base`      | Selector base for theme modifiers.            | `\".\"`               |\n// | `$alert-theme-selector-prefix`    | Selector prefix for theme modifiers.          | `\"\"`                |\n// | `$alert-body-selector-base`       | Selector base for the alert body.             | `$selector-base`    |\n// | `$alert-body-selector`            | Selector for the alert body.                  | `\"alert-body\"`      |\n// | `$alert-header-selector-base`     | Selector base for the alert header.           | `$selector-base`    |\n// | `$alert-header-selector`          | Selector for the alert header.                | `\"alert-header\"`    |\n// | `$alert-footer-selector-base`     | Selector base for the alert footer.           | `$selector-base`    |\n// | `$alert-footer-selector`          | Selector for the alert footer.                | `\"alert-footer\"`    |\n// | `$alert-title-selector-base`      | Selector base for the alert title.            | `$selector-base`    |\n// | `$alert-title-selector`           | Selector for the alert title.                 | `\"alert-title\"`     |\n// | `$alert-dismisser-selector-base`  | Selector base for the alert dismisser.        | `$selector-base`    |\n// | `$alert-dismisser-selector`       | Selector for the alert dismisser.             | `\"alert-dismisser\"` |\n// | `$alert-hidden-selector-base`     | Selector base for the hidden modifier.        | `\".\"`               |\n// | `$alert-hidden-selector`          | Selector applied when hidden.                 | `\"hide\"`            |\n// | `$alert-shown-selector-base`      | Selector base for the shown modifier.         | `\".\"`               |\n// | `$alert-shown-selector`           | Selector applied when shown.                  | `\"show\"`            |\n// | `$alert-transition-selector-base` | Selector base for the transitioning modifier. | `\".\"`               |\n// | `$alert-transition-selector`      | Selector applied while transitioning.         | `\"transitioning\"`   |\n//\n// ## Using `$alert-theme-mappings`\n//\n// `$alert-theme-mappings` is a 1-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $alert-theme-mappings: (\n//   border-color: 700,\n// )\n// ```\n//\n// This directly[1] maps to all alert variants, telling them what shade to use for said property.\n// All alert variants will use the following based on the example above:\n// - Primary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize _all_ alerts variants in the same way.\n//\n// For example, if you use the following map:\n// ```scss\n// $alert-theme-mappings: (\n//   border-color: 500,\n// )\n// ```\n//\n// All alert variants will use the following:\n// - Primary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--primary--500`,\n// - Secondary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--secondary--500`, and\n// - Tertiary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--tertiary--500`.\n//\n// [1] `$alert-theme-mappings` gets parsed into a larger, more explicit map: `$alert-theme-map`.\n//\n// Using `$alert-theme-map`\n//\n// `$alert-theme-map` is a multi-level map of properties, colors, and shade values.\n//\n// e.g.\n// ```scss\n// $alert-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: primary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: tertiary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// This directly maps to all alert variants, telling them what shade to use for said property.\n// The alert variants will use the following based on the example above:\n// - Primary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize alert variants individually.\n//\n// For example, if you use the following map:\n//\n// ```scss\n// $alert-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// The alert variants will use the following:\n// - Primary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--secondary--700`,\n// - Secondary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary alerts will have their `--graupl-alert-border-color` property set to `--graupl-theme-active--secondary--700`.\n//\n// @example\n// <div class=\"alert\">\n//   <div class=\"alert-header\">\n//     <h3 class=\"alert-title\">Alert</h3>\n//   </div>\n//   <div class=\"alert-body\">\n//     <p>This is some text that describes the alert.</p>\n//   </div>\n// </div>\n//\n// @example\n// <div class=\"alert primary\">\n//   <div class=\"alert-header\">\n//     <h3 class=\"alert-title\">Alert</h3>\n//   </div>\n//   <div class=\"alert-body\">\n//     <p>This is some text that describes the alert.</p>\n//   </div>\n//   <div class=\"alert-footer\">\n//     <a href=\"#\">Action</a>\n//   </div>\n//   <button class=\"alert-dismisser\">x</button>\n// </div>\n\n@use \"defaults\";\n@use \"variables\" as *;\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/animation\";\n@use \"../../mixins/theme\";\n@use \"../../base/button/mixins\" as button-mixins;\n@use \"sass:map\";\n\n@include layer(base) {\n  // .alert-dismisser\n  #{defaults.$alert-dismisser-selector-base}#{defaults.$alert-dismisser-selector} {\n    @include button-mixins.apply-base;\n  }\n}\n\n@include layer(component) {\n  // .alert\n  #{defaults.$alert-selector-base}#{defaults.$alert-selector} {\n    --#{root-defaults.$prefix}button-border: 0;\n\n    display: grid;\n    grid-template-columns: [content-start] 1fr [content-end dismiss-start] auto [dismiss-end];\n    grid-template-rows: [header-start] auto [header-end body-start] auto [body-end footer-start] auto [footer-end];\n    padding: $alert-padding;\n    transition: $alert-transition;\n    border-width: $alert-border-width;\n    border-style: $alert-border-style;\n    border-radius: $alert-border-radius;\n    gap: $alert-gap;\n\n    // &.hide\n    &#{defaults.$alert-hidden-selector-base}#{defaults.$alert-hidden-selector} {\n      display: none;\n    }\n\n    // &.transitioning\n    &#{defaults.$alert-transition-selector-base}#{defaults.$alert-transition-selector} {\n      display: grid;\n      opacity: 0;\n    }\n\n    // &.show\n    &#{defaults.$alert-shown-selector-base}#{defaults.$alert-shown-selector} {\n      display: grid;\n    }\n  }\n\n  // .alert-header\n  #{defaults.$alert-header-selector-base}#{defaults.$alert-header-selector} {\n    grid-column: content;\n    grid-row: header;\n    padding: $alert-header-padding;\n  }\n\n  // .alert-body\n  #{defaults.$alert-body-selector-base}#{defaults.$alert-body-selector} {\n    grid-column: content;\n    grid-row: body;\n    padding: $alert-body-padding;\n  }\n\n  // .alert-footer\n  #{defaults.$alert-footer-selector-base}#{defaults.$alert-footer-selector} {\n    grid-column: content;\n    grid-row: footer;\n    padding: $alert-footer-padding;\n  }\n\n  // .alert-dismisser\n  #{defaults.$alert-dismisser-selector-base}#{defaults.$alert-dismisser-selector} {\n    grid-column: dismiss;\n    grid-row: 1 / -1;\n    align-self: flex-start;\n  }\n\n  // .alert-title\n  #{defaults.$alert-title-selector-base}#{defaults.$alert-title-selector} {\n    margin: $alert-title-margin;\n  }\n\n  @include animation.off {\n    // .alert\n    #{defaults.$alert-selector-base}#{defaults.$alert-selector} {\n      --#{root-defaults.$prefix}alert-transition: #{$alert-transition-reduced-motion};\n    }\n  }\n}\n\n@include layer(theme) {\n  // .alert\n  #{defaults.$alert-selector-base}#{defaults.$alert-selector} {\n    --#{root-defaults.$prefix}button-background: #{$alert-background};\n    --#{root-defaults.$prefix}button-focus-background: #{$alert-background};\n    --#{root-defaults.$prefix}link-color: #{$alert-link-color};\n    --#{root-defaults.$prefix}link-visited-color: #{$alert-link-visited-color};\n    --#{root-defaults.$prefix}link-focus-color: #{$alert-link-focus-color};\n    --#{root-defaults.$prefix}link-hover-color: #{$alert-link-hover-color};\n    --#{root-defaults.$prefix}link-active-color: #{$alert-link-active-color};\n    --#{root-defaults.$prefix}link-disabled-color: #{$alert-link-disabled-color};\n\n    border-color: $alert-border-color;\n    background-color: $alert-background;\n    color: $alert-color;\n\n    @if root-defaults.$themeable-components and defaults.$themeable {\n      @include theme.generate-modifiers(\n        defaults.$alert-theme-map,\n        defaults.$alert-theme-selector-base,\n        defaults.$alert-theme-selector-prefix,\n        \"alert-\"\n      );\n    }\n  }\n\n  // .alert-dismisser\n  #{defaults.$alert-dismisser-selector-base}#{defaults.$alert-dismisser-selector} {\n    @include button-mixins.apply-theme;\n  }\n\n  // .alert-title\n  #{defaults.$alert-title-selector-base}#{defaults.$alert-title-selector} {\n    color: $alert-title-color;\n    font-size: $alert-title-font-size;\n    font-weight: $alert-title-font-weight;\n    line-height: $alert-title-line-height;\n  }\n}\n","// @graupl/core button base styles.\n\n@use \"defaults\";\n@use \"../../defaults\" as root-defaults;\n@use \"../../theme/color/variables\" as color;\n@use \"variables\" as *;\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/animation\";\n@use \"../../mixins/state\";\n@use \"../../mixins/theme\";\n@use \"sass:map\";\n\n/// Mixin to apply base styles for buttons.\n@mixin apply-base() {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-width: $button-min-width;\n  min-height: $button-min-height;\n  padding: $button-padding;\n  transform: $button-transform;\n  transition: $button-transition;\n  border-width: $button-border-width;\n  border-style: $button-border-style;\n  border-radius: $button-border-radius;\n  font-size: $button-font-size;\n  cursor: pointer;\n\n  @include state.generate-modifiers(\n    (\n      transform: $button-transform-states,\n    )\n  );\n\n  @each $selector in map.get(root-defaults.$state-selectors, \"disabled\") {\n    &#{$selector} {\n      cursor: not-allowed;\n    }\n  }\n\n  @include animation.off {\n    --#{root-defaults.$prefix}button-transition: #{$button-transition-reduced-motion};\n  }\n}\n\n/// Mixin to apply theme styles for buttons.\n@mixin apply-theme() {\n  border-color: $button-border-color;\n  background: $button-background;\n  color: $button-color;\n\n  @include state.generate-modifiers(\n    (\n      border-color: $button-border-color-states,\n      background: $button-background-states,\n      color: $button-color-states,\n    )\n  );\n\n  @if root-defaults.$themeable-components and defaults.$themeable {\n    @include theme.generate-modifiers(\n      defaults.$button-theme-map,\n      defaults.$button-theme-selector-base,\n      defaults.$button-theme-selector-prefix,\n      \"button-\"\n    );\n  }\n}\n\n@mixin apply() {\n  @include apply-base;\n  @include apply-theme;\n}\n","// @graupl/core button base variables.\n//\n// These values are to be used to directly style bases and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property                            | Default                                                                                                                                                                                                                                                                      |\n// | ------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-button-min-width                  | 44px                                                                                                                                                                                                                                                                         |\n// | --graupl-button-min-height                 | 44px                                                                                                                                                                                                                                                                         |\n// | --graupl-button-padding-x                  | var(--graupl-spacer-5)                                                                                                                                                                                                                                                       |\n// | --graupl-button-padding-y                  | var(--graupl-spacer-3)                                                                                                                                                                                                                                                       |\n// | --graupl-button-padding                    | var(--graupl-button-padding-y) var(--graupl-button-padding-x)                                                                                                                                                                                                                |\n// | --graupl-button-font-size                  | var(--graupl-font-base)                                                                                                                                                                                                                                                      |\n// | --graupl-button-transition                 | background var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function), color var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function), transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function) |\n// | --graupl-button-transition-reduced-motion  | background var(--graupl-transition-duration-none) var(--graupl-transition-timing-function), color var(--graupl-transition-duration-none) var(--graupl-transition-timing-function)                                                                                            |\n// | --graupl-button-transform                  | none                                                                                                                                                                                                                                                                         |\n// | --graupl-button-visited-transform          | var(--graupl-button-transform)                                                                                                                                                                                                                                               |\n// | --graupl-button-focus-transform            | var(--graupl-button-transform)                                                                                                                                                                                                                                               |\n// | --graupl-button-hover-transform            | var(--graupl-button-transform)                                                                                                                                                                                                                                               |\n// | --graupl-button-active-transform           | scale(0.95)                                                                                                                                                                                                                                                                  |\n// | --graupl-button-disabled-transform         | none                                                                                                                                                                                                                                                                         |\n// | --graupl-button-background                 | var(--graupl-background)                                                                                                                                                                                                                                                     |\n// | --graupl-button-visited-background         | var(--graupl-button-background)                                                                                                                                                                                                                                              |\n// | --graupl-button-focus-background           | var(--graupl-button-background)                                                                                                                                                                                                                                              |\n// | --graupl-button-hover-background           | var(--graupl-color)                                                                                                                                                                                                                                                          |\n// | --graupl-button-active-background          | var(--graupl-button-hover-background)                                                                                                                                                                                                                                        |\n// | --graupl-button-disabled-background        | var(--graupl-background)                                                                                                                                                                                                                                                     |\n// | --graupl-button-color                      | var(--graupl-color)                                                                                                                                                                                                                                                          |\n// | --graupl-button-visited-color              | var(--graupl-button-color)                                                                                                                                                                                                                                                   |\n// | --graupl-button-focus-color                | var(--graupl-button-color)                                                                                                                                                                                                                                                   |\n// | --graupl-button-hover-color                | var(--graupl-background)                                                                                                                                                                                                                                                     |\n// | --graupl-button-active-color               | var(--graupl-button-hover-color)                                                                                                                                                                                                                                             |\n// | --graupl-button-disabled-color             | var(--graupl-theme-active--primary--200)                                                                                                                                                                                                                                     |\n// | --graupl-button-border-top-width           | var(--graupl-border-top-width)                                                                                                                                                                                                                                               |\n// | --graupl-button-border-right-width         | var(--graupl-border-right-width)                                                                                                                                                                                                                                             |\n// | --graupl-button-border-bottom-width        | var(--graupl-border-bottom-width)                                                                                                                                                                                                                                            |\n// | --graupl-button-border-left-width          | var(--graupl-border-left-width)                                                                                                                                                                                                                                              |\n// | --graupl-button-border-width               | var(--graupl-button-border-top-width) var(--graupl-button-border-right-width) var(--graupl-button-border-bottom-width) var(--graupl-button-border-left-width)                                                                                                                |\n// | --graupl-button-border-top-style           | var(--graupl-border-top-style)                                                                                                                                                                                                                                               |\n// | --graupl-button-border-right-style         | var(--graupl-border-right-style)                                                                                                                                                                                                                                             |\n// | --graupl-button-border-bottom-style        | var(--graupl-border-bottom-style)                                                                                                                                                                                                                                            |\n// | --graupl-button-border-left-style          | var(--graupl-border-left-style)                                                                                                                                                                                                                                              |\n// | --graupl-button-border-style               | var(--graupl-button-border-top-style) var(--graupl-button-border-right-style) var(--graupl-button-border-bottom-style) var(--graupl-button-border-left-style)                                                                                                                |\n// | --graupl-button-border-top-left-radius     | var(--graupl-border-top-left-radius)                                                                                                                                                                                                                                         |\n// | --graupl-button-border-top-right-radius    | var(--graupl-border-top-right-radius)                                                                                                                                                                                                                                        |\n// | --graupl-button-border-bottom-right-radius | var(--graupl-border-bottom-right-radius)                                                                                                                                                                                                                                     |\n// | --graupl-button-border-bottom-left-radius  | var(--graupl-border-bottom-left-radius)                                                                                                                                                                                                                                      |\n// | --graupl-button-border-radius              | var(--graupl-button-border-top-left-radius) var(--graupl-button-border-top-right-radius) var(--graupl-button-border-bottom-right-radius) var(--graupl-button-border-bottom-left-radius)                                                                                      |\n// | --graupl-button-border-color               | var(--graupl-border-color)                                                                                                                                                                                                                                                   |\n// | --graupl-button-visited-border-color       | var(--graupl-button-border-color)                                                                                                                                                                                                                                            |\n// | --graupl-button-focus-border-color         | var(--graupl-button-border-color)                                                                                                                                                                                                                                            |\n// | --graupl-button-hover-border-color         | var(--graupl-border-color)                                                                                                                                                                                                                                                   |\n// | --graupl-button-active-border-color        | var(--graupl-button-hover-border-color)                                                                                                                                                                                                                                      |\n// | --graupl-button-disabled-border-color      | var(--graupl-theme-active--primary--200)                                                                                                                                                                                                                                     |\n\n@use \"defaults\";\n@use \"../../variables\" as root-variables;\n@use \"../../defaults\" as root-defaults;\n@use \"../../theme/color/variables\" as color;\n@use \"../../theme/typography/variables\" as typography;\n@use \"../../functions/theme\";\n@use \"sass:map\";\n\n// Button properties.\n// --graupl-button-min-width\n$button-min-width: var(\n  --#{root-defaults.$prefix}button-min-width,\n  #{root-defaults.$interactive-min-width}\n);\n\n// --graupl-button-min-height\n$button-min-height: var(\n  --#{root-defaults.$prefix}button-min-height,\n  #{root-defaults.$interactive-min-height}\n);\n\n// --graupl-button-padding-x\n$button-padding-x: var(\n  --#{root-defaults.$prefix}button-padding-x,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-button-padding-y\n$button-padding-y: var(\n  --#{root-defaults.$prefix}button-padding-y,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-button-padding\n$button-padding: var(\n  --#{root-defaults.$prefix}button-padding,\n  #{$button-padding-y} #{$button-padding-x}\n);\n\n// --graupl-button-font-size\n$button-font-size: var(\n  --#{root-defaults.$prefix}button-font-size,\n  #{map.get(typography.$font-sizes, base)}\n);\n\n// --graupl-button-transition\n$button-transition: var(\n  --#{root-defaults.$prefix}button-transition,\n  background #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function},\n  color #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function},\n  transform #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function}\n);\n\n// --graupl-button-transition-reduced-motion\n$button-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}button-transition-reduced-motion,\n  background #{map.get(root-variables.$transition-durations, none)}\n    #{root-variables.$transition-timing-function},\n  color #{map.get(root-variables.$transition-durations, none)}\n    #{root-variables.$transition-timing-function}\n);\n\n// Transform properties.\n// --graupl-button-transform\n$button-transform: var(\n  --#{root-defaults.$prefix}button-transform,\n  #{defaults.$button-initial-transform}\n);\n\n// --graupl-button-visited-transform\n$button-visited-transform: var(\n  --#{root-defaults.$prefix}button-visited-transform,\n  #{$button-transform}\n);\n\n// --graupl-button-focus-transform\n$button-focus-transform: var(\n  --#{root-defaults.$prefix}button-focus-transform,\n  #{$button-transform}\n);\n\n// --graupl-button-hover-transform\n$button-hover-transform: var(\n  --#{root-defaults.$prefix}button-hover-transform,\n  #{$button-transform}\n);\n\n// --graupl-button-active-transform\n$button-active-transform: var(\n  --#{root-defaults.$prefix}button-active-transform,\n  #{defaults.$button-final-transform}\n);\n\n// --graupl-button-disabled-transform\n$button-disabled-transform: var(\n  --#{root-defaults.$prefix}button-disabled-transform,\n  #{defaults.$button-disabled-transform}\n);\n$button-transform-states: (\n  default: $button-transform,\n  visited: $button-visited-transform,\n  focus: $button-focus-transform,\n  hover: $button-hover-transform,\n  active: $button-active-transform,\n  disabled: $button-disabled-transform,\n);\n\n// Background properties.\n// --graupl-button-background\n$button-background: var(\n  --#{root-defaults.$prefix}button-background,\n  #{color.$background}\n);\n\n// --graupl-button-visited-background\n$button-visited-background: var(\n  --#{root-defaults.$prefix}button-visited-background,\n  #{$button-background}\n);\n\n// --graupl-button-focus-background\n$button-focus-background: var(\n  --#{root-defaults.$prefix}button-focus-background,\n  #{$button-background}\n);\n\n// --graupl-button-hover-background\n$button-hover-background: var(\n  --#{root-defaults.$prefix}button-hover-background,\n  #{color.$color}\n);\n\n// --graupl-button-active-background\n$button-active-background: var(\n  --#{root-defaults.$prefix}button-active-background,\n  #{$button-hover-background}\n);\n\n// --graupl-button-disabled-background\n$button-disabled-background: var(\n  --#{root-defaults.$prefix}button-disabled-background,\n  #{color.$background}\n);\n$button-background-states: (\n  default: $button-background,\n  visited: $button-visited-background,\n  focus: $button-focus-background,\n  hover: $button-hover-background,\n  active: $button-active-background,\n  disabled: $button-disabled-background,\n);\n\n// Text properties.\n// --graupl-button-color\n$button-color: var(--#{root-defaults.$prefix}button-color, #{color.$color});\n\n// --graupl-button-visited-color\n$button-visited-color: var(\n  --#{root-defaults.$prefix}button-visited-color,\n  #{$button-color}\n);\n\n// --graupl-button-focus-color\n$button-focus-color: var(\n  --#{root-defaults.$prefix}button-focus-color,\n  #{$button-color}\n);\n\n// --graupl-button-hover-color\n$button-hover-color: var(\n  --#{root-defaults.$prefix}button-hover-color,\n  #{color.$background}\n);\n\n// --graupl-button-active-color\n$button-active-color: var(\n  --#{root-defaults.$prefix}button-active-color,\n  #{$button-hover-color}\n);\n\n// --graupl-button-disabled-color\n$button-disabled-color: var(\n  --#{root-defaults.$prefix}button-disabled-color,\n  #{theme.get(primary, 200)}\n);\n$button-color-states: (\n  default: $button-color,\n  visited: $button-visited-color,\n  focus: $button-focus-color,\n  hover: $button-hover-color,\n  active: $button-active-color,\n  disabled: $button-disabled-color,\n);\n\n// Border properties.\n// --graupl-button-border-top-width\n$button-border-top-width: var(\n  --#{root-defaults.$prefix}button-border-top-width,\n  #{root-variables.$border-top-width}\n);\n\n// --graupl-button-border-right-width\n$button-border-right-width: var(\n  --#{root-defaults.$prefix}button-border-right-width,\n  #{root-variables.$border-right-width}\n);\n\n// --graupl-button-border-bottom-width\n$button-border-bottom-width: var(\n  --#{root-defaults.$prefix}button-border-bottom-width,\n  #{root-variables.$border-bottom-width}\n);\n\n// --graupl-button-border-left-width\n$button-border-left-width: var(\n  --#{root-defaults.$prefix}button-border-left-width,\n  #{root-variables.$border-left-width}\n);\n\n// --graupl-button-border-width\n$button-border-width: var(\n  --#{root-defaults.$prefix}button-border-width,\n  #{$button-border-top-width} #{$button-border-right-width}\n    #{$button-border-bottom-width} #{$button-border-left-width}\n);\n\n// --graupl-button-border-top-style\n$button-border-top-style: var(\n  --#{root-defaults.$prefix}button-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-button-border-right-style\n$button-border-right-style: var(\n  --#{root-defaults.$prefix}button-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-button-border-bottom-style\n$button-border-bottom-style: var(\n  --#{root-defaults.$prefix}button-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-button-border-left-style\n$button-border-left-style: var(\n  --#{root-defaults.$prefix}button-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-button-border-style\n$button-border-style: var(\n  --#{root-defaults.$prefix}button-border-style,\n  #{$button-border-top-style} #{$button-border-right-style}\n    #{$button-border-bottom-style} #{$button-border-left-style}\n);\n\n// --graupl-button-border-top-left-radius\n$button-border-top-left-radius: var(\n  --#{root-defaults.$prefix}button-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-button-border-top-right-radius\n$button-border-top-right-radius: var(\n  --#{root-defaults.$prefix}button-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-button-border-bottom-right-radius\n$button-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}button-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-button-border-bottom-left-radius\n$button-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}button-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-button-border-radius\n$button-border-radius: var(\n  --#{root-defaults.$prefix}button-border-radius,\n  #{$button-border-top-left-radius} #{$button-border-top-right-radius}\n    #{$button-border-bottom-right-radius} #{$button-border-bottom-left-radius}\n);\n\n// Border colour properties.\n// --graupl-button-border-color\n$button-border-color: var(\n  --#{root-defaults.$prefix}button-border-color,\n  #{color.$border-color}\n);\n\n// --graupl-button-visited-border-color\n$button-visited-border-color: var(\n  --#{root-defaults.$prefix}button-visited-border-color,\n  #{$button-border-color}\n);\n\n// --graupl-button-focus-border-color\n$button-focus-border-color: var(\n  --#{root-defaults.$prefix}button-focus-border-color,\n  #{$button-border-color}\n);\n\n// --graupl-button-hover-border-color\n$button-hover-border-color: var(\n  --#{root-defaults.$prefix}button-hover-border-color,\n  #{color.$border-color}\n);\n\n// --graupl-button-active-border-color\n$button-active-border-color: var(\n  --#{root-defaults.$prefix}button-active-border-color,\n  #{$button-hover-border-color}\n);\n\n// --graupl-button-disabled-border-color\n$button-disabled-border-color: var(\n  --#{root-defaults.$prefix}button-disabled-border-color,\n  #{theme.get(primary, 200)}\n);\n$button-border-color-states: (\n  default: $button-border-color,\n  visited: $button-visited-border-color,\n  focus: $button-focus-border-color,\n  hover: $button-hover-border-color,\n  active: $button-active-border-color,\n  disabled: $button-disabled-border-color,\n);\n","// @graupl/core state mixins.\n//\n// A series of mixins to tie styles to a state.\n\n@use \"../defaults\" as root-defaults;\n@use \"sass:map\";\n\n/// Applies styles to a specific state.\n///\n/// @param {string} $state\n///   The name of the state to apply the styles to.\n@mixin state($state) {\n  @each $selector in map.get(root-defaults.$state-selectors, $state) {\n    &#{$selector} {\n      @content;\n    }\n  }\n}\n\n/// Generates state modifiers with properties.\n///\n/// @param {map} $state-map\n///   The map of props and states.\n/// @param {string} $selector-base\n///   The selector base for the state modifier.\n/// @param {string} $selector-prefix\n///   The selector prefix for the state modifer.\n@mixin generate-modifiers($state-map) {\n  @each $state, $selectors in root-defaults.$state-selectors {\n    @each $selector in $selectors {\n      // e.g &:visited, &:focus-visible, &:hover, &:active, &:disabled\n      &#{$selector} {\n        @each $prop, $map in $state-map {\n          #{$prop}: map.get($map, $state);\n        }\n\n        // If the state is disabled, we want that to supersede all other states.\n        @if $state == \"disabled\" {\n          @each $sub-state, $sub-selectors in root-defaults.$state-selectors {\n            @if $sub-state != $state {\n              @each $sub-selector in $sub-selectors {\n                // e.g &:visited, &:focus-visible, &:hover, &:active\n                &#{$sub-selector} {\n                  @each $prop, $map in $state-map {\n                    #{$prop}: map.get($map, $state);\n                  }\n                }\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n}\n","// @graupl/core animation media query mixins.\n\n// A media query for targeting users who have not requested reduced motion.\n@mixin on {\n  @media (prefers-reduced-motion: no-preference) {\n    @content;\n  }\n}\n\n// A media query for targeting users who have requested reduced motion.\n@mixin off {\n  @media (prefers-reduced-motion: reduce) {\n    @content;\n  }\n}\n","// @graupl/core alert component variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property                           | Default                                                                                                                                                                             |\n// | ----------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-alert-padding-x                  | var(--graupl-spacer-5)                                                                                                                                                              |\n// | --graupl-alert-padding-y                  | var(--graupl-spacer-5)                                                                                                                                                              |\n// | --graupl-alert-padding                    | var(--graupl-alert-padding-y) var(--graupl-alert-padding-x)                                                                                                                         |\n// | --graupl-alert-column-gap                 | var(--graupl-spacer-0)                                                                                                                                                              |\n// | --graupl-alert-row-gap                    | var(--graupl-spacer-3)                                                                                                                                                              |\n// | --graupl-alert-gap                        | var(--graupl-alert-column-gap) var(--graupl-alert-row-gap)                                                                                                                          |\n// | --graupl-alert-background                 | var(--graupl-background)                                                                                                                                                            |\n// | --graupl-alert-color                      | var(--graupl-color)                                                                                                                                                                 |\n// | --graupl-alert-link-color                 | link-variables.var(--graupl-link-color)                                                                                                                                             |\n// | --graupl-alert-link-visited-color         | var(--graupl-alert-link-color)                                                                                                                                                      |\n// | --graupl-alert-link-focus-color           | var(--graupl-alert-link-color)                                                                                                                                                      |\n// | --graupl-alert-link-hover-color           | link-variables.var(--graupl-link-hover-color)                                                                                                                                       |\n// | --graupl-alert-link-active-color          | var(--graupl-alert-link-hover-color)                                                                                                                                                |\n// | --graupl-alert-link-disabled-color        | link-variables.var(--graupl-link-disabled-color)                                                                                                                                    |\n// | --graupl-alert-border-color               | var(--graupl-alert-color)                                                                                                                                                           |\n// | --graupl-alert-border-top-left-radius     | var(--graupl-border-top-left-radius)                                                                                                                                                |\n// | --graupl-alert-border-top-right-radius    | var(--graupl-border-top-right-radius)                                                                                                                                               |\n// | --graupl-alert-border-bottom-left-radius  | var(--graupl-border-bottom-left-radius)                                                                                                                                             |\n// | --graupl-alert-border-bottom-right-radius | var(--graupl-border-bottom-right-radius)                                                                                                                                            |\n// | --graupl-alert-border-radius              | var(--graupl-alert-border-top-left-radius) var(--graupl-alert-border-top-right-radius) var(--graupl-alert-border-bottom-right-radius) var(--graupl-alert-border-bottom-left-radius) |\n// | --graupl-alert-border-top-width           | var(--graupl-border-top-width)                                                                                                                                                      |\n// | --graupl-alert-border-right-width         | var(--graupl-border-right-width)                                                                                                                                                    |\n// | --graupl-alert-border-bottom-width        | var(--graupl-border-bottom-width)                                                                                                                                                   |\n// | --graupl-alert-border-left-width          | var(--graupl-border-left-width)                                                                                                                                                     |\n// | --graupl-alert-border-width               | var(--graupl-alert-border-top-width) var(--graupl-alert-border-right-width) var(--graupl-alert-border-bottom-width) var(--graupl-alert-border-left-width)                           |\n// | --graupl-alert-border-top-style           | var(--graupl-border-top-style)                                                                                                                                                      |\n// | --graupl-alert-border-right-style         | var(--graupl-border-right-style)                                                                                                                                                    |\n// | --graupl-alert-border-bottom-style        | var(--graupl-border-bottom-style)                                                                                                                                                   |\n// | --graupl-alert-border-left-style          | var(--graupl-border-left-style)                                                                                                                                                     |\n// | --graupl-alert-border-style               | var(--graupl-alert-border-top-style) var(--graupl-alert-border-right-style) var(--graupl-alert-border-bottom-style) var(--graupl-alert-border-left-style)                           |\n// | --graupl-alert-transition                 | opacity var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function), transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)  |\n// | --graupl-alert-transition-reduced-motion  | opacity var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)                                                                                             |\n// | --graupl-alert-header-padding-x           | 0                                                                                                                                                                                   |\n// | --graupl-alert-header-padding-y           | 0                                                                                                                                                                                   |\n// | --graupl-alert-header-padding             | var(--graupl-alert-header-padding-y) var(--graupl-alert-header-padding-x)                                                                                                           |\n// | --graupl-alert-title-color                | var(--graupl-alert-color)                                                                                                                                                           |\n// | --graupl-alert-title-font-size            | var(--graupl-h4-font-size)                                                                                                                                                          |\n// | --graupl-alert-title-font-weight          | var(--graupl-h4-font-weight)                                                                                                                                                        |\n// | --graupl-alert-title-font-family          | var(--graupl-h4-font-family)                                                                                                                                                        |\n// | --graupl-alert-title-line-height          | var(--graupl-h4-line-height)                                                                                                                                                        |\n// | --graupl-alert-title-margin               | 0 0 0 0                                                                                                                                                                             |\n// | --graupl-alert-body-padding-x             | 0                                                                                                                                                                                   |\n// | --graupl-alert-body-padding-y             | 0                                                                                                                                                                                   |\n// | --graupl-alert-body-padding               | var(--graupl-alert-body-padding-y) var(--graupl-alert-body-padding-x)                                                                                                               |\n// | --graupl-alert-footer-padding-x           | 0                                                                                                                                                                                   |\n// | --graupl-alert-footer-padding-y           | 0                                                                                                                                                                                   |\n// | --graupl-alert-footer-padding             | var(--graupl-alert-footer-padding-y) var(--graupl-alert-footer-padding-x)                                                                                                           |\n\n@use \"defaults\";\n@use \"../../defaults\" as root-defaults;\n@use \"../../variables\" as root-variables;\n@use \"../../theme/color/variables\" as color;\n@use \"../../theme/typography/variables\" as typography;\n@use \"../../base/link/variables\" as link-variables;\n@use \"sass:map\";\n\n// Alert properties.\n// --graupl-alert-padding-x\n$alert-padding-x: var(\n  --#{root-defaults.$prefix}alert-padding-x,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-alert-padding-y\n$alert-padding-y: var(\n  --#{root-defaults.$prefix}alert-padding-y,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-alert-padding\n$alert-padding: var(\n  --#{root-defaults.$prefix}alert-padding,\n  #{$alert-padding-y} #{$alert-padding-x}\n);\n\n// Alert gap properties.\n// --graupl-alert-column-gap\n$alert-column-gap: var(\n  --#{root-defaults.$prefix}alert-column-gap,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-alert-row-gap\n$alert-row-gap: var(\n  --#{root-defaults.$prefix}alert-row-gap,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-alert-gap\n$alert-gap: var(\n  --#{root-defaults.$prefix}alert-gap,\n  #{$alert-column-gap} #{$alert-row-gap}\n);\n\n// Alert color properties.\n// --graupl-alert-background\n$alert-background: var(\n  --#{root-defaults.$prefix}alert-background,\n  #{color.$background}\n);\n\n// --graupl-alert-color\n$alert-color: var(--#{root-defaults.$prefix}alert-color, #{color.$color});\n\n// --graupl-alert-link-color\n$alert-link-color: var(\n  --#{root-defaults.$prefix}alert-link-color,\n  #{link-variables.$link-color}\n);\n\n// --graupl-alert-link-visited-color\n$alert-link-visited-color: var(\n  --#{root-defaults.$prefix}alert-link-visited-color,\n  #{$alert-link-color}\n);\n\n// --graupl-alert-link-focus-color\n$alert-link-focus-color: var(\n  --#{root-defaults.$prefix}alert-link-focus-color,\n  #{$alert-link-color}\n);\n\n// --graupl-alert-link-hover-color\n$alert-link-hover-color: var(\n  --#{root-defaults.$prefix}alert-link-hover-color,\n  #{link-variables.$link-hover-color}\n);\n\n// --graupl-alert-link-active-color\n$alert-link-active-color: var(\n  --#{root-defaults.$prefix}alert-link-active-color,\n  #{$alert-link-hover-color}\n);\n\n// --graupl-alert-link-disabled-color\n$alert-link-disabled-color: var(\n  --#{root-defaults.$prefix}alert-link-disabled-color,\n  #{link-variables.$link-disabled-color}\n);\n\n// Alert border-properties.\n// --graupl-alert-border-color\n$alert-border-color: var(\n  --#{root-defaults.$prefix}alert-border-color,\n  #{$alert-color}\n);\n\n// --graupl-alert-border-top-left-radius\n$alert-border-top-left-radius: var(\n  --#{root-defaults.$prefix}alert-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-alert-border-top-right-radius\n$alert-border-top-right-radius: var(\n  --#{root-defaults.$prefix}alert-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-alert-border-bottom-left-radius\n$alert-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}alert-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-alert-border-bottom-right-radius\n$alert-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}alert-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-alert-border-radius\n$alert-border-radius: var(\n  --#{root-defaults.$prefix}alert-border-radius,\n  #{$alert-border-top-left-radius} #{$alert-border-top-right-radius}\n    #{$alert-border-bottom-right-radius} #{$alert-border-bottom-left-radius}\n);\n\n// --graupl-alert-border-top-width\n$alert-border-top-width: var(\n  --#{root-defaults.$prefix}alert-border-top-width,\n  #{root-variables.$border-top-width}\n);\n\n// --graupl-alert-border-right-width\n$alert-border-right-width: var(\n  --#{root-defaults.$prefix}alert-border-right-width,\n  #{root-variables.$border-right-width}\n);\n\n// --graupl-alert-border-bottom-width\n$alert-border-bottom-width: var(\n  --#{root-defaults.$prefix}alert-border-bottom-width,\n  #{root-variables.$border-bottom-width}\n);\n\n// --graupl-alert-border-left-width\n$alert-border-left-width: var(\n  --#{root-defaults.$prefix}alert-border-left-width,\n  #{root-variables.$border-left-width}\n);\n\n// --graupl-alert-border-width\n$alert-border-width: var(\n  --#{root-defaults.$prefix}alert-border-width,\n  #{$alert-border-top-width} #{$alert-border-right-width}\n    #{$alert-border-bottom-width} #{$alert-border-left-width}\n);\n\n// --graupl-alert-border-top-style\n$alert-border-top-style: var(\n  --#{root-defaults.$prefix}alert-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-alert-border-right-style\n$alert-border-right-style: var(\n  --#{root-defaults.$prefix}alert-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-alert-border-bottom-style\n$alert-border-bottom-style: var(\n  --#{root-defaults.$prefix}alert-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-alert-border-left-style\n$alert-border-left-style: var(\n  --#{root-defaults.$prefix}alert-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-alert-border-style\n$alert-border-style: var(\n  --#{root-defaults.$prefix}alert-border-style,\n  #{$alert-border-top-style} #{$alert-border-right-style}\n    #{$alert-border-bottom-style} #{$alert-border-left-style}\n);\n\n// Alert transition properties.\n// --graupl-alert-transition\n$alert-transition: var(\n  --#{root-defaults.$prefix}alert-transition,\n  opacity #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function},\n  transform #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function}\n);\n\n// --graupl-alert-transition-reduced-motion\n$alert-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}alert-transition-reduced-motion,\n  opacity #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function}\n);\n\n// Alert header properties.\n// --graupl-alert-header-padding-x\n$alert-header-padding-x: var(\n  --#{root-defaults.$prefix}alert-header-padding-x,\n  0\n);\n\n// --graupl-alert-header-padding-y\n$alert-header-padding-y: var(\n  --#{root-defaults.$prefix}alert-header-padding-y,\n  0\n);\n\n// --graupl-alert-header-padding\n$alert-header-padding: var(\n  --#{root-defaults.$prefix}alert-header-padding,\n  #{$alert-header-padding-y} #{$alert-header-padding-x}\n);\n\n// Alert title properties.\n// --graupl-alert-title-color\n$alert-title-color: var(\n  --#{root-defaults.$prefix}alert-title-color,\n  #{$alert-color}\n);\n\n// --graupl-alert-title-font-size\n$alert-title-font-size: var(\n  --#{root-defaults.$prefix}alert-title-font-size,\n  #{typography.$h4-font-size}\n);\n\n// --graupl-alert-title-font-weight\n$alert-title-font-weight: var(\n  --#{root-defaults.$prefix}alert-title-font-weight,\n  #{typography.$h4-font-weight}\n);\n\n// --graupl-alert-title-font-family\n$alert-title-font-family: var(\n  --#{root-defaults.$prefix}alert-title-font-family,\n  #{typography.$h4-font-family}\n);\n\n// --graupl-alert-title-line-height\n$alert-title-line-height: var(\n  --#{root-defaults.$prefix}alert-title-line-height,\n  #{typography.$h4-line-height}\n);\n\n// --graupl-alert-title-margin\n$alert-title-margin: var(--#{root-defaults.$prefix}alert-title-margin, 0 0 0 0);\n\n// Alert body properties.\n// --graupl-alert-body-padding-x\n$alert-body-padding-x: var(--#{root-defaults.$prefix}alert-body-padding-x, 0);\n\n// --graupl-alert-body-padding-y\n$alert-body-padding-y: var(--#{root-defaults.$prefix}alert-body-padding-y, 0);\n\n// --graupl-alert-body-padding\n$alert-body-padding: var(\n  --#{root-defaults.$prefix}alert-body-padding,\n  #{$alert-body-padding-y} #{$alert-body-padding-x}\n);\n\n// Alert footer properties.\n// --graupl-alert-footer-padding-x\n$alert-footer-padding-x: var(\n  --#{root-defaults.$prefix}alert-footer-padding-x,\n  0\n);\n\n// --graupl-alert-footer-padding-y\n$alert-footer-padding-y: var(\n  --#{root-defaults.$prefix}alert-footer-padding-y,\n  0\n);\n\n// --graupl-alert-footer-padding\n$alert-footer-padding: var(\n  --#{root-defaults.$prefix}alert-footer-padding,\n  #{$alert-footer-padding-y} #{$alert-footer-padding-x}\n);\n","// @graupl/core theme mixins.\n//\n// A series of mixins to tie styles to a theme-mode.\n\n@use \"../functions/theme\";\n@use \"../theme/color/defaults\" as color-defaults;\n@use \"../defaults\" as root-defaults;\n@use \"sass:map\";\n\n/// Applies styles to a specific theme mode.\n///\n/// @param {string} $theme-name\n///   The name of the theme mode to apply the styles to.\n@mixin theme($theme-name) {\n  #{color-defaults.$theme-selector-base}#{color-defaults.$theme-selector-prefix}#{$theme-name}#{color-defaults.$theme-selector-suffix} {\n    @content;\n  }\n}\n\n/// Generates a theme modifiers with custom props.\n///\n/// @param {map} $theme-map\n///   The map of custom props.\n/// @param {string} $selector-base\n///   The selector base for the theme modifier.\n/// @param {string} $selector-prefix\n///   The selector prefix for the theme modifer.\n/// @param {string} $scope\n///   The scope of the custom properties.\n/// @param {string} $base\n///   The base selector to append the theme modifier to.\n@mixin generate-modifiers(\n  $theme-map,\n  $selector-base,\n  $selector-prefix,\n  $scope: \"\",\n  $base: \"&\"\n) {\n  @each $color, $map in $theme-map {\n    // e.g. &.primary, &.secondary, &.tertiary\n    #{$base}#{$selector-base}#{$selector-prefix}#{$color} {\n      @each $prop, $value in $map {\n        --#{root-defaults.$prefix}#{$scope}#{$prop}: #{theme.get(\n            map.get($value, color),\n            map.get($value, shade)\n          )};\n      }\n    }\n  }\n}\n","// @graupl/core accordion component variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Property                                                        | Description                                                         | Default                                                                                                                                                                                                                                                                                                                   |\n// | --------------------------------------------------------------- | ------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-accordion-padding-x                                    | Horizontal padding on the accordion container.                      | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-padding-y                                    | Vertical padding on the accordion container.                        | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-padding                                      | Shorthand padding for the accordion container.                      | var(--graupl-accordion-padding-y) var(--graupl-accordion-padding-x)                                                                                                                                                                                                                                                       |\n// | --graupl-accordion-column-gap                                   | Column gap between accordion items.                                 | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-row-gap                                      | Row gap between accordion items.                                    | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-gap                                          | Gap between accordion items (column/row).                           | var(--graupl-accordion-column-gap) var(--graupl-accordion-row-gap)                                                                                                                                                                                                                                                        |\n// | --graupl-accordion-color                                        | Text colour of the accordion container.                             | var(--graupl-color)                                                                                                                                                                                                                                                                                                       |\n// | --graupl-accordion-background                                   | Background colour of the accordion container.                       | var(--graupl-background)                                                                                                                                                                                                                                                                                                  |\n// | --graupl-accordion-border-color                                 | Border colour of the accordion container.                           | var(--graupl-accordion-color)                                                                                                                                                                                                                                                                                             |\n// | --graupl-accordion-item-color                                   | Text colour of the accordion item.                                  | var(--graupl-accordion-color)                                                                                                                                                                                                                                                                                             |\n// | --graupl-accordion-item-background                              | Background colour of the accordion item.                            | var(--graupl-accordion-background)                                                                                                                                                                                                                                                                                        |\n// | --graupl-accordion-item-border-color                            | Border colour of the accordion item.                                | var(--graupl-accordion-border-color)                                                                                                                                                                                                                                                                                      |\n// | --graupl-accordion-item-border-top-left-radius                  | Top-left border radius of an accordion item.                        | var(--graupl-border-top-left-radius)                                                                                                                                                                                                                                                                                      |\n// | --graupl-accordion-item-border-top-right-radius                 | Top-right border radius of an accordion item.                       | var(--graupl-border-top-right-radius)                                                                                                                                                                                                                                                                                     |\n// | --graupl-accordion-item-border-bottom-right-radius              | Bottom-right border radius of an accordion item.                    | var(--graupl-border-bottom-right-radius)                                                                                                                                                                                                                                                                                  |\n// | --graupl-accordion-item-border-bottom-left-radius               | Bottom-left border radius of an accordion item.                     | var(--graupl-border-bottom-left-radius)                                                                                                                                                                                                                                                                                   |\n// | --graupl-accordion-item-border-radius                           | Border radius of an accordion item.                                 | var(--graupl-accordion-item-border-top-left-radius) var(--graupl-accordion-item-border-top-right-radius) var(--graupl-accordion-item-border-bottom-right-radius) var(--graupl-accordion-item-border-bottom-left-radius)                                                                                                   |\n// | --graupl-accordion-item-border-top-width                        | Top border width of an accordion item.                              | var(--graupl-border-top-width)                                                                                                                                                                                                                                                                                            |\n// | --graupl-accordion-item-border-right-width                      | Right border width of an accordion item.                            | var(--graupl-border-right-width)                                                                                                                                                                                                                                                                                          |\n// | --graupl-accordion-item-border-bottom-width                     | Bottom border width of an accordion item.                           | var(--graupl-border-bottom-width)                                                                                                                                                                                                                                                                                         |\n// | --graupl-accordion-item-border-left-width                       | Left border width of an accordion item.                             | var(--graupl-border-left-width)                                                                                                                                                                                                                                                                                           |\n// | --graupl-accordion-item-border-width                            | Border width of an accordion item.                                  | var(--graupl-accordion-item-border-top-width) var(--graupl-accordion-item-border-right-width) var(--graupl-accordion-item-border-bottom-width) var(--graupl-accordion-item-border-left-width)                                                                                                                             |\n// | --graupl-accordion-item-border-top-style                        | Top border style of an accordion item.                              | var(--graupl-border-top-style)                                                                                                                                                                                                                                                                                            |\n// | --graupl-accordion-item-border-right-style                      | Right border style of an accordion item.                            | var(--graupl-border-right-style)                                                                                                                                                                                                                                                                                          |\n// | --graupl-accordion-item-border-bottom-style                     | Bottom border style of an accordion item.                           | var(--graupl-border-bottom-style)                                                                                                                                                                                                                                                                                         |\n// | --graupl-accordion-item-border-left-style                       | Left border style of an accordion item.                             | var(--graupl-border-left-style)                                                                                                                                                                                                                                                                                           |\n// | --graupl-accordion-item-border-style                            | Border style of an accordion item.                                  | var(--graupl-accordion-item-border-top-style) var(--graupl-accordion-item-border-right-style) var(--graupl-accordion-item-border-bottom-style) var(--graupl-accordion-item-border-left-style)                                                                                                                             |\n// | --graupl-accordion-item-header-padding-x                        | Horizontal padding for the accordion item header.                   | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-header-padding-y                        | Vertical padding for the accordion item header.                     | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-header-padding                          | Padding for the accordion item header.                              | var(--graupl-accordion-item-header-padding-y) var(--graupl-accordion-item-header-padding-x)                                                                                                                                                                                                                               |\n// | --graupl-accordion-item-header-margin                           | Margin for the accordion item header (pulls content over borders).  | calc(-1 * min(var(--graupl-accordion-item-border-top-width), var(--graupl-accordion-item-border-bottom-width), var(--graupl-accordion-item-border-left-width), var(--graupl-accordion-item-border-right-width)))                                                                                                          |\n// | --graupl-accordion-item-title-padding-x                         | Horizontal padding for the accordion item title row.                | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-title-padding-y                         | Vertical padding for the accordion item title row.                  | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-title-padding                           | Padding for the accordion item title row.                           | var(--graupl-accordion-item-title-padding-y) var(--graupl-accordion-item-title-padding-x)                                                                                                                                                                                                                                 |\n// | --graupl-accordion-item-title-margin-x                          | Horizontal margin for the accordion item title row.                 | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-title-margin-y                          | Vertical margin for the accordion item title row.                   | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-title-margin                            | Margin for the accordion item title row.                            | var(--graupl-accordion-item-title-margin-y) var(--graupl-accordion-item-title-margin-x)                                                                                                                                                                                                                                   |\n// | --graupl-accordion-item-title-color                             | Text colour for accordion item titles.                              | var(--graupl-accordion-item-color)                                                                                                                                                                                                                                                                                        |\n// | --graupl-accordion-item-title-background                        | Background colour for accordion item titles.                        | var(--graupl-accordion-item-background)                                                                                                                                                                                                                                                                                   |\n// | --graupl-accordion-item-title-border-color                      | Border colour for accordion item titles.                            | var(--graupl-accordion-item-border-color)                                                                                                                                                                                                                                                                                 |\n// | --graupl-accordion-item-title-font-size                         | Font size for accordion item titles.                                | var(--graupl-h5-font-size)                                                                                                                                                                                                                                                                                                |\n// | --graupl-accordion-item-title-font-weight                       | Font weight for accordion item titles.                              | var(--graupl-h5-font-weight)                                                                                                                                                                                                                                                                                              |\n// | --graupl-accordion-item-title-font-family                       | Font family for accordion item titles.                              | var(--graupl-h5-font-family)                                                                                                                                                                                                                                                                                              |\n// | --graupl-accordion-item-title-line-height                       | Line height for accordion item titles.                              | var(--graupl-h5-line-height)                                                                                                                                                                                                                                                                                              |\n// | --graupl-accordion-item-content-color                           | Text colour for accordion item content.                             | var(--graupl-accordion-item-color)                                                                                                                                                                                                                                                                                        |\n// | --graupl-accordion-item-content-background                      | Background colour for accordion item content.                       | var(--graupl-accordion-item-background)                                                                                                                                                                                                                                                                                   |\n// | --graupl-accordion-item-content-padding-x                       | Horizontal padding for the accordion item content area.             | var(--graupl-spacer-5)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-content-padding-y                       | Vertical padding for the accordion item content area.               | var(--graupl-spacer-5)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-content-padding                         | Padding for the accordion item content area.                        | var(--graupl-accordion-item-content-padding-y) var(--graupl-accordion-item-content-padding-x)                                                                                                                                                                                                                             |\n// | --graupl-accordion-item-content-column-gap                      | Column gap inside the accordion content.                            | var(--graupl-spacer-3)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-content-row-gap                         | Row gap inside the accordion content.                               | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-content-gap                             | Gap inside the accordion content (column/row).                      | var(--graupl-accordion-item-content-column-gap) var(--graupl-accordion-item-content-row-gap)                                                                                                                                                                                                                              |\n// | --graupl-accordion-item-body-padding-x                          | Horizontal padding for the accordion item body.                     | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-body-padding-y                          | Vertical padding for the accordion item body.                       | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-body-padding                            | Padding for the accordion item body.                                | var(--graupl-accordion-item-body-padding-y) var(--graupl-accordion-item-body-padding-x)                                                                                                                                                                                                                                   |\n// | --graupl-accordion-item-footer-padding-x                        | Horizontal padding for the accordion item footer.                   | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-footer-padding-y                        | Vertical padding for the accordion item footer.                     | var(--graupl-spacer-0)                                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-footer-padding                          | Padding for the accordion item footer.                              | var(--graupl-accordion-item-footer-padding-y) var(--graupl-accordion-item-footer-padding-x)                                                                                                                                                                                                                               |\n// | --graupl-accordion-item-content-transform                       | Base transform for accordion content.                               | translateY(-100%)                                                                                                                                                                                                                                                                                                         |\n// | --graupl-accordion-item-content-open-transform                  | Transform when accordion content is open.                           | translateY(0)                                                                                                                                                                                                                                                                                                             |\n// | --graupl-accordion-item-toggle-padding-x                        | Horizontal padding applied to the toggle control.                   | var(--graupl-button-padding-x)                                                                                                                                                                                                                                                                                            |\n// | --graupl-accordion-item-toggle-padding-y                        | Vertical padding applied to the toggle control.                     | var(--graupl-button-padding-y)                                                                                                                                                                                                                                                                                            |\n// | --graupl-accordion-item-toggle-padding                          | Shorthand padding applied to the toggle control.                    | var(--graupl-accordion-item-toggle-padding-y) var(--graupl-accordion-item-toggle-padding-x)                                                                                                                                                                                                                               |\n// | --graupl-accordion-item-toggle-transform                        | Base transform for the toggle control.                              | none                                                                                                                                                                                                                                                                                                                      |\n// | --graupl-accordion-item-toggle-visited-transform                | Transform for a visited toggle.                                     | var(--graupl-accordion-item-toggle-transform)                                                                                                                                                                                                                                                                             |\n// | --graupl-accordion-item-toggle-focus-transform                  | Transform for a focused toggle.                                     | var(--graupl-accordion-item-toggle-transform)                                                                                                                                                                                                                                                                             |\n// | --graupl-accordion-item-toggle-hover-transform                  | Transform for a hovered toggle.                                     | var(--graupl-accordion-item-toggle-transform)                                                                                                                                                                                                                                                                             |\n// | --graupl-accordion-item-toggle-active-transform                 | Transform for an active toggle.                                     | none                                                                                                                                                                                                                                                                                                                      |\n// | --graupl-accordion-item-toggle-disabled-transform               | Transform for a disabled toggle.                                    | none                                                                                                                                                                                                                                                                                                                      |\n// | --graupl-accordion-item-toggle-pseudo-transform                 | Transform for the toggle indicator pseudo-element.                  | none                                                                                                                                                                                                                                                                                                                      |\n// | --graupl-accordion-item-toggle-pseudo-open-transform            | Transform for the toggle indicator when open.                       | rotate(-180deg)                                                                                                                                                                                                                                                                                                           |\n// | --graupl-accordion-transition-duration                          | Duration used for accordion transitions.                            | var(--graupl-transition-duration-slow)                                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-transition-timing-function                   | Timing function used for accordion transitions.                     | var(--graupl-transition-timing-function)                                                                                                                                                                                                                                                                                  |\n// | --graupl-accordion-item-transition                              | Transition applied to accordion item height.                        | height var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function)                                                                                                                                                                                                                     |\n// | --graupl-accordion-item-transition-reduced-motion               | Transition used when reduced motion is enabled.                     | none                                                                                                                                                                                                                                                                                                                      |\n// | --graupl-accordion-item-toggle-pseudo-transition                | Transition for the toggle indicator pseudo-element.                 | transform var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function)                                                                                                                                                                                                                  |\n// | --graupl-accordion-item-toggle-pseudo-transition-reduced-motion | Transition for the toggle indicator when reduced motion is enabled. | none                                                                                                                                                                                                                                                                                                                      |\n// | --graupl-accordion-item-content-transition                      | Transition applied to accordion content.                            | opacity var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function) transform var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function)                                                                                                           |\n// | --graupl-accordion-item-content-transition-reduced-motion       | Transition for content when reduced motion is enabled.              | opacity var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function)                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-toggle-transition                       | Transition for toggle state changes.                                | background var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function), color var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function), transform var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function) |\n// | --graupl-accordion-item-toggle-transition-reduced-motion        | Transition used when reduced motion is enabled.                     | background var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function), color var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function)                                                                                                           |\n// | --graupl-accordion-item-toggle-color                            | Text colour of the accordion item toggle.                           | var(--graupl-accordion-color)                                                                                                                                                                                                                                                                                             |\n// | --graupl-accordion-item-toggle-visited-color                    | Text colour of a visited accordion item toggle.                     | var(--graupl-accordion-item-toggle-color)                                                                                                                                                                                                                                                                                 |\n// | --graupl-accordion-item-toggle-focus-color                      | Text colour of a focused accordion item toggle.                     | var(--graupl-accordion-item-toggle-color)                                                                                                                                                                                                                                                                                 |\n// | --graupl-accordion-item-toggle-hover-color                      | Text colour of a hovered accordion item toggle.                     | var(--graupl-accordion-background)                                                                                                                                                                                                                                                                                        |\n// | --graupl-accordion-item-toggle-active-color                     | Text colour of an active accordion item toggle.                     | var(--graupl-accordion-item-toggle-hover-color)                                                                                                                                                                                                                                                                           |\n// | --graupl-accordion-item-toggle-disabled-color                   | Text colour of a disabled accordion item toggle.                    | var(--graupl-theme-active--primary--200)                                                                                                                                                                                                                                                                                  |\n// | --graupl-accordion-item-toggle-background                       | Background colour of the accordion item toggle.                     | var(--graupl-accordion-background)                                                                                                                                                                                                                                                                                        |\n// | --graupl-accordion-item-toggle-visited-background               | Background colour of a visited accordion item toggle.               | var(--graupl-accordion-item-toggle-background)                                                                                                                                                                                                                                                                            |\n// | --graupl-accordion-item-toggle-focus-background                 | Background colour of a focused accordion item toggle.               | var(--graupl-accordion-item-toggle-background)                                                                                                                                                                                                                                                                            |\n// | --graupl-accordion-item-toggle-hover-background                 | Background colour of a hovered accordion item toggle.               | var(--graupl-accordion-color)                                                                                                                                                                                                                                                                                             |\n// | --graupl-accordion-item-toggle-active-background                | Background colour of an active accordion item toggle.               | var(--graupl-accordion-item-toggle-hover-background)                                                                                                                                                                                                                                                                      |\n// | --graupl-accordion-item-toggle-disabled-background              | Background colour of a disabled accordion item toggle.              | var(--graupl-accordion-background)                                                                                                                                                                                                                                                                                        |\n// | --graupl-accordion-item-toggle-border-color                     | Border colour of the accordion item toggle.                         | var(--graupl-accordion-item-border-color)                                                                                                                                                                                                                                                                                 |\n// | --graupl-accordion-item-toggle-visited-border-color             | Border colour of a visited accordion item toggle.                   | var(--graupl-accordion-item-toggle-border-color)                                                                                                                                                                                                                                                                          |\n// | --graupl-accordion-item-toggle-focus-border-color               | Border colour of a focused accordion item toggle.                   | var(--graupl-accordion-item-toggle-border-color)                                                                                                                                                                                                                                                                          |\n// | --graupl-accordion-item-toggle-hover-border-color               | Border colour of a hovered accordion item toggle.                   | var(--graupl-accordion-item-border-color)                                                                                                                                                                                                                                                                                 |\n// | --graupl-accordion-item-toggle-active-border-color              | Border colour of an active accordion item toggle.                   | var(--graupl-accordion-item-toggle-hover-border-color)                                                                                                                                                                                                                                                                    |\n// | --graupl-accordion-item-toggle-disabled-border-color            | Border colour of a disabled accordion item toggle.                  | var(--graupl-theme-active--primary--200)                                                                                                                                                                                                                                                                                  |\n\n@use \"../../base/button/variables\" as button;\n@use \"../../defaults\" as root-defaults;\n@use \"../../functions/theme\";\n@use \"../../theme/color/variables\" as color;\n@use \"../../theme/typography/variables\" as typography;\n@use \"../../variables\" as root-variables;\n@use \"defaults\";\n@use \"sass:map\";\n\n// Accordion properties.\n// --graupl-accordion-padding-x\n$accordion-padding-x: var(\n  --#{root-defaults.$prefix}accordion-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-padding-y\n$accordion-padding-y: var(\n  --#{root-defaults.$prefix}accordion-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-padding\n$accordion-padding: var(\n  --#{root-defaults.$prefix}accordion-padding,\n  #{$accordion-padding-y} #{$accordion-padding-x}\n);\n\n// Accordion gap properties.\n// --graupl-accordion-column-gap\n$accordion-column-gap: var(\n  --#{root-defaults.$prefix}accordion-column-gap,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-row-gap\n$accordion-row-gap: var(\n  --#{root-defaults.$prefix}accordion-row-gap,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-gap\n$accordion-gap: var(\n  --#{root-defaults.$prefix}accordion-gap,\n  #{$accordion-column-gap} #{$accordion-row-gap}\n);\n\n// Accordion color properties.\n// --graupl-accordion-color\n$accordion-color: var(\n  --#{root-defaults.$prefix}accordion-color,\n  #{color.$color}\n);\n\n// --graupl-accordion-background\n$accordion-background: var(\n  --#{root-defaults.$prefix}accordion-background,\n  #{color.$background}\n);\n\n// --graupl-accordion-border-color\n$accordion-border-color: var(\n  --#{root-defaults.$prefix}accordion-border-color,\n  #{$accordion-color}\n);\n\n// --graupl-accordion-item-color\n$accordion-item-color: var(\n  --#{root-defaults.$prefix}accordion-item-color,\n  #{$accordion-color}\n);\n\n// --graupl-accordion-item-background\n$accordion-item-background: var(\n  --#{root-defaults.$prefix}accordion-item-background,\n  #{$accordion-background}\n);\n\n// Accordion item border properties.\n// --graupl-accordion-item-border-color\n$accordion-item-border-color: var(\n  --#{root-defaults.$prefix}accordion-item-border-color,\n  #{$accordion-border-color}\n);\n\n// --graupl-accordion-item-border-top-left-radius\n$accordion-item-border-top-left-radius: var(\n  --#{root-defaults.$prefix}accordion-item-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-accordion-item-border-top-right-radius\n$accordion-item-border-top-right-radius: var(\n  --#{root-defaults.$prefix}accordion-item-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-accordion-item-border-bottom-left-radius\n$accordion-item-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}accordion-item-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-accordion-item-border-bottom-right-radius\n$accordion-item-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}accordion-item-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-accordion-item-border-radius\n$accordion-item-border-radius: var(\n  --#{root-defaults.$prefix}accordion-item-border-radius,\n  #{$accordion-item-border-top-left-radius}\n    #{$accordion-item-border-top-right-radius}\n    #{$accordion-item-border-bottom-right-radius}\n    #{$accordion-item-border-bottom-left-radius}\n);\n\n// --graupl-accordion-item-border-top-width\n$accordion-item-border-top-width: var(\n  --#{root-defaults.$prefix}accordion-item-border-top-width,\n  #{root-variables.$border-top-width}\n);\n\n// --graupl-accordion-item-border-right-width\n$accordion-item-border-right-width: var(\n  --#{root-defaults.$prefix}accordion-item-border-right-width,\n  #{root-variables.$border-right-width}\n);\n\n// --graupl-accordion-item-border-bottom-width\n$accordion-item-border-bottom-width: var(\n  --#{root-defaults.$prefix}accordion-item-border-bottom-width,\n  #{root-variables.$border-bottom-width}\n);\n\n// --graupl-accordion-item-border-left-width\n$accordion-item-border-left-width: var(\n  --#{root-defaults.$prefix}accordion-item-border-left-width,\n  #{root-variables.$border-left-width}\n);\n\n// --graupl-accordion-item-border-width\n$accordion-item-border-width: var(\n  --#{root-defaults.$prefix}accordion-item-border-width,\n  #{$accordion-item-border-top-width} #{$accordion-item-border-right-width}\n    #{$accordion-item-border-bottom-width} #{$accordion-item-border-left-width}\n);\n\n// --graupl-accordion-item-border-top-style\n$accordion-item-border-top-style: var(\n  --#{root-defaults.$prefix}accordion-item-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-accordion-item-border-right-style\n$accordion-item-border-right-style: var(\n  --#{root-defaults.$prefix}accordion-item-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-accordion-item-border-bottom-style\n$accordion-item-border-bottom-style: var(\n  --#{root-defaults.$prefix}accordion-item-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-accordion-item-border-left-style\n$accordion-item-border-left-style: var(\n  --#{root-defaults.$prefix}accordion-item-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-accordion-item-border-style\n$accordion-item-border-style: var(\n  --#{root-defaults.$prefix}accordion-item-border-style,\n  #{$accordion-item-border-top-style} #{$accordion-item-border-right-style}\n    #{$accordion-item-border-bottom-style} #{$accordion-item-border-left-style}\n);\n\n// Accordion item header properties.\n// --graupl-accordion-item-header-padding-x\n$accordion-item-header-padding-x: var(\n  --#{root-defaults.$prefix}accordion-item-header-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-item-header-padding-y\n$accordion-item-header-padding-y: var(\n  --#{root-defaults.$prefix}accordion-item-header-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-item-header-padding\n$accordion-item-header-padding: var(\n  --#{root-defaults.$prefix}accordion-item-header-padding,\n  #{$accordion-item-header-padding-y} #{$accordion-item-header-padding-x}\n);\n/* stylelint-disable scss/operator-no-newline-after -- Prettier wants to format it this way. */\n// --graupl-accordion-item-header-margin\n$accordion-item-header-margin: var(\n  --#{root-defaults.$prefix}accordion-item-header-margin,\n  calc(\n    -1 *\n      min(\n        #{$accordion-item-border-top-width},\n        #{$accordion-item-border-bottom-width},\n        #{$accordion-item-border-left-width},\n        #{$accordion-item-border-right-width}\n      )\n  )\n);\n/* stylelint-enable  scss/operator-no-newline-after */\n\n// Accordion item title properties.\n// --graupl-accordion-item-title-padding-x\n$accordion-item-title-padding-x: var(\n  --#{root-defaults.$prefix}accordion-item-title-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-item-title-padding-y\n$accordion-item-title-padding-y: var(\n  --#{root-defaults.$prefix}accordion-item-title-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-item-title-padding\n$accordion-item-title-padding: var(\n  --#{root-defaults.$prefix}accordion-item-title-padding,\n  #{$accordion-item-title-padding-y} #{$accordion-item-title-padding-x}\n);\n\n// --graupl-accordion-item-title-margin-x\n$accordion-item-title-margin-x: var(\n  --#{root-defaults.$prefix}accordion-item-title-margin-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-item-title-margin-y\n$accordion-item-title-margin-y: var(\n  --#{root-defaults.$prefix}accordion-item-title-margin-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-item-title-margin\n$accordion-item-title-margin: var(\n  --#{root-defaults.$prefix}accordion-item-title-margin,\n  #{$accordion-item-title-margin-y} #{$accordion-item-title-margin-x}\n);\n\n// --graupl-accordion-item-title-color\n$accordion-item-title-color: var(\n  --#{root-defaults.$prefix}accordion-item-title-color,\n  #{$accordion-item-color}\n);\n\n// --graupl-accordion-item-title-background\n$accordion-item-title-background: var(\n  --#{root-defaults.$prefix}accordion-item-title-background,\n  #{$accordion-item-background}\n);\n\n// --graupl-accordion-item-title-border-color\n$accordion-item-title-border-color: var(\n  --#{root-defaults.$prefix}accordion-item-title-border-color,\n  #{$accordion-item-border-color}\n);\n\n// --graupl-accordion-item-title-font-size\n$accordion-item-title-font-size: var(\n  --#{root-defaults.$prefix}accordion-item-title-font-size,\n  #{typography.$h5-font-size}\n);\n\n// --graupl-accordion-item-title-font-weight\n$accordion-item-title-font-weight: var(\n  --#{root-defaults.$prefix}accordion-item-title-font-weight,\n  #{typography.$h5-font-weight}\n);\n\n// --graupl-accordion-item-title-font-family\n$accordion-item-title-font-family: var(\n  --#{root-defaults.$prefix}accordion-item-title-font-family,\n  #{typography.$h5-font-family}\n);\n\n// --graupl-accordion-item-title-line-height\n$accordion-item-title-line-height: var(\n  --#{root-defaults.$prefix}accordion-item-title-line-height,\n  #{typography.$h5-line-height}\n);\n\n// --graupl-accordion-item-content-color\n$accordion-item-content-color: var(\n  --#{root-defaults.$prefix}accordion-item-content-color,\n  #{$accordion-item-color}\n);\n\n// --graupl-accordion-item-content-background\n$accordion-item-content-background: var(\n  --#{root-defaults.$prefix}accordion-item-content-background,\n  #{$accordion-item-background}\n);\n\n// Accordion item content properties.\n// --graupl-accordion-item-content-padding-x\n$accordion-item-content-padding-x: var(\n  --#{root-defaults.$prefix}accordion-item-content-padding-x,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-accordion-item-content-padding-y\n$accordion-item-content-padding-y: var(\n  --#{root-defaults.$prefix}accordion-item-content-padding-y,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-accordion-item-content-padding\n$accordion-item-content-padding: var(\n  --#{root-defaults.$prefix}accordion-item-content-padding,\n  #{$accordion-item-content-padding-y} #{$accordion-item-content-padding-x}\n);\n\n// --graupl-accordion-item-content-column-gap\n$accordion-item-content-column-gap: var(\n  --#{root-defaults.$prefix}accordion-item-content-column-gap,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-accordion-item-content-row-gap\n$accordion-item-content-row-gap: var(\n  --#{root-defaults.$prefix}accordion-item-content-row-gap,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-item-content-gap\n$accordion-item-content-gap: var(\n  --#{root-defaults.$prefix}accordion-item-content-gap,\n  #{$accordion-item-content-column-gap} #{$accordion-item-content-row-gap}\n);\n\n// Accordion item body properties.\n// --graupl-accordion-item-body-padding-x\n$accordion-item-body-padding-x: var(\n  --#{root-defaults.$prefix}accordion-item-body-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-item-body-padding-y\n$accordion-item-body-padding-y: var(\n  --#{root-defaults.$prefix}accordion-item-body-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-item-body-padding\n$accordion-item-body-padding: var(\n  --#{root-defaults.$prefix}accordion-item-body-padding,\n  #{$accordion-item-body-padding-y} #{$accordion-item-body-padding-x}\n);\n\n// Accordion item footer properties.\n// --graupl-accordion-item-footer-padding-x\n$accordion-item-footer-padding-x: var(\n  --#{root-defaults.$prefix}accordion-item-footer-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-item-footer-padding-y\n$accordion-item-footer-padding-y: var(\n  --#{root-defaults.$prefix}accordion-item-footer-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-accordion-item-footer-padding\n$accordion-item-footer-padding: var(\n  --#{root-defaults.$prefix}accordion-item-footer-padding,\n  #{$accordion-item-footer-padding-y} #{$accordion-item-footer-padding-x}\n);\n\n// Accordion content transform properties.\n// --graupl-accordion-item-content-transform\n$accordion-item-content-transform: var(\n  --#{root-defaults.$prefix}accordion-item-content-transform,\n  #{defaults.$accordion-item-content-initial-transform}\n);\n\n// --graupl-accordion-item-content-open-transform\n$accordion-item-content-open-transform: var(\n  --#{root-defaults.$prefix}accordion-item-content-open-transform,\n  #{defaults.$accordion-item-content-final-transform}\n);\n\n// Accordion toggle layout and transform properties.\n// --graupl-accordion-item-toggle-padding-x\n$accordion-item-toggle-padding-x: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-padding-x,\n  #{button.$button-padding-x}\n);\n\n// --graupl-accordion-item-toggle-padding-y\n$accordion-item-toggle-padding-y: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-padding-y,\n  #{button.$button-padding-y}\n);\n\n// --graupl-accordion-item-toggle-padding\n$accordion-item-toggle-padding: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-padding,\n  #{$accordion-item-toggle-padding-y} #{$accordion-item-toggle-padding-x}\n);\n\n// --graupl-accordion-item-toggle-transform\n$accordion-item-toggle-transform: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-transform,\n  #{defaults.$accordion-item-toggle-initial-transform}\n);\n\n// --graupl-accordion-item-toggle-visited-transform\n$accordion-item-toggle-visited-transform: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-visited-transform,\n  #{$accordion-item-toggle-transform}\n);\n\n// --graupl-accordion-item-toggle-focus-transform\n$accordion-item-toggle-focus-transform: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-focus-transform,\n  #{$accordion-item-toggle-transform}\n);\n\n// --graupl-accordion-item-toggle-hover-transform\n$accordion-item-toggle-hover-transform: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-hover-transform,\n  #{$accordion-item-toggle-transform}\n);\n\n// --graupl-accordion-item-toggle-active-transform\n$accordion-item-toggle-active-transform: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-active-transform,\n  #{defaults.$accordion-item-toggle-final-transform}\n);\n\n// --graupl-accordion-item-toggle-disabled-transform\n$accordion-item-toggle-disabled-transform: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-disabled-transform,\n  #{defaults.$accordion-item-toggle-disabled-transform}\n);\n$accordion-item-toggle-transform-states: (\n  _default: $accordion-item-toggle-transform,\n  visited: $accordion-item-toggle-visited-transform,\n  focus: $accordion-item-toggle-focus-transform,\n  hover: $accordion-item-toggle-hover-transform,\n  active: $accordion-item-toggle-active-transform,\n  disabled: $accordion-item-toggle-disabled-transform,\n);\n\n// --graupl-accordion-item-toggle-pseudo-transform\n$accordion-item-toggle-pseudo-transform: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-pseudo-transform,\n  #{defaults.$accordion-item-toggle-pseudo-initial-transform}\n);\n\n// --graupl-accordion-item-toggle-pseudo-open-transform\n$accordion-item-toggle-pseudo-open-transform: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-pseudo-open-transform,\n  #{defaults.$accordion-item-toggle-pseudo-final-transform}\n);\n\n// Accordion item toggle color properties.\n// --graupl-accordion-item-toggle-color\n$accordion-item-toggle-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-color,\n  #{$accordion-color}\n);\n\n// --graupl-accordion-item-toggle-visited-color\n$accordion-item-toggle-visited-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-visited-color,\n  #{$accordion-item-toggle-color}\n);\n\n// --graupl-accordion-item-toggle-focus-color\n$accordion-item-toggle-focus-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-focus-color,\n  #{$accordion-item-toggle-color}\n);\n\n// --graupl-accordion-item-toggle-hover-color\n$accordion-item-toggle-hover-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-hover-color,\n  #{$accordion-background}\n);\n\n// --graupl-accordion-item-toggle-active-color\n$accordion-item-toggle-active-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-active-color,\n  #{$accordion-item-toggle-hover-color}\n);\n\n// --graupl-accordion-item-toggle-disabled-color\n$accordion-item-toggle-disabled-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-disabled-color,\n  #{theme.get(primary, 200)}\n);\n$accordion-item-toggle-color-states: (\n  default: $accordion-item-toggle-color,\n  visited: $accordion-item-toggle-visited-color,\n  focus: $accordion-item-toggle-focus-color,\n  hover: $accordion-item-toggle-hover-color,\n  active: $accordion-item-toggle-active-color,\n  disabled: $accordion-item-toggle-disabled-color,\n);\n\n// --graupl-accordion-item-toggle-background\n$accordion-item-toggle-background: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-background,\n  #{$accordion-background}\n);\n\n// --graupl-accordion-item-toggle-visited-background\n$accordion-item-toggle-visited-background: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-visited-background,\n  #{$accordion-item-toggle-background}\n);\n\n// --graupl-accordion-item-toggle-focus-background\n$accordion-item-toggle-focus-background: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-focus-background,\n  #{$accordion-item-toggle-background}\n);\n\n// --graupl-accordion-item-toggle-hover-background\n$accordion-item-toggle-hover-background: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-hover-background,\n  #{$accordion-color}\n);\n\n// --graupl-accordion-item-toggle-active-background\n$accordion-item-toggle-active-background: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-active-background,\n  #{$accordion-item-toggle-hover-background}\n);\n\n// --graupl-accordion-item-toggle-disabled-background\n$accordion-item-toggle-disabled-background: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-disabled-background,\n  #{$accordion-background}\n);\n$accordion-item-toggle-background-states: (\n  default: $accordion-item-toggle-background,\n  visited: $accordion-item-toggle-visited-background,\n  focus: $accordion-item-toggle-focus-background,\n  hover: $accordion-item-toggle-hover-background,\n  active: $accordion-item-toggle-active-background,\n  disabled: $accordion-item-toggle-disabled-background,\n);\n\n// --graupl-accordion-item-toggle-border-color\n$accordion-item-toggle-border-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-border-color,\n  #{$accordion-item-border-color}\n);\n\n// --graupl-accordion-item-toggle-visited-border-color\n$accordion-item-toggle-visited-border-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-visited-border-color,\n  #{$accordion-item-toggle-border-color}\n);\n\n// --graupl-accordion-item-toggle-focus-border-color\n$accordion-item-toggle-focus-border-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-focus-border-color,\n  #{$accordion-item-toggle-border-color}\n);\n\n// --graupl-accordion-item-toggle-hover-border-color\n$accordion-item-toggle-hover-border-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-hover-border-color,\n  #{$accordion-item-border-color}\n);\n\n// --graupl-accordion-item-toggle-active-border-color\n$accordion-item-toggle-active-border-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-active-border-color,\n  #{$accordion-item-toggle-hover-border-color}\n);\n\n// --graupl-accordion-item-toggle-disabled-border-color\n$accordion-item-toggle-disabled-border-color: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-disabled-border-color,\n  #{theme.get(primary, 200)}\n);\n$accordion-item-toggle-border-color-states: (\n  default: $accordion-item-toggle-border-color,\n  visited: $accordion-item-toggle-visited-border-color,\n  focus: $accordion-item-toggle-focus-border-color,\n  hover: $accordion-item-toggle-hover-border-color,\n  active: $accordion-item-toggle-active-border-color,\n  disabled: $accordion-item-toggle-disabled-border-color,\n);\n\n// Accordion motion properties.\n// --graupl-accordion-transition-duration\n$accordion-transition-duration: var(\n  --#{root-defaults.$prefix}accordion-transition-duration,\n  #{map.get(root-variables.$transition-durations, slow)}\n);\n\n// --graupl-accordion-transition-timing-function.\n$accordion-transition-timing-function: var(\n  --#{root-defaults.$prefix}accordion-transition-timing-function,\n  #{root-variables.$transition-timing-function}\n);\n\n// --graupl-accordion-item-transition\n$accordion-item-transition: var(\n  --#{root-defaults.$prefix}accordion-item-transition,\n  height #{$accordion-transition-duration}\n    #{$accordion-transition-timing-function}\n);\n\n// --graupl-accordion-item-transition-reduced-motion\n$accordion-item-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}accordion-item-transition-reduced-motion,\n  none\n);\n\n// --graupl-accordion-item-toggle-pseudo-transition\n$accordion-item-toggle-pseudo-transition: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-pseudo-transition,\n  transform #{$accordion-transition-duration}\n    #{$accordion-transition-timing-function}\n);\n\n// --graupl-accordion-item-toggle-pseudo-transition-reduced-motion\n$accordion-item-toggle-pseudo-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-pseudo-transition-reduced-motion,\n  none\n);\n\n// --graupl-accordion-item-content-transition\n$accordion-item-content-transition: var(\n  --#{root-defaults.$prefix}accordion-item-content-transition,\n  opacity #{$accordion-transition-duration}\n    #{$accordion-transition-timing-function} transform\n    #{$accordion-transition-duration} #{$accordion-transition-timing-function}\n);\n\n// --graupl-accordion-item-content-transition-reduced-motion\n$accordion-item-content-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}accordion-item-content-transition-reduced-motion,\n  opacity #{$accordion-transition-duration}\n    #{$accordion-transition-timing-function}\n);\n\n// --graupl-accordion-item-toggle-transition\n$accordion-item-toggle-transition: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-transition,\n  background #{$accordion-transition-duration}\n    #{$accordion-transition-timing-function},\n  color #{$accordion-transition-duration}\n    #{$accordion-transition-timing-function},\n  transform #{$accordion-transition-duration}\n    #{$accordion-transition-timing-function}\n);\n\n// --graupl-accordion-item-toggle-transition-reduced-motion\n$accordion-item-toggle-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}accordion-item-toggle-transition-reduced-motion,\n  background #{$accordion-transition-duration}\n    #{$accordion-transition-timing-function},\n  color #{$accordion-transition-duration}\n    #{$accordion-transition-timing-function}\n);\n","// @graupl/core accordion component styles.\n//\n// This module provides the accordion component styles, combining button-like toggles with collapsible content panels.\n//\n// The following selectors are generated by default:\n// - `.accordion`: The accordion container.\n// - `.accordion-item`: The accordion item wrapper.\n// - `.accordion-item-header`: The accordion item header.\n// - `.accordion-item-title`: The accordion item title row.\n// - `.accordion-item-toggle`: The accordion item toggle control.\n// - `.accordion-item-content`: The collapsible content wrapper.\n// - `.accordion-item-body`: The main body region inside the content wrapper.\n// - `.accordion-item-footer`: The footer region inside the content wrapper.\n// - `.show`: Modifier applied to an item when open.\n// - `.hide`: Modifier applied to an item when closed.\n// - `.transitioning`: Modifier applied while an item is transitioning.\n//\n// The following custom properties can be used to customize the accordion component:\n// | Property                                                          | Description                                                         | Default Value                                                                                                                                                                                                                                                                                                               |\n// | ----------------------------------------------------------------- | ------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | `--graupl-accordion-padding-x`                                    | Horizontal padding on the accordion container.                      | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-padding-y`                                    | Vertical padding on the accordion container.                        | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-padding`                                      | Shorthand padding for the accordion container.                      | `var(--graupl-accordion-padding-y) var(--graupl-accordion-padding-x)`                                                                                                                                                                                                                                                       |\n// | `--graupl-accordion-column-gap`                                   | Column gap between accordion items.                                 | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-row-gap`                                      | Row gap between accordion items.                                    | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-gap`                                          | Gap between accordion items (column/row).                           | `var(--graupl-accordion-column-gap) var(--graupl-accordion-row-gap)`                                                                                                                                                                                                                                                        |\n// | `--graupl-accordion-color`                                        | Text colour of the accordion container.                             | `var(--graupl-color)`                                                                                                                                                                                                                                                                                                       |\n// | `--graupl-accordion-background`                                   | Background colour of the accordion container.                       | `var(--graupl-background)`                                                                                                                                                                                                                                                                                                  |\n// | `--graupl-accordion-border-color`                                 | Border colour of the accordion container.                           | `var(--graupl-accordion-color)`                                                                                                                                                                                                                                                                                             |\n// | `--graupl-accordion-item-color`                                   | Text colour of the accordion item.                                  | `var(--graupl-accordion-color)`                                                                                                                                                                                                                                                                                             |\n// | `--graupl-accordion-item-background`                              | Background colour of the accordion item.                            | `var(--graupl-accordion-background)`                                                                                                                                                                                                                                                                                        |\n// | `--graupl-accordion-item-border-color`                            | Border colour of the accordion item.                                | `var(--graupl-accordion-border-color)`                                                                                                                                                                                                                                                                                      |\n// | `--graupl-accordion-item-border-top-left-radius`                  | Top-left border radius of an accordion item.                        | `var(--graupl-border-top-left-radius)`                                                                                                                                                                                                                                                                                      |\n// | `--graupl-accordion-item-border-top-right-radius`                 | Top-right border radius of an accordion item.                       | `var(--graupl-border-top-right-radius)`                                                                                                                                                                                                                                                                                     |\n// | `--graupl-accordion-item-border-bottom-right-radius`              | Bottom-right border radius of an accordion item.                    | `var(--graupl-border-bottom-right-radius)`                                                                                                                                                                                                                                                                                  |\n// | `--graupl-accordion-item-border-bottom-left-radius`               | Bottom-left border radius of an accordion item.                     | `var(--graupl-border-bottom-left-radius)`                                                                                                                                                                                                                                                                                   |\n// | `--graupl-accordion-item-border-radius`                           | Border radius of an accordion item.                                 | `var(--graupl-accordion-item-border-top-left-radius) var(--graupl-accordion-item-border-top-right-radius) var(--graupl-accordion-item-border-bottom-right-radius) var(--graupl-accordion-item-border-bottom-left-radius)`                                                                                                   |\n// | `--graupl-accordion-item-border-top-width`                        | Top border width of an accordion item.                              | `var(--graupl-border-top-width)`                                                                                                                                                                                                                                                                                            |\n// | `--graupl-accordion-item-border-right-width`                      | Right border width of an accordion item.                            | `var(--graupl-border-right-width)`                                                                                                                                                                                                                                                                                          |\n// | `--graupl-accordion-item-border-bottom-width`                     | Bottom border width of an accordion item.                           | `var(--graupl-border-bottom-width)`                                                                                                                                                                                                                                                                                         |\n// | `--graupl-accordion-item-border-left-width`                       | Left border width of an accordion item.                             | `var(--graupl-border-left-width)`                                                                                                                                                                                                                                                                                           |\n// | `--graupl-accordion-item-border-width`                            | Border width of an accordion item.                                  | `var(--graupl-accordion-item-border-top-width) var(--graupl-accordion-item-border-right-width) var(--graupl-accordion-item-border-bottom-width) var(--graupl-accordion-item-border-left-width)`                                                                                                                             |\n// | `--graupl-accordion-item-border-top-style`                        | Top border style of an accordion item.                              | `var(--graupl-border-top-style)`                                                                                                                                                                                                                                                                                            |\n// | `--graupl-accordion-item-border-right-style`                      | Right border style of an accordion item.                            | `var(--graupl-border-right-style)`                                                                                                                                                                                                                                                                                          |\n// | `--graupl-accordion-item-border-bottom-style`                     | Bottom border style of an accordion item.                           | `var(--graupl-border-bottom-style)`                                                                                                                                                                                                                                                                                         |\n// | `--graupl-accordion-item-border-left-style`                       | Left border style of an accordion item.                             | `var(--graupl-border-left-style)`                                                                                                                                                                                                                                                                                           |\n// | `--graupl-accordion-item-border-style`                            | Border style of an accordion item.                                  | `var(--graupl-accordion-item-border-top-style) var(--graupl-accordion-item-border-right-style) var(--graupl-accordion-item-border-bottom-style) var(--graupl-accordion-item-border-left-style)`                                                                                                                             |\n// | `--graupl-accordion-item-header-padding-x`                        | Horizontal padding for the accordion item header.                   | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-header-padding-y`                        | Vertical padding for the accordion item header.                     | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-header-padding`                          | Padding for the accordion item header.                              | `var(--graupl-accordion-item-header-padding-y) var(--graupl-accordion-item-header-padding-x)`                                                                                                                                                                                                                               |\n// | `--graupl-accordion-item-header-margin`                           | Margin for the accordion item header (pulls content over borders).  | `calc(-1 * min(var(--graupl-accordion-item-border-top-width), var(--graupl-accordion-item-border-bottom-width), var(--graupl-accordion-item-border-left-width), var(--graupl-accordion-item-border-right-width)))`                                                                                                          |\n// | `--graupl-accordion-item-title-padding-x`                         | Horizontal padding for the accordion item title row.                | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-title-padding-y`                         | Vertical padding for the accordion item title row.                  | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-title-padding`                           | Padding for the accordion item title row.                           | `var(--graupl-accordion-item-title-padding-y) var(--graupl-accordion-item-title-padding-x)`                                                                                                                                                                                                                                 |\n// | `--graupl-accordion-item-title-margin-x`                          | Horizontal margin for the accordion item title row.                 | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-title-margin-y`                          | Vertical margin for the accordion item title row.                   | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-title-margin`                            | Margin for the accordion item title row.                            | `var(--graupl-accordion-item-title-margin-y) var(--graupl-accordion-item-title-margin-x)`                                                                                                                                                                                                                                   |\n// | `--graupl-accordion-item-title-color`                             | Text colour for accordion item titles.                              | `var(--graupl-accordion-item-color)`                                                                                                                                                                                                                                                                                        |\n// | `--graupl-accordion-item-title-background`                        | Background colour for accordion item titles.                        | `var(--graupl-accordion-item-background)`                                                                                                                                                                                                                                                                                   |\n// | `--graupl-accordion-item-title-border-color`                      | Border colour for accordion item titles.                            | `var(--graupl-accordion-item-border-color)`                                                                                                                                                                                                                                                                                 |\n// | `--graupl-accordion-item-title-font-size`                         | Font size for accordion item titles.                                | `var(--graupl-h5-font-size)`                                                                                                                                                                                                                                                                                                |\n// | `--graupl-accordion-item-title-font-weight`                       | Font weight for accordion item titles.                              | `var(--graupl-h5-font-weight)`                                                                                                                                                                                                                                                                                              |\n// | `--graupl-accordion-item-title-font-family`                       | Font family for accordion item titles.                              | `var(--graupl-h5-font-family)`                                                                                                                                                                                                                                                                                              |\n// | `--graupl-accordion-item-title-line-height`                       | Line height for accordion item titles.                              | `var(--graupl-h5-line-height)`                                                                                                                                                                                                                                                                                              |\n// | `--graupl-accordion-item-content-color`                           | Text colour for accordion item content.                             | `var(--graupl-accordion-item-color)`                                                                                                                                                                                                                                                                                        |\n// | `--graupl-accordion-item-content-background`                      | Background colour for accordion item content.                       | `var(--graupl-accordion-item-background)`                                                                                                                                                                                                                                                                                   |\n// | `--graupl-accordion-item-content-padding-x`                       | Horizontal padding for the accordion item content area.             | `var(--graupl-spacer-5)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-content-padding-y`                       | Vertical padding for the accordion item content area.               | `var(--graupl-spacer-5)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-content-padding`                         | Padding for the accordion item content area.                        | `var(--graupl-accordion-item-content-padding-y) var(--graupl-accordion-item-content-padding-x)`                                                                                                                                                                                                                             |\n// | `--graupl-accordion-item-content-column-gap`                      | Column gap inside the accordion content.                            | `var(--graupl-spacer-3)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-content-row-gap`                         | Row gap inside the accordion content.                               | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-content-gap`                             | Gap inside the accordion content (column/row).                      | `var(--graupl-accordion-item-content-column-gap) var(--graupl-accordion-item-content-row-gap)`                                                                                                                                                                                                                              |\n// | `--graupl-accordion-item-body-padding-x`                          | Horizontal padding for the accordion item body.                     | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-body-padding-y`                          | Vertical padding for the accordion item body.                       | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-body-padding`                            | Padding for the accordion item body.                                | `var(--graupl-accordion-item-body-padding-y) var(--graupl-accordion-item-body-padding-x)`                                                                                                                                                                                                                                   |\n// | `--graupl-accordion-item-footer-padding-x`                        | Horizontal padding for the accordion item footer.                   | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-footer-padding-y`                        | Vertical padding for the accordion item footer.                     | `var(--graupl-spacer-0)`                                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-footer-padding`                          | Padding for the accordion item footer.                              | `var(--graupl-accordion-item-footer-padding-y) var(--graupl-accordion-item-footer-padding-x)`                                                                                                                                                                                                                               |\n// | `--graupl-accordion-item-content-transform`                       | Base transform for accordion content.                               | `translateY(-100%)`                                                                                                                                                                                                                                                                                                         |\n// | `--graupl-accordion-item-content-open-transform`                  | Transform when accordion content is open.                           | `translateY(0)`                                                                                                                                                                                                                                                                                                             |\n// | `--graupl-accordion-item-toggle-padding-x`                        | Horizontal padding applied to the toggle control.                   | `var(--graupl-button-padding-x)`                                                                                                                                                                                                                                                                                            |\n// | `--graupl-accordion-item-toggle-padding-y`                        | Vertical padding applied to the toggle control.                     | `var(--graupl-button-padding-y)`                                                                                                                                                                                                                                                                                            |\n// | `--graupl-accordion-item-toggle-padding`                          | Shorthand padding applied to the toggle control.                    | `var(--graupl-accordion-item-toggle-padding-y) var(--graupl-accordion-item-toggle-padding-x)`                                                                                                                                                                                                                               |\n// | `--graupl-accordion-item-toggle-transform`                        | Base transform for the toggle control.                              | `none`                                                                                                                                                                                                                                                                                                                      |\n// | `--graupl-accordion-item-toggle-visited-transform`                | Transform for a visited toggle.                                     | `var(--graupl-accordion-item-toggle-transform)`                                                                                                                                                                                                                                                                             |\n// | `--graupl-accordion-item-toggle-focus-transform`                  | Transform for a focused toggle.                                     | `var(--graupl-accordion-item-toggle-transform)`                                                                                                                                                                                                                                                                             |\n// | `--graupl-accordion-item-toggle-hover-transform`                  | Transform for a hovered toggle.                                     | `var(--graupl-accordion-item-toggle-transform)`                                                                                                                                                                                                                                                                             |\n// | `--graupl-accordion-item-toggle-active-transform`                 | Transform for an active toggle.                                     | `var(--graupl-accordion-item-toggle-transform)`                                                                                                                                                                                                                                                                             |\n// | `--graupl-accordion-item-toggle-disabled-transform`               | Transform for a disabled toggle.                                    | `var(--graupl-accordion-item-toggle-transform)`                                                                                                                                                                                                                                                                             |\n// | `--graupl-accordion-item-toggle-pseudo-transform`                 | Transform for the toggle indicator pseudo-element.                  | `none`                                                                                                                                                                                                                                                                                                                      |\n// | `--graupl-accordion-item-toggle-pseudo-open-transform`            | Transform for the toggle indicator when open.                       | `rotate(-180deg)`                                                                                                                                                                                                                                                                                                           |\n// | `--graupl-accordion-transition-duration`                          | Duration used for accordion transitions.                            | `var(--graupl-transition-duration-slow)`                                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-transition-timing-function`                   | Timing function used for accordion transitions.                     | `var(--graupl-transition-timing-function)`                                                                                                                                                                                                                                                                                  |\n// | `--graupl-accordion-item-transition`                              | Transition applied to accordion item height.                        | `height var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function)`                                                                                                                                                                                                                     |\n// | `--graupl-accordion-item-transition-reduced-motion`               | Transition used when reduced motion is enabled.                     | `none`                                                                                                                                                                                                                                                                                                                      |\n// | `--graupl-accordion-item-toggle-pseudo-transition`                | Transition for the toggle indicator pseudo-element.                 | `transform var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function)`                                                                                                                                                                                                                  |\n// | `--graupl-accordion-item-toggle-pseudo-transition-reduced-motion` | Transition for the toggle indicator when reduced motion is enabled. | `none`                                                                                                                                                                                                                                                                                                                      |\n// | `--graupl-accordion-item-content-transition`                      | Transition applied to accordion content.                            | `opacity var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function) transform var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function)`                                                                                                           |\n// | `--graupl-accordion-item-content-transition-reduced-motion`       | Transition for content when reduced motion is enabled.              | `opacity var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function)`                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-toggle-transition`                       | Transition for toggle state changes.                                | `background var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function), color var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function), transform var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function)` |\n// | `--graupl-accordion-item-toggle-transition-reduced-motion`        | Transition used when reduced motion is enabled.                     | `background var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function), color var(--graupl-accordion-transition-duration) var(--graupl-accordion-transition-timing-function)`                                                                                                           |\n// | `--graupl-accordion-item-toggle-color`                            | Text colour of the accordion item toggle.                           | `var(--graupl-accordion-color)`                                                                                                                                                                                                                                                                                             |\n// | `--graupl-accordion-item-toggle-visited-color`                    | Text colour of a visited accordion item toggle.                     | `var(--graupl-accordion-item-toggle-color)`                                                                                                                                                                                                                                                                                 |\n// | `--graupl-accordion-item-toggle-focus-color`                      | Text colour of a focused accordion item toggle.                     | `var(--graupl-accordion-item-toggle-color)`                                                                                                                                                                                                                                                                                 |\n// | `--graupl-accordion-item-toggle-hover-color`                      | Text colour of a hovered accordion item toggle.                     | `var(--graupl-accordion-background)`                                                                                                                                                                                                                                                                                        |\n// | `--graupl-accordion-item-toggle-active-color`                     | Text colour of an active accordion item toggle.                     | `var(--graupl-accordion-item-toggle-hover-color)`                                                                                                                                                                                                                                                                           |\n// | `--graupl-accordion-item-toggle-disabled-color`                   | Text colour of a disabled accordion item toggle.                    | `var(--graupl-theme-active--primary--200)`                                                                                                                                                                                                                                                                                  |\n// | `--graupl-accordion-item-toggle-background`                       | Background colour of the accordion item toggle.                     | `var(--graupl-accordion-background)`                                                                                                                                                                                                                                                                                        |\n// | `--graupl-accordion-item-toggle-visited-background`               | Background colour of a visited accordion item toggle.               | `var(--graupl-accordion-item-toggle-background)`                                                                                                                                                                                                                                                                            |\n// | `--graupl-accordion-item-toggle-focus-background`                 | Background colour of a focused accordion item toggle.               | `var(--graupl-accordion-item-toggle-background)`                                                                                                                                                                                                                                                                            |\n// | `--graupl-accordion-item-toggle-hover-background`                 | Background colour of a hovered accordion item toggle.               | `var(--graupl-accordion-color)`                                                                                                                                                                                                                                                                                             |\n// | `--graupl-accordion-item-toggle-active-background`                | Background colour of an active accordion item toggle.               | `var(--graupl-accordion-item-toggle-hover-background)`                                                                                                                                                                                                                                                                      |\n// | `--graupl-accordion-item-toggle-disabled-background`              | Background colour of a disabled accordion item toggle.              | `var(--graupl-accordion-background)`                                                                                                                                                                                                                                                                                        |\n// | `--graupl-accordion-item-toggle-border-color`                     | Border colour of the accordion item toggle.                         | `var(--graupl-accordion-item-border-color)`                                                                                                                                                                                                                                                                                 |\n// | `--graupl-accordion-item-toggle-visited-border-color`             | Border colour of a visited accordion item toggle.                   | `var(--graupl-accordion-item-toggle-border-color)`                                                                                                                                                                                                                                                                          |\n// | `--graupl-accordion-item-toggle-focus-border-color`               | Border colour of a focused accordion item toggle.                   | `var(--graupl-accordion-item-toggle-border-color)`                                                                                                                                                                                                                                                                          |\n// | `--graupl-accordion-item-toggle-hover-border-color`               | Border colour of a hovered accordion item toggle.                   | `var(--graupl-accordion-item-border-color)`                                                                                                                                                                                                                                                                                 |\n// | `--graupl-accordion-item-toggle-active-border-color`              | Border colour of an active accordion item toggle.                   | `var(--graupl-accordion-item-toggle-hover-border-color)`                                                                                                                                                                                                                                                                    |\n// | `--graupl-accordion-item-toggle-disabled-border-color`            | Border colour of a disabled accordion item toggle.                  | `var(--graupl-theme-active--primary--200)`                                                                                                                                                                                                                                                                                  |\n//\n// The following sass variables can be used to customize the generation of the accordion component:\n// | Variable                                          | Description                                                                                | Default Value                              |\n// | ------------------------------------------------- | ------------------------------------------------------------------------------------------ | ------------------------------------------ |\n// | `$selector-base`                                  | Selector base for the component.                                                           | `\".\"`                                      |\n// | `$modifier-selector-base`                         | Selector base for component modifiers.                                                     | `\".\"`                                      |\n// | `$generate-base-theme-map`                        | A flag to generate the base theme maps for accordion variants.                             | `true`                                     |\n// | `$themeable`                                      | Flag to generate theme modifiers.                                                          | `false`                                    |\n// | `$accordion-selector-base`                        | Selector base for the accordion container.                                                 | `$selector-base`                           |\n// | `$accordion-selector`                             | Selector for the accordion container.                                                      | `\"accordion\"`                              |\n// | `$accordion-item-selector-base`                   | Selector base for items.                                                                   | `$selector-base`                           |\n// | `$accordion-item-selector`                        | Selector for items.                                                                        | `\"accordion-item\"`                         |\n// | `$accordion-item-header-selector-base`            | Selector base for item headers.                                                            | `$selector-base`                           |\n// | `$accordion-item-header-selector`                 | Selector for item headers.                                                                 | `\"accordion-item-header\"`                  |\n// | `$accordion-item-title-selector-base`             | Selector base for item titles.                                                             | `$selector-base`                           |\n// | `$accordion-item-title-selector`                  | Selector for item titles.                                                                  | `\"accordion-item-title\"`                   |\n// | `$accordion-item-toggle-selector-base`            | Selector base for item toggles.                                                            | `$selector-base`                           |\n// | `$accordion-item-toggle-selector`                 | Selector for item toggles.                                                                 | `\"accordion-item-toggle\"`                  |\n// | `$accordion-item-content-selector-base`           | Selector base for item content.                                                            | `$selector-base`                           |\n// | `$accordion-item-content-selector`                | Selector for item content.                                                                 | `\"accordion-item-content\"`                 |\n// | `$accordion-item-body-selector-base`              | Selector base for item bodies.                                                             | `$selector-base`                           |\n// | `$accordion-item-body-selector`                   | Selector for item bodies.                                                                  | `\"accordion-item-body\"`                    |\n// | `$accordion-item-footer-selector-base`            | Selector base for item footers.                                                            | `$selector-base`                           |\n// | `$accordion-item-footer-selector`                 | Selector for item footers.                                                                 | `\"accordion-item-footer\"`                  |\n// | `$accordion-item-open-selector-base`              | Selector base applied to the open modifier.                                                | `\".\"`                                      |\n// | `$accordion-item-open-selector`                   | Selector applied to the open modifier.                                                     | `\"show\"`                                   |\n// | `$accordion-item-close-selector-base`             | Selector base applied to the closed modifier.                                              | `\".\"`                                      |\n// | `$accordion-item-close-selector`                  | Selector applied to the closed modifier.                                                   | `\"hide\"`                                   |\n// | `$accordion-item-transition-selector-base`        | Selector base applied to the transitioning modifier.                                       | `\".\"`                                      |\n// | `$accordion-item-transition-selector`             | Selector applied to the transitioning modifier.                                            | `\"transitioning\"`                          |\n// | `$accordion-item-toggle-pseudo-selector`          | Pseudo-element used for the toggle indicator.                                              | `\"after\"`                                  |\n// | `$accordion-item-toggle-initial-transform`        | The initial transform of the accordion item toggle.                                        | `none`                                     |\n// | `$accordion-item-toggle-final-transform`          | The final transform of the accordion item toggle.                                          | `$accordion-item-toggle-initial-transform` |\n// | `$accordion-item-toggle-disabled-transform`       | The disabled transform of the accordion item toggle.                                       | `$accordion-item-toggle-initial-transform` |\n// | `$accordion-item-toggle-pseudo-initial-transform` | The initial transform of the accordion item toggle pseudo element.                         | `none`                                     |\n// | `$accordion-item-toggle-pseudo-final-transform`   | The final transform of the accordion item toggle pseudo element.                           | `rotate(-180deg)`                          |\n// | `$accordion-item-toggle-pseudo-content`           | Content for the accordion item toggle pseudo element.                                      | `\"▼\"`                                      |\n// | `$accordion-item-content-initial-transform`       | The initial transform of the accordion item content.                                       | `translateY(-100%)'                        |\n// | `$accordion-item-content-final-transform`         | The final transform of the accordion item content.                                         | `translateY(0)`                            |\n// | `$accordion-theme-mappings`                       | A map of properties and color shades used generate all accordion variants.                 | `()`                                       |\n// | `$accordion-theme-map`                            | A map of all properties, colors, and color shades used to generate all accordion variants. | `()`                                       |\n//\n// ## Using `$accordion-theme-mappings`\n//\n// `$accordion-theme-mappings` is a 1-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $accordion-theme-mappings: (\n//   border-color: 700,\n// )\n// ```\n//\n// This directly[1] maps to all accordion variants, telling them what shade to use for said property.\n// All accordion variants will use the following based on the example above:\n// - Primary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize _all_ accordions variants in the same way.\n//\n// For example, if you use the following map:\n// ```scss\n// $accordion-theme-mappings: (\n//   border-color: 500,\n// )\n// ```\n//\n// All accordion variants will use the following:\n// - Primary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--primary--500`,\n// - Secondary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--secondary--500`, and\n// - Tertiary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--tertiary--500`.\n//\n// [1] `$accordion-theme-mappings` gets parsed into a larger, more explicit map: `$accordion-theme-map`.\n//\n// Using `$accordion-theme-map`\n//\n// `$accordion-theme-map` is a multi-level map of properties, colors, and shade values.\n//\n// e.g.\n// ```scss\n// $accordion-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: primary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: tertiary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// This directly maps to all accordion variants, telling them what shade to use for said property.\n// The accordion variants will use the following based on the example above:\n// - Primary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize accordion variants individually.\n//\n// For example, if you use the following map:\n//\n// ```scss\n// $accordion-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// The accordion variants will use the following:\n// - Primary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--secondary--700`,\n// - Secondary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary accordions will have their `--graupl-accordion-border-color` property set to `--graupl-theme-active--secondary--700`.\n//\n// @example\n// <div class=\"accordion\">\n//   <div class=\"accordion-item show\">\n//     <div class=\"accordion-item-header\">\n//       <h3 class=\"accordion-item-title\">\n//         <button aria-expanded=\"true\" class=\"accordion-item-toggle\">Accordion item 1</button>\n//       </h3>\n//     </div>\n//     <div class=\"accordion-item-content\">\n//       <div class=\"accordion-item-body\">\n//         // Content here.\n//       </div>\n//       <div class=\"accordion-item-footer\">\n//         // Footer content here.\n//       </div>\n//     </div>\n//   </div>\n//   <div class=\"accordion-item hide\">\n//     <div class=\"accordion-item-header\">\n//       <h3 class=\"accordion-item-title\">\n//         <button aria-expanded=\"false\" class=\"accordion-item-toggle\">Accordion item 2</button>\n//       </h3>\n//     </div>\n//     <div class=\"accordion-item-content\">\n//       <div class=\"accordion-item-body\">\n//         // Content here.\n//       </div>\n//       <div class=\"accordion-item-footer\">\n//         // Footer content here.\n//       </div>\n//     </div>\n//   </div>\n//   <div class=\"accordion-item hide\">\n//     <div class=\"accordion-item-header\">\n//       <h3 class=\"accordion-item-title\">\n//         <button aria-expanded=\"false\" class=\"accordion-item-toggle\">Accordion item 3</button>\n//       </h3>\n//     </div>\n//     <div class=\"accordion-item-content\">\n//       <div class=\"accordion-item-body\">\n//         // Content here.\n//       </div>\n//       <div class=\"accordion-item-footer\">\n//         // Footer content here.\n//       </div>\n//     </div>\n//   </div>\n// </div>\n\n@use \"../../base/button/mixins\" as button-mixins;\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/animation\";\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/state\";\n@use \"../../mixins/theme\";\n@use \"../../state/focus/variables\" as focus;\n@use \"defaults\";\n@use \"sass:map\";\n@use \"variables\" as *;\n\n@include layer(base) {\n  // .accordion-item-toggle\n  #{defaults.$accordion-item-toggle-selector-base}#{defaults.$accordion-item-toggle-selector} {\n    @include button-mixins.apply-base;\n  }\n}\n\n@include layer(component) {\n  // .accordion\n  #{defaults.$accordion-selector-base}#{defaults.$accordion-selector} {\n    display: flex;\n    flex-flow: column nowrap;\n    padding: $accordion-padding;\n    gap: $accordion-gap;\n\n    // > .accordion-item\n    > #{defaults.$accordion-item-selector-base}#{defaults.$accordion-item-selector} {\n      &:not(:first-child) {\n        /* stylelint-disable scss/operator-no-newline-after -- Prettier wants to format it this way. */\n        margin-top: calc(\n          -1 *\n            min(\n              #{$accordion-item-border-top-width},\n              #{$accordion-item-border-bottom-width}\n            )\n        );\n        /* stylelint-enable  scss/operator-no-newline-after */\n      }\n    }\n  }\n\n  // .accordion-item\n  #{defaults.$accordion-item-selector-base}#{defaults.$accordion-item-selector} {\n    overflow: hidden;\n    transition: $accordion-item-transition;\n    border-width: $accordion-item-border-width;\n    border-style: $accordion-item-border-style;\n    border-radius: $accordion-item-border-radius;\n    isolation: isolate;\n\n    &#{defaults.$accordion-item-close-selector-base}#{defaults.$accordion-item-close-selector}\n      #{defaults.$accordion-item-content-selector-base}#{defaults.$accordion-item-content-selector} {\n      display: none;\n    }\n\n    &#{defaults.$accordion-item-open-selector-base}#{defaults.$accordion-item-open-selector}\n      #{defaults.$accordion-item-content-selector-base}#{defaults.$accordion-item-content-selector} {\n      transform: $accordion-item-content-open-transform;\n      opacity: 1;\n    }\n\n    &#{defaults.$accordion-item-transition-selector-base}#{defaults.$accordion-item-transition-selector}\n      #{defaults.$accordion-item-content-selector-base}#{defaults.$accordion-item-content-selector} {\n      display: flex;\n    }\n  }\n\n  // .accordion-item-toggle\n  #{defaults.$accordion-item-toggle-selector-base}#{defaults.$accordion-item-toggle-selector} {\n    z-index: 2;\n    padding: $accordion-item-toggle-padding;\n    transform: $accordion-item-toggle-transform;\n    transition: $accordion-item-toggle-transition;\n\n    @include state.generate-modifiers(\n      (\n        transform: $accordion-item-toggle-transform-states,\n      )\n    );\n\n    // ::after\n    &::#{defaults.$accordion-item-toggle-pseudo-selector} {\n      content: defaults.$accordion-item-toggle-pseudo-content;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      margin-left: auto;\n      transform: $accordion-item-toggle-pseudo-transform;\n      transition: $accordion-item-toggle-pseudo-transition;\n    }\n\n    &[aria-expanded=\"true\"] {\n      // &::after\n      &::#{defaults.$accordion-item-toggle-pseudo-selector} {\n        transform: $accordion-item-toggle-pseudo-open-transform;\n      }\n    }\n  }\n\n  // .accordion-item-header\n  #{defaults.$accordion-item-header-selector-base}#{defaults.$accordion-item-header-selector} {\n    margin: $accordion-item-header-margin;\n    padding: $accordion-item-header-padding;\n  }\n\n  // .accordion-item-title\n  #{defaults.$accordion-item-title-selector-base}#{defaults.$accordion-item-title-selector} {\n    margin: $accordion-item-title-margin;\n    padding: $accordion-item-title-padding;\n\n    &,\n    #{defaults.$accordion-item-toggle-selector-base}#{defaults.$accordion-item-toggle-selector} {\n      display: flex;\n      align-items: center;\n      justify-content: flex-start;\n      width: 100%;\n    }\n  }\n\n  // .accordion-item-content\n  #{defaults.$accordion-item-content-selector-base}#{defaults.$accordion-item-content-selector} {\n    display: flex;\n    flex-flow: column nowrap;\n    padding: $accordion-item-content-padding;\n    transform: $accordion-item-content-transform;\n    transition: $accordion-item-content-transition;\n    opacity: 0;\n    gap: $accordion-item-content-gap;\n  }\n\n  // .accordion-item-body\n  #{defaults.$accordion-item-body-selector-base}#{defaults.$accordion-item-body-selector} {\n    padding: $accordion-item-body-padding;\n  }\n\n  // .accordion-item-footer\n  #{defaults.$accordion-item-footer-selector-base}#{defaults.$accordion-item-footer-selector} {\n    padding: $accordion-item-footer-padding;\n  }\n\n  @include animation.off {\n    // .accordion-item\n    #{defaults.$accordion-item-selector-base}#{defaults.$accordion-item-selector} {\n      transition: $accordion-item-transition-reduced-motion;\n    }\n\n    // .accordion-item-toggle\n    #{defaults.$accordion-item-toggle-selector-base}#{defaults.$accordion-item-toggle-selector} {\n      transition: $accordion-item-toggle-transition-reduced-motion;\n\n      // ::after\n      &::#{defaults.$accordion-item-toggle-pseudo-selector} {\n        transition: $accordion-item-toggle-pseudo-transition-reduced-motion;\n      }\n\n      // .accordion-item-content\n      #{defaults.$accordion-item-content-selector-base}#{defaults.$accordion-item-content-selector} {\n        transition: $accordion-item-content-transition-reduced-motion;\n      }\n    }\n  }\n}\n\n@include layer(state) {\n  // .accordion-item\n  #{defaults.$accordion-item-selector-base}#{defaults.$accordion-item-selector} {\n    // .accordion-item-toggle\n    #{defaults.$accordion-item-toggle-selector-base}#{defaults.$accordion-item-toggle-selector} {\n      /* stylelint-disable scss/operator-no-newline-after -- Prettier wants to format it this way. */\n      --#{root-defaults.$prefix}focus-outline-offset: calc(\n        -1 *\n          (\n            min(\n                #{$accordion-item-border-top-width},\n                #{$accordion-item-border-bottom-width},\n                #{$accordion-item-border-left-width},\n                #{$accordion-item-border-right-width}\n              ) +\n              #{focus.$focus-width}\n          )\n      );\n      /* stylelint-enable  scss/operator-no-newline-after */\n    }\n  }\n}\n\n@include layer(theme) {\n  // .accordion\n  #{defaults.$accordion-selector-base}#{defaults.$accordion-selector} {\n    border-color: $accordion-border-color;\n    background: $accordion-background;\n    color: $accordion-color;\n\n    @if root-defaults.$themeable-components and defaults.$themeable {\n      @include theme.generate-modifiers(\n        defaults.$accordion-theme-map,\n        defaults.$accordion-theme-selector-base,\n        defaults.$accordion-theme-selector-prefix,\n        \"accordion-\"\n      );\n    }\n\n    @if root-defaults.$themeable-components and defaults.$themeable {\n      @include theme.generate-modifiers(\n        defaults.$accordion-theme-map,\n        defaults.$accordion-theme-selector-base,\n        defaults.$accordion-theme-selector-prefix,\n        \"accordion-\",\n        \"\"\n      );\n    }\n  }\n\n  // .accordion-item\n  #{defaults.$accordion-item-selector-base}#{defaults.$accordion-item-selector} {\n    border-color: $accordion-item-border-color;\n    background: $accordion-item-background;\n    color: $accordion-item-color;\n  }\n\n  // .accordion-item-content\n  #{defaults.$accordion-item-content-selector-base}#{defaults.$accordion-item-content-selector} {\n    background: $accordion-item-content-background;\n    color: $accordion-item-content-color;\n  }\n\n  // .accordion-item-toggle\n  #{defaults.$accordion-item-toggle-selector-base}#{defaults.$accordion-item-toggle-selector} {\n    @include button-mixins.apply-theme;\n\n    border-color: $accordion-item-toggle-border-color;\n    background: $accordion-item-toggle-background;\n    color: $accordion-item-toggle-color;\n\n    @include state.generate-modifiers(\n      (\n        border-color: $accordion-item-toggle-border-color-states,\n        color: $accordion-item-toggle-color-states,\n        background: $accordion-item-toggle-background-states,\n      )\n    );\n  }\n\n  // .accordion-item-title\n  #{defaults.$accordion-item-title-selector-base}#{defaults.$accordion-item-title-selector} {\n    --#{root-defaults.$prefix}accordion-item-toggle-color: #{$accordion-item-title-color};\n    --#{root-defaults.$prefix}accordion-item-toggle-background: #{$accordion-item-title-background};\n    --#{root-defaults.$prefix}accordion-item-toggle-border-color: #{$accordion-item-title-border-color};\n\n    // &,\n    // .accordion-item-toggle\n    &,\n    #{defaults.$accordion-item-toggle-selector-base}#{defaults.$accordion-item-toggle-selector} {\n      border-color: $accordion-item-title-border-color;\n      background: $accordion-item-title-background;\n      color: $accordion-item-title-color;\n      font-family: $accordion-item-title-font-family;\n      font-size: $accordion-item-title-font-size;\n      font-weight: $accordion-item-title-font-weight;\n      line-height: $accordion-item-title-line-height;\n    }\n  }\n}\n","// @graupl/core accordion component default values.\n//\n// Generally, these should not be used directly when styling components unless a static value is needed.\n// They are mainly used to provide class selectors, fallbacks for custom properties, or loop values.\n//\n// They should not be used to define direct property values (i.e. font-size, color, etc.).\n// Those should be defined as custom properties in the `_variables.scss` file.\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../functions/theme\";\n@use \"sass:map\";\n\n// Accordion selectors.\n$selector-base: root-defaults.$component-selector-base !default;\n$modifier-selector-base: root-defaults.$modifier-selector-base !default;\n$generate-base-theme-map: root-defaults.$generate-base-theme-maps !default;\n$themeable: false !default;\n$accordion-selector-base: $selector-base !default;\n$accordion-selector: \"accordion\" !default;\n$accordion-theme-selector-base: $modifier-selector-base !default;\n$accordion-theme-selector-prefix: \"\" !default;\n$accordion-item-selector-base: $selector-base !default;\n$accordion-item-selector: \"accordion-item\" !default;\n$accordion-item-header-selector-base: $selector-base !default;\n$accordion-item-header-selector: \"accordion-item-header\" !default;\n$accordion-item-title-selector-base: $selector-base !default;\n$accordion-item-title-selector: \"accordion-item-title\" !default;\n$accordion-item-toggle-selector-base: $selector-base !default;\n$accordion-item-toggle-selector: \"accordion-item-toggle\" !default;\n$accordion-item-content-selector-base: $selector-base !default;\n$accordion-item-content-selector: \"accordion-item-content\" !default;\n$accordion-item-body-selector-base: $selector-base !default;\n$accordion-item-body-selector: \"accordion-item-body\" !default;\n$accordion-item-footer-selector-base: $selector-base !default;\n$accordion-item-footer-selector: \"accordion-item-footer\" !default;\n$accordion-item-open-selector-base: $modifier-selector-base !default;\n$accordion-item-open-selector: \"show\" !default;\n$accordion-item-close-selector-base: $modifier-selector-base !default;\n$accordion-item-close-selector: \"hide\" !default;\n$accordion-item-transition-selector-base: $modifier-selector-base !default;\n$accordion-item-transition-selector: \"transitioning\" !default;\n$accordion-item-toggle-pseudo-selector: \"after\" !default;\n\n// Toggle transform properties.\n$accordion-item-toggle-initial-transform: none !default;\n$accordion-item-toggle-final-transform: $accordion-item-toggle-initial-transform !default;\n$accordion-item-toggle-disabled-transform: $accordion-item-toggle-initial-transform !default;\n$accordion-item-toggle-pseudo-initial-transform: none !default;\n$accordion-item-toggle-pseudo-final-transform: rotate(-180deg);\n\n// Toggle properties.\n$accordion-item-toggle-pseudo-content: \"▼\" !default;\n\n// Accordion transform properties.\n$accordion-item-content-initial-transform: translateY(-100%) !default;\n$accordion-item-content-final-transform: translateY(0) !default;\n\n// Accordion state theme defaults.\n// This map is used to define the default colour shades for the\n// themed accordion bases.\n//\n// e.g.\n// Primary accordions will use primary--900 as the text colour and primary--700 as the border colour.\n//\n// Secondary/tertiary accordions will use the same shade for their respective colours.\n$-accordion-theme-mappings: (\n  color: 900,\n  border-color: 700,\n  item-background: 100,\n  item-toggle-hover-color: 100,\n  item-toggle-hover-background: 700,\n  item-toggle-hover-border-color: 700,\n  item-toggle-disabled-color: 200,\n  item-toggle-disabled-border-color: 200,\n);\n$accordion-theme-mappings: () !default;\n\n// Merge the custom accordion state theme map with the default one.\n@if $generate-base-theme-map {\n  $accordion-theme-mappings: map.merge(\n    $-accordion-theme-mappings,\n    $accordion-theme-mappings\n  );\n}\n\n$-accordion-theme-map: theme.generate-property-map($accordion-theme-mappings);\n$accordion-theme-map: () !default;\n$accordion-theme-map: map.deep-merge(\n  $-accordion-theme-map,\n  $accordion-theme-map\n);\n","// @graupl/core badge base styles.\n//\n// This module provides the base styles for the badge component.\n//\n// The badge component is meant to be used on <span>, <div>, or <a> elements, but can be applied to anything.\n//\n// The following selectors are generated by default:\n// - `.badge`: The badge component.\n// - `.primary`: A component modifier to use the primary colour for the badge component.\n// - `.secondary`: A component modifier to use the secondary colour for the badge component.\n// - `.tertiary`: A component modifier to use the tertiary colour for the badge component.\n//\n// The following custom properties can be used to customize the badge component:\n// | Property                                    | Description                                                                                                   | Default Value                                                                                                                                                                         |\n// | ---                                         | ---                                                                                                           | ---                                                                                                                                                                                   |\n// | `--graupl-badge-font-size`                  | The font size of the badge component.                                                                         | `var(--graupl-font-sm)`                                                                                                                                                               |\n// | `--graupl-badge-background`                 | The background colour of the badge component.                                                                 | `var(--graupl-background)`                                                                                                                                                            |\n// | `--graupl-badge-color`                      | The text colour of the badge component.                                                                       | `var(--graupl-color)`                                                                                                                                                                 |\n// | `--graupl-badge-border-color`               | The border colour of the badge component.                                                                     | `var(--graupl-border-color)`                                                                                                                                                          |\n// | `--graupl-badge-padding-x`                  | The horizontal padding of the badge component.                                                                | `var(--graupl-spacer-5)`                                                                                                                                                              |\n// | `--graupl-badge-padding-y`                  | The vertical padding of the badge component.                                                                  | `var(--graupl-spacer-3)`                                                                                                                                                              |\n// | `--graupl-badge-padding`                    | The padding of the badge component (combines y and x padding).                                                | `var(--graupl-badge-padding-y) var(--graupl-badge-padding-x)`                                                                                                                         |\n// | `--graupl-badge-border-top-width`           | The top border width of the badge component.                                                                  | `var(--graupl-border-top-width)`                                                                                                                                                      |\n// | `--graupl-badge-border-right-width`         | The right border width of the badge component.                                                                | `var(--graupl-border-right-width)`                                                                                                                                                    |\n// | `--graupl-badge-border-bottom-width`        | The bottom border width of the badge component.                                                               | `var(--graupl-border-bottom-width)`                                                                                                                                                   |\n// | `--graupl-badge-border-left-width`          | The left border width of the badge component.                                                                 | `var(--graupl-border-left-width)`                                                                                                                                                     |\n// | `--graupl-badge-border-width`               | The border width of the badge component (combines top, right, bottom, and left widths).                       | `var(--graupl-badge-border-top-width) var(--graupl-badge-border-right-width) var(--graupl-badge-border-bottom-width) var(--graupl-badge-border-left-width)`                           |\n// | `--graupl-badge-border-top-style`           | The top border style of the badge component.                                                                  | `var(--graupl-border-top-style)`                                                                                                                                                      |\n// | `--graupl-badge-border-right-style`         | The right border style of the badge component.                                                                | `var(--graupl-border-right-style)`                                                                                                                                                    |\n// | `--graupl-badge-border-bottom-style`        | The bottom border style of the badge component.                                                               | `var(--graupl-border-bottom-style)`                                                                                                                                                   |\n// | `--graupl-badge-border-left-style`          | The left border style of the badge component.                                                                 | `var(--graupl-border-left-style)`                                                                                                                                                     |\n// | `--graupl-badge-border-style`               | The border style of the badge component (combines top, right, bottom, and left styles).                       | `var(--graupl-badge-border-top-style) var(--graupl-badge-border-right-style) var(--graupl-badge-border-bottom-style) var(--graupl-badge-border-left-style)`                           |\n// | `--graupl-badge-border-top-left-radius`     | The top-left border radius of the badge component.                                                            | `var(--graupl-border-top-left-radius)`                                                                                                                                                |\n// | `--graupl-badge-border-top-right-radius`    | The top-right border radius of the badge component.                                                           | `var(--graupl-border-top-right-radius)`                                                                                                                                               |\n// | `--graupl-badge-border-bottom-right-radius` | The bottom-right border radius of the badge component.                                                        | `var(--graupl-border-bottom-right-radius)`                                                                                                                                            |\n// | `--graupl-badge-border-bottom-left-radius`  | The bottom-left border radius of the badge component.                                                         | `var(--graupl-border-bottom-left-radius)`                                                                                                                                             |\n// | `--graupl-badge-border-radius`              | The border radius of the badge component (combines top-left, top-right, bottom-right, and bottom-left radii). | `var(--graupl-badge-border-top-left-radius) var(--graupl-badge-border-top-right-radius) var(--graupl-badge-border-bottom-right-radius) var(--graupl-badge-border-bottom-left-radius)` |\n//\n// The following sass variables can be used to customize the generation of the badge component:\n// | Variable                       | Description                                                                            | Default Value             |\n// | ---                            | ---                                                                                    | ---                       |\n// | `$selector-base`               | The selector base for the component.                                                   | `.`                       |\n// | `$modifier-selector-base`      | The selector base for component modifiers.                                             | `.`                       |\n// | `$themeable`                   | Flag to generate theme modifiers.                                                      | `true`.                   |\n// | `$generate-base-theme-map`     | A flag to generate the base theme maps for badge variants.                             | `true`                    |\n// | `$badge-selector-base`         | The selector base for the badge component.                                             | `$selector-base`          |\n// | `$badge-selector`              | The badge component selector.                                                          | `badge`                   |\n// | `$badge-theme-selector-base`   | The selector base for the badge theme component modifiers.                             | `$modifier-selector-base` |\n// | `$badge-theme-selector-prefix` | The badge theme component modifier selector prefix.                                    | `\"\"`                      |\n// | `$badge-theme-mappings`        | A map of properties and color shades used generate all badge variants.                 | `()`                      |\n// | `$badge-theme-map`             | A map of all properties, colors, and color shades used to generate all badge variants. | `()`                      |\n//\n// ## Using `$badge-theme-mappings`\n//\n// `$badge-theme-mappings` is a 1-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $badge-theme-mappings: (\n//   border-color: 700,\n// )\n// ```\n//\n// This directly[1] maps to all badge variants, telling them what shade to use for said property.\n// All badge variants will use the following based on the example above:\n// - Primary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize _all_ badges variants in the same way.\n//\n// For example, if you use the following map:\n// ```scss\n// $badge-theme-mappings: (\n//   border-color: 500,\n// )\n// ```\n//\n// All badge variants will use the following:\n// - Primary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--primary--500`,\n// - Secondary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--secondary--500`, and\n// - Tertiary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--tertiary--500`.\n//\n// [1] `$badge-theme-mappings` gets parsed into a larger, more explicit map: `$badge-theme-map`.\n//\n// Using `$badge-theme-map`\n//\n// `$badge-theme-map` is a multi-level map of properties, colors, and shade values.\n//\n// e.g.\n// ```scss\n// $badge-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: primary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: tertiary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// This directly maps to all badge variants, telling them what shade to use for said property.\n// The badge variants will use the following based on the example above:\n// - Primary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize badge variants individually.\n//\n// For example, if you use the following map:\n//\n// ```scss\n// $badge-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// The badge variants will use the following:\n// - Primary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--secondary--700`,\n// - Secondary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary badges will have their `--graupl-badge-border-color` property set to `--graupl-theme-active--secondary--700`.\n//\n// @example\n// <badge class=\"badge primary\">Primary Badge</badge>\n//\n// @example\n// <a class=\"badge secondary\" href=\"#\">Secondary Badge</a>\n//\n// @example\n// <a class=\"badge tertiary\" href=\"#\">Tertiary Badge</a>\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/theme\";\n@use \"../../mixins/layer\" as *;\n@use \"defaults\";\n@use \"sass:map\";\n@use \"variables\" as *;\n\n@include layer(component) {\n  // .badge\n  #{defaults.$badge-selector-base}#{defaults.$badge-selector} {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: $badge-padding;\n    border-width: $badge-border-width;\n    border-style: $badge-border-style;\n    border-radius: $badge-border-radius;\n    font-size: $badge-font-size;\n  }\n}\n\n@include layer(theme) {\n  // .badge\n  #{defaults.$badge-selector-base}#{defaults.$badge-selector} {\n    border-color: $badge-border-color;\n    background: $badge-background;\n    color: $badge-color;\n\n    @if root-defaults.$themeable-components and defaults.$themeable {\n      @include theme.generate-modifiers(\n        defaults.$badge-theme-map,\n        defaults.$badge-theme-selector-base,\n        defaults.$badge-theme-selector-prefix,\n        \"badge-\"\n      );\n    }\n  }\n}\n","// @graupl/core badge base variables.\n//\n// These values are to be used to directly style bases and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property                           | Default                                                                                                                                                                             |\n// | ----------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-badge-font-size                  | var(--graupl-font-sm)                                                                                                                                                               |\n// | --graupl-badge-background                 | var(--graupl-background)                                                                                                                                                            |\n// | --graupl-badge-color                      | var(--graupl-color)                                                                                                                                                                 |\n// | --graupl-badge-border-color               | var(--graupl-border-color)                                                                                                                                                          |\n// | --graupl-badge-padding-x                  | var(--graupl-spacer-5)                                                                                                                                                              |\n// | --graupl-badge-padding-y                  | var(--graupl-spacer-3)                                                                                                                                                              |\n// | --graupl-badge-padding                    | var(--graupl-badge-padding-y) var(--graupl-badge-padding-x)                                                                                                                         |\n// | --graupl-badge-border-top-width           | var(--graupl-border-top-width)                                                                                                                                                      |\n// | --graupl-badge-border-right-width         | var(--graupl-border-right-width)                                                                                                                                                    |\n// | --graupl-badge-border-bottom-width        | var(--graupl-border-bottom-width)                                                                                                                                                   |\n// | --graupl-badge-border-left-width          | var(--graupl-border-left-width)                                                                                                                                                     |\n// | --graupl-badge-border-width               | var(--graupl-badge-border-top-width) var(--graupl-badge-border-right-width) var(--graupl-badge-border-bottom-width) var(--graupl-badge-border-left-width)                           |\n// | --graupl-badge-border-top-style           | var(--graupl-border-top-style)                                                                                                                                                      |\n// | --graupl-badge-border-right-style         | var(--graupl-border-right-style)                                                                                                                                                    |\n// | --graupl-badge-border-bottom-style        | var(--graupl-border-bottom-style)                                                                                                                                                   |\n// | --graupl-badge-border-left-style          | var(--graupl-border-left-style)                                                                                                                                                     |\n// | --graupl-badge-border-style               | var(--graupl-badge-border-top-style) var(--graupl-badge-border-right-style) var(--graupl-badge-border-bottom-style) var(--graupl-badge-border-left-style)                           |\n// | --graupl-badge-border-top-left-radius     | var(--graupl-border-top-left-radius)                                                                                                                                                |\n// | --graupl-badge-border-top-right-radius    | var(--graupl-border-top-right-radius)                                                                                                                                               |\n// | --graupl-badge-border-bottom-right-radius | var(--graupl-border-bottom-right-radius)                                                                                                                                            |\n// | --graupl-badge-border-bottom-left-radius  | var(--graupl-border-bottom-left-radius)                                                                                                                                             |\n// | --graupl-badge-border-radius              | var(--graupl-badge-border-top-left-radius) var(--graupl-badge-border-top-right-radius) var(--graupl-badge-border-bottom-right-radius) var(--graupl-badge-border-bottom-left-radius) |\n\n@use \"defaults\";\n@use \"../../variables\" as root-variables;\n@use \"../../defaults\" as root-defaults;\n@use \"../../theme/color/variables\" as color;\n@use \"../../theme/typography/variables\" as typography;\n@use \"../../functions/theme\";\n@use \"sass:map\";\n\n// Typography.\n// --graupl-badge-font-size\n$badge-font-size: var(\n  --#{root-defaults.$prefix}badge-font-size,\n  #{map.get(typography.$font-sizes, sm)}\n);\n\n// Colors.\n// --graupl-badge-background\n$badge-background: var(\n  --#{root-defaults.$prefix}badge-background,\n  #{color.$background}\n);\n\n// --graupl-badge-color\n$badge-color: var(--#{root-defaults.$prefix}badge-color, #{color.$color});\n\n// --graupl-badge-border-color\n$badge-border-color: var(\n  --#{root-defaults.$prefix}badge-border-color,\n  #{color.$border-color}\n);\n\n// Spacing.\n// --graupl-badge-padding-x\n$badge-padding-x: var(\n  --#{root-defaults.$prefix}badge-padding-x,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-badge-padding-y\n$badge-padding-y: var(\n  --#{root-defaults.$prefix}badge-padding-y,\n  #{map.get(root-variables.$spacers, 2)}\n);\n\n// --graupl-badge-padding\n$badge-padding: var(\n  --#{root-defaults.$prefix}badge-padding,\n  #{$badge-padding-y} #{$badge-padding-x}\n);\n\n// Border widths.\n// --graupl-badge-border-top-width\n$badge-border-top-width: var(\n  --#{root-defaults.$prefix}badge-border-top-width,\n  #{root-variables.$border-top-width}\n);\n\n// --graupl-badge-border-right-width\n$badge-border-right-width: var(\n  --#{root-defaults.$prefix}badge-border-right-width,\n  #{root-variables.$border-right-width}\n);\n\n// --graupl-badge-border-bottom-width\n$badge-border-bottom-width: var(\n  --#{root-defaults.$prefix}badge-border-bottom-width,\n  #{root-variables.$border-bottom-width}\n);\n\n// --graupl-badge-border-left-width\n$badge-border-left-width: var(\n  --#{root-defaults.$prefix}badge-border-left-width,\n  #{root-variables.$border-left-width}\n);\n\n// --graupl-badge-border-width\n$badge-border-width: var(\n  --#{root-defaults.$prefix}badge-border-width,\n  #{$badge-border-top-width} #{$badge-border-right-width}\n    #{$badge-border-bottom-width} #{$badge-border-left-width}\n);\n\n// Border styles.\n// --graupl-badge-border-top-style\n$badge-border-top-style: var(\n  --#{root-defaults.$prefix}badge-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-badge-border-right-style\n$badge-border-right-style: var(\n  --#{root-defaults.$prefix}badge-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-badge-border-bottom-style\n$badge-border-bottom-style: var(\n  --#{root-defaults.$prefix}badge-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-badge-border-left-style\n$badge-border-left-style: var(\n  --#{root-defaults.$prefix}badge-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-badge-border-style\n$badge-border-style: var(\n  --#{root-defaults.$prefix}badge-border-style,\n  #{$badge-border-top-style} #{$badge-border-right-style}\n    #{$badge-border-bottom-style} #{$badge-border-left-style}\n);\n\n// Border radii.\n// --graupl-badge-border-top-left-radius\n$badge-border-top-left-radius: var(\n  --#{root-defaults.$prefix}badge-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-badge-border-top-right-radius\n$badge-border-top-right-radius: var(\n  --#{root-defaults.$prefix}badge-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-badge-border-bottom-right-radius\n$badge-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}badge-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-badge-border-bottom-left-radius\n$badge-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}badge-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-badge-border-radius\n$badge-border-radius: var(\n  --#{root-defaults.$prefix}badge-border-radius,\n  #{$badge-border-top-left-radius} #{$badge-border-top-right-radius}\n    #{$badge-border-bottom-right-radius} #{$badge-border-bottom-left-radius}\n);\n","// @graupl/core card component styles.\n//\n// This module provides the card component styles for vertical and horizontal layouts.\n//\n// The following selectors are generated by default:\n// - `.card`: The card container.\n// - `.card-image`: The card image wrapper.\n// - `.card-content`: The card content wrapper.\n// - `.card-body`: The main body region.\n// - `.card-header`: The header region.\n// - `.card-footer`: The footer region.\n// - `.card-title`: The title element.\n// - `.horizontal`: A modifier to use a horizontal layout for the card.\n// - `.left`: A modifier to position the image on the left in a horizontal layout.\n// - `.right`: A modifier to position the image on the right in a horizontal layout.\n// - `.top`: A modifier to position the image on the top in a vertical layout.\n// - `.bottom`: A modifier to position the image on the bottom in a vertical layout.\n// - `.inverse`: A modifier to invert the image/content positioning.\n//\n// The following custom properties can be used to customize the card component:\n// | Property                                  | Description                                            | Default Value                                                                                                                                                 |\n// | ---                                       | ---                                                    | ---                                                                                                                                                           |\n// | `--graupl-card-padding-x`                 | Horizontal padding of the card.                        | `var(--graupl-spacer-0)`                                                                                                                                      |\n// | `--graupl-card-padding-y`                 | Vertical padding of the card.                          | `var(--graupl-spacer-0)`                                                                                                                                      |\n// | `--graupl-card-padding`                   | Shorthand padding of the card.                         | `var(--graupl-card-padding-y) var(--graupl-card-padding-x)`                                                                                                   |\n// | `--graupl-card-transition`                | Transition applied to the card.                        | `transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)`                                                                   |\n// | `--graupl-card-transition-reduced-motion` | Transition when reduced motion is enabled.             | `none`                                                                                                                                                        |\n// | `--graupl-card-transform`                 | Base transform for the card.                           | `none`                                                                                                                                                        |\n// | `--graupl-card-hover-transform`           | Transform for hovered cards.                           | `none`                                                                                                                                                        |\n// | `--graupl-card-column-gap`                | Column gap inside the card.                            | `var(--graupl-spacer-0)`                                                                                                                                      |\n// | `--graupl-card-row-gap`                   | Row gap inside the card.                               | `var(--graupl-spacer-0)`                                                                                                                                      |\n// | `--graupl-card-gap`                       | Gap inside the card (column/row).                      | `var(--graupl-card-column-gap) var(--graupl-card-row-gap)`                                                                                                    |\n// | `--graupl-card-background`                | Background colour of the card.                         | `var(--graupl-background)`                                                                                                                                    |\n// | `--graupl-card-color`                     | Text colour of the card.                               | `var(--graupl-color)`                                                                                                                                         |\n// | `--graupl-card-border-width`              | Border width of the card.                              | `var(--graupl-border-top-width) var(--graupl-border-right-width) var(--graupl-border-bottom-width) var(--graupl-border-left-width)`                           |\n// | `--graupl-card-border-style`              | Border style of the card.                              | `var(--graupl-border-top-style) var(--graupl-border-right-style) var(--graupl-border-bottom-style) var(--graupl-border-left-style)`                           |\n// | `--graupl-card-border-radius`             | Border radius of the card.                             | `var(--graupl-border-top-left-radius) var(--graupl-border-top-right-radius) var(--graupl-border-bottom-right-radius) var(--graupl-border-bottom-left-radius)` |\n// | `--graupl-card-border-color`              | Border colour of the card.                             | `var(--graupl-card-color)`                                                                                                                                    |\n// | `--graupl-card-content-ratio`             | Grid row ratio used for card content.                  | `1fr`                                                                                                                                                         |\n// | `--graupl-card-image-ratio`               | Grid row ratio used for card images.                   | `auto`                                                                                                                                                        |\n// | `--graupl-horizontal-card-content-ratio`  | Grid column ratio for horizontal cards (content area). | `3fr`                                                                                                                                                         |\n// | `--graupl-horizontal-card-image-ratio`    | Grid column ratio for horizontal cards (image area).   | `2fr`                                                                                                                                                         |\n// | `--graupl-card-image-padding`             | Padding for the card image wrapper.                    | `var(--graupl-spacer-0) var(--graupl-spacer-0)`                                                                                                               |\n// | `--graupl-card-content-padding`           | Padding for the card content wrapper.                  | `var(--graupl-spacer-3) var(--graupl-spacer-5)`                                                                                                               |\n// | `--graupl-card-content-gap`               | Gap inside the card content (column/row).              | `var(--graupl-card-content-column-gap) var(--graupl-card-content-row-gap)`                                                                                    |\n// | `--graupl-card-title-color`               | Text colour of the card title.                         | `var(--graupl-card-color)`                                                                                                                                    |\n// | `--graupl-card-title-font-size`           | Font size of the card title.                           | `var(--graupl-h4)`                                                                                                                                            |\n// | `--graupl-card-title-font-weight`         | Font weight of the card title.                         | `var(--graupl-font-weight-h4)`                                                                                                                                |\n// | `--graupl-card-title-font-family`         | Font family of the card title.                         | `var(--graupl-font-family-h4)`                                                                                                                                |\n// | `--graupl-card-title-line-height`         | Line height of the card title.                         | `var(--graupl-line-height-h4)`                                                                                                                                |\n//\n// The following sass variables can be used to customize the generation of the card component:\n// | Variable                               | Description                                                                           | Default Value    |\n// | ---                                    | ---                                                                                   | ---              |\n// | `$selector-base`                       | Selector base for the component.                                                      | `\".\"`            |\n// | `$modifier-selector-base`              | Selector base for component modifiers.                                                | `\".\"`            |\n// | `$generate-base-theme-map`             | A flag to generate the base theme maps for accordion variants.                        | `true`           |\n// | `$themeable`                           | Flag to generate theme modifiers.                                                     | `false`          |\n// | `$card-selector-base`                  | Selector base for the card container.                                                 | `$selector-base` |\n// | `$card-selector`                       | Selector for the card container.                                                      | `\"card\"`         |\n// | `$card-image-selector-base`            | Selector base for the image wrapper.                                                  | `$selector-base` |\n// | `$card-image-selector`                 | Selector for the image wrapper.                                                       | `\"card-image\"`   |\n// | `$card-content-selector-base`          | Selector base for the content wrapper.                                                | `$selector-base` |\n// | `$card-content-selector`               | Selector for the content wrapper.                                                     | `\"card-content\"` |\n// | `$card-body-selector-base`             | Selector base for the body region.                                                    | `$selector-base` |\n// | `$card-body-selector`                  | Selector for the body region.                                                         | `\"card-body\"`    |\n// | `$card-header-selector-base`           | Selector base for the header region.                                                  | `$selector-base` |\n// | `$card-header-selector`                | Selector for the header region.                                                       | `\"card-header\"`  |\n// | `$card-footer-selector-base`           | Selector base for the footer region.                                                  | `$selector-base` |\n// | `$card-footer-selector`                | Selector for the footer region.                                                       | `\"card-footer\"`  |\n// | `$card-title-selector-base`            | Selector base for the title element.                                                  | `$selector-base` |\n// | `$card-title-selector`                 | Selector for the title element.                                                       | `\"card-title\"`   |\n// | `$horizontal-card-selector-base`       | Selector base for horizontal layout modifier.                                         | `\".\"`            |\n// | `$horizontal-card-selector`            | Selector for horizontal layout modifier.                                              | `\"horizontal\"`   |\n// | `$horizontal-card-left-selector-base`  | Selector base for left modifier.                                                      | `\".\"`            |\n// | `$horizontal-card-left-selector`       | Selector for left modifier.                                                           | `\"left\"`         |\n// | `$horizontal-card-right-selector-base` | Selector base for right modifier.                                                     | `\".\"`            |\n// | `$horizontal-card-right-selector`      | Selector for right modifier.                                                          | `\"right\"`        |\n// | `$vertical-card-top-selector-base`     | Selector base for top modifier.                                                       | `\".\"`            |\n// | `$vertical-card-top-selector`          | Selector for top modifier.                                                            | `\"top\"`          |\n// | `$vertical-card-bottom-selector-base`  | Selector base for bottom modifier.                                                    | `\".\"`            |\n// | `$vertical-card-bottom-selector`       | Selector for bottom modifier.                                                         | `\"bottom\"`       |\n// | `$inverse-card-selector-base`          | Selector base for inverse layout modifier.                                            | `\".\"`            |\n// | `$inverse-card-selector`               | Selector for inverse layout modifier.                                                 | `\"inverse\"`      |\n// | `$card-transform`                      | Base transform for the card.                                                          | `none`           |\n// | `$card-hover-transform`                | Hover transform for the card.                                                         | `none`           |\n// | `$card-content-ratio`                  | Grid ratio for content rows.                                                          | `1fr`            |\n// | `$card-image-ratio`                    | Grid ratio for image rows.                                                            | `auto`           |\n// | `$horizontal-card-content-ratio`       | Grid ratio for content in horizontal layout.                                          | `3fr`            |\n// | `$horizontal-card-image-ratio`         | Grid ratio for images in horizontal layout.                                           | `2fr`            |\n// | `$card-theme-mappings`                 | A map of properties and color shades used generate all card variants.                 | `()`             |\n// | `$card-theme-map`                      | A map of all properties, colors, and color shades used to generate all card variants. | `()`             |\n//\n// ## Using `$card-theme-mappings`\n//\n// `$card-theme-mappings` is a 1-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $card-theme-mappings: (\n//   border-color: 700,\n// )\n// ```\n//\n// This directly[1] maps to all card variants, telling them what shade to use for said property.\n// All card variants will use the following based on the example above:\n// - Primary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize _all_ cards variants in the same way.\n//\n// For example, if you use the following map:\n// ```scss\n// $card-theme-mappings: (\n//   border-color: 500,\n// )\n// ```\n//\n// All card variants will use the following:\n// - Primary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--primary--500`,\n// - Secondary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--secondary--500`, and\n// - Tertiary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--tertiary--500`.\n//\n// [1] `$card-theme-mappings` gets parsed into a larger, more explicit map: `$card-theme-map`.\n//\n// Using `$card-theme-map`\n//\n// `$card-theme-map` is a multi-level map of properties, colors, and shade values.\n//\n// e.g.\n// ```scss\n// $card-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: primary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: tertiary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// This directly maps to all card variants, telling them what shade to use for said property.\n// The card variants will use the following based on the example above:\n// - Primary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize card variants individually.\n//\n// For example, if you use the following map:\n//\n// ```scss\n// $card-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// The card variants will use the following:\n// - Primary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--secondary--700`,\n// - Secondary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary cards will have their `--graupl-card-border-color` property set to `--graupl-theme-active--secondary--700`.\n//\n// @example\n// <div class=\"card\">\n//   <div class=\"card-image\"><img src=\"https://picsum.photos/600/400\" alt=\"Card image\" /></div>\n//   <div class=\"card-content\">\n//     <div class=\"card-header\"><h3 class=\"card-title\">Card Title</h3></div>\n//     <div class=\"card-body\"><p>This is some text that describes the card.</p></div>\n//     <div class=\"card-footer\"><a class=\"card stretched\" href=\"#\">Card Action</a></div>\n//   </div>\n// </div>\n//\n// @example\n// <div class=\"card horizontal right\">\n//   <div class=\"card-image\"><img src=\"https://picsum.photos/600/400\" alt=\"Card image\" /></div>\n//   <div class=\"card-content\">\n//     <div class=\"card-header\"><h3 class=\"card-title\">Card Title</h3></div>\n//     <div class=\"card-body\"><p>This is some text that describes the card.</p></div>\n//     <div class=\"card-footer\"><a class=\"card stretched\" href=\"#\">Card Action</a></div>\n//   </div>\n// </div>\n\n@use \"defaults\";\n@use \"variables\" as *;\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/theme\";\n@use \"../../mixins/animation\";\n@use \"../../mixins/container\";\n\n@include layer(component) {\n  // .card\n  #{defaults.$card-selector-base}#{defaults.$card-selector} {\n    display: grid;\n    position: relative;\n    grid-template-columns: [image-start content-start] 1fr [image-end content-end];\n    padding: $card-padding;\n    transform: $card-transform;\n    transition: $card-transition;\n    border-width: $card-border-width;\n    border-style: $card-border-style;\n    border-radius: $card-border-radius;\n    gap: $card-gap;\n    isolation: isolate;\n\n    // &, &.top\n    &,\n    &#{defaults.$vertical-card-top-selector-base}#{defaults.$vertical-card-top-selector} {\n      grid-template-rows:\n        [image-start]\n        $card-image-ratio\n        [image-end content-start]\n        $card-content-ratio\n        [content-end];\n    }\n\n    // &.bottom, &.inverse\n    &#{defaults.$vertical-card-bottom-selector-base}#{defaults.$vertical-card-bottom-selector},\n    &#{defaults.$inverse-card-selector-base}#{defaults.$inverse-card-selector} {\n      grid-template-rows:\n        [content-start]\n        $card-content-ratio\n        [content-end image-start]\n        $card-image-ratio\n        [image-end];\n    }\n\n    &:hover {\n      --#{root-defaults.$prefix}card-transform: #{$card-hover-transform};\n    }\n\n    // &.horizontal\n    &#{defaults.$horizontal-card-selector-base}#{defaults.$horizontal-card-selector} {\n      // &, &.left\n      &,\n      &#{defaults.$horizontal-card-left-selector-base}#{defaults.$horizontal-card-left-selector} {\n        --#{root-defaults.$prefix}card-content-ratio: #{$horizontal-card-content-ratio};\n        --#{root-defaults.$prefix}card-image-ratio: #{$horizontal-card-image-ratio};\n\n        grid-template-columns:\n          [image-start]\n          $card-image-ratio\n          [image-end content-start]\n          $card-content-ratio\n          [content-end];\n        grid-template-rows: [image-start content-start] 1fr [image-end content-end];\n\n        // .card-image\n        #{defaults.$card-image-selector-base}#{defaults.$card-image-selector}\n          img {\n          border-radius: calc(\n              $card-border-top-left-radius - min(\n                  $card-border-top-width,\n                  $card-border-left-width\n                )\n            )\n            0 0\n            calc(\n              $card-border-bottom-left-radius - min(\n                  $card-border-bottom-width,\n                  $card-border-left-width\n                )\n            );\n        }\n      }\n\n      // &.right, &.inverse\n      &#{defaults.$horizontal-card-right-selector-base}#{defaults.$horizontal-card-right-selector},\n      &#{defaults.$inverse-card-selector-base}#{defaults.$inverse-card-selector} {\n        grid-template-columns:\n          [content-start]\n          $card-content-ratio\n          [content-end image-start]\n          $card-image-ratio\n          [image-end];\n\n        // .card-image\n        #{defaults.$card-image-selector-base}#{defaults.$card-image-selector}\n          img {\n          border-radius: 0\n            calc(\n              $card-border-top-right-radius - min(\n                  $card-border-top-width,\n                  $card-border-right-width\n                )\n            )\n            calc(\n              $card-border-bottom-right-radius - min(\n                  $card-border-bottom-width,\n                  $card-border-right-width\n                )\n            )\n            0;\n        }\n      }\n    }\n  }\n\n  // .card-image\n  #{defaults.$card-image-selector-base}#{defaults.$card-image-selector} {\n    grid-area: image;\n    padding: $card-image-padding;\n\n    img {\n      width: 100%;\n      height: 100%;\n      border-radius: calc(\n          $card-border-top-left-radius - min(\n              $card-border-top-width,\n              $card-border-left-width\n            )\n        )\n        calc(\n          $card-border-top-right-radius - min(\n              $card-border-top-width,\n              $card-border-right-width\n            )\n        )\n        0 0;\n      object-fit: cover;\n    }\n  }\n\n  // .card-content\n  #{defaults.$card-content-selector-base}#{defaults.$card-content-selector} {\n    display: flex;\n    grid-area: content;\n    flex-direction: column;\n    padding: $card-content-padding;\n    gap: $card-content-gap;\n  }\n\n  // .card-body\n  #{defaults.$card-body-selector-base}#{defaults.$card-body-selector} {\n    flex: 1 0 auto;\n  }\n\n  // .card-footer\n  #{defaults.$card-footer-selector-base}#{defaults.$card-footer-selector} {\n    flex: 0 0 auto;\n  }\n\n  // .card-title\n  #{defaults.$card-title-selector-base}#{defaults.$card-title-selector} {\n    flex: 0 0 auto;\n  }\n\n  @include container.trigger(force-vertical-card) {\n    // .card\n    #{defaults.$card-selector-base}#{defaults.$card-selector} {\n      // .horizontal\n      &#{defaults.$horizontal-card-selector-base}#{defaults.$horizontal-card-selector} {\n        // &, &.left, &.top, &.right, &.bottom, &.inverse\n        &,\n        &#{defaults.$horizontal-card-left-selector-base}#{defaults.$horizontal-card-left-selector},\n        &#{defaults.$vertical-card-top-selector-base}#{defaults.$vertical-card-top-selector},\n        &#{defaults.$horizontal-card-right-selector-base}#{defaults.$horizontal-card-right-selector},\n        &#{defaults.$vertical-card-bottom-selector-base}#{defaults.$vertical-card-bottom-selector},\n        &#{defaults.$inverse-card-selector-base}#{defaults.$inverse-card-selector} {\n          --#{root-defaults.$prefix}horizontal-card-image-ratio: #{defaults.$card-image-ratio};\n          --#{root-defaults.$prefix}horizontal-card-content-ratio: #{defaults.$card-content-ratio};\n\n          grid-template-columns: [image-start content-start] 1fr [image-end content-end];\n        }\n\n        // &, &.left, &.top\n        &,\n        &#{defaults.$horizontal-card-left-selector-base}#{defaults.$horizontal-card-left-selector},\n        &#{defaults.$horizontal-card-right-selector-base}#{defaults.$horizontal-card-right-selector},\n        &#{defaults.$vertical-card-top-selector-base}#{defaults.$vertical-card-top-selector} {\n          grid-template-rows:\n            [image-start]\n            $card-image-ratio\n            [image-end content-start]\n            $card-content-ratio\n            [content-end];\n        }\n\n        // &.bottom, &.inverse\n        &#{defaults.$vertical-card-bottom-selector-base}#{defaults.$vertical-card-bottom-selector},\n        &#{defaults.$inverse-card-selector-base}#{defaults.$inverse-card-selector} {\n          grid-template-rows:\n            [content-start]\n            $card-content-ratio\n            [content-end image-start]\n            $card-image-ratio\n            [image-end];\n        }\n      }\n    }\n  }\n\n  @include animation.off {\n    // .card\n    #{#{defaults.$card-selector-base}}#{defaults.$card-selector} {\n      --#{root-defaults.$prefix}card-transition: #{$card-transition-reduced-motion};\n    }\n  }\n}\n\n@include layer(theme) {\n  // .card\n  #{#{defaults.$card-selector-base}}#{defaults.$card-selector} {\n    --#{root-defaults.$prefix}color: #{$card-color};\n    --#{root-defaults.$prefix}background: #{$card-background};\n\n    border-color: $card-border-color;\n    background: $card-background;\n    color: $card-color;\n\n    @if root-defaults.$themeable-components and defaults.$themeable {\n      @include theme.generate-modifiers(\n        defaults.$card-theme-map,\n        defaults.$card-theme-selector-base,\n        defaults.$card-theme-selector-prefix,\n        \"card-\"\n      );\n    }\n  }\n\n  // .card-title\n  #{defaults.$card-title-selector-base}#{defaults.$card-title-selector} {\n    color: $card-title-color;\n    font-size: $card-title-font-size;\n    font-weight: $card-title-font-weight;\n    line-height: $card-title-line-height;\n  }\n}\n","// @graupl/core card component variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property                          | Default                                                                                                                                                                         |\n// | ---------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-card-padding-x                  | var(--graupl-spacer-0)                                                                                                                                                          |\n// | --graupl-card-padding-y                  | var(--graupl-spacer-0)                                                                                                                                                          |\n// | --graupl-card-padding                    | var(--graupl-card-padding-y) var(--graupl-card-padding-x)                                                                                                                       |\n// | --graupl-card-transition                 | transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)                                                                                       |\n// | --graupl-card-transition-reduced-motion  | none                                                                                                                                                                            |\n// | --graupl-card-transform                  | none                                                                                                                                                                            |\n// | --graupl-card-hover-transform            | none                                                                                                                                                                 |\n// | --graupl-card-column-gap                 | var(--graupl-spacer-0)                                                                                                                                                          |\n// | --graupl-card-row-gap                    | var(--graupl-spacer-0)                                                                                                                                                          |\n// | --graupl-card-gap                        | var(--graupl-card-column-gap) var(--graupl-card-row-gap)                                                                                                                        |\n// | --graupl-card-background                 | var(--graupl-background)                                                                                                                                                        |\n// | --graupl-card-color                      | var(--graupl-color)                                                                                                                                                             |\n// | --graupl-card-border-color               | var(--graupl-card-color)                                                                                                                                                        |\n// | --graupl-card-border-top-left-radius     | var(--graupl-border-top-left-radius)                                                                                                                                            |\n// | --graupl-card-border-top-right-radius    | var(--graupl-border-top-right-radius)                                                                                                                                           |\n// | --graupl-card-border-bottom-left-radius  | var(--graupl-border-bottom-left-radius)                                                                                                                                         |\n// | --graupl-card-border-bottom-right-radius | var(--graupl-border-bottom-right-radius)                                                                                                                                        |\n// | --graupl-card-border-radius              | var(--graupl-card-border-top-left-radius) var(--graupl-card-border-top-right-radius) var(--graupl-card-border-bottom-right-radius) var(--graupl-card-border-bottom-left-radius) |\n// | --graupl-card-border-top-width           | var(--graupl-border-top-width)                                                                                                                                                  |\n// | --graupl-card-border-right-width         | var(--graupl-border-right-width)                                                                                                                                                |\n// | --graupl-card-border-bottom-width        | var(--graupl-border-bottom-width)                                                                                                                                               |\n// | --graupl-card-border-left-width          | var(--graupl-border-left-width)                                                                                                                                                 |\n// | --graupl-card-border-width               | var(--graupl-card-border-top-width) var(--graupl-card-border-right-width) var(--graupl-card-border-bottom-width) var(--graupl-card-border-left-width)                           |\n// | --graupl-card-border-top-style           | var(--graupl-border-top-style)                                                                                                                                                  |\n// | --graupl-card-border-right-style         | var(--graupl-border-right-style)                                                                                                                                                |\n// | --graupl-card-border-bottom-style        | var(--graupl-border-bottom-style)                                                                                                                                               |\n// | --graupl-card-border-left-style          | var(--graupl-border-left-style)                                                                                                                                                 |\n// | --graupl-card-border-style               | var(--graupl-card-border-top-style) var(--graupl-card-border-right-style) var(--graupl-card-border-bottom-style) var(--graupl-card-border-left-style)                           |\n// | --graupl-card-content-ratio              | 1fr                                                                                                                                                                             |\n// | --graupl-card-image-ratio                | auto                                                                                                                                                                            |\n// | --graupl-horizontal-card-content-ratio   | 3fr                                                                                                                                                                             |\n// | --graupl-horizontal-card-image-ratio     | 2fr                                                                                                                                                                             |\n// | --graupl-card-image-padding-x            | var(--graupl-spacer-0)                                                                                                                                                          |\n// | --graupl-card-image-padding-y            | var(--graupl-spacer-0)                                                                                                                                                          |\n// | --graupl-card-image-padding              | var(--graupl-card-image-padding-y) var(--graupl-card-image-padding-x)                                                                                                           |\n// | --graupl-card-content-padding-x          | var(--graupl-spacer-5)                                                                                                                                                          |\n// | --graupl-card-content-padding-y          | var(--graupl-spacer-3)                                                                                                                                                          |\n// | --graupl-card-content-padding            | var(--graupl-card-content-padding-y) var(--graupl-card-content-padding-x)                                                                                                       |\n// | --graupl-card-content-column-gap         | var(--graupl-spacer-0)                                                                                                                                                          |\n// | --graupl-card-content-row-gap            | var(--graupl-spacer-3)                                                                                                                                                          |\n// | --graupl-card-content-gap                | var(--graupl-card-content-column-gap) var(--graupl-card-content-row-gap)                                                                                                        |\n// | --graupl-card-title-color                | var(--graupl-card-color)                                                                                                                                                        |\n// | --graupl-card-title-font-size            | var(--graupl-h4-font-size)                                                                                                                                                      |\n// | --graupl-card-title-font-weight          | var(--graupl-h4-font-weight)                                                                                                                                                    |\n// | --graupl-card-title-font-family          | var(--graupl-h4-font-family)                                                                                                                                                    |\n// | --graupl-card-title-line-height          | var(--graupl-h4-line-height)                                                                                                                                                    |\n\n@use \"defaults\";\n@use \"../../defaults\" as root-defaults;\n@use \"../../variables\" as root-variables;\n@use \"../../theme/color/variables\" as color;\n@use \"../../theme/typography/variables\" as typography;\n@use \"sass:map\";\n\n// Card properties.\n// --graupl-card-padding-x\n$card-padding-x: var(\n  --#{root-defaults.$prefix}card-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-card-padding-y\n$card-padding-y: var(\n  --#{root-defaults.$prefix}card-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-card-padding\n$card-padding: var(\n  --#{root-defaults.$prefix}card-padding,\n  #{$card-padding-y} #{$card-padding-x}\n);\n\n// --graupl-card-transition\n$card-transition: var(\n  --#{root-defaults.$prefix}card-transition,\n  transform #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function}\n);\n\n// --graupl-card-transition-reduced-motion\n$card-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}card-transition-reduced-motion,\n  none\n);\n\n// Card transform properties.\n// --graupl-card-transform\n$card-transform: var(\n  --#{root-defaults.$prefix}card-transform,\n  #{defaults.$card-transform}\n);\n\n// --graupl-card-hover-transform\n$card-hover-transform: var(\n  --#{root-defaults.$prefix}card-hover-transform,\n  #{defaults.$card-hover-transform}\n);\n\n// Card gap properties.\n// --graupl-card-column-gap\n$card-column-gap: var(\n  --#{root-defaults.$prefix}card-column-gap,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-card-row-gap\n$card-row-gap: var(\n  --#{root-defaults.$prefix}card-row-gap,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-card-gap\n$card-gap: var(\n  --#{root-defaults.$prefix}card-gap,\n  #{$card-column-gap} #{$card-row-gap}\n);\n\n// Card color properties.\n// --graupl-card-background\n$card-background: var(\n  --#{root-defaults.$prefix}card-background,\n  #{color.$background}\n);\n\n// --graupl-card-color\n$card-color: var(--#{root-defaults.$prefix}card-color, #{color.$color});\n\n// Card border-properties.\n// --graupl-card-border-color\n$card-border-color: var(\n  --#{root-defaults.$prefix}card-border-color,\n  #{$card-color}\n);\n\n// --graupl-card-border-top-left-radius\n$card-border-top-left-radius: var(\n  --#{root-defaults.$prefix}card-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-card-border-top-right-radius\n$card-border-top-right-radius: var(\n  --#{root-defaults.$prefix}card-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-card-border-bottom-left-radius\n$card-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}card-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-card-border-bottom-right-radius\n$card-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}card-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-card-border-radius\n$card-border-radius: var(\n  --#{root-defaults.$prefix}card-border-radius,\n  #{$card-border-top-left-radius} #{$card-border-top-right-radius}\n    #{$card-border-bottom-right-radius} #{$card-border-bottom-left-radius}\n);\n\n// --graupl-card-border-top-width\n$card-border-top-width: var(\n  --#{root-defaults.$prefix}card-border-top-width,\n  #{root-variables.$border-top-width}\n);\n\n// --graupl-card-border-right-width\n$card-border-right-width: var(\n  --#{root-defaults.$prefix}card-border-right-width,\n  #{root-variables.$border-right-width}\n);\n\n// --graupl-card-border-bottom-width\n$card-border-bottom-width: var(\n  --#{root-defaults.$prefix}card-border-bottom-width,\n  #{root-variables.$border-bottom-width}\n);\n\n// --graupl-card-border-left-width\n$card-border-left-width: var(\n  --#{root-defaults.$prefix}card-border-left-width,\n  #{root-variables.$border-left-width}\n);\n\n// --graupl-card-border-width\n$card-border-width: var(\n  --#{root-defaults.$prefix}card-border-width,\n  #{$card-border-top-width} #{$card-border-right-width}\n    #{$card-border-bottom-width} #{$card-border-left-width}\n);\n\n// --graupl-card-border-top-style\n$card-border-top-style: var(\n  --#{root-defaults.$prefix}card-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-card-border-right-style\n$card-border-right-style: var(\n  --#{root-defaults.$prefix}card-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-card-border-bottom-style\n$card-border-bottom-style: var(\n  --#{root-defaults.$prefix}card-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-card-border-left-style\n$card-border-left-style: var(\n  --#{root-defaults.$prefix}card-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-card-border-style\n$card-border-style: var(\n  --#{root-defaults.$prefix}card-border-style,\n  #{$card-border-top-style} #{$card-border-right-style}\n    #{$card-border-bottom-style} #{$card-border-left-style}\n);\n\n// Card layout properties.\n// --graupl-card-content-ratio\n$card-content-ratio: var(\n  --#{root-defaults.$prefix}card-content-ratio,\n  defaults.$card-content-ratio\n);\n\n// --graupl-card-image-ratio\n$card-image-ratio: var(\n  --#{root-defaults.$prefix}card-image-ratio,\n  defaults.$card-image-ratio\n);\n\n// --graupl-horizontal-card-content-ratio\n$horizontal-card-content-ratio: var(\n  --#{root-defaults.$prefix}horizontal-card-content-ratio,\n  defaults.$horizontal-card-content-ratio\n);\n\n// --graupl-horizontal-card-image-ratio\n$horizontal-card-image-ratio: var(\n  --#{root-defaults.$prefix}horizontal-card-image-ratio,\n  defaults.$horizontal-card-image-ratio\n);\n\n// Card image properties.\n// --graupl-card-image-padding-x\n$card-image-padding-x: var(\n  --#{root-defaults.$prefix}card-image-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-card-image-padding-y\n$card-image-padding-y: var(\n  --#{root-defaults.$prefix}card-image-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-card-image-padding\n$card-image-padding: var(\n  --#{root-defaults.$prefix}card-image-padding,\n  #{$card-image-padding-y} #{$card-image-padding-x}\n);\n\n// Card content properties.\n// --graupl-card-content-padding-x\n$card-content-padding-x: var(\n  --#{root-defaults.$prefix}card-content-padding-x,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-card-content-padding-y\n$card-content-padding-y: var(\n  --#{root-defaults.$prefix}card-content-padding-y,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-card-content-padding\n$card-content-padding: var(\n  --#{root-defaults.$prefix}card-content-padding,\n  #{$card-content-padding-y} #{$card-content-padding-x}\n);\n\n// Card content gap properties.\n// --graupl-card-content-column-gap\n$card-content-column-gap: var(\n  --#{root-defaults.$prefix}card-content-column-gap,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-card-content-row-gap\n$card-content-row-gap: var(\n  --#{root-defaults.$prefix}card-content-row-gap,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-card-content-gap\n$card-content-gap: var(\n  --#{root-defaults.$prefix}card-content-gap,\n  #{$card-content-column-gap} #{$card-content-row-gap}\n);\n\n// Card title properties.\n// --graupl-card-title-color\n$card-title-color: var(\n  --#{root-defaults.$prefix}card-title-color,\n  #{$card-color}\n);\n\n// --graupl-card-title-font-size\n$card-title-font-size: var(\n  --#{root-defaults.$prefix}card-title-font-size,\n  #{typography.$h4-font-size}\n);\n\n// --graupl-card-title-font-weight\n$card-title-font-weight: var(\n  --#{root-defaults.$prefix}card-title-font-weight,\n  #{typography.$h4-font-weight}\n);\n\n// --graupl-card-title-font-family\n$card-title-font-family: var(\n  --#{root-defaults.$prefix}card-title-font-family,\n  #{typography.$h4-font-family}\n);\n\n// --graupl-card-title-line-height\n$card-title-line-height: var(\n  --#{root-defaults.$prefix}card-title-line-height,\n  #{typography.$h4-line-height}\n);\n","// @graupl/core container mixins.\n//\n// A series of mixins to generate breakpoints.\n\n// @use \"../defaults\" as root-defaults;\n@use \"../functions/container\";\n@use \"../defaults\" as root-defaults;\n@use \"sass:map\";\n@use \"sass:meta\";\n\n// A mixin to generate a minimum container width media query.\n@mixin up($size) {\n  $container-size: container.min($size);\n\n  @container (#{$container-size} <= width) {\n    @content;\n  }\n}\n\n// A mixin to generate a maximum container width media query.\n@mixin down($size) {\n  $container-size: container.max($size);\n\n  @container (width <= #{$container-size}) {\n    @content;\n  }\n}\n\n// A mixin to generate a range of container widths media query.\n@mixin between($min, $max) {\n  $container-size: container.range($min, $max);\n  $min: map.get($container-size, \"min\");\n  $max: map.get($container-size, \"max\");\n\n  @container (#{$min} <= width <= #{$max}) {\n    @content;\n  }\n}\n\n@mixin only($size) {\n  @include between($size, $size) {\n    @content;\n  }\n}\n\n@mixin trigger($trigger) {\n  @if not map.has-key(root-defaults.$container-size-triggers, $trigger) {\n    @error \"The container size trigger \\\"#{$trigger}\\\" does not exist.\";\n  }\n\n  $container-size-trigger: map.get(\n    root-defaults.$container-size-triggers,\n    $trigger\n  );\n\n  @if not map.has-key($container-size-trigger, \"mixin\") {\n    @error \"The container size trigger \\\"#{$trigger}\\\" does not have a mixin key.\";\n  }\n\n  @if not map.has-key($container-size-trigger, \"args\") {\n    @error \"The container size trigger \\\"#{$trigger}\\\" does not have an args key.\";\n  }\n\n  $mixin-name: map.get($container-size-trigger, \"mixin\");\n  $mixin-args: map.get($container-size-trigger, \"args\");\n\n  @if not meta.mixin-exists($mixin-name) {\n    @error \"The mixin \\\"#{$mixin-name}\\\" does not exist.\";\n  }\n\n  $mixin: meta.get-mixin($mixin-name);\n\n  @if meta.accepts-content($mixin) {\n    @include meta.apply($mixin, $mixin-args...) {\n      @content;\n    }\n  } @else {\n    @warn \"The mixin \\\"#{$mixin-name}\\\" does not accept content.\";\n  }\n}\n","// @graupl/core carousel component styles.\n//\n// This module provides carousel layout, controls, and tabs.\n//\n// The following selectors are generated by default:\n// - `.carousel`: The carousel container.\n// - `.carousel-control-container`: The container for play/pause/prev/next controls.\n// - `.carousel-control`: The control elements (with `.autoplay`, `.play`, `.pause`, `.previous`, `.next` modifiers).\n// - `.carousel-item-container`: The container for carousel items.\n// - `.carousel-item`: Individual carousel items (with `.active`, `.next`, `.previous` modifiers).\n// - `.carousel-tab-container`: The container for tabs.\n// - `.carousel-tab`: Individual tabs.\n//\n// The following custom properties can be used to customize the carousel component:\n// | Property                                   | Description                                      | Default Value                                                       |\n// | ------------------------------------------ | ------------------------------------------------ | ------------------------------------------------------------------- |\n// | `--graupl-carousel-controls-height`        | Height of the controls row.                      | `auto`                                                              |\n// | `--graupl-carousel-tabs-width`             | Width of the tabs column.                        | `1fr`                                                               |\n// | `--graupl-carousel-tabs-height`            | Height of the tabs row.                          | `auto`                                                              |\n// | `--graupl-carousel-slide-height`           | Height of the slide row.                         | `1fr`                                                               |\n// | `--graupl-carousel-padding-x`              | Horizontal padding of the carousel.              | `var(--graupl-spacer-0)`                                            |\n// | `--graupl-carousel-padding-y`              | Vertical padding of the carousel.                | `var(--graupl-spacer-0)`                                            |\n// | `--graupl-carousel-padding`                | Shorthand padding of the carousel.               | `var(--graupl-carousel-padding-y) var(--graupl-carousel-padding-x)` |\n// | `--graupl-carousel-item-max-width`         | Max width of a carousel item.                    | `100%`                                                              |\n// | `--graupl-carousel-transition-duration`    | Duration used for slide transitions.             | `500ms`                                                             |\n// | `--graupl-carousel-item-container-padding` | Padding of the item container.                   | `var(--graupl-spacer-0) var(--graupl-spacer-0)`                     |\n// | `--graupl-carousel-color`                  | Default text color for carousel content.         | `var(--graupl-color)`                                               |\n// | `--graupl-carousel-background`             | Default background color for the carousel.       | `var(--graupl-background)`                                          |\n// | `--graupl-carousel-border-color`           | Border color applied to carousel elements.       | `var(--graupl-border-color)`                                        |\n// | `--graupl-carousel-control-color`          | Text/icon color for carousel controls.           | `var(--graupl-carousel-color)`                                      |\n// | `--graupl-carousel-control-visited-color`  | Text/icon color for visited controls.            | `var(--graupl-carousel-control-color)`                              |\n// | `--graupl-carousel-control-focus-color`    | Text/icon color for focused controls.            | `var(--graupl-carousel-control-color)`                              |\n// | `--graupl-carousel-control-hover-color`    | Text/icon color for hovered controls.            | `var(--graupl-carousel-background)`                                 |\n// | `--graupl-carousel-control-active-color`   | Text/icon color for active controls.             | `var(--graupl-carousel-control-hover-color)`                        |\n// | `--graupl-carousel-control-disabled-color` | Text/icon color for disabled controls.           | `var(--graupl-theme-active--primary--200)`                          |\n// | `--graupl-carousel-control-background`     | Background color for carousel controls.          | `var(--graupl-carousel-background)`                                 |\n// | `--graupl-carousel-control-visited-background` | Background for visited controls.             | `var(--graupl-carousel-control-background)`                         |\n// | `--graupl-carousel-control-focus-background`   | Background for focused controls.             | `var(--graupl-carousel-control-background)`                         |\n// | `--graupl-carousel-control-hover-background`   | Background for hovered controls.              | `var(--graupl-carousel-color)`                                      |\n// | `--graupl-carousel-control-active-background`  | Background for active controls.               | `var(--graupl-carousel-control-hover-background)`                   |\n// | `--graupl-carousel-control-disabled-background` | Background for disabled controls.            | `var(--graupl-carousel-background)`                                 |\n// | `--graupl-carousel-control-border-color`   | Border color for carousel controls.              | `var(--graupl-carousel-border-color)`                               |\n// | `--graupl-carousel-control-visited-border-color` | Border color for visited controls.          | `var(--graupl-carousel-control-border-color)`                       |\n// | `--graupl-carousel-control-focus-border-color`   | Border color for focused controls.          | `var(--graupl-carousel-control-border-color)`                       |\n// | `--graupl-carousel-control-hover-border-color`   | Border color for hovered controls.           | `var(--graupl-carousel-control-border-color)`                       |\n// | `--graupl-carousel-control-active-border-color`  | Border color for active controls.            | `var(--graupl-carousel-control-hover-border-color)`                 |\n// | `--graupl-carousel-control-disabled-border-color` | Border color for disabled controls.         | `var(--graupl-theme-active--primary--200)`                          |\n// | `--graupl-carousel-control-width`          | Width of each control.                           | `4rem`                                                              |\n// | `--graupl-carousel-control-height`         | Height of each control.                          | `3rem`                                                              |\n// | `--graupl-carousel-play-content`           | Content for the play control pseudo-element.     | `'▶'`                                                               |\n// | `--graupl-carousel-pause-content`          | Content for the pause control pseudo-element.    | `'❚❚'`                                                              |\n// | `--graupl-carousel-next-content`           | Content for the next control pseudo-element.     | `'▶'`                                                               |\n// | `--graupl-carousel-previous-content`       | Content for the previous control pseudo-element. | `'◀'`                                                               |\n// | `--graupl-carousel-tab-color`              | Text/icon color for carousel tabs.               | `var(--graupl-carousel-color)`                                      |\n// | `--graupl-carousel-tab-visited-color`      | Text/icon color for visited tabs.                | `var(--graupl-carousel-tab-color)`                                  |\n// | `--graupl-carousel-tab-focus-color`        | Text/icon color for focused tabs.                | `var(--graupl-carousel-tab-color)`                                  |\n// | `--graupl-carousel-tab-hover-color`        | Text/icon color for hovered tabs.                | `var(--graupl-carousel-background)`                                 |\n// | `--graupl-carousel-tab-active-color`       | Text/icon color for active tabs.                 | `var(--graupl-carousel-tab-hover-color)`                            |\n// | `--graupl-carousel-tab-disabled-color`     | Text/icon color for disabled tabs.               | `var(--graupl-theme-active--primary--200)`                          |\n// | `--graupl-carousel-tab-background`         | Background color for carousel tabs.              | `var(--graupl-carousel-background)`                                 |\n// | `--graupl-carousel-tab-visited-background` | Background for visited tabs.                     | `var(--graupl-carousel-tab-background)`                             |\n// | `--graupl-carousel-tab-focus-background`   | Background for focused tabs.                     | `var(--graupl-carousel-tab-background)`                             |\n// | `--graupl-carousel-tab-hover-background`   | Background for hovered tabs.                     | `var(--graupl-carousel-color)`                                      |\n// | `--graupl-carousel-tab-active-background`  | Background for active tabs.                      | `var(--graupl-carousel-tab-hover-background)`                       |\n// | `--graupl-carousel-tab-disabled-background`| Background for disabled tabs.                    | `var(--graupl-carousel-background)`                                 |\n// | `--graupl-carousel-tab-border-color`       | Border color for carousel tabs.                  | `var(--graupl-carousel-border-color)`                               |\n// | `--graupl-carousel-tab-visited-border-color` | Border color for visited tabs.                 | `var(--graupl-carousel-tab-border-color)`                           |\n// | `--graupl-carousel-tab-focus-border-color` | Border color for focused tabs.                   | `var(--graupl-carousel-tab-border-color)`                           |\n// | `--graupl-carousel-tab-hover-border-color` | Border color for hovered tabs.                   | `var(--graupl-carousel-tab-border-color)`                           |\n// | `--graupl-carousel-tab-active-border-color`| Border color for active tabs.                    | `var(--graupl-carousel-tab-hover-border-color)`                     |\n// | `--graupl-carousel-tab-disabled-border-color` | Border color for disabled tabs.                | `var(--graupl-theme-active--primary--200)`                          |\n// | `--graupl-carousel-tab-container-padding`  | Padding of the tab container.                    | `var(--graupl-spacer-3) var(--graupl-spacer-3)`                     |\n// | `--graupl-carousel-tab-container-gap`      | Gap inside the tab container.                    | `var(--graupl-spacer-3)`                                            |\n//\n// The following sass variables can be used to customize the generation of the carousel component:\n// | Variable                                    | Description                                             | Default Value                  |\n// | ------------------------------------------- | ------------------------------------------------------- | ------------------------------ |\n// | `$selector-base`                            | Selector base for the component.                        | `\".\"`                          |\n// | `$modifier-selector-base`                   | Selector base for component modifiers.                  | `\".\"`                          |\n// | `$generate-base-theme-map`                  | Flag to generate the base theme map.                    | `true`                         |\n// | `$themeable`                                | Flag to generate theme modifiers.                       | `false`                        |\n// | `$carousel-selector-base`                   | Selector base for the carousel container.               | `$selector-base`               |\n// | `$carousel-selector`                        | Selector for the carousel container.                    | `\"carousel\"`                   |\n// | `$carousel-theme-selector-base`             | Selector base for theme modifiers.                      | `\".\"`                          |\n// | `$carousel-theme-selector-prefix`           | Selector prefix for theme modifiers.                    | `\"\"`                           |\n// | `$carousel-control-container-selector-base` | Selector base for the control container.                | `$selector-base`               |\n// | `$carousel-control-container-selector`      | Selector for the control container.                     | `\"carousel-control-container\"` |\n// | `$carousel-control-selector-base`           | Selector base for controls.                             | `$selector-base`               |\n// | `$carousel-control-selector`                | Selector for controls.                                  | `\"carousel-control\"`           |\n// | `$carousel-pause-selector-base`             | Selector base for pause modifier.                       | `\".\"`                          |\n// | `$carousel-pause-selector`                  | Selector for pause modifier.                            | `\"pause\"`                      |\n// | `$carousel-play-selector-base`              | Selector base for play modifier.                        | `\".\"`                          |\n// | `$carousel-play-selector`                   | Selector for play modifier.                             | `\"play\"`                       |\n// | `$carousel-autoplay-selector-base`          | Selector base for autoplay modifier.                    | `\".\"`                          |\n// | `$carousel-autoplay-selector`               | Selector for autoplay modifier.                         | `\"autoplay\"`                   |\n// | `$carousel-previous-selector-base`          | Selector base for previous modifier.                    | `\".\"`                          |\n// | `$carousel-previous-selector`               | Selector for previous modifier.                         | `\"previous\"`                   |\n// | `$carousel-next-selector-base`              | Selector base for next modifier.                        | `\".\"`                          |\n// | `$carousel-next-selector`                   | Selector for next modifier.                             | `\"next\"`                       |\n// | `$carousel-item-container-selector-base`    | Selector base for item container.                       | `$selector-base`               |\n// | `$carousel-item-container-selector`         | Selector for item container.                            | `\"carousel-item-container\"`    |\n// | `$carousel-item-selector-base`              | Selector base for items.                                | `$selector-base`               |\n// | `$carousel-item-selector`                   | Selector for items.                                     | `\"carousel-item\"`              |\n// | `$carousel-tab-container-selector-base`     | Selector base for tab container.                        | `$selector-base`               |\n// | `$carousel-tab-container-selector`          | Selector for tab container.                             | `\"carousel-tab-container\"`     |\n// | `$carousel-tab-selector-base`               | Selector base for tabs.                                 | `$selector-base`               |\n// | `$carousel-tab-selector`                    | Selector for tabs.                                      | `\"carousel-tab\"`               |\n// | `$carousel-active-item-selector-base`       | Selector base for the active modifier.                  | `\".\"`                          |\n// | `$carousel-active-item-selector`            | Selector for the active modifier.                       | `\"active\"`                     |\n// | `$carousel-next-item-selector-base`         | Selector base for the next modifier.                    | `\".\"`                          |\n// | `$carousel-next-item-selector`              | Selector for the next modifier.                         | `\"next\"`                       |\n// | `$carousel-previous-item-selector-base`     | Selector base for the previous modifier.                | `\".\"`                          |\n// | `$carousel-previous-item-selector`          | Selector for the previous modifier.                     | `\"previous\"`                   |\n// | `$carousel-controls-height`                 | Height of the controls row.                             | `auto`                         |\n// | `$carousel-tabs-width`                      | Width of the tabs column.                               | `1fr`                          |\n// | `$carousel-tabs-height`                     | Height of the tabs row.                                 | `auto`                         |\n// | `$carousel-slide-height`                    | Height of the slide row.                                | `1fr`                          |\n// | `$carousel-item-max-width`                  | Max width of a carousel item.                           | `100%`                         |\n// | `$carousel-transition-duration`             | Duration used for slide transitions.                    | `500ms`                        |\n// | `$carousel-theme-mappings`                  | Map of properties/shades applied to all theme variants. | `()`                           |\n// | `$carousel-theme-map`                       | Expanded map of properties/colors/shades per variant.   | `()`                           |\n//\n// ## Using `$carousel-theme-mappings`\n//\n// `$carousel-theme-mappings` is a 1-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $carousel-theme-mappings: (\n//   border-color: 700,\n// )\n// ```\n//\n// This directly[1] maps to all carousel variants, telling them what shade to use for said property.\n// All carousel variants will use the following based on the example above:\n// - Primary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize _all_ carousel variants in the same way.\n//\n// For example, if you use the following map:\n// ```scss\n// $carousel-theme-mappings: (\n//   border-color: 500,\n// )\n// ```\n//\n// All carousel variants will use the following:\n// - Primary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--primary--500`,\n// - Secondary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--secondary--500`, and\n// - Tertiary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--tertiary--500`.\n//\n// [1] `$carousel-theme-mappings` gets parsed into a larger, more explicit map: `$carousel-theme-map`.\n//\n// Using `$carousel-theme-map`\n//\n// `$carousel-theme-map` is a multi-level map of properties, colors, and shade values.\n//\n// e.g.\n// ```scss\n// $carousel-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: primary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: tertiary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// This directly maps to all carousel variants, telling them what shade to use for said property.\n// The carousel variants will use the following based on the example above:\n// - Primary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize carousel variants individually.\n//\n// For example, if you use the following map:\n//\n// ```scss\n// $carousel-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// The carousel variants will use the following:\n// - Primary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--secondary--700`,\n// - Secondary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary carousels will have their `--graupl-carousel-border-color` property set to `--graupl-theme-active--secondary--700`.\n//\n// @example\n// <section class=\"carousel\">\n//   <div class=\"carousel-control-container\">\n//     <button class=\"carousel-control autoplay\" aria-label=\"Toggle autoplay\"></button>\n//     <button class=\"carousel-control previous\" aria-label=\"Previous slide\"></button>\n//     <button class=\"carousel-control next\" aria-label=\"Next slide\"></button>\n//   </div>\n//   <div class=\"carousel-tab-container\">\n//     <button class=\"carousel-tab\" aria-label=\"Slide 1\"></button>\n//     <button class=\"carousel-tab\" aria-label=\"Slide 2\"></button>\n//     <button class=\"carousel-tab\" aria-label=\"Slide 3\"></button>\n//   </div>\n//   <div class=\"carousel-item-container\">\n//     <div class=\"carousel-item active\">\n//       <div class=\"ratio sixteen-by-nine\">\n//         <img class=\"force-ratio\" src=\"https://picsum.photos/1400/600?random=1\" alt=\"Carousel slide 1\" />\n//       </div>\n//     </div>\n//     <div class=\"carousel-item\">\n//       <div class=\"ratio sixteen-by-nine\">\n//         <img class=\"force-ratio\" src=\"https://picsum.photos/1400/600?random=2\" alt=\"Carousel slide 2\" />\n//       </div>\n//     </div>\n//   </div>\n// </section>\n\n@use \"../../base/button/mixins\" as button-mixins;\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/state\";\n@use \"../../mixins/theme\";\n@use \"defaults\";\n@use \"variables\" as *;\n\n@include layer(base) {\n  // .carousel-control\n  #{defaults.$carousel-control-selector-base}#{defaults.$carousel-control-selector} {\n    @include button-mixins.apply-base;\n  }\n\n  // .carousel-tab\n  #{defaults.$carousel-tab-selector-base}#{defaults.$carousel-tab-selector} {\n    @include button-mixins.apply-base;\n  }\n}\n\n@include layer(component) {\n  // .carousel\n  #{defaults.$carousel-selector-base}#{defaults.$carousel-selector} {\n    display: grid;\n    position: relative;\n    grid-template-columns: [slide-start controls-start] auto [tabs-start] $carousel-tabs-width [tabs-end] auto [controls-end slide-end];\n    grid-template-rows: [slide-start controls-start] $carousel-controls-height [controls-end] $carousel-slide-height [tabs-start] $carousel-tabs-height [tabs-end slide-end];\n    isolation: isolate;\n    padding: $carousel-padding;\n\n    &[data-graupl-action=\"next\"] {\n      // .carousel-item\n      #{defaults.$carousel-item-selector-base}#{defaults.$carousel-item-selector} {\n        // &.carousel-previous-item\n        &#{defaults.$carousel-previous-item-selector-base}#{defaults.$carousel-previous-item-selector} {\n          transform: translateX(calc(-1 * $carousel-item-max-width));\n\n          // &.carousel-active-item\n          &#{defaults.$carousel-active-item-selector-base}#{defaults.$carousel-active-item-selector} {\n            transform: none;\n          }\n        }\n\n        // &.carousel-next-item\n        &#{defaults.$carousel-next-item-selector-base}#{defaults.$carousel-next-item-selector} {\n          transform: translateX($carousel-item-max-width);\n\n          // &.carousel-active-item\n          &#{defaults.$carousel-active-item-selector-base}#{defaults.$carousel-active-item-selector} {\n            transform: none;\n          }\n        }\n      }\n    }\n\n    &[data-graupl-action=\"previous\"] {\n      // .carousel-item\n      #{defaults.$carousel-item-selector-base}#{defaults.$carousel-item-selector} {\n        // &.carousel-previous-item\n        &#{defaults.$carousel-previous-item-selector-base}#{defaults.$carousel-previous-item-selector} {\n          transform: translateX($carousel-item-max-width);\n\n          // &.carousel-active-item\n          &#{defaults.$carousel-active-item-selector-base}#{defaults.$carousel-active-item-selector} {\n            transform: none;\n          }\n        }\n\n        // &.carousel-next-item\n        &#{defaults.$carousel-next-item-selector-base}#{defaults.$carousel-next-item-selector} {\n          transform: translateX(calc(-1 * $carousel-item-max-width));\n\n          // &.carousel-active-item\n          &#{defaults.$carousel-active-item-selector-base}#{defaults.$carousel-active-item-selector} {\n            transform: none;\n          }\n        }\n      }\n    }\n  }\n\n  // .carousel-control-container\n  #{defaults.$carousel-control-container-selector-base}#{defaults.$carousel-control-container-selector} {\n    display: grid;\n    z-index: 1;\n    grid-area: controls;\n    grid-template-columns:\n      [autoplay-start] $carousel-control-width [autoplay-end]\n      1fr [previous-start] $carousel-control-width [previous-end next-start]\n      $carousel-control-width [next-end];\n    grid-template-rows: [autoplay-start next-start previous-start] $carousel-control-height [previous-end next-end autoplay-end];\n    pointer-events: none;\n  }\n\n  // .carousel-control\n  #{defaults.$carousel-control-selector-base}#{defaults.$carousel-control-selector} {\n    pointer-events: auto;\n\n    // &.autoplay\n    &#{defaults.$carousel-autoplay-selector-base}#{defaults.$carousel-autoplay-selector} {\n      grid-area: autoplay;\n    }\n\n    // &.play::before\n    &#{defaults.$carousel-play-selector-base}#{defaults.$carousel-play-selector}::before {\n      content: $carousel-play-content;\n      display: inline-block;\n    }\n\n    // &.pause::before\n    &#{defaults.$carousel-pause-selector-base}#{defaults.$carousel-pause-selector}::before {\n      content: $carousel-pause-content;\n      display: inline-block;\n    }\n\n    // &.next\n    &#{defaults.$carousel-next-selector-base}#{defaults.$carousel-next-selector} {\n      grid-area: next;\n\n      &::before {\n        content: $carousel-next-content;\n        display: inline-block;\n      }\n    }\n\n    // &.previous\n    &#{defaults.$carousel-previous-selector-base}#{defaults.$carousel-previous-selector} {\n      grid-area: previous;\n\n      &::before {\n        content: $carousel-previous-content;\n        display: inline-block;\n      }\n    }\n  }\n\n  // .carousel-item-container\n  #{defaults.$carousel-item-container-selector-base}#{defaults.$carousel-item-container-selector} {\n    display: grid;\n    z-index: 0;\n    grid-area: slide;\n    grid-template-areas: \"items\";\n    padding: $carousel-item-container-padding;\n    overflow-x: hidden;\n    isolation: isolate;\n  }\n\n  // .carousel-item\n  #{defaults.$carousel-item-selector-base}#{defaults.$carousel-item-selector} {\n    z-index: -1;\n    grid-area: items;\n    max-width: $carousel-item-max-width;\n    opacity: 0;\n\n    // &.carousel-active-item\n    &#{defaults.$carousel-active-item-selector-base}#{defaults.$carousel-active-item-selector} {\n      z-index: 1;\n      transform: none;\n      transition: transform #{$carousel-transition-duration} ease-in-out;\n      opacity: 1;\n    }\n\n    // &.carousel-previous-item\n    &#{defaults.$carousel-previous-item-selector-base}#{defaults.$carousel-previous-item-selector} {\n      z-index: 1;\n      transform: translateX(calc(-1 * $carousel-item-max-width));\n      transition: transform #{$carousel-transition-duration} ease-in-out;\n      opacity: 1;\n\n      // &.carousel-active-item\n      &#{defaults.$carousel-active-item-selector-base}#{defaults.$carousel-active-item-selector} {\n        transform: none;\n      }\n    }\n\n    // &.carousel-next-item\n    &#{defaults.$carousel-next-item-selector-base}#{defaults.$carousel-next-item-selector} {\n      z-index: 1;\n      transform: translateX($carousel-item-max-width);\n      opacity: 1;\n\n      // &.carousel-active-item\n      &#{defaults.$carousel-active-item-selector-base}#{defaults.$carousel-active-item-selector} {\n        transform: none;\n      }\n    }\n  }\n\n  // .carousel-tab-container\n  #{defaults.$carousel-tab-container-selector-base}#{defaults.$carousel-tab-container-selector} {\n    display: flex;\n    z-index: 1;\n    grid-area: tabs;\n    justify-content: center;\n    padding: $carousel-tab-container-padding;\n    gap: $carousel-tab-container-gap;\n    pointer-events: none;\n  }\n\n  // .carousel-tab\n  #{defaults.$carousel-tab-selector-base}#{defaults.$carousel-tab-selector} {\n    --#{root-defaults.$prefix}button-border-radius: 50%;\n\n    pointer-events: auto;\n  }\n}\n\n@include layer(theme) {\n  // .carousel\n  #{defaults.$carousel-selector-base}#{defaults.$carousel-selector} {\n    @if root-defaults.$themeable-components and defaults.$themeable {\n      @include theme.generate-modifiers(\n        defaults.$carousel-theme-map,\n        defaults.$carousel-theme-selector-base,\n        defaults.$carousel-theme-selector-prefix,\n        \"carousel-\"\n      );\n      @include theme.generate-modifiers(\n        defaults.$carousel-theme-map,\n        defaults.$carousel-theme-selector-base,\n        defaults.$carousel-theme-selector-prefix,\n        \"carousel-\",\n        \"\"\n      );\n    }\n  }\n\n  // .carousel-control\n  #{defaults.$carousel-control-selector-base}#{defaults.$carousel-control-selector} {\n    @include button-mixins.apply-theme;\n\n    border-color: $carousel-control-border-color;\n    background: $carousel-control-background;\n    color: $carousel-control-color;\n\n    @include state.generate-modifiers(\n      (\n        border-color: $carousel-control-border-color-states,\n        color: $carousel-control-color-states,\n        background: $carousel-control-background-states,\n      )\n    );\n  }\n\n  // .carousel-tab\n  #{defaults.$carousel-tab-selector-base}#{defaults.$carousel-tab-selector} {\n    @include button-mixins.apply-theme;\n\n    border-color: $carousel-tab-border-color;\n    background: $carousel-tab-background;\n    color: $carousel-tab-color;\n\n    @include state.generate-modifiers(\n      (\n        border-color: $carousel-tab-border-color-states,\n        color: $carousel-tab-color-states,\n        background: $carousel-tab-background-states,\n      )\n    );\n  }\n}\n","// @graupl/core carousel component variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property                            | Default                                                                                         |\n// | ------------------------------------------ | ----------------------------------------------------------------------------------------------- |\n// | --graupl-carousel-controls-height          | auto                                                                                            |\n// | --graupl-carousel-tabs-width               | 1fr                                                                                             |\n// | --graupl-carousel-tabs-height              | auto                                                                                            |\n// | --graupl-carousel-slide-height             | 1fr                                                                                             |\n// | --graupl-carousel-padding-x                | var(--graupl-spacer-0)                                                                          |\n// | --graupl-carousel-padding-y                | var(--graupl-spacer-0)                                                                          |\n// | --graupl-carousel-padding                  | var(--graupl-carousel-padding-y) var(--graupl-carousel-padding-x)                               |\n// | --graupl-carousel-item-max-width           | 100%                                                                                            |\n// | --graupl-carousel-item-container-padding-x | var(--graupl-spacer-0)                                                                          |\n// | --graupl-carousel-item-container-padding-y | var(--graupl-spacer-0)                                                                          |\n// | --graupl-carousel-item-container-padding   | var(--graupl-carousel-item-container-padding-y) var(--graupl-carousel-item-container-padding-x) |\n// | --graupl-carousel-play-content             | \"'▶'\"                                                                                           |\n// | --graupl-carousel-pause-content            | \"'❚❚'\"                                                                                          |\n// | --graupl-carousel-next-content             | \"'▶'\"                                                                                           |\n// | --graupl-carousel-previous-content         | \"'◀'\"                                                                                           |\n// | --graupl-carousel-control-width            | 4rem                                                                                            |\n// | --graupl-carousel-control-height           | 3rem                                                                                            |\n// | --graupl-carousel-transition-duration      | 500ms                                                                                           |\n// | --graupl-carousel-tab-container-padding-x  | var(--graupl-spacer-3)                                                                          |\n// | --graupl-carousel-tab-container-padding-y  | var(--graupl-spacer-3)                                                                          |\n// | --graupl-carousel-tab-container-padding    | var(--graupl-carousel-tab-container-padding-y) var(--graupl-carousel-tab-container-padding-x)   |\n// | --graupl-carousel-tab-container-gap        | var(--graupl-spacer-3)                                                                          |\n// | --graupl-carousel-color                    | var(--graupl-color)                                                                             |\n// | --graupl-carousel-background               | var(--graupl-background)                                                                        |\n// | --graupl-carousel-border-color             | var(--graupl-border-color)                                                                      |\n// | --graupl-carousel-control-color            | var(--graupl-carousel-color)                                                                    |\n// | --graupl-carousel-control-visited-color    | var(--graupl-carousel-control-color)                                                            |\n// | --graupl-carousel-control-focus-color      | var(--graupl-carousel-control-color)                                                            |\n// | --graupl-carousel-control-hover-color      | var(--graupl-carousel-background)                                                               |\n// | --graupl-carousel-control-active-color     | var(--graupl-carousel-control-hover-color)                                                      |\n// | --graupl-carousel-control-disabled-color   | var(--graupl-theme-active--primary--200)                                                        |\n// | --graupl-carousel-control-background       | var(--graupl-carousel-background)                                                               |\n// | --graupl-carousel-control-visited-background | var(--graupl-carousel-control-background)                                                     |\n// | --graupl-carousel-control-focus-background | var(--graupl-carousel-control-background)                                                      |\n// | --graupl-carousel-control-hover-background | var(--graupl-carousel-color)                                                                   |\n// | --graupl-carousel-control-active-background | var(--graupl-carousel-control-hover-background)                                               |\n// | --graupl-carousel-control-disabled-background | var(--graupl-carousel-background)                                                             |\n// | --graupl-carousel-control-border-color     | var(--graupl-carousel-border-color)                                                             |\n// | --graupl-carousel-control-visited-border-color | var(--graupl-carousel-control-border-color)                                                  |\n// | --graupl-carousel-control-focus-border-color | var(--graupl-carousel-control-border-color)                                                  |\n// | --graupl-carousel-control-hover-border-color | var(--graupl-carousel-control-border-color)                                                  |\n// | --graupl-carousel-control-active-border-color | var(--graupl-carousel-control-hover-border-color)                                           |\n// | --graupl-carousel-control-disabled-border-color | var(--graupl-theme-active--primary--200)                                                   |\n// | --graupl-carousel-tab-color                 | var(--graupl-carousel-color)                                                                    |\n// | --graupl-carousel-tab-visited-color         | var(--graupl-carousel-tab-color)                                                                |\n// | --graupl-carousel-tab-focus-color           | var(--graupl-carousel-tab-color)                                                                |\n// | --graupl-carousel-tab-hover-color           | var(--graupl-carousel-background)                                                               |\n// | --graupl-carousel-tab-active-color          | var(--graupl-carousel-tab-hover-color)                                                          |\n// | --graupl-carousel-tab-disabled-color        | var(--graupl-theme-active--primary--200)                                                        |\n// | --graupl-carousel-tab-background            | var(--graupl-carousel-background)                                                               |\n// | --graupl-carousel-tab-visited-background    | var(--graupl-carousel-tab-background)                                                           |\n// | --graupl-carousel-tab-focus-background      | var(--graupl-carousel-tab-background)                                                           |\n// | --graupl-carousel-tab-hover-background      | var(--graupl-carousel-color)                                                                    |\n// | --graupl-carousel-tab-active-background     | var(--graupl-carousel-tab-hover-background)                                                     |\n// | --graupl-carousel-tab-disabled-background   | var(--graupl-carousel-background)                                                               |\n// | --graupl-carousel-tab-border-color          | var(--graupl-carousel-border-color)                                                             |\n// | --graupl-carousel-tab-visited-border-color  | var(--graupl-carousel-tab-border-color)                                                         |\n// | --graupl-carousel-tab-focus-border-color    | var(--graupl-carousel-tab-border-color)                                                         |\n// | --graupl-carousel-tab-hover-border-color    | var(--graupl-carousel-tab-border-color)                                                         |\n// | --graupl-carousel-tab-active-border-color   | var(--graupl-carousel-tab-hover-border-color)                                                   |\n// | --graupl-carousel-tab-disabled-border-color | var(--graupl-theme-active--primary--200)                                                        |\n\n@use \"defaults\";\n@use \"../../defaults\" as root-defaults;\n@use \"../../variables\" as root-variables;\n@use \"../../functions/theme\";\n@use \"../../theme/color/variables\" as color;\n@use \"../../base/button/variables\" as button-variables;\n@use \"sass:map\";\n\n// Carousel grid area properties.\n// --graupl-carousel-controls-height\n$carousel-controls-height: var(\n  --#{root-defaults.$prefix}carousel-controls-height,\n  #{defaults.$carousel-controls-height}\n);\n\n// --graupl-carousel-tabs-width\n$carousel-tabs-width: var(\n  --#{root-defaults.$prefix}carousel-tabs-width,\n  #{defaults.$carousel-tabs-width}\n);\n\n// --graupl-carousel-tabs-height\n$carousel-tabs-height: var(\n  --#{root-defaults.$prefix}carousel-tabs-height,\n  #{defaults.$carousel-tabs-height}\n);\n\n// --graupl-carousel-slide-height\n$carousel-slide-height: var(\n  --#{root-defaults.$prefix}carousel-slide-height,\n  #{defaults.$carousel-slide-height}\n);\n\n// Carousel color properties.\n// --graupl-carousel-color\n$carousel-color: var(--#{root-defaults.$prefix}carousel-color, #{color.$color});\n\n// --graupl-carousel-background\n$carousel-background: var(\n  --#{root-defaults.$prefix}carousel-background,\n  #{color.$background}\n);\n\n// --graupl-carousel-border-color\n$carousel-border-color: var(\n  --#{root-defaults.$prefix}carousel-border-color,\n  #{color.$border-color}\n);\n\n// Carousel properties.\n// --graupl-carousel-padding-x\n$carousel-padding-x: var(\n  --#{root-defaults.$prefix}carousel-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-carousel-padding-y\n$carousel-padding-y: var(\n  --#{root-defaults.$prefix}carousel-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-carousel-padding\n$carousel-padding: var(\n  --#{root-defaults.$prefix}carousel-padding,\n  #{$carousel-padding-y} #{$carousel-padding-x}\n);\n\n// Carousel slide properties.\n// --graupl-carousel-item-max-width\n$carousel-item-max-width: var(\n  --#{root-defaults.$prefix}carousel-item-max-width,\n  #{defaults.$carousel-item-max-width}\n);\n\n// --graupl-carousel-item-container-padding-x\n$carousel-item-container-padding-x: var(\n  --#{root-defaults.$prefix}carousel-item-container-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-carousel-item-container-padding-y\n$carousel-item-container-padding-y: var(\n  --#{root-defaults.$prefix}carousel-item-container-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-carousel-item-container-padding\n$carousel-item-container-padding: var(\n  --#{root-defaults.$prefix}carousel-item-container-padding,\n  #{$carousel-item-container-padding-y} #{$carousel-item-container-padding-x}\n);\n\n// Carousel control properties.\n// --graupl-carousel-control-color\n$carousel-control-color: var(\n  --#{root-defaults.$prefix}carousel-control-color,\n  #{$carousel-color}\n);\n\n// --graupl-carousel-control-visited-color\n$carousel-control-visited-color: var(\n  --#{root-defaults.$prefix}carousel-control-visited-color,\n  #{$carousel-control-color}\n);\n\n// --graupl-carousel-control-focus-color\n$carousel-control-focus-color: var(\n  --#{root-defaults.$prefix}carousel-control-focus-color,\n  #{$carousel-control-color}\n);\n\n// --graupl-carousel-control-hover-color\n$carousel-control-hover-color: var(\n  --#{root-defaults.$prefix}carousel-control-hover-color,\n  #{$carousel-background}\n);\n\n// --graupl-carousel-control-active-color\n$carousel-control-active-color: var(\n  --#{root-defaults.$prefix}carousel-control-active-color,\n  #{$carousel-control-hover-color}\n);\n\n// --graupl-carousel-control-disabled-color\n$carousel-control-disabled-color: var(\n  --#{root-defaults.$prefix}carousel-control-disabled-color,\n  #{theme.get(primary, 200)}\n);\n$carousel-control-color-states: (\n  default: $carousel-control-color,\n  visited: $carousel-control-visited-color,\n  focus: $carousel-control-focus-color,\n  hover: $carousel-control-hover-color,\n  active: $carousel-control-active-color,\n  disabled: $carousel-control-disabled-color,\n);\n\n// --graupl-carousel-control-background\n$carousel-control-background: var(\n  --#{root-defaults.$prefix}carousel-control-background,\n  #{$carousel-background}\n);\n\n// --graupl-carousel-control-visited-background\n$carousel-control-visited-background: var(\n  --#{root-defaults.$prefix}carousel-control-visited-background,\n  #{$carousel-control-background}\n);\n\n// --graupl-carousel-control-focus-background\n$carousel-control-focus-background: var(\n  --#{root-defaults.$prefix}carousel-control-focus-background,\n  #{$carousel-control-background}\n);\n\n// --graupl-carousel-control-hover-background\n$carousel-control-hover-background: var(\n  --#{root-defaults.$prefix}carousel-control-hover-background,\n  #{$carousel-color}\n);\n\n// --graupl-carousel-control-active-background\n$carousel-control-active-background: var(\n  --#{root-defaults.$prefix}carousel-control-active-background,\n  #{$carousel-control-hover-background}\n);\n\n// --graupl-carousel-control-disabled-background\n$carousel-control-disabled-background: var(\n  --#{root-defaults.$prefix}carousel-control-disabled-background,\n  #{$carousel-background}\n);\n$carousel-control-background-states: (\n  default: $carousel-control-background,\n  visited: $carousel-control-visited-background,\n  focus: $carousel-control-focus-background,\n  hover: $carousel-control-hover-background,\n  active: $carousel-control-active-background,\n  disabled: $carousel-control-disabled-background,\n);\n\n// --graupl-carousel-control-border-color\n$carousel-control-border-color: var(\n  --#{root-defaults.$prefix}carousel-control-border-color,\n  #{$carousel-border-color}\n);\n\n// --graupl-carousel-control-visited-border-color\n$carousel-control-visited-border-color: var(\n  --#{root-defaults.$prefix}carousel-control-visited-border-color,\n  #{$carousel-control-border-color}\n);\n\n// --graupl-carousel-control-focus-border-color\n$carousel-control-focus-border-color: var(\n  --#{root-defaults.$prefix}carousel-control-focus-border-color,\n  #{$carousel-control-border-color}\n);\n\n// --graupl-carousel-control-hover-border-color\n$carousel-control-hover-border-color: var(\n  --#{root-defaults.$prefix}carousel-control-hover-border-color,\n  #{$carousel-control-border-color}\n);\n\n// --graupl-carousel-control-active-border-color\n$carousel-control-active-border-color: var(\n  --#{root-defaults.$prefix}carousel-control-active-border-color,\n  #{$carousel-control-hover-border-color}\n);\n\n// --graupl-carousel-control-disabled-border-color\n$carousel-control-disabled-border-color: var(\n  --#{root-defaults.$prefix}carousel-control-disabled-border-color,\n  #{theme.get(primary, 200)}\n);\n$carousel-control-border-color-states: (\n  default: $carousel-control-border-color,\n  visited: $carousel-control-visited-border-color,\n  focus: $carousel-control-focus-border-color,\n  hover: $carousel-control-hover-border-color,\n  active: $carousel-control-active-border-color,\n  disabled: $carousel-control-disabled-border-color,\n);\n\n// --graupl-carousel-play-content\n$carousel-play-content: var(\n  --#{root-defaults.$prefix}carousel-play-content,\n  #{defaults.$carousel-play-content}\n);\n\n// --graupl-carousel-pause-content\n$carousel-pause-content: var(\n  --#{root-defaults.$prefix}carousel-pause-content,\n  #{defaults.$carousel-pause-content}\n);\n\n// --graupl-carousel-next-content\n$carousel-next-content: var(\n  --#{root-defaults.$prefix}carousel-next-content,\n  #{defaults.$carousel-next-content}\n);\n\n// --graupl-carousel-previous-content\n$carousel-previous-content: var(\n  --#{root-defaults.$prefix}carousel-previous-content,\n  #{defaults.$carousel-previous-content}\n);\n\n// --graupl-carousel-control-width\n$carousel-control-width: var(\n  --#{root-defaults.$prefix}carousel-control-width,\n  #{defaults.$carousel-control-width}\n);\n\n// --graupl-carousel-control-height\n$carousel-control-height: var(\n  --#{root-defaults.$prefix}carousel-control-height,\n  #{defaults.$carousel-control-height}\n);\n\n// Carousel transition properties.\n// --graupl-carousel-transition-duration\n$carousel-transition-duration: var(\n  --#{root-defaults.$prefix}carousel-transition-duration,\n  #{defaults.$carousel-transition-duration}\n);\n\n// Carousel tab properties.\n// --graupl-carousel-tab-color\n$carousel-tab-color: var(\n  --#{root-defaults.$prefix}carousel-tab-color,\n  #{$carousel-color}\n);\n\n// --graupl-carousel-tab-visited-color\n$carousel-tab-visited-color: var(\n  --#{root-defaults.$prefix}carousel-tab-visited-color,\n  #{$carousel-tab-color}\n);\n\n// --graupl-carousel-tab-focus-color\n$carousel-tab-focus-color: var(\n  --#{root-defaults.$prefix}carousel-tab-focus-color,\n  #{$carousel-tab-color}\n);\n\n// --graupl-carousel-tab-hover-color\n$carousel-tab-hover-color: var(\n  --#{root-defaults.$prefix}carousel-tab-hover-color,\n  #{$carousel-background}\n);\n\n// --graupl-carousel-tab-active-color\n$carousel-tab-active-color: var(\n  --#{root-defaults.$prefix}carousel-tab-active-color,\n  #{$carousel-tab-hover-color}\n);\n\n// --graupl-carousel-tab-disabled-color\n$carousel-tab-disabled-color: var(\n  --#{root-defaults.$prefix}carousel-tab-disabled-color,\n  #{theme.get(primary, 200)}\n);\n$carousel-tab-color-states: (\n  default: $carousel-tab-color,\n  visited: $carousel-tab-visited-color,\n  focus: $carousel-tab-focus-color,\n  hover: $carousel-tab-hover-color,\n  active: $carousel-tab-active-color,\n  disabled: $carousel-tab-disabled-color,\n);\n\n// --graupl-carousel-tab-background\n$carousel-tab-background: var(\n  --#{root-defaults.$prefix}carousel-tab-background,\n  #{$carousel-background}\n);\n\n// --graupl-carousel-tab-visited-background\n$carousel-tab-visited-background: var(\n  --#{root-defaults.$prefix}carousel-tab-visited-background,\n  #{$carousel-tab-background}\n);\n\n// --graupl-carousel-tab-focus-background\n$carousel-tab-focus-background: var(\n  --#{root-defaults.$prefix}carousel-tab-focus-background,\n  #{$carousel-tab-background}\n);\n\n// --graupl-carousel-tab-hover-background\n$carousel-tab-hover-background: var(\n  --#{root-defaults.$prefix}carousel-tab-hover-background,\n  #{$carousel-color}\n);\n\n// --graupl-carousel-tab-active-background\n$carousel-tab-active-background: var(\n  --#{root-defaults.$prefix}carousel-tab-active-background,\n  #{$carousel-tab-hover-background}\n);\n\n// --graupl-carousel-tab-disabled-background\n$carousel-tab-disabled-background: var(\n  --#{root-defaults.$prefix}carousel-tab-disabled-background,\n  #{$carousel-background}\n);\n$carousel-tab-background-states: (\n  default: $carousel-tab-background,\n  visited: $carousel-tab-visited-background,\n  focus: $carousel-tab-focus-background,\n  hover: $carousel-tab-hover-background,\n  active: $carousel-tab-active-background,\n  disabled: $carousel-tab-disabled-background,\n);\n\n// --graupl-carousel-tab-border-color\n$carousel-tab-border-color: var(\n  --#{root-defaults.$prefix}carousel-tab-border-color,\n  #{$carousel-border-color}\n);\n\n// --graupl-carousel-tab-visited-border-color\n$carousel-tab-visited-border-color: var(\n  --#{root-defaults.$prefix}carousel-tab-visited-border-color,\n  #{$carousel-tab-border-color}\n);\n\n// --graupl-carousel-tab-focus-border-color\n$carousel-tab-focus-border-color: var(\n  --#{root-defaults.$prefix}carousel-tab-focus-border-color,\n  #{$carousel-tab-border-color}\n);\n\n// --graupl-carousel-tab-hover-border-color\n$carousel-tab-hover-border-color: var(\n  --#{root-defaults.$prefix}carousel-tab-hover-border-color,\n  #{$carousel-tab-border-color}\n);\n\n// --graupl-carousel-tab-active-border-color\n$carousel-tab-active-border-color: var(\n  --#{root-defaults.$prefix}carousel-tab-active-border-color,\n  #{$carousel-tab-hover-border-color}\n);\n\n// --graupl-carousel-tab-disabled-border-color\n$carousel-tab-disabled-border-color: var(\n  --#{root-defaults.$prefix}carousel-tab-disabled-border-color,\n  #{theme.get(primary, 200)}\n);\n$carousel-tab-border-color-states: (\n  default: $carousel-tab-border-color,\n  visited: $carousel-tab-visited-border-color,\n  focus: $carousel-tab-focus-border-color,\n  hover: $carousel-tab-hover-border-color,\n  active: $carousel-tab-active-border-color,\n  disabled: $carousel-tab-disabled-border-color,\n);\n\n// --graupl-carousel-tab-container-padding-x\n$carousel-tab-container-padding-x: var(\n  --#{root-defaults.$prefix}carousel-tab-container-padding-x,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-carousel-tab-container-padding-y\n$carousel-tab-container-padding-y: var(\n  --#{root-defaults.$prefix}carousel-tab-container-padding-y,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-carousel-tab-container-padding\n$carousel-tab-container-padding: var(\n  --#{root-defaults.$prefix}carousel-tab-container-padding,\n  #{$carousel-tab-container-padding-y} #{$carousel-tab-container-padding-x}\n);\n\n// --graupl-carousel-tab-container-gap\n$carousel-tab-container-gap: var(\n  --#{root-defaults.$prefix}carousel-tab-container-gap,\n  #{map.get(root-variables.$spacers, 3)}\n);\n","// @graupl/core disclosure component base styles.\n//\n// This module provides the disclosure component styles, wiring together the\n// container, content panel, and toggle control layers.\n//\n// The disclosure component exposes CSS custom properties for display, block\n// sizing, opacity, and transitions so that the open, closed, and transitioning\n// states can be themed without rewriting the core selectors. The toggle control\n// shares the base button styles to keep interactive affordances consistent.\n//\n// The following selectors are generated by default:\n// - `.disclosure`: The disclosure root container that manages layout, overflow, and transitions.\n// - `.disclosure.hide`: A modifier that forces the disclosure container into the closed state.\n// - `.disclosure.transitioning`: A modifier that applies the transitioning state to the container.\n// - `.disclosure.show`: A modifier that forces the disclosure container into the open state.\n// - `.disclosure-content`: The disclosure content wrapper that receives padding and border styles.\n// - `.disclosure-toggle`: The disclosure toggle control that inherits the button base styles.\n//\n// The following custom properties can be used to customize the disclosure component:\n// - `--graupl-disclosure-background`: The disclosure container background color.\n// - `--graupl-disclosure-color`: The disclosure container text color.\n// - `--graupl-disclosure-content-border-color`: The disclosure content border color.\n// - `--graupl-disclosure-content-padding-x`: The horizontal padding for the disclosure content.\n// - `--graupl-disclosure-content-padding-y`: The vertical padding for the disclosure content.\n// - `--graupl-disclosure-content-padding`: The shorthand padding for the disclosure content (combines x and y padding).\n// - `--graupl-disclosure-show-display`: The display value applied when the disclosure is open.\n// - `--graupl-disclosure-hide-display`: The display value applied when the disclosure is hidden.\n// - `--graupl-disclosure-transitioning-display`: The display value applied while transitioning.\n// - `--graupl-disclosure-display`: The base display value applied to the disclosure container.\n// - `--graupl-disclosure-show-block-size`: The block-size value applied when the disclosure is open.\n// - `--graupl-disclosure-hide-block-size`: The block-size value applied when the disclosure is hidden.\n// - `--graupl-disclosure-transitioning-block-size`: The block-size value applied while transitioning.\n// - `--graupl-disclosure-block-size`: The base block-size value applied to the disclosure container.\n// - `--graupl-disclosure-show-opacity`: The opacity value applied when the disclosure is open.\n// - `--graupl-disclosure-hide-opacity`: The opacity value applied when the disclosure is hidden.\n// - `--graupl-disclosure-transitioning-opacity`: The opacity value applied while transitioning.\n// - `--graupl-disclosure-opacity`: The base opacity value applied to the disclosure container.\n// - `--graupl-disclosure-transition-duration`: The animation duration for disclosure transitions.\n// - `--graupl-disclosure-transition-timing-function`: The easing used for disclosure transitions.\n// - `--graupl-disclosure-transition`: The combined transition declaration for the disclosure container.\n// - `--graupl-disclosure-transition-reduced-motion`: The transition used when motion is reduced.\n// - `--graupl-disclosure-content-border-top-width`: The top border width for the disclosure content.\n// - `--graupl-disclosure-content-border-right-width`: The right border width for the disclosure content.\n// - `--graupl-disclosure-content-border-bottom-width`: The bottom border width for the disclosure content.\n// - `--graupl-disclosure-content-border-left-width`: The left border width for the disclosure content.\n// - `--graupl-disclosure-content-border-width`: The shorthand border width for the disclosure content (combines top, right, bottom, and left widths).\n// - `--graupl-disclosure-content-border-top-style`: The top border style for the disclosure content.\n// - `--graupl-disclosure-content-border-right-style`: The right border style for the disclosure content.\n// - `--graupl-disclosure-content-border-bottom-style`: The bottom border style for the disclosure content.\n// - `--graupl-disclosure-content-border-left-style`: The left border style for the disclosure content.\n// - `--graupl-disclosure-content-border-style`: The shorthand border style for the disclosure content (combines top, right, bottom, and left styles).\n// - `--graupl-disclosure-content-border-top-left-radius`: The top-left border radius for the content.\n// - `--graupl-disclosure-content-border-top-right-radius`: The top-right border radius for the content.\n// - `--graupl-disclosure-content-border-bottom-right-radius`: The bottom-right border radius for the content.\n// - `--graupl-disclosure-content-border-bottom-left-radius`: The bottom-left border radius for the content.\n// - `--graupl-disclosure-content-border-radius`: The shorthand border radius for the disclosure content (combines top-left, top-right, bottom-right, and bottom-left radii).\n// - `--graupl-disclosure-toggle-transform`: The transform applied to the toggle indicator.\n// - `--graupl-disclosure-toggle-open-transform`: The transform applied to the toggle when open.\n// - `--graupl-disclosure-toggle-content`: The string content inserted by the toggle pseudo-element.\n// - `--graupl-disclosure-toggle-transition`: The transition applied to the toggle indicator.\n// - `--graupl-disclosure-toggle-transition-reduced-motion`: The toggle transition when motion is reduced.\n//\n// The following Sass variables can be used to customize selectors and defaults:\n// - `$selector-base`: The selector base for the component.\n// - `$modifier-selector-base`: The selector base for component modifiers.\n// - `$disclosure-selector-base`: The selector base for disclosure containers.\n// - `$disclosure-selector`: The disclosure container selector.\n// - `$disclosure-content-selector-base`: The selector base for disclosure content.\n// - `$disclosure-content-selector`: The disclosure content selector.\n// - `$disclosure-toggle-selector-base`: The selector base for disclosure toggles.\n// - `$disclosure-toggle-selector`: The disclosure toggle selector.\n// - `$disclosure-open-selector-base`: The selector base applied to the open modifier.\n// - `$disclosure-open-selector`: The selector applied to the open modifier.\n// - `$disclosure-closed-selector-base`: The selector base applied to the closed modifier.\n// - `$disclosure-closed-selector`: The selector applied to the closed modifier.\n// - `$disclosure-transitioning-selector-base`: The selector base applied to the transitioning modifier.\n// - `$disclosure-transitioning-selector`: The selector applied to the transitioning modifier.\n// - `$disclosure-show-display`: The default display value for open disclosures.\n// - `$disclosure-hide-display`: The default display value for closed disclosures.\n// - `$disclosure-transitioning-display`: The default display value for transitioning disclosures.\n// - `$disclosure-show-block-size`: The default block-size value for open disclosures.\n// - `$disclosure-hide-block-size`: The default block-size value for closed disclosures.\n// - `$disclosure-transitioning-block-size`: The default block-size value for transitioning disclosures.\n// - `$disclosure-show-opacity`: The default opacity value for open disclosures.\n// - `$disclosure-hide-opacity`: The default opacity value for closed disclosures.\n// - `$disclosure-transitioning-opacity`: The default opacity value for transitioning disclosures.\n// - `$disclosure-toggle-content`: The default string inserted for the toggle indicator.\n// - `$disclosure-toggle-transform`: The default transform applied to the toggle indicator.\n// - `$disclosure-toggle-open-transform`: The transform applied to the toggle when the disclosure is open.\n//\n// @example\n// <button\n//   class=\"disclosure-toggle primary\"\n//   type=\"button\"\n//   aria-expanded=\"false\"\n//   aria-controls=\"disclosure-example\"\n//   data-graupl-disclosure-target=\"#disclosure-example\"\n// >\n//   Toggle details\n// </button>\n// <div id=\"disclosure-example\" class=\"disclosure\">\n//   <div class=\"disclosure-content\">\n//     <p>This content is hidden until the disclosure is open.</p>\n//   </div>\n// </div>\n//\n// @example\n// <button\n//   class=\"disclosure-toggle primary\"\n//   type=\"button\"\n//   aria-expanded=\"true\"\n//   aria-controls=\"disclosure-example-open\"\n//   data-graupl-disclosure-target=\"#disclosure-example-open\"\n// >\n//   Toggle details\n// </button>\n// <div id=\"disclosure-example-open\" class=\"disclosure show\">\n//   <div class=\"disclosure-content\">\n//     <p>This content is visible when the disclosure has the `.show` modifier.</p>\n//     <p><a href=\"#\">Links and inline content</a> keep their default styling.</p>\n//   </div>\n// </div>\n\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/animation\";\n@use \"../../defaults\" as root-defaults;\n@use \"defaults\";\n@use \"variables\" as *;\n@use \"../../base/button/mixins\" as button-mixins;\n\n@include layer(component) {\n  // .disclosure\n  #{defaults.$disclosure-selector-base}#{defaults.$disclosure-selector} {\n    display: $disclosure-display;\n    block-size: $disclosure-block-size;\n    overflow: hidden;\n    transition: $disclosure-transition;\n    opacity: $disclosure-opacity;\n\n    // &.hide\n    &#{defaults.$disclosure-closed-selector-base}#{defaults.$disclosure-closed-selector} {\n      --#{root-defaults.$prefix}disclosure-display: #{$disclosure-hide-display};\n      --#{root-defaults.$prefix}disclosure-block-size: #{$disclosure-hide-block-size};\n      --#{root-defaults.$prefix}disclosure-opacity: #{$disclosure-hide-opacity};\n    }\n\n    // &.transitioning\n    &#{defaults.$disclosure-transitioning-selector-base}#{defaults.$disclosure-transitioning-selector} {\n      --#{root-defaults.$prefix}disclosure-display: #{$disclosure-transitioning-display};\n      --#{root-defaults.$prefix}disclosure-block-size: #{$disclosure-transitioning-block-size};\n      --#{root-defaults.$prefix}disclosure-opacity: #{$disclosure-transitioning-opacity};\n    }\n\n    // &.show\n    &#{defaults.$disclosure-open-selector-base}#{defaults.$disclosure-open-selector} {\n      --#{root-defaults.$prefix}disclosure-display: #{$disclosure-show-display};\n      --#{root-defaults.$prefix}disclosure-block-size: #{$disclosure-show-block-size};\n      --#{root-defaults.$prefix}disclosure-opacity: #{$disclosure-show-opacity};\n    }\n  }\n\n  // .disclosure-content\n  #{defaults.$disclosure-content-selector-base}#{defaults.$disclosure-content-selector} {\n    flex: 1 1 auto;\n    padding: $disclosure-content-padding;\n    border-width: $disclosure-content-border-width;\n    border-style: $disclosure-content-border-style;\n    border-radius: $disclosure-content-border-radius;\n  }\n\n  // .disclosure-toggle.\n  #{defaults.$disclosure-toggle-selector-base}#{defaults.$disclosure-toggle-selector} {\n    @include button-mixins.apply-base;\n\n    &::after {\n      content: $disclosure-toggle-content;\n      display: block;\n      transform: $disclosure-toggle-transform;\n      transition: $disclosure-toggle-transition;\n    }\n\n    &[aria-expanded=\"true\"]::after {\n      --#{root-defaults.$prefix}disclosure-toggle-transform: #{$disclosure-toggle-open-transform};\n    }\n  }\n\n  @include animation.off {\n    #{defaults.$disclosure-selector-base}#{defaults.$disclosure-selector} {\n      --#{root-defaults.$prefix}disclosure-transition: #{$disclosure-transition-reduced-motion};\n    }\n\n    #{defaults.$disclosure-toggle-selector-base}#{defaults.$disclosure-toggle-selector} {\n      --#{root-defaults.$prefix}disclosure-toggle-transition: #{$disclosure-toggle-transition-reduced-motion};\n    }\n  }\n}\n\n@include layer(theme) {\n  // .disclosure\n  #{defaults.$disclosure-selector-base}#{defaults.$disclosure-selector} {\n    background: $disclosure-background;\n    color: $disclosure-color;\n  }\n\n  // .disclosure-content\n  #{defaults.$disclosure-content-selector-base}#{defaults.$disclosure-content-selector} {\n    border-color: $disclosure-content-border-color;\n  }\n\n  // .disclosure-toggle\n  #{defaults.$disclosure-toggle-selector-base}#{defaults.$disclosure-toggle-selector} {\n    @include button-mixins.apply-theme;\n  }\n}\n","// @graupl/core disclosure component variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property                                        | Default                                                                                                                                                                                                                                 |\n// | ------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-disclosure-color                              | var(--graupl-color)                                                                                                                                                                                                                     |\n// | --graupl-disclosure-background                         | var(--graupl-background)                                                                                                                                                                                                                |\n// | --graupl-disclosure-content-border-color               | var(--graupl-border-color)                                                                                                                                                                                                              |\n// | --graupl-disclosure-content-padding-x                  | var(--graupl-spacer-5)                                                                                                                                                                                                                  |\n// | --graupl-disclosure-content-padding-y                  | var(--graupl-spacer-5)                                                                                                                                                                                                                  |\n// | --graupl-disclosure-content-padding                    | var(--graupl-disclosure-content-padding-y) var(--graupl-disclosure-content-padding-x)                                                                                                                                                   |\n// | --graupl-disclosure-show-display                       | flex                                                                                                                                                                                                                                    |\n// | --graupl-disclosure-hide-display                       | flex                                                                                                                                                                                                                                    |\n// | --graupl-disclosure-transitioning-display              | flex                                                                                                                                                                                                                |\n// | --graupl-disclosure-display                            | flex                                                                                                                                                                                                                                    |\n// | --graupl-disclosure-show-block-size                    | 100%                                                                                                                                                                                                                                    |\n// | --graupl-disclosure-hide-block-size                    | 0                                                                                                                                                                                                                                       |\n// | --graupl-disclosure-transitioning-block-size           | 0                                                                                                                                                                                                             |\n// | --graupl-disclosure-block-size                         | 0                                                                                                                                                                                                                                       |\n// | --graupl-disclosure-show-opacity                       | 1                                                                                                                                                                                                                                       |\n// | --graupl-disclosure-hide-opacity                       | 0                                                                                                                                                                                                                                       |\n// | --graupl-disclosure-transitioning-opacity              | 0                                                                                                                                                                                                                |\n// | --graupl-disclosure-opacity                            | 0                                                                                                                                                                                                                                       |\n// | --graupl-disclosure-transition-duration                | var(--graupl-transition-duration-fast)                                                                                                                                                                                                  |\n// | --graupl-disclosure-transition-timing-function         | var(--graupl-transition-timing-function)                                                                                                                                                                                                |\n// | --graupl-disclosure-transition                         | opacity var(--graupl-disclosure-transition-duration) var(--graupl-disclosure-transition-timing-function), block-size var(--graupl-disclosure-transition-duration) var(--graupl-disclosure-transition-timing-function)                   |\n// | --graupl-disclosure-transition-reduced-motion          | opacity var(--graupl-disclosure-transition-duration) var(--graupl-disclosure-transition-timing-function)                                                                                                                                |\n// | --graupl-disclosure-content-border-top-width           | var(--graupl-border-top-width)                                                                                                                                                                                                          |\n// | --graupl-disclosure-content-border-right-width         | var(--graupl-border-right-width)                                                                                                                                                                                                        |\n// | --graupl-disclosure-content-border-bottom-width        | var(--graupl-border-bottom-width)                                                                                                                                                                                                       |\n// | --graupl-disclosure-content-border-left-width          | var(--graupl-border-left-width)                                                                                                                                                                                                         |\n// | --graupl-disclosure-content-border-width               | var(--graupl-disclosure-content-border-top-width) var(--graupl-disclosure-content-border-right-width) var(--graupl-disclosure-content-border-bottom-width) var(--graupl-disclosure-content-border-left-width)                           |\n// | --graupl-disclosure-content-border-top-style           | var(--graupl-border-top-style)                                                                                                                                                                                                          |\n// | --graupl-disclosure-content-border-right-style         | var(--graupl-border-right-style)                                                                                                                                                                                                        |\n// | --graupl-disclosure-content-border-bottom-style        | var(--graupl-border-bottom-style)                                                                                                                                                                                                       |\n// | --graupl-disclosure-content-border-left-style          | var(--graupl-border-left-style)                                                                                                                                                                                                         |\n// | --graupl-disclosure-content-border-style               | var(--graupl-disclosure-content-border-top-style) var(--graupl-disclosure-content-border-right-style) var(--graupl-disclosure-content-border-bottom-style) var(--graupl-disclosure-content-border-left-style)                           |\n// | --graupl-disclosure-content-border-top-left-radius     | var(--graupl-border-top-left-radius)                                                                                                                                                                                                    |\n// | --graupl-disclosure-content-border-top-right-radius    | var(--graupl-border-top-right-radius)                                                                                                                                                                                                   |\n// | --graupl-disclosure-content-border-bottom-right-radius | var(--graupl-border-bottom-right-radius)                                                                                                                                                                                                |\n// | --graupl-disclosure-content-border-bottom-left-radius  | var(--graupl-border-bottom-left-radius)                                                                                                                                                                                                 |\n// | --graupl-disclosure-content-border-radius              | var(--graupl-disclosure-content-border-top-left-radius) var(--graupl-disclosure-content-border-top-right-radius) var(--graupl-disclosure-content-border-bottom-right-radius) var(--graupl-disclosure-content-border-bottom-left-radius) |\n// | --graupl-disclosure-toggle-transform                   | rotate(0deg)                                                                                                                                                                                                                            |\n// | --graupl-disclosure-toggle-open-transform              | rotate(-180deg)                                                                                                                                                                                                                         |\n// | --graupl-disclosure-toggle-content                     | \"'↓'\"                                                                                                                                                                                                                                   |\n// | --graupl-disclosure-toggle-transition                  | transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)                                                                                                                                               |\n// | --graupl-disclosure-toggle-transition-reduced-motion   | none                                                                                                                                                                                                                                    |\n\n@use \"defaults\";\n@use \"../../defaults\" as root-defaults;\n@use \"../../variables\" as root-variables;\n@use \"../../theme/color/variables\" as color;\n@use \"sass:map\";\n\n// Color properties.\n// --graupl-disclosure-color\n$disclosure-color: var(\n  --#{root-defaults.$prefix}disclosure-color,\n  #{color.$color}\n);\n\n// --graupl-disclosure-background\n$disclosure-background: var(\n  --#{root-defaults.$prefix}disclosure-background,\n  #{color.$background}\n);\n\n// --graupl-disclosure-content-border-color\n$disclosure-content-border-color: var(\n  --#{root-defaults.$prefix}disclosure-content-border-color,\n  #{color.$border-color}\n);\n\n// Spacing properties.\n// --graupl-disclosure-content-padding-x\n$disclosure-content-padding-x: var(\n  --#{root-defaults.$prefix}disclosure-content-padding-x,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-disclosure-content-padding-y\n$disclosure-content-padding-y: var(\n  --#{root-defaults.$prefix}disclosure-content-padding-y,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-disclosure-content-padding\n$disclosure-content-padding: var(\n  --#{root-defaults.$prefix}disclosure-content-padding,\n  #{$disclosure-content-padding-y} #{$disclosure-content-padding-x}\n);\n\n// Display properties.\n// --graupl-disclosure-show-display\n$disclosure-show-display: var(\n  --#{root-defaults.$prefix}disclosure-show-display,\n  #{defaults.$disclosure-show-display}\n);\n\n// --graupl-disclosure-hide-display\n$disclosure-hide-display: var(\n  --#{root-defaults.$prefix}disclosure-hide-display,\n  #{defaults.$disclosure-hide-display}\n);\n\n// --graupl-disclosure-transitioning-display\n$disclosure-transitioning-display: var(\n  --#{root-defaults.$prefix}disclosure-transitioning-display,\n  #{defaults.$disclosure-transitioning-display}\n);\n\n// --graupl-disclosure-display\n$disclosure-display: var(\n  --#{root-defaults.$prefix}disclosure-display,\n  #{defaults.$disclosure-hide-display}\n);\n\n// Block-size properties.\n// --graupl-disclosure-show-block-size\n$disclosure-show-block-size: var(\n  --#{root-defaults.$prefix}disclosure-show-block-size,\n  #{defaults.$disclosure-show-block-size}\n);\n\n// --graupl-disclosure-hide-block-size\n$disclosure-hide-block-size: var(\n  --#{root-defaults.$prefix}disclosure-hide-block-size,\n  #{defaults.$disclosure-hide-block-size}\n);\n\n// --graupl-disclosure-transitioning-block-size\n$disclosure-transitioning-block-size: var(\n  --#{root-defaults.$prefix}disclosure-transitioning-block-size,\n  #{defaults.$disclosure-transitioning-block-size}\n);\n\n// --graupl-disclosure-block-size\n$disclosure-block-size: var(\n  --#{root-defaults.$prefix}disclosure-block-size,\n  #{defaults.$disclosure-hide-block-size}\n);\n\n// Opacity properties.\n// --graupl-disclosure-show-opacity\n$disclosure-show-opacity: var(\n  --#{root-defaults.$prefix}disclosure-show-opacity,\n  #{defaults.$disclosure-show-opacity}\n);\n\n// --graupl-disclosure-hide-opacity\n$disclosure-hide-opacity: var(\n  --#{root-defaults.$prefix}disclosure-hide-opacity,\n  #{defaults.$disclosure-hide-opacity}\n);\n\n// --graupl-disclosure-transitioning-opacity\n$disclosure-transitioning-opacity: var(\n  --#{root-defaults.$prefix}disclosure-transitioning-opacity,\n  #{defaults.$disclosure-transitioning-opacity}\n);\n\n// --graupl-disclosure-opacity\n$disclosure-opacity: var(\n  --#{root-defaults.$prefix}disclosure-opacity,\n  #{$disclosure-hide-opacity}\n);\n\n// Transition properties.\n// --graupl-disclosure-transition-duration\n$disclosure-transition-duration: var(\n  --#{root-defaults.$prefix}disclosure-transition-duration,\n  #{map.get(root-variables.$transition-durations, fast)}\n);\n\n// --graupl-disclosure-transition-timing-function\n$disclosure-transition-timing-function: var(\n  --#{root-defaults.$prefix}disclosure-transition-timing-function,\n  #{root-variables.$transition-timing-function}\n);\n\n// --graupl-disclosure-transition\n$disclosure-transition: var(\n  --#{root-defaults.$prefix}disclosure-transition,\n  opacity #{$disclosure-transition-duration}\n    #{$disclosure-transition-timing-function},\n  block-size #{$disclosure-transition-duration}\n    #{$disclosure-transition-timing-function}\n);\n\n// --graupl-disclosure-transition-reduced-motion\n$disclosure-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}disclosure-transition-reduced-motion,\n  opacity #{$disclosure-transition-duration}\n    #{$disclosure-transition-timing-function}\n);\n\n// Border properties.\n// --graupl-disclosure-content-border-top-width\n$disclosure-content-border-top-width: var(\n  --#{root-defaults.$prefix}disclosure-content-border-top-width,\n  #{root-variables.$border-top-width}\n);\n\n// --graupl-disclosure-content-border-right-width\n$disclosure-content-border-right-width: var(\n  --#{root-defaults.$prefix}disclosure-content-border-right-width,\n  #{root-variables.$border-right-width}\n);\n\n// --graupl-disclosure-content-border-bottom-width\n$disclosure-content-border-bottom-width: var(\n  --#{root-defaults.$prefix}disclosure-content-border-bottom-width,\n  #{root-variables.$border-bottom-width}\n);\n\n// --graupl-disclosure-content-border-left-width\n$disclosure-content-border-left-width: var(\n  --#{root-defaults.$prefix}disclosure-content-border-left-width,\n  #{root-variables.$border-left-width}\n);\n\n// --graupl-disclosure-content-border-width\n$disclosure-content-border-width: var(\n  --#{root-defaults.$prefix}disclosure-content-border-width,\n  #{$disclosure-content-border-top-width}\n    #{$disclosure-content-border-right-width}\n    #{$disclosure-content-border-bottom-width}\n    #{$disclosure-content-border-left-width}\n);\n\n// --graupl-disclosure-content-border-top-style\n$disclosure-content-border-top-style: var(\n  --#{root-defaults.$prefix}disclosure-content-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-disclosure-content-border-right-style\n$disclosure-content-border-right-style: var(\n  --#{root-defaults.$prefix}disclosure-content-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-disclosure-content-border-bottom-style\n$disclosure-content-border-bottom-style: var(\n  --#{root-defaults.$prefix}disclosure-content-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-disclosure-content-border-left-style\n$disclosure-content-border-left-style: var(\n  --#{root-defaults.$prefix}disclosure-content-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-disclosure-content-border-style\n$disclosure-content-border-style: var(\n  --#{root-defaults.$prefix}disclosure-content-border-style,\n  #{$disclosure-content-border-top-style}\n    #{$disclosure-content-border-right-style}\n    #{$disclosure-content-border-bottom-style}\n    #{$disclosure-content-border-left-style}\n);\n\n// --graupl-disclosure-content-border-top-left-radius\n$disclosure-content-border-top-left-radius: var(\n  --#{root-defaults.$prefix}disclosure-content-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-disclosure-content-border-top-right-radius\n$disclosure-content-border-top-right-radius: var(\n  --#{root-defaults.$prefix}disclosure-content-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-disclosure-content-border-bottom-right-radius\n$disclosure-content-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}disclosure-content-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-disclosure-content-border-bottom-left-radius\n$disclosure-content-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}disclosure-content-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-disclosure-content-border-radius\n$disclosure-content-border-radius: var(\n  --#{root-defaults.$prefix}disclosure-content-border-radius,\n  #{$disclosure-content-border-top-left-radius}\n    #{$disclosure-content-border-top-right-radius}\n    #{$disclosure-content-border-bottom-right-radius}\n    #{$disclosure-content-border-bottom-left-radius}\n);\n\n// Disclosure toggle properties.\n// --graupl-disclosure-toggle-transform\n$disclosure-toggle-transform: var(\n  --#{root-defaults.$prefix}disclosure-toggle-transform,\n  #{defaults.$disclosure-toggle-transform}\n);\n\n// --graupl-disclosure-toggle-open-transform\n$disclosure-toggle-open-transform: var(\n  --#{root-defaults.$prefix}disclosure-toggle-open-transform,\n  #{defaults.$disclosure-toggle-open-transform}\n);\n\n// --graupl-disclosure-toggle-content\n$disclosure-toggle-content: var(\n  --#{root-defaults.$prefix}disclosure-toggle-content,\n  #{defaults.$disclosure-toggle-content}\n);\n\n// --graupl-disclosure-toggle-transition\n$disclosure-toggle-transition: var(\n  --#{root-defaults.$prefix}disclosure-toggle-transition,\n  transform #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function}\n);\n\n// --graupl-disclosure-toggle-transition-reduced-motion\n$disclosure-toggle-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}disclosure-toggle-transition-reduced-motion,\n  none\n);\n","// @graupl/core input group component styles.\n//\n// This module provides grid-based alignment for labels, inputs, and help text.\n//\n// The following selectors are generated by default:\n// - `.input-group`: The input group container.\n// - `.help-text`: Inline help text element.\n// - `.inline`: Modifier to lay out label/input/help in a single row (when allowed).\n//\n// The following custom properties can be used to customize the input group component:\n// | Property                                            | Description                                   | Default Value                                                            |\n// | ---                                                 | ---                                           | ---                                                                      |\n// | `--graupl-input-group-grid-template-areas`          | Grid template areas for the default layout.   | `\"label\" \"input\" \"help\"`                                                 |\n// | `--graupl-input-group-grid-template-columns`        | Grid template columns for the default layout. | `100%`                                                                   |\n// | `--graupl-input-group-grid-template-rows`           | Grid template rows for the default layout.    | `auto auto auto`                                                         |\n// | `--graupl-input-group-row-gap`                      | Row gap between label/input/help.             | `var(--graupl-spacer-2)`                                                 |\n// | `--graupl-input-group-column-gap`                   | Column gap between label/input/help.          | `var(--graupl-spacer-3)`                                                 |\n// | `--graupl-input-group-gap`                          | Shorthand gap (row/column) for the group.     | `var(--graupl-input-group-row-gap) var(--graupl-input-group-column-gap)` |\n// | `--graupl-input-group-inline-grid-template-areas`   | Grid template areas for the inline layout.    | `\"label input\" \"- help\"`                                                 |\n// | `--graupl-input-group-inline-grid-template-columns` | Grid template columns for the inline layout.  | `auto 1fr`                                                               |\n// | `--graupl-input-group-inline-grid-template-rows`    | Grid template rows for the inline layout.     | `auto auto`                                                              |\n// | `--graupl-input-group-label-grid-area`              | Grid area name used by the label.             | `label`                                                                  |\n// | `--graupl-input-group-input-grid-area`              | Grid area name used by form controls.         | `input`                                                                  |\n// | `--graupl-input-group-help-grid-area`               | Grid area name used by help text.             | `help`                                                                   |\n//\n// The following sass variables can be used to customize the generation of the input group component:\n// | Variable                                    | Description                                  | Default Value    |\n// | ---                                         | ---                                          | ---              |\n// | `$selector-base`                            | Selector base for the component.             | `\".\"`            |\n// | `$modifier-selector-base`                   | Selector base for component modifiers.       | `\".\"`            |\n// | `$input-group-selector-base`                | Selector base for the input group container. | `$selector-base` |\n// | `$input-group-selector`                     | Selector for the input group container.      | `\"input-group\"`  |\n// | `$input-group-inline-selector-base`         | Selector base for the inline modifier.       | `\".\"`            |\n// | `$input-group-inline-selector`              | Selector for the inline modifier.            | `\"inline\"`       |\n// | `$input-group-help-text-selector-base`      | Selector base for the help text.             | `$selector-base` |\n// | `$input-group-help-text-selector`           | Selector for the help text.                  | `\"help-text\"`    |\n// | `$input-group-grid-label-name`              | Grid area name for labels.                   | `label`          |\n// | `$input-group-grid-input-name`              | Grid area name for inputs.                   | `input`          |\n// | `$input-group-grid-help-name`               | Grid area name for help text.                | `help`           |\n// | `$input-group-grid-template-columns`        | Default grid columns.                        | `100%`           |\n// | `$input-group-grid-template-rows`           | Default grid rows.                           | `auto auto auto` |\n// | `$input-group-inline-grid-template-columns` | Inline layout grid columns.                  | `auto 1fr`       |\n// | `$input-group-inline-grid-template-rows`    | Inline layout grid rows.                     | `auto auto`      |\n// | `$input-group-label-grid-area`              | Grid area value for labels.                  | `label`          |\n// | `$input-group-input-grid-area`              | Grid area value for inputs.                  | `input`          |\n// | `$input-group-help-grid-area`               | Grid area value for help text.               | `help`           |\n//\n// @example\n// <div class=\"input-group\">\n//   <label for=\"input-default\">Label</label>\n//   <input id=\"input-default\" type=\"text\" placeholder=\"Enter text\" />\n//   <span class=\"help-text\">Helpful hint</span>\n// </div>\n//\n// @example\n// <div class=\"input-group inline\">\n//   <label for=\"select-inline\">Label</label>\n//   <select id=\"select-inline\">\n//     <option value=\"1\">One</option>\n//     <option value=\"2\">Two</option>\n//   </select>\n//   <span class=\"help-text\">Inline help</span>\n// </div>\n\n@use \"defaults\";\n@use \"../../base/form/defaults\" as form-defaults;\n@use \"variables\" as *;\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/screen\";\n\n// stylelint-disable declaration-block-no-redundant-longhand-properties\n@include layer(component) {\n  // .input-group\n  #{defaults.$input-group-selector-base}#{defaults.$input-group-selector} {\n    display: grid;\n    grid-template-areas: $input-group-grid-template-areas;\n    grid-template-columns: $input-group-grid-template-columns;\n    grid-template-rows: $input-group-grid-template-rows;\n    align-items: center;\n    gap: $input-group-gap;\n\n    // label\n    #{form-defaults.$label-selector} {\n      grid-area: $input-group-label-grid-area;\n    }\n\n    // input, textarea, select\n    #{form-defaults.$input-selector},\n    #{form-defaults.$textarea-selector},\n    #{form-defaults.$select-selector} {\n      grid-area: $input-group-input-grid-area;\n    }\n\n    // .help-text\n    #{defaults.$input-group-help-text-selector-base}#{defaults.$input-group-help-text-selector} {\n      grid-area: $input-group-help-grid-area;\n    }\n\n    // &.inline\n    &#{defaults.$input-group-inline-selector-base}#{defaults.$input-group-inline-selector} {\n      grid-template-areas: $input-group-inline-grid-template-areas;\n      grid-template-columns: $input-group-inline-grid-template-columns;\n      grid-template-rows: $input-group-inline-grid-template-rows;\n    }\n  }\n\n  @include screen.down(xs) {\n    // .input-group.inline\n    #{defaults.$input-group-selector-base}#{defaults.$input-group-selector}#{defaults.$input-group-inline-selector-base}#{defaults.$input-group-inline-selector} {\n      grid-template-areas: $input-group-grid-template-areas;\n      grid-template-columns: $input-group-grid-template-columns;\n      grid-template-rows: $input-group-grid-template-rows;\n    }\n  }\n}\n","// @graupl/core input group component variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property                                   | Default                                                                |\n// | ------------------------------------------------- | ---------------------------------------------------------------------- |\n// | --graupl-input-group-grid-template-areas          | \"label\" \"input\" \"help\"                                                 |\n// | --graupl-input-group-grid-template-columns        | 100%                                                                   |\n// | --graupl-input-group-grid-template-rows           | auto auto auto                                                         |\n// | --graupl-input-group-row-gap                      | var(--graupl-spacer-2)                                                 |\n// | --graupl-input-group-column-gap                   | var(--graupl-spacer-3)                                                 |\n// | --graupl-input-group-gap                          | var(--graupl-input-group-row-gap) var(--graupl-input-group-column-gap) |\n// | --graupl-input-group-inline-grid-template-areas   | \"label input\" \"- help\"                                                 |\n// | --graupl-input-group-inline-grid-template-columns | auto 1fr                                                               |\n// | --graupl-input-group-inline-grid-template-rows    | auto auto                                                              |\n// | --graupl-input-group-label-grid-area              | label                                           |\n// | --graupl-input-group-input-grid-area              | input                                           |\n// | --graupl-input-group-help-grid-area               | help                                            |\n\n@use \"defaults\";\n@use \"../../defaults\" as root-defaults;\n@use \"../../variables\" as root-variables;\n@use \"sass:map\";\n\n// Input group properties.\n// --graupl-input-group-grid-template-areas\n$input-group-grid-template-areas: var(\n  --#{root-defaults.$prefix}input-group-grid-template-areas,\n  \"#{defaults.$input-group-grid-label-name}\"\n    \"#{defaults.$input-group-grid-input-name}\"\n    \"#{defaults.$input-group-grid-help-name}\"\n);\n\n// --graupl-input-group-grid-template-columns\n$input-group-grid-template-columns: var(\n  --#{root-defaults.$prefix}input-group-grid-template-columns,\n  #{defaults.$input-group-grid-template-columns}\n);\n\n// --graupl-input-group-grid-template-rows\n$input-group-grid-template-rows: var(\n  --#{root-defaults.$prefix}input-group-grid-template-rows,\n  #{defaults.$input-group-grid-template-rows}\n);\n\n// --graupl-input-group-row-gap\n$input-group-row-gap: var(\n  --#{root-defaults.$prefix}input-group-row-gap,\n  #{map.get(root-variables.$spacers, 2)}\n);\n\n// --graupl-input-group-column-gap\n$input-group-column-gap: var(\n  --#{root-defaults.$prefix}input-group-column-gap,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-input-group-gap\n$input-group-gap: var(\n  --#{root-defaults.$prefix}input-group-gap,\n  #{$input-group-row-gap} #{$input-group-column-gap}\n);\n\n// Inline input group properties.\n// --graupl-input-group-inline-grid-template-areas\n$input-group-inline-grid-template-areas: var(\n  --#{root-defaults.$prefix}input-group-inline-grid-template-areas,\n  \"#{defaults.$input-group-grid-label-name} #{defaults.$input-group-grid-input-name}\"\n    \"- #{defaults.$input-group-grid-help-name}\"\n);\n\n// --graupl-input-group-inline-grid-template-columns\n$input-group-inline-grid-template-columns: var(\n  --#{root-defaults.$prefix}input-group-inline-grid-template-columns,\n  #{defaults.$input-group-inline-grid-template-columns}\n);\n\n// --graupl-input-group-inline-grid-template-rows\n$input-group-inline-grid-template-rows: var(\n  --#{root-defaults.$prefix}input-group-inline-grid-template-rows,\n  #{defaults.$input-group-inline-grid-template-rows}\n);\n\n// Inner element properties.\n// --graupl-input-group-label-grid-area\n$input-group-label-grid-area: var(\n  --#{root-defaults.$prefix}input-group-label-grid-area,\n  #{defaults.$input-group-label-grid-area}\n);\n\n// --graupl-input-group-input-grid-area\n$input-group-input-grid-area: var(\n  --#{root-defaults.$prefix}input-group-input-grid-area,\n  #{defaults.$input-group-input-grid-area}\n);\n\n// --graupl-input-group-help-grid-area\n$input-group-help-grid-area: var(\n  --#{root-defaults.$prefix}input-group-help-grid-area,\n  #{defaults.$input-group-help-grid-area}\n);\n","// @graupl/core screen mixins.\n//\n// A series of mixins to generate breakpoints.\n\n// @use \"../defaults\" as root-defaults;\n@use \"../functions/screen\";\n@use \"../defaults\" as root-defaults;\n@use \"sass:map\";\n@use \"sass:meta\";\n\n// A mixin to generate a minimum screen width media query.\n@mixin up($size) {\n  $screen-size: screen.min($size);\n\n  @media screen and (#{$screen-size} <= width) {\n    @content;\n  }\n}\n\n// A mixin to generate a maximum screen width media query.\n@mixin down($size) {\n  $screen-size: screen.max($size);\n\n  @media screen and (width <= #{$screen-size}) {\n    @content;\n  }\n}\n\n// A mixin to generate a range of screen widths media query.\n@mixin between($min, $max) {\n  $screen-size: screen.range($min, $max);\n  $min: map.get($screen-size, \"min\");\n  $max: map.get($screen-size, \"max\");\n\n  @media screen and (#{$min} <= width <= #{$max}) {\n    @content;\n  }\n}\n\n@mixin only($size) {\n  @include between($size, $size) {\n    @content;\n  }\n}\n\n@mixin trigger($trigger) {\n  @if not map.has-key(root-defaults.$screen-size-triggers, $trigger) {\n    @error \"The screen size trigger \\\"#{$trigger}\\\" does not exist.\";\n  }\n\n  $screen-size-trigger: map.get(root-defaults.$screen-size-triggers, $trigger);\n\n  @if not map.has-key($screen-size-trigger, \"mixin\") {\n    @error \"The screen size trigger \\\"#{$trigger}\\\" does not have a mixin key.\";\n  }\n\n  @if not map.has-key($screen-size-trigger, \"args\") {\n    @error \"The screen size trigger \\\"#{$trigger}\\\" does not have an args key.\";\n  }\n\n  $mixin-name: map.get($screen-size-trigger, \"mixin\");\n  $mixin-args: map.get($screen-size-trigger, \"args\");\n\n  @if not meta.mixin-exists($mixin-name) {\n    @error \"The mixin \\\"#{$mixin-name}\\\" does not exist.\";\n  }\n\n  $mixin: meta.get-mixin($mixin-name);\n\n  @if meta.accepts-content($mixin) {\n    @include meta.apply($mixin, $mixin-args...) {\n      @content;\n    }\n  } @else {\n    @warn \"The mixin \\\"#{$mixin-name}\\\" does not accept content.\";\n  }\n}\n","// @graupl/core list component styles.\n//\n// This module provides the list component styles.\n//\n// The following selectors are generated by default:\n// - `.list`: The list container.\n// - `.list-item`: The list item.\n//\n// The following custom properties can be used to customize the list component:\n// | Property                                       | Description                                          | Default Value                                                                                                                                                 |\n// | ---------------------------------------------- | ---------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | `--graupl-list-padding-x`                      | Horizontal padding of the list.                      | `var(--graupl-spacer-0)`                                                                                                                                      |\n// | `--graupl-list-padding-y`                      | Vertical padding of the list.                        | `var(--graupl-spacer-0)`                                                                                                                                      |\n// | `--graupl-list-padding`                        | Shorthand padding of the list.                       | `var(--graupl-list-padding-y) var(--graupl-list-padding-x)`                                                                                                   |\n// | `--graupl-list-margin-x`                       | Horizontal margin of the list.                       | `var(--graupl-spacer-0)`                                                                                                                                      |\n// | `--graupl-list-margin-y`                       | Vertical margin of the list.                         | `var(--graupl-spacer-0)`                                                                                                                                      |\n// | `--graupl-list-margin`                         | Shorthand margin of the list.                        | `var(--graupl-list-margin-y) var(--graupl-list-margin-x)`                                                                                                     |\n// | `--graupl-list-gap`                            | Gap between list items (column/row).                 | `var(--graupl-list-column-gap) var(--graupl-list-row-gap)`                                                                                                    |\n// | `--graupl-list-background`                     | Background colour of the list.                       | `var(--graupl-background)`                                                                                                                                    |\n// | `--graupl-list-color`                          | Text colour of the list.                             | `var(--graupl-color)`                                                                                                                                         |\n// | `--graupl-list-border-width`                   | Border width of the list.                            | `0 0 0 0`                                                                                                                                                     |\n// | `--graupl-list-border-style`                   | Border style of the list.                            | `var(--graupl-border-top-style) var(--graupl-border-right-style) var(--graupl-border-bottom-style) var(--graupl-border-left-style)`                           |\n// | `--graupl-list-border-radius`                  | Border radius of the list.                           | `var(--graupl-border-top-left-radius) var(--graupl-border-top-right-radius) var(--graupl-border-bottom-right-radius) var(--graupl-border-bottom-left-radius)` |\n// | `--graupl-list-border-color`                   | Border colour of the list.                           | `var(--graupl-list-color)`                                                                                                                                    |\n// | `--graupl-list-item-padding`                   | Padding for a list item.                             | `var(--graupl-spacer-3) var(--graupl-spacer-5)`                                                                                                               |\n// | `--graupl-list-item-transition`                | Transition applied to list items.                    | `transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)`                                                                   |\n// | `--graupl-list-item-transition-reduced-motion` | Transition for items when reduced motion is enabled. | `none`                                                                                                                                                        |\n// | `--graupl-list-item-transform`                 | Base transform for list items.                       | `none`                                                                                                                                                        |\n// | `--graupl-list-item-hover-transform`           | Transform for hovered list items.                    | `none`                                                                                                                                                        |\n// | `--graupl-list-item-background`                | Background colour of list items.                     | `var(--graupl-background)`                                                                                                                                    |\n// | `--graupl-list-item-color`                     | Text colour of list items.                           | `var(--graupl-color)`                                                                                                                                         |\n// | `--graupl-list-item-border-width`              | Border width of list items.                          | `var(--graupl-border-top-width) var(--graupl-border-right-width) var(--graupl-border-bottom-width) var(--graupl-border-left-width)`                           |\n// | `--graupl-list-item-border-style`              | Border style of list items.                          | `var(--graupl-border-top-style) var(--graupl-border-right-style) var(--graupl-border-bottom-style) var(--graupl-border-left-style)`                           |\n// | `--graupl-list-item-border-radius`             | Border radius of list items.                         | `var(--graupl-border-top-left-radius) var(--graupl-border-top-right-radius) var(--graupl-border-bottom-right-radius) var(--graupl-border-bottom-left-radius)` |\n// | `--graupl-list-item-border-color`              | Border colour of list items.                         | `var(--graupl-list-item-color)`                                                                                                                               |\n//\n// The following sass variables can be used to customize the generation of the list component:\n// | Variable                     | Description                               | Default Value    |\n// | ---------------------------- | ----------------------------------------- | ---------------- |\n// | `$selector-base`             | Selector base for the component.          | `\".\"`            |\n// | `$modifier-selector-base`    | Selector base for component modifiers.    | `\".\"`            |\n// | `$generate-base-theme-map`   | Flag to generate the base theme map.      | `true`           |\n// | `$themeable`                 | Flag to generate theme modifiers.         | `false`          |\n// | `$list-selector-base`        | Selector base for the list container.     | `$selector-base` |\n// | `$list-selector`             | Selector for the list container.          | `\"list\"`         |\n// | `$list-theme-selector-base`  | Selector base for theme modifiers.        | `\".\"`            |\n// | `$list-theme-selector-prefix`| Selector prefix for theme modifiers.      | `\"\"`             |\n// | `$list-item-selector-base`   | Selector base for list items.             | `$selector-base` |\n// | `$list-item-selector`        | Selector for list items.                  | `\"list-item\"`    |\n// | `$list-item-transform`       | Base transform for list items.            | `none`           |\n// | `$list-item-hover-transform` | Hover transform for list items.           | `none`           |\n// | `$list-theme-mappings`       | Map of properties/shades for list themes. | `()`             |\n// | `$list-theme-map`            | Expanded map of properties/colors/shades. | `()`             |\n//\n// ## Using `$list-theme-mappings`\n//\n// `$list-theme-mappings` is a 1-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $list-theme-mappings: (\n//   color: 900,\n//   border-color: 700,\n// )\n// ```\n//\n// This directly[1] maps to all list variants, telling them what shade to use for the base colour slots.\n// All list variants will use the following based on the example above:\n// - Primary lists will have their `--graupl-list-color` property set to `--graupl-theme-active--primary--900` and `--graupl-list-border-color` to `--graupl-theme-active--primary--700`,\n// - Secondary lists will use the same shades for the secondary palette, and\n// - Tertiary lists will use the same shades for the tertiary palette.\n//\n// You can use this to customize _all_ list variants in the same way.\n//\n// For example, if you use the following map:\n// ```scss\n// $list-theme-mappings: (\n//   color: 500,\n//   item-color: 500,\n// )\n// ```\n//\n// All list variants will use the following:\n// - Primary lists will have their `--graupl-list-color` and `--graupl-list-item-color` properties set to `--graupl-theme-active--primary--500`,\n// - Secondary lists will have theirs set to `--graupl-theme-active--secondary--500`, and\n// - Tertiary lists will have theirs set to `--graupl-theme-active--tertiary--500`.\n//\n// [1] `$list-theme-mappings` gets parsed into a larger, more explicit map: `$list-theme-map`.\n//\n// Using `$list-theme-map`\n//\n// `$list-theme-map` is a multi-level map of properties, colors, and shade values.\n//\n// e.g.\n// ```scss\n// $list-theme-map: (\n//   primary: (\n//     item-border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     item-border-color: (\n//       color: secondary,\n//       shade: 500\n//     ),\n//   ),\n//   tertiary: (\n//     item-border-color: (\n//       color: tertiary,\n//       shade: 300\n//     ),\n//   ),\n// )\n// ```\n//\n// This directly maps to all list variants, telling them what shade to use for said property.\n// You can use this to customize list variants individually.\n//\n// @example\n// <ul class=\"list\">\n//   <li class=\"list-item\">First item</li>\n//   <li class=\"list-item\">Second item</li>\n//   <li class=\"list-item\">Third item</li>\n// </ul>\n//\n// @example\n// <ol class=\"list list-style-decimal list-style-inside\">\n//   <li class=\"list-item\">Numbered item one</li>\n//   <li class=\"list-item\">Numbered item two</li>\n//   <li class=\"list-item\">Numbered item three</li>\n// </ol>\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/animation\";\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/theme\" as theme;\n@use \"defaults\";\n@use \"sass:map\";\n@use \"variables\" as *;\n\n@include layer(component) {\n  // .list\n  #{defaults.$list-selector-base}#{defaults.$list-selector} {\n    display: grid;\n    position: relative;\n    margin: $list-margin;\n    padding: $list-padding;\n    border-width: $list-border-width;\n    border-style: $list-border-style;\n    border-radius: $list-border-radius;\n    list-style: none;\n    gap: $list-gap;\n  }\n\n  // .list-item\n  #{defaults.$list-item-selector-base}#{defaults.$list-item-selector} {\n    position: relative;\n    padding: $list-item-padding;\n    transform: $list-item-transform;\n    transition: $list-item-transition;\n    border-width: $list-item-border-width;\n    border-style: $list-item-border-style;\n    border-radius: $list-item-border-radius;\n\n    @each $selector in map.get(root-defaults.$state-selectors, hover) {\n      // e.g &:hover, &.hover\n      &#{$selector} {\n        --#{root-defaults.$prefix}list-item-transform: $list-item-hover-transform;\n      }\n    }\n  }\n}\n\n@include layer(theme) {\n  // .list\n  #{defaults.$list-selector-base}#{defaults.$list-selector} {\n    border-color: $list-border-color;\n    background: $list-background;\n    color: $list-color;\n\n    @if root-defaults.$themeable-components and defaults.$themeable {\n      @include theme.generate-modifiers(\n        defaults.$list-theme-map,\n        defaults.$list-theme-selector-base,\n        defaults.$list-theme-selector-prefix,\n        \"list-\"\n      );\n      @include theme.generate-modifiers(\n        defaults.$list-theme-map,\n        defaults.$list-theme-selector-base,\n        defaults.$list-theme-selector-prefix,\n        \"list-\",\n        \"\"\n      );\n    }\n  }\n\n  // .list-item\n  #{defaults.$list-item-selector-base}#{defaults.$list-item-selector} {\n    border-color: $list-item-border-color;\n    background: $list-item-background;\n    color: $list-item-color;\n  }\n}\n","// @graupl/core list component variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property                               | Default                                                                                                                                                                                             |\n// | --------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-list-padding-x                       | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-list-padding-y                       | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-list-padding                         | var(--graupl-list-padding-y) var(--graupl-list-padding-x)                                                                                                                                           |\n// | --graupl-list-margin-x                        | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-list-margin-y                        | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-list-margin                          | var(--graupl-list-margin-y) var(--graupl-list-margin-x)                                                                                                                                             |\n// | --graupl-list-column-gap                      | var(--graupl-spacer-2)                                                                                                                                                                              |\n// | --graupl-list-row-gap                         | var(--graupl-spacer-2)                                                                                                                                                                              |\n// | --graupl-list-gap                             | var(--graupl-list-column-gap) var(--graupl-list-row-gap)                                                                                                                                            |\n// | --graupl-list-background                      | var(--graupl-background)                                                                                                                                                                            |\n// | --graupl-list-color                           | var(--graupl-color)                                                                                                                                                                                 |\n// | --graupl-list-border-color                    | var(--graupl-list-color)                                                                                                                                                                            |\n// | --graupl-list-border-top-left-radius          | var(--graupl-border-top-left-radius)                                                                                                                                                                |\n// | --graupl-list-border-top-right-radius         | var(--graupl-border-top-right-radius)                                                                                                                                                               |\n// | --graupl-list-border-bottom-left-radius       | var(--graupl-border-bottom-left-radius)                                                                                                                                                             |\n// | --graupl-list-border-bottom-right-radius      | var(--graupl-border-bottom-right-radius)                                                                                                                                                            |\n// | --graupl-list-border-radius                   | var(--graupl-list-border-top-left-radius) var(--graupl-list-border-top-right-radius) var(--graupl-list-border-bottom-right-radius) var(--graupl-list-border-bottom-left-radius)                     |\n// | --graupl-list-border-top-width                | 0                                                                                                                                                                                                   |\n// | --graupl-list-border-right-width              | 0                                                                                                                                                                                                   |\n// | --graupl-list-border-bottom-width             | 0                                                                                                                                                                                                   |\n// | --graupl-list-border-left-width               | 0                                                                                                                                                                                                   |\n// | --graupl-list-border-width                    | var(--graupl-list-border-top-width) var(--graupl-list-border-right-width) var(--graupl-list-border-bottom-width) var(--graupl-list-border-left-width)                                               |\n// | --graupl-list-border-top-style                | var(--graupl-border-top-style)                                                                                                                                                                      |\n// | --graupl-list-border-right-style              | var(--graupl-border-right-style)                                                                                                                                                                    |\n// | --graupl-list-border-bottom-style             | var(--graupl-border-bottom-style)                                                                                                                                                                   |\n// | --graupl-list-border-left-style               | var(--graupl-border-left-style)                                                                                                                                                                     |\n// | --graupl-list-border-style                    | var(--graupl-list-border-top-style) var(--graupl-list-border-right-style) var(--graupl-list-border-bottom-style) var(--graupl-list-border-left-style)                                               |\n// | --graupl-list-item-padding-x                  | var(--graupl-spacer-5)                                                                                                                                                                              |\n// | --graupl-list-item-padding-y                  | var(--graupl-spacer-3)                                                                                                                                                                              |\n// | --graupl-list-item-padding                    | var(--graupl-list-item-padding-y) var(--graupl-list-item-padding-x)                                                                                                                                 |\n// | --graupl-list-item-transition                 | transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)                                                                                                           |\n// | --graupl-list-item-transition-reduced-motion  | none                                                                                                                                                                                                |\n// | --graupl-list-item-transform                  | none                                                                                                                                                                                                |\n// | --graupl-list-item-hover-transform            | none                                                                                                                                                                                |\n// | --graupl-list-item-background                 | var(--graupl-background)                                                                                                                                                                            |\n// | --graupl-list-item-color                      | var(--graupl-color)                                                                                                                                                                                 |\n// | --graupl-list-item-border-color               | var(--graupl-list-item-color)                                                                                                                                                                       |\n// | --graupl-list-item-border-top-left-radius     | var(--graupl-border-top-left-radius)                                                                                                                                                                |\n// | --graupl-list-item-border-top-right-radius    | var(--graupl-border-top-right-radius)                                                                                                                                                               |\n// | --graupl-list-item-border-bottom-left-radius  | var(--graupl-border-bottom-left-radius)                                                                                                                                                             |\n// | --graupl-list-item-border-bottom-right-radius | var(--graupl-border-bottom-right-radius)                                                                                                                                                            |\n// | --graupl-list-item-border-radius              | var(--graupl-list-item-border-top-left-radius) var(--graupl-list-item-border-top-right-radius) var(--graupl-list-item-border-bottom-right-radius) var(--graupl-list-item-border-bottom-left-radius) |\n// | --graupl-list-item-border-top-width           | var(--graupl-border-top-width)                                                                                                                                                                      |\n// | --graupl-list-item-border-right-width         | var(--graupl-border-right-width)                                                                                                                                                                    |\n// | --graupl-list-item-border-bottom-width        | var(--graupl-border-bottom-width)                                                                                                                                                                   |\n// | --graupl-list-item-border-left-width          | var(--graupl-border-left-width)                                                                                                                                                                     |\n// | --graupl-list-item-border-width               | var(--graupl-list-item-border-top-width) var(--graupl-list-item-border-right-width) var(--graupl-list-item-border-bottom-width) var(--graupl-list-item-border-left-width)                           |\n// | --graupl-list-item-border-top-style           | var(--graupl-border-top-style)                                                                                                                                                                      |\n// | --graupl-list-item-border-right-style         | var(--graupl-border-right-style)                                                                                                                                                                    |\n// | --graupl-list-item-border-bottom-style        | var(--graupl-border-bottom-style)                                                                                                                                                                   |\n// | --graupl-list-item-border-left-style          | var(--graupl-border-left-style)                                                                                                                                                                     |\n// | --graupl-list-item-border-style               | var(--graupl-list-item-border-top-style) var(--graupl-list-item-border-right-style) var(--graupl-list-item-border-bottom-style) var(--graupl-list-item-border-left-style)                           |\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../theme/color/variables\" as color;\n@use \"../../variables\" as root-variables;\n@use \"defaults\";\n@use \"sass:map\";\n\n// List properties.\n// --graupl-list-padding-x\n$list-padding-x: var(\n  --#{root-defaults.$prefix}list-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-list-padding-y\n$list-padding-y: var(\n  --#{root-defaults.$prefix}list-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-list-padding\n$list-padding: var(\n  --#{root-defaults.$prefix}list-padding,\n  #{$list-padding-y} #{$list-padding-x}\n);\n\n// --graupl-list-margin-x\n$list-margin-x: var(\n  --#{root-defaults.$prefix}list-margin-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-list-margin-y\n$list-margin-y: var(\n  --#{root-defaults.$prefix}list-margin-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-list-margin\n$list-margin: var(\n  --#{root-defaults.$prefix}list-margin,\n  #{$list-margin-y} #{$list-margin-x}\n);\n\n// List gap properties.\n// --graupl-list-column-gap\n$list-column-gap: var(\n  --#{root-defaults.$prefix}list-column-gap,\n  #{map.get(root-variables.$spacers, 2)}\n);\n\n// --graupl-list-row-gap\n$list-row-gap: var(\n  --#{root-defaults.$prefix}list-row-gap,\n  #{map.get(root-variables.$spacers, 2)}\n);\n\n// --graupl-list-gap\n$list-gap: var(\n  --#{root-defaults.$prefix}list-gap,\n  #{$list-column-gap} #{$list-row-gap}\n);\n\n// List color properties.\n// --graupl-list-background\n$list-background: var(\n  --#{root-defaults.$prefix}list-background,\n  #{color.$background}\n);\n\n// --graupl-list-color\n$list-color: var(--#{root-defaults.$prefix}list-color, #{color.$color});\n\n// List border-properties.\n// --graupl-list-border-color\n$list-border-color: var(\n  --#{root-defaults.$prefix}list-border-color,\n  #{$list-color}\n);\n\n// --graupl-list-border-top-left-radius\n$list-border-top-left-radius: var(\n  --#{root-defaults.$prefix}list-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-list-border-top-right-radius\n$list-border-top-right-radius: var(\n  --#{root-defaults.$prefix}list-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-list-border-bottom-left-radius\n$list-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}list-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-list-border-bottom-right-radius\n$list-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}list-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-list-border-radius\n$list-border-radius: var(\n  --#{root-defaults.$prefix}list-border-radius,\n  #{$list-border-top-left-radius} #{$list-border-top-right-radius}\n    #{$list-border-bottom-right-radius} #{$list-border-bottom-left-radius}\n);\n\n// --graupl-list-border-top-width\n$list-border-top-width: var(--#{root-defaults.$prefix}list-border-top-width, 0);\n\n// --graupl-list-border-right-width\n$list-border-right-width: var(\n  --#{root-defaults.$prefix}list-border-right-width,\n  0\n);\n\n// --graupl-list-border-bottom-width\n$list-border-bottom-width: var(\n  --#{root-defaults.$prefix}list-border-bottom-width,\n  0\n);\n\n// --graupl-list-border-left-width\n$list-border-left-width: var(\n  --#{root-defaults.$prefix}list-border-left-width,\n  0\n);\n\n// --graupl-list-border-width\n$list-border-width: var(\n  --#{root-defaults.$prefix}list-border-width,\n  #{$list-border-top-width} #{$list-border-right-width}\n    #{$list-border-bottom-width} #{$list-border-left-width}\n);\n\n// --graupl-list-border-top-style\n$list-border-top-style: var(\n  --#{root-defaults.$prefix}list-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-list-border-right-style\n$list-border-right-style: var(\n  --#{root-defaults.$prefix}list-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-list-border-bottom-style\n$list-border-bottom-style: var(\n  --#{root-defaults.$prefix}list-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-list-border-left-style\n$list-border-left-style: var(\n  --#{root-defaults.$prefix}list-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-list-border-style\n$list-border-style: var(\n  --#{root-defaults.$prefix}list-border-style,\n  #{$list-border-top-style} #{$list-border-right-style}\n    #{$list-border-bottom-style} #{$list-border-left-style}\n);\n\n// List item properties.\n// --graupl-list-item-padding-x\n$list-item-padding-x: var(\n  --#{root-defaults.$prefix}list-item-padding-x,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-list-item-padding-y\n$list-item-padding-y: var(\n  --#{root-defaults.$prefix}list-item-padding-y,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-list-item-padding\n$list-item-padding: var(\n  --#{root-defaults.$prefix}list-item-padding,\n  #{$list-item-padding-y} #{$list-item-padding-x}\n);\n\n// --graupl-list-item-transition\n$list-item-transition: var(\n  --#{root-defaults.$prefix}list-item-transition,\n  transform #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function}\n);\n\n// --graupl-list-item-transition-reduced-motion\n$list-item-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}list-item-transition-reduced-motion,\n  none\n);\n\n// List item transform properties.\n// --graupl-list-item-transform\n$list-item-transform: var(\n  --#{root-defaults.$prefix}list-item-transform,\n  #{defaults.$list-item-transform}\n);\n\n// --graupl-list-item-hover-transform\n$list-item-hover-transform: var(\n  --#{root-defaults.$prefix}list-item-hover-transform,\n  #{defaults.$list-item-hover-transform}\n);\n\n// List item color properties.\n// --graupl-list-item-background\n$list-item-background: var(\n  --#{root-defaults.$prefix}list-item-background,\n  #{color.$background}\n);\n\n// --graupl-list-item-color\n$list-item-color: var(\n  --#{root-defaults.$prefix}list-item-color,\n  #{color.$color}\n);\n\n// List item border-properties.\n// --graupl-list-item-border-color\n$list-item-border-color: var(\n  --#{root-defaults.$prefix}list-item-border-color,\n  #{$list-item-color}\n);\n\n// --graupl-list-item-border-top-left-radius\n$list-item-border-top-left-radius: var(\n  --#{root-defaults.$prefix}list-item-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-list-item-border-top-right-radius\n$list-item-border-top-right-radius: var(\n  --#{root-defaults.$prefix}list-item-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-list-item-border-bottom-left-radius\n$list-item-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}list-item-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-list-item-border-bottom-right-radius\n$list-item-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}list-item-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-list-item-border-radius\n$list-item-border-radius: var(\n  --#{root-defaults.$prefix}list-item-border-radius,\n  #{$list-item-border-top-left-radius} #{$list-item-border-top-right-radius}\n    #{$list-item-border-bottom-right-radius}\n    #{$list-item-border-bottom-left-radius}\n);\n\n// --graupl-list-item-border-top-width\n$list-item-border-top-width: var(\n  --#{root-defaults.$prefix}list-item-border-top-width,\n  #{root-variables.$border-top-width}\n);\n\n// --graupl-list-item-border-right-width\n$list-item-border-right-width: var(\n  --#{root-defaults.$prefix}list-item-border-right-width,\n  #{root-variables.$border-right-width}\n);\n\n// --graupl-list-item-border-bottom-width\n$list-item-border-bottom-width: var(\n  --#{root-defaults.$prefix}list-item-border-bottom-width,\n  #{root-variables.$border-bottom-width}\n);\n\n// --graupl-list-item-border-left-width\n$list-item-border-left-width: var(\n  --#{root-defaults.$prefix}list-item-border-left-width,\n  #{root-variables.$border-left-width}\n);\n\n// --graupl-list-item-border-width\n$list-item-border-width: var(\n  --#{root-defaults.$prefix}list-item-border-width,\n  #{$list-item-border-top-width} #{$list-item-border-right-width}\n    #{$list-item-border-bottom-width} #{$list-item-border-left-width}\n);\n\n// --graupl-list-item-border-top-style\n$list-item-border-top-style: var(\n  --#{root-defaults.$prefix}list-item-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-list-item-border-right-style\n$list-item-border-right-style: var(\n  --#{root-defaults.$prefix}list-item-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-list-item-border-bottom-style\n$list-item-border-bottom-style: var(\n  --#{root-defaults.$prefix}list-item-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-list-item-border-left-style\n$list-item-border-left-style: var(\n  --#{root-defaults.$prefix}list-item-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-list-item-border-style\n$list-item-border-style: var(\n  --#{root-defaults.$prefix}list-item-border-style,\n  #{$list-item-border-top-style} #{$list-item-border-right-style}\n    #{$list-item-border-bottom-style} #{$list-item-border-left-style}\n);\n","// @graupl/core menu component styles.\n//\n// This module provides the menu and submenu styles.\n//\n// The following selectors are generated by default:\n// - `.menu`: The menu container.\n// - `.submenu`: The submenu container.\n// - `.menu-item`: A menu item.\n// - `.menu-link`: The menu link inside a menu item.\n// - `.submenu-toggle`: The submenu toggle control.\n// - `.show`: Modifier applied when menus/submenus are shown.\n// - `.hide`: Modifier applied when menus/submenus are hidden.\n//\n// The following custom properties can be used to customize the menu component:\n// | Property                                                | Description                                        | Default Value                                                                                                                                                                                         |\n// | ------------------------------------------------------- | -------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | `--graupl-menu-flex-direction`                          | Flex direction of the root menu container.         | `row`                                                                                                                                                                                                 |\n// | `--graupl-menu-padding-x`                               | Horizontal padding inside the menu.                | `var(--graupl-spacer-0)`                                                                                                                                                                              |\n// | `--graupl-menu-padding-y`                               | Vertical padding inside the menu.                  | `var(--graupl-spacer-0)`                                                                                                                                                                              |\n// | `--graupl-menu-padding`                                 | Shorthand padding for the menu.                    | `var(--graupl-menu-padding-y) var(--graupl-menu-padding-x)`                                                                                                                                           |\n// | `--graupl-menu-column-gap`                              | Column gap between menu items.                     | `var(--graupl-spacer-0)`                                                                                                                                                                              |\n// | `--graupl-menu-row-gap`                                 | Row gap between menu rows.                         | `var(--graupl-spacer-0)`                                                                                                                                                                              |\n// | `--graupl-menu-gap`                                     | Shorthand gap between menu items.                  | `var(--graupl-menu-column-gap) var(--graupl-menu-row-gap)`                                                                                                                                            |\n// | `--graupl-menu-show-display`                            | Display value when the menu is shown.              | `flex`                                                                                                                                                                                                |\n// | `--graupl-menu-hide-display`                            | Display value when the menu is hidden.             | `none`                                                                                                                                                                                                |\n// | `--graupl-menu-display`                                 | Base display value for the menu.                   | `flex`                                                                                                                                                                                                |\n// | `--graupl-menu-background`                              | Background colour of the menu.                     | `var(--graupl-background)`                                                                                                                                                                            |\n// | `--graupl-menu-color`                                   | Text colour of the menu.                           | `var(--graupl-color)`                                                                                                                                                                                 |\n// | `--graupl-menu-border-color`                            | Border colour of the menu.                         | `var(--graupl-menu-color)`                                                                                                                                                                            |\n// | `--graupl-menu-border-top-left-radius`                  | Top-left border radius of the menu.                | `var(--graupl-border-top-left-radius)`                                                                                                                                                                |\n// | `--graupl-menu-border-top-right-radius`                 | Top-right border radius of the menu.               | `var(--graupl-border-top-right-radius)`                                                                                                                                                               |\n// | `--graupl-menu-border-bottom-right-radius`              | Bottom-right border radius of the menu.            | `var(--graupl-border-bottom-right-radius)`                                                                                                                                                            |\n// | `--graupl-menu-border-bottom-left-radius`               | Bottom-left border radius of the menu.             | `var(--graupl-border-bottom-left-radius)`                                                                                                                                                             |\n// | `--graupl-menu-border-radius`                           | Border radius shorthand for the menu.              | `var(--graupl-menu-border-top-left-radius) var(--graupl-menu-border-top-right-radius) var(--graupl-menu-border-bottom-right-radius) var(--graupl-menu-border-bottom-left-radius)`                     |\n// | `--graupl-menu-border-top-width`                        | Top border width of the menu.                      | `0`                                                                                                                                                                                                   |\n// | `--graupl-menu-border-right-width`                      | Right border width of the menu.                    | `0`                                                                                                                                                                                                   |\n// | `--graupl-menu-border-bottom-width`                     | Bottom border width of the menu.                   | `0`                                                                                                                                                                                                   |\n// | `--graupl-menu-border-left-width`                       | Left border width of the menu.                     | `0`                                                                                                                                                                                                   |\n// | `--graupl-menu-border-width`                            | Border width shorthand for the menu.               | `var(--graupl-menu-border-top-width) var(--graupl-menu-border-right-width) var(--graupl-menu-border-bottom-width) var(--graupl-menu-border-left-width)`                                               |\n// | `--graupl-menu-border-top-style`                        | Top border style of the menu.                      | `var(--graupl-border-top-style)`                                                                                                                                                                      |\n// | `--graupl-menu-border-right-style`                      | Right border style of the menu.                    | `var(--graupl-border-right-style)`                                                                                                                                                                    |\n// | `--graupl-menu-border-bottom-style`                     | Bottom border style of the menu.                   | `var(--graupl-border-bottom-style)`                                                                                                                                                                   |\n// | `--graupl-menu-border-left-style`                       | Left border style of the menu.                     | `var(--graupl-border-left-style)`                                                                                                                                                                     |\n// | `--graupl-menu-border-style`                            | Border style shorthand for the menu.               | `var(--graupl-menu-border-top-style) var(--graupl-menu-border-right-style) var(--graupl-menu-border-bottom-style) var(--graupl-menu-border-left-style)`                                               |\n// | `--graupl-submenu-flex-direction`                       | Flex direction of submenu lists.                   | `column`                                                                                                                                                                                              |\n// | `--graupl-submenu-z-index`                              | Z-index applied to submenu overlays.               | `2`                                                                                                                                                                                                   |\n// | `--graupl-submenu-padding-x`                            | Horizontal padding inside submenus.                | `var(--graupl-spacer-0)`                                                                                                                                                                              |\n// | `--graupl-submenu-padding-y`                            | Vertical padding inside submenus.                  | `var(--graupl-spacer-0)`                                                                                                                                                                              |\n// | `--graupl-submenu-padding`                              | Shorthand padding inside submenus.                 | `var(--graupl-submenu-padding-y) var(--graupl-submenu-padding-x)`                                                                                                                                     |\n// | `--graupl-submenu-column-gap`                           | Column gap inside submenus.                        | `var(--graupl-menu-column-gap)`                                                                                                                                                                       |\n// | `--graupl-submenu-row-gap`                              | Row gap inside submenus.                           | `var(--graupl-menu-row-gap)`                                                                                                                                                                          |\n// | `--graupl-submenu-gap`                                  | Shorthand gap inside submenus.                     | `var(--graupl-submenu-column-gap) var(--graupl-submenu-row-gap)`                                                                                                                                      |\n// | `--graupl-submenu-show-display`                         | Display value when a submenu is shown.             | `flex`                                                                                                                                                                                                |\n// | `--graupl-submenu-hide-display`                         | Display value when a submenu is hidden.            | `none`                                                                                                                                                                                                |\n// | `--graupl-submenu-display`                              | Base display value for submenus.                   | `none`                                                                                                                                                                                                |\n// | `--graupl-submenu-background`                           | Background colour of submenus.                     | `var(--graupl-menu-background)`                                                                                                                                                                       |\n// | `--graupl-submenu-color`                                | Text colour of submenus.                           | `var(--graupl-menu-color)`                                                                                                                                                                            |\n// | `--graupl-submenu-border-color`                         | Border colour of submenus.                         | `var(--graupl-menu-border-color)`                                                                                                                                                                     |\n// | `--graupl-submenu-border-top-left-radius`               | Top-left border radius of submenus.                | `var(--graupl-border-top-left-radius)`                                                                                                                                                                |\n// | `--graupl-submenu-border-top-right-radius`              | Top-right border radius of submenus.               | `var(--graupl-border-top-right-radius)`                                                                                                                                                               |\n// | `--graupl-submenu-border-bottom-right-radius`           | Bottom-right border radius of submenus.            | `var(--graupl-border-bottom-right-radius)`                                                                                                                                                            |\n// | `--graupl-submenu-border-bottom-left-radius`            | Bottom-left border radius of submenus.             | `var(--graupl-border-bottom-left-radius)`                                                                                                                                                             |\n// | `--graupl-submenu-border-radius`                        | Border radius shorthand for submenus.              | `var(--graupl-submenu-border-top-left-radius) var(--graupl-submenu-border-top-right-radius) var(--graupl-submenu-border-bottom-right-radius) var(--graupl-submenu-border-bottom-left-radius)`         |\n// | `--graupl-submenu-border-top-width`                     | Top border width of submenus.                      | `var(--graupl-border-top-width)`                                                                                                                                                                      |\n// | `--graupl-submenu-border-right-width`                   | Right border width of submenus.                    | `var(--graupl-border-right-width)`                                                                                                                                                                    |\n// | `--graupl-submenu-border-bottom-width`                  | Bottom border width of submenus.                   | `var(--graupl-border-bottom-width)`                                                                                                                                                                   |\n// | `--graupl-submenu-border-left-width`                    | Left border width of submenus.                     | `var(--graupl-border-left-width)`                                                                                                                                                                     |\n// | `--graupl-submenu-border-width`                         | Border width shorthand for submenus.               | `var(--graupl-submenu-border-top-width) var(--graupl-submenu-border-right-width) var(--graupl-submenu-border-bottom-width) var(--graupl-submenu-border-left-width)`                                   |\n// | `--graupl-submenu-border-top-style`                     | Top border style of submenus.                      | `var(--graupl-border-top-style)`                                                                                                                                                                      |\n// | `--graupl-submenu-border-right-style`                   | Right border style of submenus.                    | `var(--graupl-border-right-style)`                                                                                                                                                                    |\n// | `--graupl-submenu-border-bottom-style`                  | Bottom border style of submenus.                   | `var(--graupl-border-bottom-style)`                                                                                                                                                                   |\n// | `--graupl-submenu-border-left-style`                    | Left border style of submenus.                     | `var(--graupl-border-left-style)`                                                                                                                                                                     |\n// | `--graupl-submenu-border-style`                         | Border style shorthand for submenus.               | `var(--graupl-submenu-border-top-style) var(--graupl-submenu-border-right-style) var(--graupl-submenu-border-bottom-style) var(--graupl-submenu-border-left-style)`                                   |\n// | `--graupl-submenu-position`                             | Positioning mode applied to submenus.              | `absolute`                                                                                                                                                                                            |\n// | `--graupl-submenu-top`                                  | Top offset applied to submenus.                    | `100%`                                                                                                                                                                                                |\n// | `--graupl-submenu-right`                                | Right offset applied to submenus.                  | `auto`                                                                                                                                                                                                |\n// | `--graupl-submenu-bottom`                               | Bottom offset applied to submenus.                 | `auto`                                                                                                                                                                                                |\n// | `--graupl-submenu-left`                                 | Left offset applied to submenus.                   | `0`                                                                                                                                                                                                   |\n// | `--graupl-submenu-inset`                                | Inset shorthand applied to submenus.               | `var(--graupl-submenu-top) var(--graupl-submenu-right) var(--graupl-submenu-bottom) var(--graupl-submenu-left)`                                                                                       |\n// | `--graupl-menu-item-min-width`                          | Minimum width for menu items.                      | `min-content`                                                                                                                                                                                         |\n// | `--graupl-menu-item-max-width`                          | Maximum width for menu items.                      | `100%`                                                                                                                                                                                                |\n// | `--graupl-menu-item-padding-x`                          | Horizontal padding for menu items.                 | `var(--graupl-spacer-0)`                                                                                                                                                                              |\n// | `--graupl-menu-item-padding-y`                          | Vertical padding for menu items.                   | `var(--graupl-spacer-0)`                                                                                                                                                                              |\n// | `--graupl-menu-item-padding`                            | Shorthand padding for menu items.                  | `var(--graupl-menu-item-padding-y) var(--graupl-menu-item-padding-x)`                                                                                                                                 |\n// | `--graupl-submenu-item-width`                           | Width applied to submenu items.                    | `100%`                                                                                                                                                                                                |\n// | `--graupl-menu-link-padding-x`                          | Horizontal padding for menu links.                 | `var(--graupl-spacer-5)`                                                                                                                                                                              |\n// | `--graupl-menu-link-padding-y`                          | Vertical padding for menu links.                   | `var(--graupl-spacer-3)`                                                                                                                                                                              |\n// | `--graupl-menu-link-padding`                            | Shorthand padding for menu links.                  | `var(--graupl-menu-link-padding-y) var(--graupl-menu-link-padding-x)`                                                                                                                                 |\n// | `--graupl-menu-link-transition`                         | Transition used for menu link interactions.        | `background var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function), color var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)`                   |\n// | `--graupl-menu-link-transition-reduced-motion`          | Transition used when reduced motion is enabled.    | `background var(--graupl-transition-duration-none) var(--graupl-transition-timing-function), color var(--graupl-transition-duration-none) var(--graupl-transition-timing-function)`                   |\n// | `--graupl-menu-link-transform`                          | Base transform for menu links.                     | `none`                                                                                                                                                                                                |\n// | `--graupl-menu-link-visited-transform`                  | Transform for visited menu links.                  | `var(--graupl-menu-link-transform)`                                                                                                                                                                   |\n// | `--graupl-menu-link-focus-transform`                    | Transform for focused menu links.                  | `var(--graupl-menu-link-transform)`                                                                                                                                                                   |\n// | `--graupl-menu-link-hover-transform`                    | Transform for hovered menu links.                  | `none`                                                                                                                                                                                                |\n// | `--graupl-menu-link-active-transform`                   | Transform for active menu links.                   | `var(--graupl-menu-link-hover-transform)`                                                                                                                                                             |\n// | `--graupl-menu-link-disabled-transform`                 | Transform for disabled menu links.                 | `none`                                                                                                                                                                                                |\n// | `--graupl-menu-link-column-gap`                         | Column gap between menu link contents.             | `var(--graupl-menu-link-padding-x)`                                                                                                                                                                   |\n// | `--graupl-menu-link-row-gap`                            | Row gap between menu link contents.                | `var(--graupl-spacer-0)`                                                                                                                                                                              |\n// | `--graupl-menu-link-gap`                                | Shorthand gap between menu link contents.          | `var(--graupl-menu-link-column-gap) var(--graupl-menu-link-row-gap)`                                                                                                                                  |\n// | `--graupl-menu-link-background`                         | Background colour of menu links.                   | `var(--graupl-menu-background)`                                                                                                                                                                       |\n// | `--graupl-menu-link-visited-background`                 | Background colour of visited menu links.           | `var(--graupl-menu-link-background)`                                                                                                                                                                  |\n// | `--graupl-menu-link-focus-background`                   | Background colour of focused menu links.           | `var(--graupl-menu-link-background)`                                                                                                                                                                  |\n// | `--graupl-menu-link-hover-background`                   | Background colour of hovered menu links.           | `var(--graupl-menu-color)`                                                                                                                                                                            |\n// | `--graupl-menu-link-active-background`                  | Background colour of active menu links.            | `var(--graupl-menu-link-hover-background)`                                                                                                                                                            |\n// | `--graupl-menu-link-disabled-background`                | Background colour of disabled menu links.          | `var(--graupl-background)`                                                                                                                                                                            |\n// | `--graupl-menu-link-color`                              | Text colour of menu links.                         | `var(--graupl-menu-color)`                                                                                                                                                                            |\n// | `--graupl-menu-link-visited-color`                      | Text colour of visited menu links.                 | `var(--graupl-menu-link-color)`                                                                                                                                                                       |\n// | `--graupl-menu-link-focus-color`                        | Text colour of focused menu links.                 | `var(--graupl-menu-link-color)`                                                                                                                                                                       |\n// | `--graupl-menu-link-hover-color`                        | Text colour of hovered menu links.                 | `var(--graupl-menu-background)`                                                                                                                                                                       |\n// | `--graupl-menu-link-active-color`                       | Text colour of active menu links.                  | `var(--graupl-menu-link-hover-color)`                                                                                                                                                                 |\n// | `--graupl-menu-link-disabled-color`                     | Text colour of disabled menu links.                | `var(--graupl-theme-active--primary--200)`                                                                                                                                                            |\n// | `--graupl-menu-link-text-decoration`                    | Base text decoration for menu links.               | `none`                                                                                                                                                                                                |\n// | `--graupl-menu-link-visited-text-decoration`            | Text decoration for visited menu links.            | `var(--graupl-menu-link-text-decoration)`                                                                                                                                                             |\n// | `--graupl-menu-link-focus-text-decoration`              | Text decoration for focused menu links.            | `var(--graupl-menu-link-text-decoration)`                                                                                                                                                             |\n// | `--graupl-menu-link-hover-text-decoration`              | Text decoration for hovered menu links.            | `none`                                                                                                                                                                                                |\n// | `--graupl-menu-link-active-text-decoration`             | Text decoration for active menu links.             | `var(--graupl-menu-link-hover-text-decoration)`                                                                                                                                                       |\n// | `--graupl-menu-link-disabled-text-decoration`           | Text decoration for disabled menu links.           | `none`                                                                                                                                                                                                |\n// | `--graupl-menu-link-text-decoration-thickness`          | Base decoration thickness for menu links.          | `var(--graupl-border-width)`                                                                                                                                                                          |\n// | `--graupl-menu-link-visited-text-decoration-thickness`  | Decoration thickness for visited menu links.       | `var(--graupl-menu-link-text-decoration-thickness)`                                                                                                                                                   |\n// | `--graupl-menu-link-focus-text-decoration-thickness`    | Decoration thickness for focused menu links.       | `var(--graupl-menu-link-text-decoration-thickness)`                                                                                                                                                   |\n// | `--graupl-menu-link-hover-text-decoration-thickness`    | Decoration thickness for hovered menu links.       | `var(--graupl-border-width)`                                                                                                                                                                          |\n// | `--graupl-menu-link-active-text-decoration-thickness`   | Decoration thickness for active menu links.        | `var(--graupl-menu-link-hover-text-decoration-thickness)`                                                                                                                                             |\n// | `--graupl-menu-link-disabled-text-decoration-thickness` | Decoration thickness for disabled menu links.      | `var(--graupl-border-width)`                                                                                                                                                                          |\n// | `--graupl-menu-link-text-decoration-style`              | Base decoration style for menu links.              | `solid`                                                                                                                                                                                               |\n// | `--graupl-menu-link-visited-text-decoration-style`      | Decoration style for visited menu links.           | `var(--graupl-menu-link-text-decoration-style)`                                                                                                                                                       |\n// | `--graupl-menu-link-focus-text-decoration-style`        | Decoration style for focused menu links.           | `var(--graupl-menu-link-text-decoration-style)`                                                                                                                                                       |\n// | `--graupl-menu-link-hover-text-decoration-style`        | Decoration style for hovered menu links.           | `solid`                                                                                                                                                                                               |\n// | `--graupl-menu-link-active-text-decoration-style`       | Decoration style for active menu links.            | `var(--graupl-menu-link-hover-text-decoration-style)`                                                                                                                                                 |\n// | `--graupl-menu-link-disabled-text-decoration-style`     | Decoration style for disabled menu links.          | `solid`                                                                                                                                                                                               |\n// | `--graupl-menu-link-text-decoration-color`              | Base decoration colour for menu links.             | `var(--graupl-menu-link-color)`                                                                                                                                                                       |\n// | `--graupl-menu-link-visited-text-decoration-color`      | Decoration colour for visited menu links.          | `var(--graupl-menu-link-visited-color)`                                                                                                                                                               |\n// | `--graupl-menu-link-focus-text-decoration-color`        | Decoration colour for focused menu links.          | `var(--graupl-menu-link-focus-color)`                                                                                                                                                                 |\n// | `--graupl-menu-link-hover-text-decoration-color`        | Decoration colour for hovered menu links.          | `var(--graupl-menu-link-hover-color)`                                                                                                                                                                 |\n// | `--graupl-menu-link-active-text-decoration-color`       | Decoration colour for active menu links.           | `var(--graupl-menu-link-active-color)`                                                                                                                                                                |\n// | `--graupl-menu-link-disabled-text-decoration-color`     | Decoration colour for disabled menu links.         | `var(--graupl-menu-link-disabled-color)`                                                                                                                                                              |\n// | `--graupl-menu-link-border-top-left-radius`             | Top-left border radius of menu links.              | `var(--graupl-border-top-left-radius)`                                                                                                                                                                |\n// | `--graupl-menu-link-border-top-right-radius`            | Top-right border radius of menu links.             | `var(--graupl-border-top-right-radius)`                                                                                                                                                               |\n// | `--graupl-menu-link-border-bottom-right-radius`         | Bottom-right border radius of menu links.          | `var(--graupl-border-bottom-right-radius)`                                                                                                                                                            |\n// | `--graupl-menu-link-border-bottom-left-radius`          | Bottom-left border radius of menu links.           | `var(--graupl-border-bottom-left-radius)`                                                                                                                                                             |\n// | `--graupl-menu-link-border-radius`                      | Border radius shorthand for menu links.            | `var(--graupl-menu-link-border-top-left-radius) var(--graupl-menu-link-border-top-right-radius) var(--graupl-menu-link-border-bottom-right-radius) var(--graupl-menu-link-border-bottom-left-radius)` |\n// | `--graupl-menu-link-border-top-width`                   | Top border width of menu links.                    | `0`                                                                                                                                                                                                   |\n// | `--graupl-menu-link-border-right-width`                 | Right border width of menu links.                  | `0`                                                                                                                                                                                                   |\n// | `--graupl-menu-link-border-bottom-width`                | Bottom border width of menu links.                 | `0`                                                                                                                                                                                                   |\n// | `--graupl-menu-link-border-left-width`                  | Left border width of menu links.                   | `0`                                                                                                                                                                                                   |\n// | `--graupl-menu-link-border-width`                       | Border width shorthand for menu links.             | `var(--graupl-menu-link-border-top-width) var(--graupl-menu-link-border-right-width) var(--graupl-menu-link-border-bottom-width) var(--graupl-menu-link-border-left-width)`                           |\n// | `--graupl-menu-link-border-top-style`                   | Top border style of menu links.                    | `var(--graupl-border-top-style)`                                                                                                                                                                      |\n// | `--graupl-menu-link-border-right-style`                 | Right border style of menu links.                  | `var(--graupl-border-right-style)`                                                                                                                                                                    |\n// | `--graupl-menu-link-border-bottom-style`                | Bottom border style of menu links.                 | `var(--graupl-border-bottom-style)`                                                                                                                                                                   |\n// | `--graupl-menu-link-border-left-style`                  | Left border style of menu links.                   | `var(--graupl-border-left-style)`                                                                                                                                                                     |\n// | `--graupl-menu-link-border-style`                       | Border style shorthand for menu links.             | `var(--graupl-menu-link-border-top-style) var(--graupl-menu-link-border-right-style) var(--graupl-menu-link-border-bottom-style) var(--graupl-menu-link-border-left-style)`                           |\n// | `--graupl-menu-link-border-color`                       | Border colour of menu links.                       | `var(--graupl-menu-link-color)`                                                                                                                                                                       |\n// | `--graupl-menu-link-visited-border-color`               | Border colour of visited menu links.               | `var(--graupl-menu-link-border-color)`                                                                                                                                                                |\n// | `--graupl-menu-link-focus-border-color`                 | Border colour of focused menu links.               | `var(--graupl-menu-link-border-color)`                                                                                                                                                                |\n// | `--graupl-menu-link-hover-border-color`                 | Border colour of hovered menu links.               | `var(--graupl-menu-link-hover-color)`                                                                                                                                                                 |\n// | `--graupl-menu-link-active-border-color`                | Border colour of active menu links.                | `var(--graupl-menu-link-hover-border-color)`                                                                                                                                                          |\n// | `--graupl-menu-link-disabled-border-color`              | Border colour of disabled menu links.              | `var(--graupl-menu-link-disabled-color)`                                                                                                                                                              |\n// | `--graupl-submenu-toggle-transform`                     | Base transform for submenu toggles.                | `rotate(0deg)`                                                                                                                                                                                        |\n// | `--graupl-submenu-toggle-open-transform`                | Transform applied when a submenu is open.          | `rotate(-180deg)`                                                                                                                                                                                     |\n// | `--graupl-submenu-toggle-content`                       | Content string for submenu toggle pseudo-elements. | `'↓'`                                                                                                                                                                                                 |\n// | `--graupl-submenu-toggle-transition`                    | Transition applied to submenu toggles.             | `transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)`                                                                                                           |\n// | `--graupl-submenu-toggle-transition-reduced-motion`     | Transition used when reduced motion is enabled.    | `none`                                                                                                                                                                                                |\n//\n// The following sass variables can be used to customize the generation of the menu component:\n// | Variable                        | Description                                                          | Default Value             |\n// | ------------------------------- | -------------------------------------------------------------------- | ------------------------- |\n// | `$selector-base`                | Selector base for the component.                                     | `\".\"`                     |\n// | `$modifier-selector-base`       | Selector base for component modifiers.                               | `\".\"`                     |\n// | `$generate-base-theme-map`      | Flag to generate the base theme maps for menu variants.              | `true`                    |\n// | `$themeable`                    | Flag to generate theme modifiers.                                    | `false`                   |\n// | `$menu-selector-base`           | Selector base for the menu.                                          | `$selector-base`          |\n// | `$menu-selector`                | Selector for the menu.                                               | `\"menu\"`                  |\n// | `$menu-theme-selector-base`     | Selector base for menu theme modifiers.                              | `$modifier-selector-base` |\n// | `$menu-theme-selector-prefix`   | Selector prefix for menu theme modifiers.                            | `\"\"`                      |\n// | `$submenu-selector-base`        | Selector base for the submenu.                                       | `$selector-base`          |\n// | `$submenu-selector`             | Selector for the submenu.                                            | `\"submenu\"`               |\n// | `$menu-item-selector-base`      | Selector base for a menu item.                                       | `$selector-base`          |\n// | `$menu-item-selector`           | Selector for a menu item.                                            | `\"menu-item\"`             |\n// | `$menu-link-selector-base`      | Selector base for the menu link.                                     | `$selector-base`          |\n// | `$menu-link-selector`           | Selector for the menu link.                                          | `\"menu-link\"`             |\n// | `$submenu-toggle-selector-base` | Selector base for the submenu toggle.                                | `$selector-base`          |\n// | `$submenu-toggle-selector`      | Selector for the submenu toggle.                                     | `\"submenu-toggle\"`        |\n// | `$menu-show-selector-base`      | Selector base for the show modifier.                                 | `\".\"`                     |\n// | `$menu-show-selector`           | Selector for the show modifier.                                      | `\"show\"`                  |\n// | `$menu-hide-selector-base`      | Selector base for the hide modifier.                                 | `\".\"`                     |\n// | `$menu-hide-selector`           | Selector for the hide modifier.                                      | `\"hide\"`                  |\n// | `$menu-theme-mappings`          | A map of properties and shade values applied to menu theme variants. | `()`                      |\n// | `$menu-theme-map`               | A fully expanded property map used to generate menu theme modifiers. | `()`                      |\n//\n// ## Using `$menu-theme-mappings`\n//\n// `$menu-theme-mappings` is a single-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $menu-theme-mappings: (\n//   border-color: 700,\n// );\n// ```\n//\n// This directly[1] informs all menu theme variants what shade to use for each property key.\n// Based on the example above:\n// - Primary menus expose `--graupl-menu-border-color` as `var(--graupl-theme-active--primary--700)`,\n// - Secondary menus expose `--graupl-menu-border-color` as `var(--graupl-theme-active--secondary--700)`, and\n// - Tertiary menus expose `--graupl-menu-border-color` as `var(--graupl-theme-active--tertiary--700)`.\n//\n// You can pair multiple properties to customize all variants together.\n//\n// ```scss\n// $menu-theme-mappings: (\n//   color: 900,\n//   link-hover-background: 600,\n// );\n// ```\n//\n// - Primary menus use `--graupl-theme-active--primary--900` for `--graupl-menu-color` and `--graupl-theme-active--primary--600` for `--graupl-menu-link-hover-background`.\n// - Secondary menus use the same shades for `--graupl-menu-color` / `--graupl-menu-link-hover-background`, but sourced from the secondary palette.\n// - Tertiary menus follow suit with the tertiary palette.\n//\n// [1] `$menu-theme-mappings` gets parsed into a larger, more explicit map: `$menu-theme-map`.\n//\n// ## Using `$menu-theme-map`\n//\n// `$menu-theme-map` is a multi-level map of properties, colours, and shade values, allowing you to target each variant explicitly.\n//\n// e.g.\n// ```scss\n// $menu-theme-map: (\n//   primary: (\n//     link-hover-background: (\n//       color: primary,\n//       shade: 500,\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 600,\n//     ),\n//   ),\n// );\n// ```\n//\n// This example keeps default behaviour for unspecified variants/properties, while overriding the hover background for primary menus and the border colour for secondary menus.\n//\n// @example\n// <ul class=\"menu\">\n//   <li class=\"menu-item\"><a class=\"menu-link\" href=\"#\">Home</a></li>\n//   <li class=\"menu-item submenu-item\">\n//     <button class=\"menu-link button link submenu-toggle\" type=\"button\">About</button>\n//     <ul class=\"submenu\">\n//       <li class=\"menu-item\"><a class=\"menu-link\" href=\"#\">About Us</a></li>\n//       <li class=\"menu-item\"><a class=\"menu-link\" href=\"#\">Our Team</a></li>\n//       <li class=\"menu-item\"><a class=\"menu-link\" href=\"#\">Our Mission</a></li>\n//     </ul>\n//   </li>\n//   <li class=\"menu-item\"><a class=\"menu-link\" href=\"#\">Blog</a></li>\n//   <li class=\"menu-item\"><a class=\"menu-link button tertiary\" href=\"#\">Contact</a></li>\n// </ul>\n\n@use \"../../base/button/defaults\" as button-defaults;\n@use \"../../base/button/variables\" as button-variables;\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/animation\";\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/state\";\n@use \"../../mixins/theme\";\n@use \"defaults\";\n@use \"variables\" as *;\n\n@include layer(component) {\n  // .menu\n  #{defaults.$menu-selector-base}#{defaults.$menu-selector} {\n    --#{root-defaults.$prefix}link-padding: #{$menu-link-padding};\n    --#{root-defaults.$prefix}link-border-width: #{$menu-link-border-width};\n    --#{root-defaults.$prefix}link-border-radius: #{$menu-link-border-radius};\n    --#{root-defaults.$prefix}link-border-style: #{$menu-link-border-style};\n    --#{root-defaults.$prefix}link-text-decoration: #{$menu-link-text-decoration};\n    --#{root-defaults.$prefix}link-text-decoration-thickness: #{$menu-link-text-decoration-thickness};\n    --#{root-defaults.$prefix}link-text-decoration-style: #{$menu-link-text-decoration-style};\n    --#{root-defaults.$prefix}link-transform: #{$menu-link-transform};\n    --#{root-defaults.$prefix}link-visited-text-decoration: #{$menu-link-visited-text-decoration};\n    --#{root-defaults.$prefix}link-visited-text-decoration-thickness: #{$menu-link-visited-text-decoration-thickness};\n    --#{root-defaults.$prefix}link-visited-text-decoration-style: #{$menu-link-visited-text-decoration-style};\n    --#{root-defaults.$prefix}link-visited-transform: #{$menu-link-visited-transform};\n    --#{root-defaults.$prefix}link-focus-text-decoration: #{$menu-link-focus-text-decoration};\n    --#{root-defaults.$prefix}link-focus-text-decoration-thickness: #{$menu-link-focus-text-decoration-thickness};\n    --#{root-defaults.$prefix}link-focus-text-decoration-style: #{$menu-link-focus-text-decoration-style};\n    --#{root-defaults.$prefix}link-focus-transform: #{$menu-link-focus-transform};\n    --#{root-defaults.$prefix}link-hover-text-decoration: #{$menu-link-hover-text-decoration};\n    --#{root-defaults.$prefix}link-hover-text-decoration-thickness: #{$menu-link-hover-text-decoration-thickness};\n    --#{root-defaults.$prefix}link-hover-text-decoration-style: #{$menu-link-hover-text-decoration-style};\n    --#{root-defaults.$prefix}link-hover-transform: #{$menu-link-hover-transform};\n    --#{root-defaults.$prefix}link-active-text-decoration: #{$menu-link-active-text-decoration};\n    --#{root-defaults.$prefix}link-active-text-decoration-thickness: #{$menu-link-active-text-decoration-thickness};\n    --#{root-defaults.$prefix}link-active-text-decoration-style: #{$menu-link-active-text-decoration-style};\n    --#{root-defaults.$prefix}link-active-transform: #{$menu-link-active-transform};\n    --#{root-defaults.$prefix}link-disabled-text-decoration: #{$menu-link-disabled-text-decoration};\n    --#{root-defaults.$prefix}link-disabled-text-decoration-thickness: #{$menu-link-disabled-text-decoration-thickness};\n    --#{root-defaults.$prefix}link-disabled-text-decoration-style: #{$menu-link-disabled-text-decoration-style};\n    --#{root-defaults.$prefix}link-disabled-transform: #{$menu-link-disabled-transform};\n\n    display: $menu-display;\n    flex-direction: $menu-flex-direction;\n    padding: $menu-padding;\n    border-width: $menu-border-width;\n    border-style: $menu-border-style;\n    border-radius: $menu-border-radius;\n    list-style: none;\n    gap: $menu-gap;\n    isolation: isolate;\n\n    // &.show\n    &#{defaults.$menu-show-selector-base}#{defaults.$menu-show-selector} {\n      --#{root-defaults.$prefix}menu-display: #{$menu-show-display};\n    }\n\n    // &.hide\n    &#{defaults.$menu-hide-selector-base}#{defaults.$menu-hide-selector} {\n      --#{root-defaults.$prefix}menu-display: #{$menu-hide-display};\n    }\n  }\n\n  // .submenu\n  #{defaults.$submenu-selector-base}#{defaults.$submenu-selector} {\n    display: $submenu-display;\n    position: $submenu-position;\n    z-index: $submenu-z-index;\n    flex: 1 1;\n    flex-direction: $submenu-flex-direction;\n    padding: $submenu-padding;\n    border-width: $submenu-border-width;\n    border-style: $submenu-border-style;\n    border-radius: $submenu-border-radius;\n    list-style: none;\n    gap: $submenu-gap;\n    isolation: isolate;\n    inset: $submenu-inset;\n\n    // &.show\n    &#{defaults.$menu-show-selector-base}#{defaults.$menu-show-selector} {\n      --#{root-defaults.$prefix}submenu-display: #{$submenu-show-display};\n    }\n\n    // &.hide\n    &#{defaults.$menu-hide-selector-base}#{defaults.$menu-hide-selector} {\n      --#{root-defaults.$prefix}submenu-display: #{$submenu-hide-display};\n    }\n  }\n\n  // .menu-item\n  #{defaults.$menu-item-selector-base}#{defaults.$menu-item-selector} {\n    display: flex;\n    position: relative;\n    flex-wrap: wrap;\n    align-items: center;\n    justify-content: center;\n    min-width: $menu-item-min-width;\n    max-width: $menu-item-max-width;\n    padding: $menu-item-padding;\n  }\n\n  // .menu-link\n  #{defaults.$menu-link-selector-base}#{defaults.$menu-link-selector} {\n    display: flex;\n    width: 100%;\n    padding: $menu-link-padding;\n    transform: $menu-link-transform;\n    transition: $menu-link-transition;\n    border-width: $menu-link-border-width;\n    border-style: $menu-link-border-style;\n    border-radius: $menu-link-border-radius;\n    text-decoration: $menu-link-text-decoration;\n    text-decoration-style: $menu-link-text-decoration-style;\n    gap: $menu-link-gap;\n    text-decoration-thickness: $menu-link-text-decoration-thickness;\n\n    @include state.generate-modifiers(\n      (\n        text-decoration: $menu-link-text-decoration-states,\n        text-decoration-thickness: $menu-link-text-decoration-thickness-states,\n        text-decoration-style: $menu-link-text-decoration-style-states,\n        transform: $menu-link-transform-states,\n      )\n    );\n\n    // &.button\n    &#{button-defaults.$button-selector-base}#{button-defaults.$button-selector} {\n      --#{root-defaults.$prefix}menu-link-padding: #{button-variables.$button-padding};\n      --#{root-defaults.$prefix}menu-link-border-width: #{button-variables.$button-border-width};\n      --#{root-defaults.$prefix}menu-link-border-radius: #{button-variables.$button-border-radius};\n      --#{root-defaults.$prefix}menu-link-border-style: #{button-variables.$button-border-style};\n      --#{root-defaults.$prefix}menu-link-text-decoration: none;\n      --#{root-defaults.$prefix}menu-link-visited-text-decoration: none;\n      --#{root-defaults.$prefix}menu-link-focus-text-decoration: none;\n      --#{root-defaults.$prefix}menu-link-hover-text-decoration: none;\n      --#{root-defaults.$prefix}menu-link-active-text-decoration: none;\n      --#{root-defaults.$prefix}menu-link-disabled-text-decoration: none;\n      --#{root-defaults.$prefix}menu-link-transition: #{button-variables.$button-transition};\n      --#{root-defaults.$prefix}menu-link-transition-reduced-motion: #{button-variables.$button-transition-reduced-motion};\n      --#{root-defaults.$prefix}menu-link-transform: #{button-variables.$button-transform};\n      --#{root-defaults.$prefix}menu-link-visited-transform: #{button-variables.$button-visited-transform};\n      --#{root-defaults.$prefix}menu-link-focus-transform: #{button-variables.$button-focus-transform};\n      --#{root-defaults.$prefix}menu-link-hover-transform: #{button-variables.$button-hover-transform};\n      --#{root-defaults.$prefix}menu-link-active-transform: #{button-variables.$button-active-transform};\n      --#{root-defaults.$prefix}menu-link-disabled-transform: #{button-variables.$button-disabled-transform};\n    }\n  }\n\n  // .submenu-toggle\n  #{defaults.$submenu-toggle-selector-base}#{defaults.$submenu-toggle-selector} {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n\n    &::after {\n      content: $submenu-toggle-content;\n      display: block;\n      transform: $submenu-toggle-transform;\n      transition: $submenu-toggle-transition;\n    }\n\n    &[aria-expanded=\"true\"]::after {\n      --#{root-defaults.$prefix}submenu-toggle-transform: #{$submenu-toggle-open-transform};\n    }\n  }\n\n  @include animation.off {\n    // .menu-link\n    #{defaults.$menu-link-selector-base}#{defaults.$menu-link-selector} {\n      --#{root-defaults.$prefix}menu-link-transition: #{$menu-link-transition-reduced-motion};\n    }\n\n    // .submenu-toggle\n    #{defaults.$submenu-toggle-selector-base}#{defaults.$submenu-toggle-selector}::after {\n      --#{root-defaults.$prefix}submenu-toggle-transition: #{$submenu-toggle-transition-reduced-motion};\n    }\n  }\n}\n\n@include layer(theme) {\n  // .menu\n  #{defaults.$menu-selector-base}#{defaults.$menu-selector} {\n    --#{root-defaults.$prefix}link-color: #{$menu-link-color};\n    --#{root-defaults.$prefix}link-background: #{$menu-link-background};\n    --#{root-defaults.$prefix}link-border-color: #{$menu-link-border-color};\n    --#{root-defaults.$prefix}link-text-decoration-color: #{$menu-link-text-decoration-color};\n    --#{root-defaults.$prefix}link-visited-color: #{$menu-link-visited-color};\n    --#{root-defaults.$prefix}link-visited-background: #{$menu-link-visited-background};\n    --#{root-defaults.$prefix}link-visited-border-color: #{$menu-link-visited-border-color};\n    --#{root-defaults.$prefix}link-visited-text-decoration-color: #{$menu-link-visited-text-decoration-color};\n    --#{root-defaults.$prefix}link-focus-color: #{$menu-link-focus-color};\n    --#{root-defaults.$prefix}link-focus-background: #{$menu-link-focus-background};\n    --#{root-defaults.$prefix}link-focus-border-color: #{$menu-link-focus-border-color};\n    --#{root-defaults.$prefix}link-focus-text-decoration-color: #{$menu-link-focus-text-decoration-color};\n    --#{root-defaults.$prefix}link-hover-color: #{$menu-link-hover-color};\n    --#{root-defaults.$prefix}link-hover-background: #{$menu-link-hover-background};\n    --#{root-defaults.$prefix}link-hover-border-color: #{$menu-link-hover-border-color};\n    --#{root-defaults.$prefix}link-hover-text-decoration-color: #{$menu-link-hover-text-decoration-color};\n    --#{root-defaults.$prefix}link-active-color: #{$menu-link-active-color};\n    --#{root-defaults.$prefix}link-active-background: #{$menu-link-active-background};\n    --#{root-defaults.$prefix}link-active-border-color: #{$menu-link-active-border-color};\n    --#{root-defaults.$prefix}link-active-text-decoration-color: #{$menu-link-active-text-decoration-color};\n    --#{root-defaults.$prefix}link-disabled-color: #{$menu-link-disabled-color};\n    --#{root-defaults.$prefix}link-disabled-background: #{$menu-link-disabled-background};\n    --#{root-defaults.$prefix}link-disabled-border-color: #{$menu-link-disabled-border-color};\n    --#{root-defaults.$prefix}link-disabled-text-decoration-color: #{$menu-link-disabled-text-decoration-color};\n\n    border-color: $menu-border-color;\n    background: $menu-background;\n    color: $menu-color;\n\n    @if root-defaults.$themeable-components and defaults.$themeable {\n      @include theme.generate-modifiers(\n        defaults.$menu-theme-map,\n        defaults.$menu-theme-selector-base,\n        defaults.$menu-theme-selector-prefix,\n        \"menu-\"\n      );\n      @include theme.generate-modifiers(\n        defaults.$menu-theme-map,\n        defaults.$menu-theme-selector-base,\n        defaults.$menu-theme-selector-prefix,\n        \"menu-\",\n        \"\"\n      );\n    }\n  }\n\n  // .submenu\n  #{defaults.$submenu-selector-base}#{defaults.$submenu-selector} {\n    border-color: $submenu-border-color;\n    background: $submenu-background;\n    color: $submenu-color;\n  }\n\n  // .menu-link\n  #{defaults.$menu-link-selector-base}#{defaults.$menu-link-selector} {\n    border-color: $menu-link-border-color;\n    background: $menu-link-background;\n    color: $menu-link-color;\n    text-decoration-color: $menu-link-text-decoration-color;\n\n    @include state.generate-modifiers(\n      (\n        border-color: $menu-link-border-color-states,\n        background: $menu-link-background-states,\n        color: $menu-link-color-states,\n        text-decoration-color: $menu-link-text-decoration-color-states,\n      )\n    );\n\n    // .button\n    &#{button-defaults.$button-selector-base}#{button-defaults.$button-selector} {\n      --#{root-defaults.$prefix}menu-link-background: #{button-variables.$button-background};\n      --#{root-defaults.$prefix}menu-link-color: #{button-variables.$button-color};\n      --#{root-defaults.$prefix}menu-link-border-color: #{button-variables.$button-border-color};\n      --#{root-defaults.$prefix}menu-link-visited-background: #{button-variables.$button-visited-background};\n      --#{root-defaults.$prefix}menu-link-visited-color: #{button-variables.$button-visited-color};\n      --#{root-defaults.$prefix}menu-link-visited-border-color: #{button-variables.$button-visited-border-color};\n      --#{root-defaults.$prefix}menu-link-focus-background: #{button-variables.$button-focus-background};\n      --#{root-defaults.$prefix}menu-link-focus-color: #{button-variables.$button-focus-color};\n      --#{root-defaults.$prefix}menu-link-focus-border-color: #{button-variables.$button-focus-border-color};\n      --#{root-defaults.$prefix}menu-link-hover-background: #{button-variables.$button-hover-background};\n      --#{root-defaults.$prefix}menu-link-hover-color: #{button-variables.$button-hover-color};\n      --#{root-defaults.$prefix}menu-link-hover-border-color: #{button-variables.$button-hover-border-color};\n      --#{root-defaults.$prefix}menu-link-active-background: #{button-variables.$button-active-background};\n      --#{root-defaults.$prefix}menu-link-active-color: #{button-variables.$button-active-color};\n      --#{root-defaults.$prefix}menu-link-active-border-color: #{button-variables.$button-active-border-color};\n      --#{root-defaults.$prefix}menu-link-disabled-background: #{button-variables.$button-disabled-background};\n      --#{root-defaults.$prefix}menu-link-disabled-color: #{button-variables.$button-disabled-color};\n      --#{root-defaults.$prefix}menu-link-disabled-border-color: #{button-variables.$button-disabled-border-color};\n    }\n  }\n}\n","// @graupl/core menu component variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property                                       | Default                                                                                                                                                                                             |\n// | ----------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-menu-flex-direction                          | row                                                                                                                                                                                                 |\n// | --graupl-menu-padding-x                               | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-menu-padding-y                               | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-menu-padding                                 | var(--graupl-menu-padding-y) var(--graupl-menu-padding-x)                                                                                                                                           |\n// | --graupl-menu-column-gap                              | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-menu-row-gap                                 | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-menu-gap                                     | var(--graupl-menu-column-gap) var(--graupl-menu-row-gap)                                                                                                                                            |\n// | --graupl-menu-show-display                            | flex                                                                                                                                                                                                |\n// | --graupl-menu-hide-display                            | none                                                                                                                                                                                                |\n// | --graupl-menu-display                                 | flex                                                                                                                                                                                                |\n// | --graupl-menu-background                              | var(--graupl-background)                                                                                                                                                                            |\n// | --graupl-menu-color                                   | var(--graupl-color)                                                                                                                                                                                 |\n// | --graupl-menu-border-color                            | var(--graupl-menu-color)                                                                                                                                                                            |\n// | --graupl-menu-border-top-left-radius                  | var(--graupl-border-top-left-radius)                                                                                                                                                                |\n// | --graupl-menu-border-top-right-radius                 | var(--graupl-border-top-right-radius)                                                                                                                                                               |\n// | --graupl-menu-border-bottom-left-radius               | var(--graupl-border-bottom-left-radius)                                                                                                                                                             |\n// | --graupl-menu-border-bottom-right-radius              | var(--graupl-border-bottom-right-radius)                                                                                                                                                            |\n// | --graupl-menu-border-radius                           | var(--graupl-menu-border-top-left-radius) var(--graupl-menu-border-top-right-radius) var(--graupl-menu-border-bottom-right-radius) var(--graupl-menu-border-bottom-left-radius)                     |\n// | --graupl-menu-border-top-width                        | 0                                                                                                                                                                                                   |\n// | --graupl-menu-border-right-width                      | 0                                                                                                                                                                                                   |\n// | --graupl-menu-border-bottom-width                     | 0                                                                                                                                                                                                   |\n// | --graupl-menu-border-left-width                       | 0                                                                                                                                                                                                   |\n// | --graupl-menu-border-width                            | var(--graupl-menu-border-top-width) var(--graupl-menu-border-right-width) var(--graupl-menu-border-bottom-width) var(--graupl-menu-border-left-width)                                               |\n// | --graupl-menu-border-top-style                        | var(--graupl-border-top-style)                                                                                                                                                                      |\n// | --graupl-menu-border-right-style                      | var(--graupl-border-right-style)                                                                                                                                                                    |\n// | --graupl-menu-border-bottom-style                     | var(--graupl-border-bottom-style)                                                                                                                                                                   |\n// | --graupl-menu-border-left-style                       | var(--graupl-border-left-style)                                                                                                                                                                     |\n// | --graupl-menu-border-style                            | var(--graupl-menu-border-top-style) var(--graupl-menu-border-right-style) var(--graupl-menu-border-bottom-style) var(--graupl-menu-border-left-style)                                               |\n// | --graupl-submenu-flex-direction                       | column                                                                                                                                                                                              |\n// | --graupl-submenu-z-index                              | 2                                                                                                                                                                                                   |\n// | --graupl-submenu-padding-x                            | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-submenu-padding-y                            | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-submenu-padding                              | var(--graupl-submenu-padding-y) var(--graupl-submenu-padding-x)                                                                                                                                     |\n// | --graupl-submenu-column-gap                           | var(--graupl-menu-column-gap)                                                                                                                                                                       |\n// | --graupl-submenu-row-gap                              | var(--graupl-menu-row-gap)                                                                                                                                                                          |\n// | --graupl-submenu-gap                                  | var(--graupl-submenu-column-gap) var(--graupl-submenu-row-gap)                                                                                                                                      |\n// | --graupl-submenu-show-display                         | flex                                                                                                                                                                                                |\n// | --graupl-submenu-hide-display                         | none                                                                                                                                                                                                |\n// | --graupl-submenu-display                              | none                                                                                                                                                                                                |\n// | --graupl-submenu-background                           | var(--graupl-menu-background)                                                                                                                                                                       |\n// | --graupl-submenu-color                                | var(--graupl-menu-color)                                                                                                                                                                            |\n// | --graupl-submenu-border-color                         | var(--graupl-menu-border-color)                                                                                                                                                                     |\n// | --graupl-submenu-border-top-left-radius               | var(--graupl-border-top-left-radius)                                                                                                                                                                |\n// | --graupl-submenu-border-top-right-radius              | var(--graupl-border-top-right-radius)                                                                                                                                                               |\n// | --graupl-submenu-border-bottom-left-radius            | var(--graupl-border-bottom-left-radius)                                                                                                                                                             |\n// | --graupl-submenu-border-bottom-right-radius           | var(--graupl-border-bottom-right-radius)                                                                                                                                                            |\n// | --graupl-submenu-border-radius                        | var(--graupl-submenu-border-top-left-radius) var(--graupl-submenu-border-top-right-radius) var(--graupl-submenu-border-bottom-right-radius) var(--graupl-submenu-border-bottom-left-radius)         |\n// | --graupl-submenu-border-top-width                     | var(--graupl-border-top-width)                                                                                                                                                                      |\n// | --graupl-submenu-border-right-width                   | var(--graupl-border-right-width)                                                                                                                                                                    |\n// | --graupl-submenu-border-bottom-width                  | var(--graupl-border-bottom-width)                                                                                                                                                                   |\n// | --graupl-submenu-border-left-width                    | var(--graupl-border-left-width)                                                                                                                                                                     |\n// | --graupl-submenu-border-width                         | var(--graupl-submenu-border-top-width) var(--graupl-submenu-border-right-width) var(--graupl-submenu-border-bottom-width) var(--graupl-submenu-border-left-width)                                   |\n// | --graupl-submenu-border-top-style                     | var(--graupl-border-top-style)                                                                                                                                                                      |\n// | --graupl-submenu-border-right-style                   | var(--graupl-border-right-style)                                                                                                                                                                    |\n// | --graupl-submenu-border-bottom-style                  | var(--graupl-border-bottom-style)                                                                                                                                                                   |\n// | --graupl-submenu-border-left-style                    | var(--graupl-border-left-style)                                                                                                                                                                     |\n// | --graupl-submenu-border-style                         | var(--graupl-submenu-border-top-style) var(--graupl-submenu-border-right-style) var(--graupl-submenu-border-bottom-style) var(--graupl-submenu-border-left-style)                                   |\n// | --graupl-submenu-position                             | absolute                                                                                                                                                                                            |\n// | --graupl-submenu-top                                  | 100%                                                                                                                                                                                                |\n// | --graupl-submenu-right                                | auto                                                                                                                                                                                                |\n// | --graupl-submenu-bottom                               | auto                                                                                                                                                                                                |\n// | --graupl-submenu-left                                 | 0                                                                                                                                                                                                   |\n// | --graupl-submenu-inset                                | 100% auto auto 0                                                                                                                                                                                    |\n// | --graupl-menu-item-min-width                          | min-content                                                                                                                                                                                         |\n// | --graupl-menu-item-max-width                          | 100%                                                                                                                                                                                                |\n// | --graupl-menu-item-padding-x                          | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-menu-item-padding-y                          | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-menu-item-padding                            | var(--graupl-menu-item-padding-y) var(--graupl-menu-item-padding-x)                                                                                                                                 |\n// | --graupl-submenu-item-width                           | 100%                                                                                                                                                                                                |\n// | --graupl-menu-link-padding-x                          | var(--graupl-spacer-5)                                                                                                                                                                              |\n// | --graupl-menu-link-padding-y                          | var(--graupl-spacer-3)                                                                                                                                                                              |\n// | --graupl-menu-link-padding                            | var(--graupl-menu-link-padding-y) var(--graupl-menu-link-padding-x)                                                                                                                                 |\n// | --graupl-menu-link-transition                         | background var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function), color var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)                   |\n// | --graupl-menu-link-transition-reduced-motion          | background var(--graupl-transition-duration-none) var(--graupl-transition-timing-function), color var(--graupl-transition-duration-none) var(--graupl-transition-timing-function)                   |\n// | --graupl-menu-link-transform                          | none                                                                                                                                                                                                |\n// | --graupl-menu-link-visited-transform                  | var(--graupl-menu-link-transform)                                                                                                                                                                   |\n// | --graupl-menu-link-focus-transform                    | var(--graupl-menu-link-transform)                                                                                                                                                                   |\n// | --graupl-menu-link-hover-transform                    | none                                                                                                                                                                                                |\n// | --graupl-menu-link-active-transform                   | var(--graupl-menu-link-hover-transform)                                                                                                                                                             |\n// | --graupl-menu-link-disabled-transform                 | none                                                                                                                                                                                                |\n// | --graupl-menu-link-column-gap                         | var(--graupl-menu-link-padding-x)                                                                                                                                                                   |\n// | --graupl-menu-link-row-gap                            | var(--graupl-spacer-0)                                                                                                                                                                              |\n// | --graupl-menu-link-gap                                | var(--graupl-menu-link-column-gap) var(--graupl-menu-link-row-gap)                                                                                                                                  |\n// | --graupl-menu-link-background                         | var(--graupl-menu-background)                                                                                                                                                                       |\n// | --graupl-menu-link-visited-background                 | var(--graupl-menu-link-background)                                                                                                                                                                  |\n// | --graupl-menu-link-focus-background                   | var(--graupl-menu-link-background)                                                                                                                                                                  |\n// | --graupl-menu-link-hover-background                   | var(--graupl-menu-color)                                                                                                                                                                            |\n// | --graupl-menu-link-active-background                  | var(--graupl-menu-link-hover-background)                                                                                                                                                            |\n// | --graupl-menu-link-disabled-background                | var(--graupl-background)                                                                                                                                                                            |\n// | --graupl-menu-link-color                              | var(--graupl-menu-color)                                                                                                                                                                            |\n// | --graupl-menu-link-visited-color                      | var(--graupl-menu-link-color)                                                                                                                                                                       |\n// | --graupl-menu-link-focus-color                        | var(--graupl-menu-link-color)                                                                                                                                                                       |\n// | --graupl-menu-link-hover-color                        | var(--graupl-menu-background)                                                                                                                                                                       |\n// | --graupl-menu-link-active-color                       | var(--graupl-menu-link-hover-color)                                                                                                                                                                 |\n// | --graupl-menu-link-disabled-color                     | var(--graupl-theme-active--primary--200)                                                                                                                                                            |\n// | --graupl-menu-link-text-decoration                    | none                                                                                                                                                                                                |\n// | --graupl-menu-link-visited-text-decoration            | var(--graupl-menu-link-text-decoration)                                                                                                                                                             |\n// | --graupl-menu-link-focus-text-decoration              | var(--graupl-menu-link-text-decoration)                                                                                                                                                             |\n// | --graupl-menu-link-hover-text-decoration              | none                                                                                                                                                                                                |\n// | --graupl-menu-link-active-text-decoration             | var(--graupl-menu-link-hover-text-decoration)                                                                                                                                                       |\n// | --graupl-menu-link-disabled-text-decoration           | none                                                                                                                                                                                                |\n// | --graupl-menu-link-text-decoration-thickness          | var(--graupl-border-width)                                                                                                                                                                          |\n// | --graupl-menu-link-visited-text-decoration-thickness  | var(--graupl-menu-link-text-decoration-thickness)                                                                                                                                                   |\n// | --graupl-menu-link-focus-text-decoration-thickness    | var(--graupl-menu-link-text-decoration-thickness)                                                                                                                                                   |\n// | --graupl-menu-link-hover-text-decoration-thickness    | var(--graupl-border-width)                                                                                                                                                                          |\n// | --graupl-menu-link-active-text-decoration-thickness   | var(--graupl-menu-link-hover-text-decoration-thickness)                                                                                                                                             |\n// | --graupl-menu-link-disabled-text-decoration-thickness | var(--graupl-border-width)                                                                                                                                                                          |\n// | --graupl-menu-link-text-decoration-style              | solid                                                                                                                                                                                               |\n// | --graupl-menu-link-visited-text-decoration-style      | var(--graupl-menu-link-text-decoration-style)                                                                                                                                                       |\n// | --graupl-menu-link-focus-text-decoration-style        | var(--graupl-menu-link-text-decoration-style)                                                                                                                                                       |\n// | --graupl-menu-link-hover-text-decoration-style        | solid                                                                                                                                                                                               |\n// | --graupl-menu-link-active-text-decoration-style       | var(--graupl-menu-link-hover-text-decoration-style)                                                                                                                                                 |\n// | --graupl-menu-link-disabled-text-decoration-style     | solid                                                                                                                                                                                               |\n// | --graupl-menu-link-text-decoration-color              | var(--graupl-menu-link-color)                                                                                                                                                                       |\n// | --graupl-menu-link-visited-text-decoration-color      | var(--graupl-menu-link-visited-color)                                                                                                                                                               |\n// | --graupl-menu-link-focus-text-decoration-color        | var(--graupl-menu-link-focus-color)                                                                                                                                                                 |\n// | --graupl-menu-link-hover-text-decoration-color        | var(--graupl-menu-link-hover-color)                                                                                                                                                                 |\n// | --graupl-menu-link-active-text-decoration-color       | var(--graupl-menu-link-active-color)                                                                                                                                                                |\n// | --graupl-menu-link-disabled-text-decoration-color     | var(--graupl-menu-link-disabled-color)                                                                                                                                                              |\n// | --graupl-menu-link-border-top-left-radius             | var(--graupl-border-top-left-radius)                                                                                                                                                                |\n// | --graupl-menu-link-border-top-right-radius            | var(--graupl-border-top-right-radius)                                                                                                                                                               |\n// | --graupl-menu-link-border-bottom-left-radius          | var(--graupl-border-bottom-left-radius)                                                                                                                                                             |\n// | --graupl-menu-link-border-bottom-right-radius         | var(--graupl-border-bottom-right-radius)                                                                                                                                                            |\n// | --graupl-menu-link-border-radius                      | var(--graupl-menu-link-border-top-left-radius) var(--graupl-menu-link-border-top-right-radius) var(--graupl-menu-link-border-bottom-right-radius) var(--graupl-menu-link-border-bottom-left-radius) |\n// | --graupl-menu-link-border-top-width                   | 0                                                                                                                                                                                                   |\n// | --graupl-menu-link-border-right-width                 | 0                                                                                                                                                                                                   |\n// | --graupl-menu-link-border-bottom-width                | 0                                                                                                                                                                                                   |\n// | --graupl-menu-link-border-left-width                  | 0                                                                                                                                                                                                   |\n// | --graupl-menu-link-border-width                       | var(--graupl-menu-link-border-top-width) var(--graupl-menu-link-border-right-width) var(--graupl-menu-link-border-bottom-width) var(--graupl-menu-link-border-left-width)                           |\n// | --graupl-menu-link-border-top-style                   | var(--graupl-border-top-style)                                                                                                                                                                      |\n// | --graupl-menu-link-border-right-style                 | var(--graupl-border-right-style)                                                                                                                                                                    |\n// | --graupl-menu-link-border-bottom-style                | var(--graupl-border-bottom-style)                                                                                                                                                                   |\n// | --graupl-menu-link-border-left-style                  | var(--graupl-border-left-style)                                                                                                                                                                     |\n// | --graupl-menu-link-border-style                       | var(--graupl-menu-link-border-top-style) var(--graupl-menu-link-border-right-style) var(--graupl-menu-link-border-bottom-style) var(--graupl-menu-link-border-left-style)                           |\n// | --graupl-menu-link-border-color                       | var(--graupl-menu-link-color)                                                                                                                                                                       |\n// | --graupl-menu-link-visited-border-color               | var(--graupl-menu-link-border-color)                                                                                                                                                                |\n// | --graupl-menu-link-focus-border-color                 | var(--graupl-menu-link-border-color)                                                                                                                                                                |\n// | --graupl-menu-link-hover-border-color                 | var(--graupl-menu-link-hover-color)                                                                                                                                                                 |\n// | --graupl-menu-link-active-border-color                | var(--graupl-menu-link-hover-border-color)                                                                                                                                                          |\n// | --graupl-menu-link-disabled-border-color              | var(--graupl-menu-link-disabled-color)                                                                                                                                                              |\n// | --graupl-submenu-toggle-transform                     | rotate(0deg)                                                                                                                                                                                        |\n// | --graupl-submenu-toggle-open-transform                | rotate(-180deg)                                                                                                                                                                                     |\n// | --graupl-submenu-toggle-content                       | \"'↓'\"                                                                                                                                                                                               |\n// | --graupl-submenu-toggle-transition                    | transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function)                                                                                                           |\n// | --graupl-submenu-toggle-transition-reduced-motion     | none                                                                                                                                                                                                |\n\n@use \"defaults\";\n@use \"../../defaults\" as root-defaults;\n@use \"../../variables\" as root-variables;\n@use \"../../theme/color/variables\" as color;\n@use \"../../functions/theme\";\n@use \"sass:map\";\n\n// Menu properties.\n// --graupl-menu-flex-direction\n$menu-flex-direction: var(\n  --#{root-defaults.$prefix}menu-flex-direction,\n  #{defaults.$menu-flex-direction}\n);\n\n// --graupl-menu-padding-x\n$menu-padding-x: var(\n  --#{root-defaults.$prefix}menu-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-menu-padding-y\n$menu-padding-y: var(\n  --#{root-defaults.$prefix}menu-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-menu-padding\n$menu-padding: var(\n  --#{root-defaults.$prefix}menu-padding,\n  #{$menu-padding-y} #{$menu-padding-x}\n);\n\n// Menu gap properties.\n// --graupl-menu-column-gap\n$menu-column-gap: var(\n  --#{root-defaults.$prefix}menu-column-gap,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-menu-row-gap\n$menu-row-gap: var(\n  --#{root-defaults.$prefix}menu-row-gap,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-menu-gap\n$menu-gap: var(\n  --#{root-defaults.$prefix}menu-gap,\n  #{$menu-column-gap} #{$menu-row-gap}\n);\n\n// Menu display properties.\n// --graupl-menu-show-display\n$menu-show-display: var(\n  --#{root-defaults.$prefix}menu-show-display,\n  #{defaults.$menu-show-display}\n);\n\n// --graupl-menu-hide-display\n$menu-hide-display: var(\n  --#{root-defaults.$prefix}menu-hide-display,\n  #{defaults.$menu-hide-display}\n);\n\n// --graupl-menu-display\n$menu-display: var(\n  --#{root-defaults.$prefix}menu-display,\n  #{defaults.$menu-show-display}\n);\n\n// Menu color properties.\n// --graupl-menu-background\n$menu-background: var(\n  --#{root-defaults.$prefix}menu-background,\n  #{color.$background}\n);\n\n// --graupl-menu-color\n$menu-color: var(--#{root-defaults.$prefix}menu-color, #{color.$color});\n\n// Menu border properties.\n// --graupl-menu-border-color\n$menu-border-color: var(\n  --#{root-defaults.$prefix}menu-border-color,\n  #{$menu-color}\n);\n\n// --graupl-menu-border-top-left-radius\n$menu-border-top-left-radius: var(\n  --#{root-defaults.$prefix}menu-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-menu-border-top-right-radius\n$menu-border-top-right-radius: var(\n  --#{root-defaults.$prefix}menu-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-menu-border-bottom-left-radius\n$menu-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}menu-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-menu-border-bottom-right-radius\n$menu-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}menu-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-menu-border-radius\n$menu-border-radius: var(\n  --#{root-defaults.$prefix}menu-border-radius,\n  #{$menu-border-top-left-radius} #{$menu-border-top-right-radius}\n    #{$menu-border-bottom-right-radius} #{$menu-border-bottom-left-radius}\n);\n\n// --graupl-menu-border-top-width\n$menu-border-top-width: var(\n  --#{root-defaults.$prefix}menu-border-top-width,\n  #{defaults.$menu-border-width}\n);\n\n// --graupl-menu-border-right-width\n$menu-border-right-width: var(\n  --#{root-defaults.$prefix}menu-border-right-width,\n  #{defaults.$menu-border-width}\n);\n\n// --graupl-menu-border-bottom-width\n$menu-border-bottom-width: var(\n  --#{root-defaults.$prefix}menu-border-bottom-width,\n  #{defaults.$menu-border-width}\n);\n\n// --graupl-menu-border-left-width\n$menu-border-left-width: var(\n  --#{root-defaults.$prefix}menu-border-left-width,\n  #{defaults.$menu-border-width}\n);\n\n// --graupl-menu-border-width\n$menu-border-width: var(\n  --#{root-defaults.$prefix}menu-border-width,\n  #{$menu-border-top-width} #{$menu-border-right-width}\n    #{$menu-border-bottom-width} #{$menu-border-left-width}\n);\n\n// --graupl-menu-border-top-style\n$menu-border-top-style: var(\n  --#{root-defaults.$prefix}menu-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-menu-border-right-style\n$menu-border-right-style: var(\n  --#{root-defaults.$prefix}menu-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-menu-border-bottom-style\n$menu-border-bottom-style: var(\n  --#{root-defaults.$prefix}menu-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-menu-border-left-style\n$menu-border-left-style: var(\n  --#{root-defaults.$prefix}menu-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-menu-border-style\n$menu-border-style: var(\n  --#{root-defaults.$prefix}menu-border-style,\n  #{$menu-border-top-style} #{$menu-border-right-style}\n    #{$menu-border-bottom-style} #{$menu-border-left-style}\n);\n\n// Submenu properties\n// --graupl-submenu-flex-direction\n$submenu-flex-direction: var(\n  --#{root-defaults.$prefix}submenu-flex-direction,\n  #{defaults.$submenu-flex-direction}\n);\n\n// --graupl-submenu-z-index\n$submenu-z-index: var(\n  --#{root-defaults.$prefix}submenu-z-index,\n  #{defaults.$submenu-z-index}\n);\n\n// --graupl-submenu-padding-x\n$submenu-padding-x: var(\n  --#{root-defaults.$prefix}submenu-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-submenu-padding-y\n$submenu-padding-y: var(\n  --#{root-defaults.$prefix}submenu-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-submenu-padding\n$submenu-padding: var(\n  --#{root-defaults.$prefix}submenu-padding,\n  #{$submenu-padding-y} #{$submenu-padding-x}\n);\n\n// Submenu gap properties.\n// --graupl-submenu-column-gap\n$submenu-column-gap: var(\n  --#{root-defaults.$prefix}submenu-column-gap,\n  #{$menu-column-gap}\n);\n\n// --graupl-submenu-row-gap\n$submenu-row-gap: var(\n  --#{root-defaults.$prefix}submenu-row-gap,\n  #{$menu-row-gap}\n);\n\n// --graupl-submenu-gap\n$submenu-gap: var(\n  --#{root-defaults.$prefix}submenu-gap,\n  #{$submenu-column-gap} #{$submenu-row-gap}\n);\n\n// Submenu display properties.\n// --graupl-submenu-show-display\n$submenu-show-display: var(\n  --#{root-defaults.$prefix}submenu-show-display,\n  #{defaults.$submenu-show-display}\n);\n\n// --graupl-submenu-hide-display\n$submenu-hide-display: var(\n  --#{root-defaults.$prefix}submenu-hide-display,\n  #{defaults.$submenu-hide-display}\n);\n\n// --graupl-submenu-display\n$submenu-display: var(\n  --#{root-defaults.$prefix}submenu-display,\n  #{defaults.$submenu-hide-display}\n);\n\n// Submenu color properties.\n// --graupl-submenu-background\n$submenu-background: var(\n  --#{root-defaults.$prefix}submenu-background,\n  #{$menu-background}\n);\n\n// --graupl-submenu-color\n$submenu-color: var(--#{root-defaults.$prefix}submenu-color, #{$menu-color});\n\n// Submenu border properties.\n// --graupl-submenu-border-color\n$submenu-border-color: var(\n  --#{root-defaults.$prefix}submenu-border-color,\n  #{$menu-border-color}\n);\n\n// --graupl-submenu-border-top-left-radius\n$submenu-border-top-left-radius: var(\n  --#{root-defaults.$prefix}submenu-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-submenu-border-top-right-radius\n$submenu-border-top-right-radius: var(\n  --#{root-defaults.$prefix}submenu-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-submenu-border-bottom-left-radius\n$submenu-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}submenu-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-submenu-border-bottom-right-radius\n$submenu-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}submenu-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-submenu-border-radius\n$submenu-border-radius: var(\n  --#{root-defaults.$prefix}submenu-border-radius,\n  #{$submenu-border-top-left-radius} #{$submenu-border-top-right-radius}\n    #{$submenu-border-bottom-right-radius} #{$submenu-border-bottom-left-radius}\n);\n\n// --graupl-submenu-border-top-width\n$submenu-border-top-width: var(\n  --#{root-defaults.$prefix}submenu-border-top-width,\n  #{root-variables.$border-top-width}\n);\n\n// --graupl-submenu-border-right-width\n$submenu-border-right-width: var(\n  --#{root-defaults.$prefix}submenu-border-right-width,\n  #{root-variables.$border-right-width}\n);\n\n// --graupl-submenu-border-bottom-width\n$submenu-border-bottom-width: var(\n  --#{root-defaults.$prefix}submenu-border-bottom-width,\n  #{root-variables.$border-bottom-width}\n);\n\n// --graupl-submenu-border-left-width\n$submenu-border-left-width: var(\n  --#{root-defaults.$prefix}submenu-border-left-width,\n  #{root-variables.$border-left-width}\n);\n\n// --graupl-submenu-border-width\n$submenu-border-width: var(\n  --#{root-defaults.$prefix}submenu-border-width,\n  #{$submenu-border-top-width} #{$submenu-border-right-width}\n    #{$submenu-border-bottom-width} #{$submenu-border-left-width}\n);\n\n// --graupl-submenu-border-top-style\n$submenu-border-top-style: var(\n  --#{root-defaults.$prefix}submenu-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-submenu-border-right-style\n$submenu-border-right-style: var(\n  --#{root-defaults.$prefix}submenu-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-submenu-border-bottom-style\n$submenu-border-bottom-style: var(\n  --#{root-defaults.$prefix}submenu-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-submenu-border-left-style\n$submenu-border-left-style: var(\n  --#{root-defaults.$prefix}submenu-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-submenu-border-style\n$submenu-border-style: var(\n  --#{root-defaults.$prefix}submenu-border-style,\n  #{$submenu-border-top-style} #{$submenu-border-right-style}\n    #{$submenu-border-bottom-style} #{$submenu-border-left-style}\n);\n\n// Submenu position properties.\n// --graupl-submenu-position\n$submenu-position: var(\n  --#{root-defaults.$prefix}submenu-position,\n  #{defaults.$submenu-position}\n);\n\n// --graupl-submenu-top\n$submenu-top: var(\n  --#{root-defaults.$prefix}submenu-top,\n  #{defaults.$submenu-top}\n);\n\n// --graupl-submenu-right\n$submenu-right: var(\n  --#{root-defaults.$prefix}submenu-right,\n  #{defaults.$submenu-right}\n);\n\n// --graupl-submenu-bottom\n$submenu-bottom: var(\n  --#{root-defaults.$prefix}submenu-bottom,\n  #{defaults.$submenu-bottom}\n);\n\n// --graupl-submenu-left\n$submenu-left: var(\n  --#{root-defaults.$prefix}submenu-left,\n  #{defaults.$submenu-left}\n);\n\n// --graupl-submenu-inset\n$submenu-inset: var(\n  --#{root-defaults.$prefix}submenu-inset,\n  #{$submenu-top} #{$submenu-right} #{$submenu-bottom} #{$submenu-left}\n);\n\n// Menu item properties.\n// --graupl-menu-item-min-width\n$menu-item-min-width: var(\n  --#{root-defaults.$prefix}menu-item-min-width,\n  #{defaults.$menu-item-min-width}\n);\n\n// --graupl-menu-item-max-width\n$menu-item-max-width: var(\n  --#{root-defaults.$prefix}menu-item-max-width,\n  #{defaults.$menu-item-max-width}\n);\n\n// --graupl-menu-item-padding-x\n$menu-item-padding-x: var(\n  --#{root-defaults.$prefix}menu-item-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-menu-item-padding-y\n$menu-item-padding-y: var(\n  --#{root-defaults.$prefix}menu-item-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-menu-item-padding\n$menu-item-padding: var(\n  --#{root-defaults.$prefix}menu-item-padding,\n  #{$menu-item-padding-y} #{$menu-item-padding-x}\n);\n\n// Submenu item properties.\n// --graupl-submenu-item-width\n$submenu-item-width: var(\n  --#{root-defaults.$prefix}submenu-item-width,\n  #{defaults.$submenu-item-width}\n);\n\n// Menu link properties.\n// --graupl-menu-link-padding-x\n$menu-link-padding-x: var(\n  --#{root-defaults.$prefix}menu-link-padding-x,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-menu-link-padding-y\n$menu-link-padding-y: var(\n  --#{root-defaults.$prefix}menu-link-padding-y,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-menu-link-padding\n$menu-link-padding: var(\n  --#{root-defaults.$prefix}menu-link-padding,\n  #{$menu-link-padding-y} #{$menu-link-padding-x}\n);\n\n// Menu link transform properties.\n// --graupl-menu-link-transition\n$menu-link-transition: var(\n  --#{root-defaults.$prefix}menu-link-transition,\n  background #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function},\n  color #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function}\n);\n\n// --graupl-menu-link-transition-reduced-motion\n$menu-link-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}menu-link-transition-reduced-motion,\n  background #{map.get(root-variables.$transition-durations, none)}\n    #{root-variables.$transition-timing-function},\n  color #{map.get(root-variables.$transition-durations, none)}\n    #{root-variables.$transition-timing-function}\n);\n\n// --graupl-menu-link-transform\n$menu-link-transform: var(\n  --#{root-defaults.$prefix}menu-link-transform,\n  #{defaults.$menu-link-initial-transform}\n);\n\n// --graupl-menu-link-visited-transform\n$menu-link-visited-transform: var(\n  --#{root-defaults.$prefix}menu-link-visited-transform,\n  #{$menu-link-transform}\n);\n\n// --graupl-menu-link-focus-transform\n$menu-link-focus-transform: var(\n  --#{root-defaults.$prefix}menu-link-focus-transform,\n  #{$menu-link-transform}\n);\n\n// --graupl-menu-link-hover-transform\n$menu-link-hover-transform: var(\n  --#{root-defaults.$prefix}menu-link-hover-transform,\n  #{defaults.$menu-link-final-transform}\n);\n\n// --graupl-menu-link-active-transform\n$menu-link-active-transform: var(\n  --#{root-defaults.$prefix}menu-link-active-transform,\n  #{$menu-link-hover-transform}\n);\n\n// --graupl-menu-link-disabled-transform\n$menu-link-disabled-transform: var(\n  --#{root-defaults.$prefix}menu-link-disabled-transform,\n  #{defaults.$menu-link-disabled-transform}\n);\n$menu-link-transform-states: (\n  default: $menu-link-transform,\n  visited: $menu-link-visited-transform,\n  focus: $menu-link-focus-transform,\n  hover: $menu-link-hover-transform,\n  active: $menu-link-active-transform,\n  disabled: $menu-link-disabled-transform,\n);\n\n// Menu link gap properties.\n// --graupl-menu-link-column-gap\n$menu-link-column-gap: var(\n  --#{root-defaults.$prefix}menu-link-column-gap,\n  #{$menu-link-padding-x}\n);\n\n// --graupl-menu-link-row-gap\n$menu-link-row-gap: var(\n  --#{root-defaults.$prefix}menu-link-row-gap,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-menu-link-gap\n$menu-link-gap: var(\n  --#{root-defaults.$prefix}menu-link-gap,\n  #{$menu-link-column-gap} #{$menu-link-row-gap}\n);\n\n// Menu link colors.\n// --graupl-menu-link-background\n$menu-link-background: var(\n  --#{root-defaults.$prefix}menu-link-background,\n  #{$menu-background}\n);\n\n// --graupl-menu-link-visited-background\n$menu-link-visited-background: var(\n  --#{root-defaults.$prefix}menu-link-visited-background,\n  #{$menu-link-background}\n);\n\n// --graupl-menu-link-focus-background\n$menu-link-focus-background: var(\n  --#{root-defaults.$prefix}menu-link-focus-background,\n  #{$menu-link-background}\n);\n\n// --graupl-menu-link-hover-background\n$menu-link-hover-background: var(\n  --#{root-defaults.$prefix}menu-link-hover-background,\n  #{$menu-color}\n);\n\n// --graupl-menu-link-active-background\n$menu-link-active-background: var(\n  --#{root-defaults.$prefix}menu-link-active-background,\n  #{$menu-link-hover-background}\n);\n\n// --graupl-menu-link-disabled-background\n$menu-link-disabled-background: var(\n  --#{root-defaults.$prefix}menu-link-disabled-background,\n  #{color.$background}\n);\n$menu-link-background-states: (\n  default: $menu-link-background,\n  visited: $menu-link-visited-background,\n  focus: $menu-link-focus-background,\n  hover: $menu-link-hover-background,\n  active: $menu-link-active-background,\n  disabled: $menu-link-disabled-background,\n);\n\n// --graupl-menu-link-color\n$menu-link-color: var(\n  --#{root-defaults.$prefix}menu-link-color,\n  #{$menu-color}\n);\n\n// --graupl-menu-link-visited-color\n$menu-link-visited-color: var(\n  --#{root-defaults.$prefix}menu-link-visited-color,\n  #{$menu-link-color}\n);\n\n// --graupl-menu-link-focus-color\n$menu-link-focus-color: var(\n  --#{root-defaults.$prefix}menu-link-focus-color,\n  #{$menu-link-color}\n);\n\n// --graupl-menu-link-hover-color\n$menu-link-hover-color: var(\n  --#{root-defaults.$prefix}menu-link-hover-color,\n  #{$menu-background}\n);\n\n// --graupl-menu-link-active-color\n$menu-link-active-color: var(\n  --#{root-defaults.$prefix}menu-link-active-color,\n  #{$menu-link-hover-color}\n);\n\n// --graupl-menu-link-disabled-color\n$menu-link-disabled-color: var(\n  --#{root-defaults.$prefix}menu-link-disabled-color,\n  #{theme.get(primary, 200)}\n);\n$menu-link-color-states: (\n  default: $menu-link-color,\n  visited: $menu-link-visited-color,\n  focus: $menu-link-focus-color,\n  hover: $menu-link-hover-color,\n  active: $menu-link-active-color,\n  disabled: $menu-link-disabled-color,\n);\n\n// Menu link text decoration properties.\n// --graupl-menu-link-text-decoration\n$menu-link-text-decoration: var(\n  --#{root-defaults.$prefix}menu-link-text-decoration,\n  #{defaults.$menu-link-initial-text-decoration}\n);\n\n// --graupl-menu-link-visited-text-decoration\n$menu-link-visited-text-decoration: var(\n  --#{root-defaults.$prefix}menu-link-visited-text-decoration,\n  #{$menu-link-text-decoration}\n);\n\n// --graupl-menu-link-focus-text-decoration\n$menu-link-focus-text-decoration: var(\n  --#{root-defaults.$prefix}menu-link-focus-text-decoration,\n  #{$menu-link-text-decoration}\n);\n\n// --graupl-menu-link-hover-text-decoration\n$menu-link-hover-text-decoration: var(\n  --#{root-defaults.$prefix}menu-link-hover-text-decoration,\n  #{defaults.$menu-link-final-text-decoration}\n);\n\n// --graupl-menu-link-active-text-decoration\n$menu-link-active-text-decoration: var(\n  --#{root-defaults.$prefix}menu-link-active-text-decoration,\n  #{$menu-link-hover-text-decoration}\n);\n\n// --graupl-menu-link-disabled-text-decoration\n$menu-link-disabled-text-decoration: var(\n  --#{root-defaults.$prefix}menu-link-disabled-text-decoration,\n  #{defaults.$menu-link-disabled-text-decoration}\n);\n$menu-link-text-decoration-states: (\n  default: $menu-link-text-decoration,\n  visited: $menu-link-visited-text-decoration,\n  focus: $menu-link-focus-text-decoration,\n  hover: $menu-link-hover-text-decoration,\n  active: $menu-link-active-text-decoration,\n  disabled: $menu-link-disabled-text-decoration,\n);\n\n// --graupl-menu-link-text-decoration-thickness\n$menu-link-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}menu-link-text-decoration-thickness,\n  #{root-variables.$border-width}\n);\n\n// --graupl-menu-link-visited-text-decoration-thickness\n$menu-link-visited-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}menu-link-visited-text-decoration-thickness,\n  #{$menu-link-text-decoration-thickness}\n);\n\n// --graupl-menu-link-focus-text-decoration-thickness\n$menu-link-focus-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}menu-link-focus-text-decoration-thickness,\n  #{$menu-link-text-decoration-thickness}\n);\n\n// --graupl-menu-link-hover-text-decoration-thickness\n$menu-link-hover-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}menu-link-hover-text-decoration-thickness,\n  #{root-variables.$border-width}\n);\n\n// --graupl-menu-link-active-text-decoration-thickness\n$menu-link-active-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}menu-link-active-text-decoration-thickness,\n  #{$menu-link-hover-text-decoration-thickness}\n);\n\n// --graupl-menu-link-disabled-text-decoration-thickness\n$menu-link-disabled-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}menu-link-disabled-text-decoration-thickness,\n  #{root-variables.$border-width}\n);\n$menu-link-text-decoration-thickness-states: (\n  default: $menu-link-text-decoration-thickness,\n  visited: $menu-link-visited-text-decoration-thickness,\n  focus: $menu-link-focus-text-decoration-thickness,\n  hover: $menu-link-hover-text-decoration-thickness,\n  active: $menu-link-active-text-decoration-thickness,\n  disabled: $menu-link-disabled-text-decoration-thickness,\n);\n\n// --graupl-menu-link-text-decoration-style\n$menu-link-text-decoration-style: var(\n  --#{root-defaults.$prefix}menu-link-text-decoration-style,\n  #{defaults.$menu-link-initial-text-decoration-style}\n);\n\n// --graupl-menu-link-visited-text-decoration-style\n$menu-link-visited-text-decoration-style: var(\n  --#{root-defaults.$prefix}menu-link-visited-text-decoration-style,\n  #{$menu-link-text-decoration-style}\n);\n\n// --graupl-menu-link-focus-text-decoration-style\n$menu-link-focus-text-decoration-style: var(\n  --#{root-defaults.$prefix}menu-link-focus-text-decoration-style,\n  #{$menu-link-text-decoration-style}\n);\n\n// --graupl-menu-link-hover-text-decoration-style\n$menu-link-hover-text-decoration-style: var(\n  --#{root-defaults.$prefix}menu-link-hover-text-decoration-style,\n  #{defaults.$menu-link-final-text-decoration-style}\n);\n\n// --graupl-menu-link-active-text-decoration-style\n$menu-link-active-text-decoration-style: var(\n  --#{root-defaults.$prefix}menu-link-active-text-decoration-style,\n  #{$menu-link-hover-text-decoration-style}\n);\n\n// --graupl-menu-link-disabled-text-decoration-style\n$menu-link-disabled-text-decoration-style: var(\n  --#{root-defaults.$prefix}menu-link-disabled-text-decoration-style,\n  #{defaults.$menu-link-disabled-text-decoration-style}\n);\n$menu-link-text-decoration-style-states: (\n  default: $menu-link-text-decoration-style,\n  visited: $menu-link-visited-text-decoration-style,\n  focus: $menu-link-focus-text-decoration-style,\n  hover: $menu-link-hover-text-decoration-style,\n  active: $menu-link-active-text-decoration-style,\n  disabled: $menu-link-disabled-text-decoration-style,\n);\n\n// --graupl-menu-link-text-decoration-color\n$menu-link-text-decoration-color: var(\n  --#{root-defaults.$prefix}menu-link-text-decoration-color,\n  #{$menu-link-color}\n);\n\n// --graupl-menu-link-visited-text-decoration-color\n$menu-link-visited-text-decoration-color: var(\n  --#{root-defaults.$prefix}menu-link-visited-text-decoration-color,\n  #{$menu-link-visited-color}\n);\n\n// --graupl-menu-link-focus-text-decoration-color\n$menu-link-focus-text-decoration-color: var(\n  --#{root-defaults.$prefix}menu-link-focus-text-decoration-color,\n  #{$menu-link-focus-color}\n);\n\n// --graupl-menu-link-hover-text-decoration-color\n$menu-link-hover-text-decoration-color: var(\n  --#{root-defaults.$prefix}menu-link-hover-text-decoration-color,\n  #{$menu-link-hover-color}\n);\n\n// --graupl-menu-link-active-text-decoration-color\n$menu-link-active-text-decoration-color: var(\n  --#{root-defaults.$prefix}menu-link-active-text-decoration-color,\n  #{$menu-link-active-color}\n);\n\n// --graupl-menu-link-disabled-text-decoration-color\n$menu-link-disabled-text-decoration-color: var(\n  --#{root-defaults.$prefix}menu-link-disabled-text-decoration-color,\n  #{$menu-link-disabled-color}\n);\n$menu-link-text-decoration-color-states: (\n  default: $menu-link-text-decoration-color,\n  visited: $menu-link-visited-text-decoration-color,\n  focus: $menu-link-focus-text-decoration-color,\n  hover: $menu-link-hover-text-decoration-color,\n  active: $menu-link-active-text-decoration-color,\n  disabled: $menu-link-disabled-text-decoration-color,\n);\n\n// Menu link border properties.\n// --graupl-menu-link-border-top-left-radius\n$menu-link-border-top-left-radius: var(\n  --#{root-defaults.$prefix}menu-link-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-menu-link-border-top-right-radius\n$menu-link-border-top-right-radius: var(\n  --#{root-defaults.$prefix}menu-link-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-menu-link-border-bottom-left-radius\n$menu-link-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}menu-link-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-menu-link-border-bottom-right-radius\n$menu-link-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}menu-link-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-menu-link-border-radius\n$menu-link-border-radius: var(\n  --#{root-defaults.$prefix}menu-link-border-radius,\n  #{$menu-link-border-top-left-radius} #{$menu-link-border-top-right-radius}\n    #{$menu-link-border-bottom-right-radius}\n    #{$menu-link-border-bottom-left-radius}\n);\n\n// --graupl-menu-link-border-top-width\n$menu-link-border-top-width: var(\n  --#{root-defaults.$prefix}menu-link-border-top-width,\n  #{defaults.$menu-link-border-width}\n);\n\n// --graupl-menu-link-border-right-width\n$menu-link-border-right-width: var(\n  --#{root-defaults.$prefix}menu-link-border-right-width,\n  #{defaults.$menu-link-border-width}\n);\n\n// --graupl-menu-link-border-bottom-width\n$menu-link-border-bottom-width: var(\n  --#{root-defaults.$prefix}menu-link-border-bottom-width,\n  #{defaults.$menu-link-border-width}\n);\n\n// --graupl-menu-link-border-left-width\n$menu-link-border-left-width: var(\n  --#{root-defaults.$prefix}menu-link-border-left-width,\n  #{defaults.$menu-link-border-width}\n);\n\n// --graupl-menu-link-border-width\n$menu-link-border-width: var(\n  --#{root-defaults.$prefix}menu-link-border-width,\n  #{$menu-link-border-top-width} #{$menu-link-border-right-width}\n    #{$menu-link-border-bottom-width} #{$menu-link-border-left-width}\n);\n\n// --graupl-menu-link-border-top-style\n$menu-link-border-top-style: var(\n  --#{root-defaults.$prefix}menu-link-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-menu-link-border-right-style\n$menu-link-border-right-style: var(\n  --#{root-defaults.$prefix}menu-link-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-menu-link-border-bottom-style\n$menu-link-border-bottom-style: var(\n  --#{root-defaults.$prefix}menu-link-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-menu-link-border-left-style\n$menu-link-border-left-style: var(\n  --#{root-defaults.$prefix}menu-link-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-menu-link-border-style\n$menu-link-border-style: var(\n  --#{root-defaults.$prefix}menu-link-border-style,\n  #{$menu-link-border-top-style} #{$menu-link-border-right-style}\n    #{$menu-link-border-bottom-style} #{$menu-link-border-left-style}\n);\n\n// --graupl-menu-link-border-color\n$menu-link-border-color: var(\n  --#{root-defaults.$prefix}menu-link-border-color,\n  #{$menu-link-color}\n);\n\n// --graupl-menu-link-visited-border-color\n$menu-link-visited-border-color: var(\n  --#{root-defaults.$prefix}menu-link-visited-border-color,\n  #{$menu-link-border-color}\n);\n\n// --graupl-menu-link-focus-border-color\n$menu-link-focus-border-color: var(\n  --#{root-defaults.$prefix}menu-link-focus-border-color,\n  #{$menu-link-border-color}\n);\n\n// --graupl-menu-link-hover-border-color\n$menu-link-hover-border-color: var(\n  --#{root-defaults.$prefix}menu-link-hover-border-color,\n  #{$menu-link-hover-color}\n);\n\n// --graupl-menu-link-active-border-color\n$menu-link-active-border-color: var(\n  --#{root-defaults.$prefix}menu-link-active-border-color,\n  #{$menu-link-hover-border-color}\n);\n\n// --graupl-menu-link-disabled-border-color\n$menu-link-disabled-border-color: var(\n  --#{root-defaults.$prefix}menu-link-disabled-border-color,\n  #{$menu-link-disabled-color}\n);\n$menu-link-border-color-states: (\n  default: $menu-link-border-color,\n  visited: $menu-link-visited-border-color,\n  focus: $menu-link-focus-border-color,\n  hover: $menu-link-hover-border-color,\n  active: $menu-link-active-border-color,\n  disabled: $menu-link-disabled-border-color,\n);\n\n// Submenu toggle properties.\n// --graupl-submenu-toggle-transform\n$submenu-toggle-transform: var(\n  --#{root-defaults.$prefix}submenu-toggle-transform,\n  #{defaults.$submenu-toggle-transform}\n);\n\n// --graupl-submenu-toggle-open-transform\n$submenu-toggle-open-transform: var(\n  --#{root-defaults.$prefix}submenu-toggle-open-transform,\n  #{defaults.$submenu-toggle-open-transform}\n);\n\n// --graupl-submenu-toggle-content\n$submenu-toggle-content: var(\n  --#{root-defaults.$prefix}submenu-toggle-content,\n  #{defaults.$submenu-toggle-content}\n);\n\n// --graupl-submenu-toggle-transition\n$submenu-toggle-transition: var(\n  --#{root-defaults.$prefix}submenu-toggle-transition,\n  transform #{map.get(root-variables.$transition-durations, fast)}\n    #{root-variables.$transition-timing-function}\n);\n\n// --graupl-submenu-toggle-transition-reduced-motion\n$submenu-toggle-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}submenu-toggle-transition-reduced-motion,\n  none\n);\n","// @graupl/core navigation component styles.\n//\n// This module provides the navigation bar styles and its toggle/branding elements.\n//\n// The following selectors are generated by default:\n// - `.navigation`: The navigation container.\n// - `.navigation-toggle`: The navigation toggle control.\n// - `.navigation-branding`: The branding link/label.\n//\n// The following custom properties can be used to customize the navigation component:\n// | Property                                                          | Description                                                   | Default Value                                                                                                                                                                                                                         |\n// | ----------------------------------------------------------------- | ------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | `--graupl-navigation-background`                                  | Background colour of the navigation bar.                      | `var(--graupl-background)`                                                                                                                                                                                                            |\n// | `--graupl-navigation-color`                                       | Text colour of the navigation bar.                            | `var(--graupl-color)`                                                                                                                                                                                                                 |\n// | `--graupl-navigation-toggle-min-width`                            | Minimum width of the toggle control.                          | `44px`                                                                                                                                                                                                                                |\n// | `--graupl-navigation-toggle-min-height`                           | Minimum height of the toggle control.                         | `44px`                                                                                                                                                                                                                                |\n// | `--graupl-navigation-toggle-padding-x`                            | Horizontal padding inside the toggle.                         | `var(--graupl-spacer-5)`                                                                                                                                                                                                              |\n// | `--graupl-navigation-toggle-padding-y`                            | Vertical padding inside the toggle.                           | `var(--graupl-spacer-3)`                                                                                                                                                                                                              |\n// | `--graupl-navigation-toggle-padding`                              | Shorthand padding for the toggle.                             | `var(--graupl-navigation-toggle-padding-y) var(--graupl-navigation-toggle-padding-x)`                                                                                                                                                 |\n// | `--graupl-navigation-toggle-background`                           | Background colour of the toggle.                              | `var(--graupl-navigation-background)`                                                                                                                                                                                                 |\n// | `--graupl-navigation-toggle-visited-background`                   | Background when the toggle is visited.                        | `var(--graupl-navigation-toggle-background)`                                                                                                                                                                                          |\n// | `--graupl-navigation-toggle-focus-background`                     | Background when the toggle is focused.                        | `var(--graupl-navigation-toggle-background)`                                                                                                                                                                                          |\n// | `--graupl-navigation-toggle-hover-background`                     | Background when the toggle is hovered.                        | `var(--graupl-navigation-color)`                                                                                                                                                                                                      |\n// | `--graupl-navigation-toggle-active-background`                    | Background when the toggle is active.                         | `var(--graupl-navigation-toggle-hover-background)`                                                                                                                                                                                    |\n// | `--graupl-navigation-toggle-disabled-background`                  | Background when the toggle is disabled.                       | `var(--graupl-navigation-background)`                                                                                                                                                                                                 |\n// | `--graupl-navigation-toggle-color`                                | Text colour of the toggle.                                    | `var(--graupl-navigation-color)`                                                                                                                                                                                                      |\n// | `--graupl-navigation-toggle-visited-color`                        | Text colour of a visited toggle.                              | `var(--graupl-navigation-background)`                                                                                                                                                                                                 |\n// | `--graupl-navigation-toggle-focus-color`                          | Text colour of a focused toggle.                              | `var(--graupl-navigation-background)`                                                                                                                                                                                                 |\n// | `--graupl-navigation-toggle-hover-color`                          | Text colour of a hovered toggle.                              | `var(--graupl-navigation-background)`                                                                                                                                                                                                 |\n// | `--graupl-navigation-toggle-active-color`                         | Text colour of an active toggle.                              | `var(--graupl-navigation-background)`                                                                                                                                                                                                 |\n// | `--graupl-navigation-toggle-disabled-color`                       | Text colour of a disabled toggle.                             | `var(--graupl-theme-active--primary--200)`                                                                                                                                                                                            |\n// | `--graupl-navigation-toggle-border-top-width`                     | Top border width of the toggle.                               | `var(--graupl-border-top-width)`                                                                                                                                                                                                      |\n// | `--graupl-navigation-toggle-border-right-width`                   | Right border width of the toggle.                             | `var(--graupl-border-right-width)`                                                                                                                                                                                                    |\n// | `--graupl-navigation-toggle-border-bottom-width`                  | Bottom border width of the toggle.                            | `var(--graupl-border-bottom-width)`                                                                                                                                                                                                   |\n// | `--graupl-navigation-toggle-border-left-width`                    | Left border width of the toggle.                              | `var(--graupl-border-left-width)`                                                                                                                                                                                                     |\n// | `--graupl-navigation-toggle-border-width`                         | Border width shorthand for the toggle.                        | `var(--graupl-navigation-toggle-border-top-width) var(--graupl-navigation-toggle-border-right-width) var(--graupl-navigation-toggle-border-bottom-width) var(--graupl-navigation-toggle-border-left-width)`                           |\n// | `--graupl-navigation-toggle-border-top-style`                     | Top border style of the toggle.                               | `var(--graupl-border-top-style)`                                                                                                                                                                                                      |\n// | `--graupl-navigation-toggle-border-right-style`                   | Right border style of the toggle.                             | `var(--graupl-border-right-style)`                                                                                                                                                                                                    |\n// | `--graupl-navigation-toggle-border-bottom-style`                  | Bottom border style of the toggle.                            | `var(--graupl-border-bottom-style)`                                                                                                                                                                                                   |\n// | `--graupl-navigation-toggle-border-left-style`                    | Left border style of the toggle.                              | `var(--graupl-border-left-style)`                                                                                                                                                                                                     |\n// | `--graupl-navigation-toggle-border-style`                         | Border style shorthand for the toggle.                        | `var(--graupl-navigation-toggle-border-top-style) var(--graupl-navigation-toggle-border-right-style) var(--graupl-navigation-toggle-border-bottom-style) var(--graupl-navigation-toggle-border-left-style)`                           |\n// | `--graupl-navigation-toggle-border-color`                         | Base border colour of the toggle.                             | `var(--graupl-navigation-toggle-color)`                                                                                                                                                                                               |\n// | `--graupl-navigation-toggle-visited-border-color`                 | Border colour of a visited toggle.                            | `var(--graupl-navigation-toggle-border-color)`                                                                                                                                                                                        |\n// | `--graupl-navigation-toggle-focus-border-color`                   | Border colour of a focused toggle.                            | `var(--graupl-navigation-toggle-border-color)`                                                                                                                                                                                        |\n// | `--graupl-navigation-toggle-hover-border-color`                   | Border colour of a hovered toggle.                            | `var(--graupl-navigation-toggle-hover-color)`                                                                                                                                                                                         |\n// | `--graupl-navigation-toggle-active-border-color`                  | Border colour of an active toggle.                            | `var(--graupl-navigation-toggle-hover-border-color)`                                                                                                                                                                                  |\n// | `--graupl-navigation-toggle-disabled-border-color`                | Border colour of a disabled toggle.                           | `var(--graupl-navigation-toggle-disabled-color)`                                                                                                                                                                                      |\n// | `--graupl-navigation-toggle-border-top-left-radius`               | Top-left border radius of the toggle.                         | `var(--graupl-border-top-left-radius)`                                                                                                                                                                                                |\n// | `--graupl-navigation-toggle-border-top-right-radius`              | Top-right border radius of the toggle.                        | `var(--graupl-border-top-right-radius)`                                                                                                                                                                                               |\n// | `--graupl-navigation-toggle-border-bottom-right-radius`           | Bottom-right border radius of the toggle.                     | `var(--graupl-border-bottom-right-radius)`                                                                                                                                                                                            |\n// | `--graupl-navigation-toggle-border-bottom-left-radius`            | Bottom-left border radius of the toggle.                      | `var(--graupl-border-bottom-left-radius)`                                                                                                                                                                                             |\n// | `--graupl-navigation-toggle-border-radius`                        | Border radius shorthand for the toggle.                       | `var(--graupl-navigation-toggle-border-top-left-radius) var(--graupl-navigation-toggle-border-top-right-radius) var(--graupl-navigation-toggle-border-bottom-right-radius) var(--graupl-navigation-toggle-border-bottom-left-radius)` |\n// | `--graupl-navigation-branding-padding-x`                          | Horizontal padding for the branding element.                  | `var(--graupl-spacer-3)`                                                                                                                                                                                                              |\n// | `--graupl-navigation-branding-padding-y`                          | Vertical padding for the branding element.                    | `var(--graupl-spacer-2)`                                                                                                                                                                                                              |\n// | `--graupl-navigation-branding-padding`                            | Shorthand padding for the branding element.                   | `var(--graupl-navigation-branding-padding-y) var(--graupl-navigation-branding-padding-x)`                                                                                                                                             |\n// | `--graupl-navigation-branding-font-size`                          | Font size of the branding element.                            | `var(--graupl-font-lg)`                                                                                                                                                                                                               |\n// | `--graupl-navigation-branding-font-weight`                        | Font weight of the branding element.                          | `var(--graupl-font-weight-bold)`                                                                                                                                                                                                      |\n// | `--graupl-navigation-branding-color`                              | Text colour for branding.                                     | `var(--graupl-navigation-color)`                                                                                                                                                                                                      |\n// | `--graupl-navigation-branding-visited-color`                      | Text colour for visited branding.                             | `var(--graupl-navigation-branding-color)`                                                                                                                                                                                             |\n// | `--graupl-navigation-branding-focus-color`                        | Text colour for focused branding.                             | `var(--graupl-navigation-branding-color)`                                                                                                                                                                                             |\n// | `--graupl-navigation-branding-hover-color`                        | Text colour for hovered branding.                             | `var(--graupl-navigation-color)`                                                                                                                                                                                                      |\n// | `--graupl-navigation-branding-active-color`                       | Text colour for active branding.                              | `var(--graupl-navigation-branding-hover-color)`                                                                                                                                                                                       |\n// | `--graupl-navigation-branding-disabled-color`                     | Text colour for disabled branding.                            | `var(--graupl-navigation-color)`                                                                                                                                                                                                      |\n// | `--graupl-navigation-branding-text-decoration`                    | Base text decoration for branding.                            | `none`                                                                                                                                                                                                                                |\n// | `--graupl-navigation-branding-visited-text-decoration`            | Text decoration for visited branding.                         | `var(--graupl-navigation-branding-text-decoration)`                                                                                                                                                                                   |\n// | `--graupl-navigation-branding-focus-text-decoration`              | Text decoration for focused branding.                         | `var(--graupl-navigation-branding-text-decoration)`                                                                                                                                                                                   |\n// | `--graupl-navigation-branding-hover-text-decoration`              | Text decoration for hovered branding.                         | `none`                                                                                                                                                                                                                                |\n// | `--graupl-navigation-branding-active-text-decoration`             | Text decoration for active branding.                          | `var(--graupl-navigation-branding-hover-text-decoration)`                                                                                                                                                                             |\n// | `--graupl-navigation-branding-disabled-text-decoration`           | Text decoration for disabled branding.                        | `none`                                                                                                                                                                                                                                |\n// | `--graupl-navigation-branding-text-decoration-style`              | Base text decoration style for branding.                      | `solid`                                                                                                                                                                                                                               |\n// | `--graupl-navigation-branding-visited-text-decoration-style`      | Text decoration style for visited branding.                   | `var(--graupl-navigation-branding-text-decoration-style)`                                                                                                                                                                             |\n// | `--graupl-navigation-branding-focus-text-decoration-style`        | Text decoration style for focused branding.                   | `var(--graupl-navigation-branding-text-decoration-style)`                                                                                                                                                                             |\n// | `--graupl-navigation-branding-hover-text-decoration-style`        | Text decoration style for hovered branding.                   | `solid`                                                                                                                                                                                                                               |\n// | `--graupl-navigation-branding-active-text-decoration-style`       | Text decoration style for active branding.                    | `var(--graupl-navigation-branding-hover-text-decoration-style)`                                                                                                                                                                       |\n// | `--graupl-navigation-branding-disabled-text-decoration-style`     | Text decoration style for disabled branding.                  | `solid`                                                                                                                                                                                                                               |\n// | `--graupl-navigation-branding-text-decoration-thickness`          | Base decoration thickness for branding.                       | `var(--graupl-border-width)`                                                                                                                                                                                                          |\n// | `--graupl-navigation-branding-visited-text-decoration-thickness`  | Decoration thickness for visited branding.                    | `var(--graupl-navigation-branding-text-decoration-thickness)`                                                                                                                                                                         |\n// | `--graupl-navigation-branding-focus-text-decoration-thickness`    | Decoration thickness for focused branding.                    | `var(--graupl-navigation-branding-text-decoration-thickness)`                                                                                                                                                                         |\n// | `--graupl-navigation-branding-hover-text-decoration-thickness`    | Decoration thickness for hovered branding.                    | `var(--graupl-border-width)`                                                                                                                                                                                                          |\n// | `--graupl-navigation-branding-active-text-decoration-thickness`   | Decoration thickness for active branding.                     | `var(--graupl-navigation-branding-hover-text-decoration-thickness)`                                                                                                                                                                   |\n// | `--graupl-navigation-branding-disabled-text-decoration-thickness` | Decoration thickness for disabled branding.                   | `var(--graupl-border-width)`                                                                                                                                                                                                          |\n// | `--graupl-navigation-branding-text-decoration-color`              | Base decoration colour for branding.                          | `var(--graupl-navigation-branding-color)`                                                                                                                                                                                             |\n// | `--graupl-navigation-branding-visited-text-decoration-color`      | Decoration colour for visited branding.                       | `var(--graupl-navigation-branding-visited-color)`                                                                                                                                                                                     |\n// | `--graupl-navigation-branding-focus-text-decoration-color`        | Decoration colour for focused branding.                       | `var(--graupl-navigation-branding-focus-color)`                                                                                                                                                                                       |\n// | `--graupl-navigation-branding-hover-text-decoration-color`        | Decoration colour for hovered branding.                       | `var(--graupl-navigation-branding-hover-color)`                                                                                                                                                                                       |\n// | `--graupl-navigation-branding-active-text-decoration-color`       | Decoration colour for active branding.                        | `var(--graupl-navigation-branding-active-color)`                                                                                                                                                                                      |\n// | `--graupl-navigation-branding-disabled-text-decoration-color`     | Decoration colour for disabled branding.                      | `var(--graupl-navigation-branding-disabled-color)`                                                                                                                                                                                    |\n// | `--graupl-navigation-toggle-content`                              | Content used for the toggle pseudo-element.                   | `'☰'`                                                                                                                                                                                                                                 |\n//\n// The following sass variables can be used to customize the generation of the navigation component:\n// | Variable                             | Description                                                          | Default Value             |\n// | ------------------------------------ | -------------------------------------------------------------------- | ------------------------- |\n// | `$selector-base`                     | Selector base for the component.                                     | `\".\"`                     |\n// | `$modifier-selector-base`            | Selector base for component modifiers.                               | `\".\"`                     |\n// | `$generate-base-theme-map`           | Flag to generate the base theme maps for navigation variants.        | `true`                    |\n// | `$themeable`                         | Flag to generate theme modifiers.                                    | `false`                   |\n// | `$navigation-selector-base`          | Selector base for the navigation container.                          | `$selector-base`          |\n// | `$navigation-selector`               | Selector for the navigation container.                               | `\"navigation\"`            |\n// | `$navigation-theme-selector-base`    | Selector base for navigation theme modifiers.                        | `$modifier-selector-base` |\n// | `$navigation-theme-selector-prefix`  | Selector prefix for navigation theme modifiers.                      | `\"\"`                      |\n// | `$navigation-toggle-selector-base`   | Selector base for the navigation toggle.                             | `$selector-base`          |\n// | `$navigation-toggle-selector`        | Selector for the navigation toggle.                                  | `\"navigation-toggle\"`     |\n// | `$navigation-branding-selector-base` | Selector base for the navigation branding.                           | `$selector-base`          |\n// | `$navigation-branding-selector`      | Selector for the navigation branding.                                | `\"navigation-branding\"`   |\n// | `$navigation-toggle-content`         | Content for the toggle pseudo-element.                               | `'☰'`                     |\n// | `$navigation-theme-mappings`         | A map of properties and shade values applied to navigation variants. | `()`                      |\n// | `$navigation-theme-map`              | A fully expanded property map used to generate navigation variants.  | `()`                      |\n//\n// ## Using `$navigation-theme-mappings`\n//\n// `$navigation-theme-mappings` is a single-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $navigation-theme-mappings: (\n//   color: 900,\n//   background: 100,\n// );\n// ```\n//\n// This directly[1] informs all navigation variants what shade to use for each property key.\n// Based on the example above:\n// - Primary navigations expose `--graupl-navigation-color` as `var(--graupl-theme-active--primary--900)` and `--graupl-navigation-background` as `var(--graupl-theme-active--primary--100)`,\n// - Secondary navigations expose those properties via the secondary palette, and\n// - Tertiary navigations expose those properties via the tertiary palette.\n//\n// You can target multiple properties at once to keep every variant in sync.\n//\n// ```scss\n// $navigation-theme-mappings: (\n//   color: 800,\n//   toggle-hover-background: 700,\n// );\n// ```\n//\n// - Primary navigations use `--graupl-theme-active--primary--800` for `--graupl-navigation-color` and `--graupl-theme-active--primary--700` for `--graupl-navigation-toggle-hover-background`.\n// - Secondary/tertiary navigations pull the same shades from their respective palettes.\n//\n// [1] `$navigation-theme-mappings` gets parsed into a larger, more explicit map: `$navigation-theme-map`.\n//\n// ## Using `$navigation-theme-map`\n//\n// `$navigation-theme-map` is a multi-level map of properties, colours, and shade values, allowing you to override individual variants without affecting the others.\n//\n// e.g.\n// ```scss\n// $navigation-theme-map: (\n//   primary: (\n//     color: (\n//       color: primary,\n//       shade: 950,\n//     ),\n//   ),\n//   secondary: (\n//     background: (\n//       color: secondary,\n//       shade: 200,\n//     ),\n//   ),\n// );\n// ```\n//\n// This example keeps the default behaviour for tertiary navigations, while deepening the colour on the primary variant and lightening the background on the secondary variant.\n//\n// @example\n// <nav class=\"navigation\" data-graupl-menu-type=\"DisclosureMenu\" data-graupl-menu-options=\"{'optionalKeySupport': true}\">\n//   <a class=\"navigation-branding\" href=\"#\">Graupl</a>\n//   <button class=\"navigation-toggle\" aria-label=\"Toggle navigation\"></button>\n//   <ul class=\"menu\">\n//     <li class=\"menu-item\"><a class=\"menu-link\" href=\"#\">Home</a></li>\n//     <li class=\"menu-item submenu-item\">\n//       <button class=\"menu-link button link submenu-toggle\" type=\"button\">About</button>\n//       <ul class=\"submenu\">\n//         <li class=\"menu-item\"><a class=\"menu-link\" href=\"#\">About Us</a></li>\n//         <li class=\"menu-item\"><a class=\"menu-link\" href=\"#\">Our Team</a></li>\n//         <li class=\"menu-item\"><a class=\"menu-link\" href=\"#\">Our Mission</a></li>\n//       </ul>\n//     </li>\n//     <li class=\"menu-item\"><a class=\"menu-link\" href=\"#\">Blog</a></li>\n//     <li class=\"menu-item\"><a class=\"menu-link\" href=\"#\">Portfolio</a></li>\n//     <li class=\"menu-item\"><a class=\"menu-link button tertiary\" href=\"#\">Contact</a></li>\n//   </ul>\n// </nav>\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/screen\";\n@use \"../../mixins/state\";\n@use \"../../mixins/theme\";\n@use \"../menu/defaults\" as menu-defaults;\n@use \"../menu/variables\" as menu-variables;\n@use \"defaults\";\n@use \"variables\" as *;\n\n@include layer(component) {\n  // .navigation\n  #{defaults.$navigation-selector-base}#{defaults.$navigation-selector} {\n    display: grid;\n    grid-template-areas:\n      \"branding - toggle\"\n      \"menu menu menu\";\n    grid-template-columns: auto 1fr auto;\n    isolation: isolate;\n\n    // .menu\n    #{menu-defaults.$menu-selector-base}#{menu-defaults.$menu-selector} {\n      grid-area: menu;\n\n      // &.show\n      &#{menu-defaults.$menu-show-selector-base}#{menu-defaults.$menu-show-selector} {\n        --#{root-defaults.$prefix}menu-display: #{menu-variables.$menu-show-display};\n      }\n\n      // &.hide\n      &#{menu-defaults.$menu-hide-selector-base}#{menu-defaults.$menu-hide-selector} {\n        --#{root-defaults.$prefix}menu-display: #{menu-variables.$menu-hide-display};\n      }\n    }\n  }\n\n  // .navigation-toggle\n  #{defaults.$navigation-toggle-selector-base}#{defaults.$navigation-toggle-selector} {\n    display: flex;\n    grid-area: toggle;\n    align-items: center;\n    justify-content: center;\n    min-width: $navigation-toggle-min-width;\n    min-height: $navigation-toggle-min-height;\n    padding: $navigation-toggle-padding;\n    border-width: $navigation-toggle-border-width;\n    border-style: $navigation-toggle-border-style;\n    border-radius: $navigation-toggle-border-radius;\n\n    &::before {\n      content: $navigation-toggle-content;\n      display: block;\n    }\n  }\n\n  // .navigation-branding\n  #{defaults.$navigation-branding-selector-base}#{defaults.$navigation-branding-selector} {\n    display: flex;\n    grid-area: branding;\n    align-items: center;\n    justify-content: flex-start;\n    padding: $navigation-branding-padding;\n    font-size: $navigation-branding-font-size;\n    font-weight: $navigation-branding-font-weight;\n    text-decoration: $navigation-branding-text-decoration;\n    text-decoration-style: $navigation-branding-text-decoration-style;\n    text-decoration-thickness: $navigation-branding-text-decoration-thickness;\n\n    @include state.generate-modifiers(\n      (\n        text-decoration: $navigation-branding-text-decoration-states,\n        text-decoration-thickness:\n          $navigation-branding-text-decoration-thickness-states,\n        text-decoration-style: $navigation-branding-text-decoration-style-states,\n      )\n    );\n  }\n\n  @include screen.trigger(navigation-collapse) {\n    // .navigation\n    #{defaults.$navigation-selector-base}#{defaults.$navigation-selector} {\n      --#{root-defaults.$prefix}menu-flex-direction: column;\n      --#{root-defaults.$prefix}submenu-position: relative;\n      --#{root-defaults.$prefix}menu-item-min-width: 100%;\n      --#{root-defaults.$prefix}submenu-inset: auto;\n    }\n  }\n\n  @include screen.trigger(navigation-expand) {\n    // .navigation\n    #{defaults.$navigation-selector-base}#{defaults.$navigation-selector} {\n      --#{root-defaults.$prefix}menu-hide-display: #{menu-variables.$menu-show-display};\n\n      grid-template-areas: \"branding - menu\";\n    }\n\n    // .navigation-toggle\n    #{defaults.$navigation-toggle-selector-base}#{defaults.$navigation-toggle-selector} {\n      display: none;\n    }\n  }\n}\n\n@include layer(theme) {\n  // .navigation\n  #{defaults.$navigation-selector-base}#{defaults.$navigation-selector} {\n    --#{root-defaults.$prefix}menu-background: #{$navigation-background};\n    --#{root-defaults.$prefix}menu-color: #{$navigation-color};\n\n    background: $navigation-background;\n    color: $navigation-color;\n\n    @if root-defaults.$themeable-components and defaults.$themeable {\n      @include theme.generate-modifiers(\n        defaults.$navigation-theme-map,\n        defaults.$navigation-theme-selector-base,\n        defaults.$navigation-theme-selector-prefix,\n        \"navigation-\"\n      );\n      @include theme.generate-modifiers(\n        defaults.$navigation-theme-map,\n        defaults.$navigation-theme-selector-base,\n        defaults.$navigation-theme-selector-prefix,\n        \"navigation-\",\n        \"\"\n      );\n    }\n  }\n\n  // .navigation-toggle\n  #{defaults.$navigation-toggle-selector-base}#{defaults.$navigation-toggle-selector} {\n    border-color: $navigation-toggle-border-color;\n    background: $navigation-toggle-background;\n    color: $navigation-toggle-color;\n\n    @include state.generate-modifiers(\n      (\n        border-color: $navigation-toggle-border-color-states,\n        background: $navigation-toggle-background-states,\n        color: $navigation-toggle-color-states,\n      )\n    );\n  }\n\n  // .navigation-branding\n  #{defaults.$navigation-branding-selector-base}#{defaults.$navigation-branding-selector} {\n    color: $navigation-branding-color;\n    text-decoration-color: $navigation-branding-text-decoration-color;\n\n    @include state.generate-modifiers(\n      (\n        color: $navigation-branding-color-states,\n        text-decoration: $navigation-branding-text-decoration-color-states,\n      )\n    );\n  }\n}\n","// @graupl/core navigation component variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property                                                 | Default                                                                                                                                                                                                                             |\n// | --------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | Custom property                                                 | Default                                                                                                                                                                                                                             |\n// | --------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-navigation-background                                  | var(--graupl-background)                                                                                                                                                                                                            |\n// | --graupl-navigation-color                                       | var(--graupl-color)                                                                                                                                                                                                                 |\n// | --graupl-navigation-toggle-min-width                            | 44px                                                                                                                                                                                                                                |\n// | --graupl-navigation-toggle-min-height                           | 44px                                                                                                                                                                                                                                |\n// | --graupl-navigation-toggle-padding-x                            | var(--graupl-spacer-5)                                                                                                                                                                                                              |\n// | --graupl-navigation-toggle-padding-y                            | var(--graupl-spacer-3)                                                                                                                                                                                                              |\n// | --graupl-navigation-toggle-padding                              | var(--graupl-navigation-toggle-padding-y) var(--graupl-navigation-toggle-padding-x)                                                                                                                                                 |\n// | --graupl-navigation-toggle-background                           | var(--graupl-navigation-background)                                                                                                                                                                                                 |\n// | --graupl-navigation-toggle-color                                | var(--graupl-navigation-color)                                                                                                                                                                                                      |\n// | --graupl-navigation-toggle-hover-background                     | var(--graupl-navigation-color)                                                                                                                                                                                                      |\n// | --graupl-navigation-toggle-hover-color                          | var(--graupl-navigation-background)                                                                                                                                                                                                 |\n// | --graupl-navigation-toggle-border-top-width                     | var(--graupl-border-top-width)                                                                                                                                                                                                      |\n// | --graupl-navigation-toggle-border-right-width                   | var(--graupl-border-right-width)                                                                                                                                                                                                    |\n// | --graupl-navigation-toggle-border-bottom-width                  | var(--graupl-border-bottom-width)                                                                                                                                                                                                   |\n// | --graupl-navigation-toggle-border-left-width                    | var(--graupl-border-left-width)                                                                                                                                                                                                     |\n// | --graupl-navigation-toggle-border-width                         | var(--graupl-navigation-toggle-border-top-width) var(--graupl-navigation-toggle-border-right-width) var(--graupl-navigation-toggle-border-bottom-width) var(--graupl-navigation-toggle-border-left-width)                           |\n// | --graupl-navigation-toggle-border-top-style                     | var(--graupl-border-top-style)                                                                                                                                                                                                      |\n// | --graupl-navigation-toggle-border-right-style                   | var(--graupl-border-right-style)                                                                                                                                                                                                    |\n// | --graupl-navigation-toggle-border-bottom-style                  | var(--graupl-border-bottom-style)                                                                                                                                                                                                   |\n// | --graupl-navigation-toggle-border-left-style                    | var(--graupl-border-left-style)                                                                                                                                                                                                     |\n// | --graupl-navigation-toggle-border-style                         | var(--graupl-navigation-toggle-border-top-style) var(--graupl-navigation-toggle-border-right-style) var(--graupl-navigation-toggle-border-bottom-style) var(--graupl-navigation-toggle-border-left-style)                           |\n// | --graupl-navigation-toggle-border-color                         | var(--graupl-navigation-toggle-color)                                                                                                                                                                                               |\n// | --graupl-navigation-toggle-border-top-left-radius               | var(--graupl-border-top-left-radius)                                                                                                                                                                                                |\n// | --graupl-navigation-toggle-border-top-right-radius              | var(--graupl-border-top-right-radius)                                                                                                                                                                                               |\n// | --graupl-navigation-toggle-border-bottom-left-radius            | var(--graupl-border-bottom-left-radius)                                                                                                                                                                                             |\n// | --graupl-navigation-toggle-border-bottom-right-radius           | var(--graupl-border-bottom-right-radius)                                                                                                                                                                                            |\n// | --graupl-navigation-toggle-border-radius                        | var(--graupl-navigation-toggle-border-top-left-radius) var(--graupl-navigation-toggle-border-top-right-radius) var(--graupl-navigation-toggle-border-bottom-right-radius) var(--graupl-navigation-toggle-border-bottom-left-radius) |\n// | --graupl-navigation-branding-font-size                          | var(--graupl-font-lg)                                                                                                                                                                                                               |\n// | --graupl-navigation-branding-font-weight                        | var(--graupl-font-weight-bold)                                                                                                                                                                                                      |\n// | --graupl-navigation-branding-padding-x                          | var(--graupl-spacer-3)                                                                                                                                                                                                              |\n// | --graupl-navigation-branding-padding-y                          | var(--graupl-spacer-2)                                                                                                                                                                                                              |\n// | --graupl-navigation-branding-padding                            | var(--graupl-navigation-branding-padding-y) var(--graupl-navigation-branding-padding-x)                                                                                                                                             |\n// | --graupl-navigation-branding-color                              | var(--graupl-navigation-color)                                                                                                                                                                                                      |\n// | --graupl-navigation-branding-visited-color                      | var(--graupl-navigation-branding-color)                                                                                                                                                                                             |\n// | --graupl-navigation-branding-focus-color                        | var(--graupl-navigation-branding-color)                                                                                                                                                                                             |\n// | --graupl-navigation-branding-hover-color                        | var(--graupl-navigation-color)                                                                                                                                                                                                      |\n// | --graupl-navigation-branding-active-color                       | var(--graupl-navigation-branding-hover-color)                                                                                                                                                                                       |\n// | --graupl-navigation-branding-disabled-color                     | var(--graupl-navigation-color)                                                                                                                                                                                                      |\n// | --graupl-navigation-branding-text-decoration                    | none                                                                                                                                                                                                                                |\n// | --graupl-navigation-branding-visited-text-decoration            | var(--graupl-navigation-branding-text-decoration)                                                                                                                                                                                   |\n// | --graupl-navigation-branding-focus-text-decoration              | var(--graupl-navigation-branding-text-decoration)                                                                                                                                                                                   |\n// | --graupl-navigation-branding-hover-text-decoration              | none                                                                                                                                                                                                                                |\n// | --graupl-navigation-branding-active-text-decoration             | var(--graupl-navigation-branding-hover-text-decoration)                                                                                                                                                                             |\n// | --graupl-navigation-branding-disabled-text-decoration           | none                                                                                                                                                                                                                                |\n// | --graupl-navigation-branding-text-decoration-style              | solid                                                                                                                                                                                                                               |\n// | --graupl-navigation-branding-visited-text-decoration-style      | var(--graupl-navigation-branding-text-decoration-style)                                                                                                                                                                             |\n// | --graupl-navigation-branding-focus-text-decoration-style        | var(--graupl-navigation-branding-text-decoration-style)                                                                                                                                                                             |\n// | --graupl-navigation-branding-hover-text-decoration-style        | solid                                                                                                                                                                                                                               |\n// | --graupl-navigation-branding-active-text-decoration-style       | var(--graupl-navigation-branding-hover-text-decoration-style)                                                                                                                                                                       |\n// | --graupl-navigation-branding-disabled-text-decoration-style     | solid                                                                                                                                                                                                                               |\n// | --graupl-navigation-branding-text-decoration-thickness          | var(--graupl-border-width)                                                                                                                                                                                                          |\n// | --graupl-navigation-branding-visited-text-decoration-thickness  | var(--graupl-navigation-branding-text-decoration-thickness)                                                                                                                                                                         |\n// | --graupl-navigation-branding-focus-text-decoration-thickness    | var(--graupl-navigation-branding-text-decoration-thickness)                                                                                                                                                                         |\n// | --graupl-navigation-branding-hover-text-decoration-thickness    | var(--graupl-border-width)                                                                                                                                                                                                          |\n// | --graupl-navigation-branding-active-text-decoration-thickness   | var(--graupl-navigation-branding-hover-text-decoration-thickness)                                                                                                                                                                   |\n// | --graupl-navigation-branding-disabled-text-decoration-thickness | var(--graupl-border-width)                                                                                                                                                                                                          |\n// | --graupl-navigation-branding-text-decoration-color              | var(--graupl-navigation-branding-color)                                                                                                                                                                                             |\n// | --graupl-navigation-branding-visited-text-decoration-color      | var(--graupl-navigation-branding-visited-color)                                                                                                                                                                                     |\n// | --graupl-navigation-branding-focus-text-decoration-color        | var(--graupl-navigation-branding-focus-color)                                                                                                                                                                                       |\n// | --graupl-navigation-branding-hover-text-decoration-color        | var(--graupl-navigation-branding-hover-color)                                                                                                                                                                                       |\n// | --graupl-navigation-branding-active-text-decoration-color       | var(--graupl-navigation-branding-active-color)                                                                                                                                                                                      |\n// | --graupl-navigation-branding-disabled-text-decoration-color     | var(--graupl-navigation-branding-disabled-color)                                                                                                                                                                                    |\n// | --graupl-navigation-toggle-content                              | \"'☰'\"                                                                                                                                                                                                                               |\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../functions/theme\";\n@use \"../../theme/color/variables\" as color;\n@use \"../../theme/typography/variables\" as typography;\n@use \"../../variables\" as root-variables;\n@use \"defaults\";\n@use \"sass:map\";\n\n// Navigation colors.\n// --graupl-navigation-background\n$navigation-background: var(\n  --#{root-defaults.$prefix}navigation-background,\n  #{color.$background}\n);\n\n// --graupl-navigation-color\n$navigation-color: var(\n  --#{root-defaults.$prefix}navigation-color,\n  #{color.$color}\n);\n\n// Navigation toggle size.\n// --graupl-navigation-toggle-min-width\n$navigation-toggle-min-width: var(\n  --#{root-defaults.$prefix}navigation-toggle-min-width,\n  #{root-defaults.$interactive-min-width}\n);\n\n// --graupl-navigation-toggle-min-height\n$navigation-toggle-min-height: var(\n  --#{root-defaults.$prefix}navigation-toggle-min-height,\n  #{root-defaults.$interactive-min-height}\n);\n\n// Navigation toggle spacing.\n// --graupl-navigation-toggle-padding-x\n$navigation-toggle-padding-x: var(\n  --#{root-defaults.$prefix}navigation-toggle-padding-x,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-navigation-toggle-padding-y\n$navigation-toggle-padding-y: var(\n  --#{root-defaults.$prefix}navigation-toggle-padding-y,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-navigation-toggle-padding\n$navigation-toggle-padding: var(\n  --#{root-defaults.$prefix}navigation-toggle-padding,\n  #{$navigation-toggle-padding-y} #{$navigation-toggle-padding-x}\n);\n\n// Navigation toggle colors.\n// --graupl-navigation-toggle-background\n$navigation-toggle-background: var(\n  --#{root-defaults.$prefix}navigation-toggle-background,\n  #{$navigation-background}\n);\n\n// --graupl-navigation-toggle-visited-background\n$navigation-toggle-visited-background: var(\n  --#{root-defaults.$prefix}navigation-toggle-visited-background,\n  #{$navigation-toggle-background}\n);\n\n// --graupl-navigation-toggle-focus-background\n$navigation-toggle-focus-background: var(\n  --#{root-defaults.$prefix}navigation-toggle-focus-background,\n  #{$navigation-toggle-background}\n);\n\n// --graupl-navigation-toggle-hover-background\n$navigation-toggle-hover-background: var(\n  --#{root-defaults.$prefix}navigation-toggle-hover-background,\n  #{$navigation-color}\n);\n\n// --graupl-navigation-toggle-active-background\n$navigation-toggle-active-background: var(\n  --#{root-defaults.$prefix}navigation-toggle-active-background,\n  #{$navigation-toggle-hover-background}\n);\n\n// --graupl-navigation-toggle-disabled-background\n$navigation-toggle-disabled-background: var(\n  --#{root-defaults.$prefix}navigation-toggle-disabled-background,\n  #{$navigation-background}\n);\n$navigation-toggle-background-states: (\n  default: $navigation-toggle-background,\n  visited: $navigation-toggle-visited-background,\n  focus: $navigation-toggle-focus-background,\n  hover: $navigation-toggle-hover-background,\n  active: $navigation-toggle-active-background,\n  disabled: $navigation-toggle-disabled-background,\n);\n\n// --graupl-navigation-toggle-color\n$navigation-toggle-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-color,\n  #{$navigation-color}\n);\n\n// --graupl-navigation-toggle-visited-color\n$navigation-toggle-visited-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-visited-color,\n  #{$navigation-background}\n);\n\n// --graupl-navigation-toggle-focus-color\n$navigation-toggle-focus-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-focus-color,\n  #{$navigation-background}\n);\n\n// --graupl-navigation-toggle-hover-color\n$navigation-toggle-hover-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-hover-color,\n  #{$navigation-background}\n);\n\n// --graupl-navigation-toggle-active-color\n$navigation-toggle-active-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-active-color,\n  #{$navigation-background}\n);\n\n// --graupl-navigation-toggle-disabled-color\n$navigation-toggle-disabled-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-disabled-color,\n  #{theme.get(primary, 200)}\n);\n$navigation-toggle-color-states: (\n  default: $navigation-toggle-color,\n  visited: $navigation-toggle-visited-color,\n  focus: $navigation-toggle-focus-color,\n  hover: $navigation-toggle-hover-color,\n  active: $navigation-toggle-active-color,\n  disabled: $navigation-toggle-disabled-color,\n);\n\n// Navigation toggle border properties.\n// --graupl-navigation-toggle-border-top-width\n$navigation-toggle-border-top-width: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-top-width,\n  #{root-variables.$border-top-width}\n);\n\n// --graupl-navigation-toggle-border-right-width\n$navigation-toggle-border-right-width: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-right-width,\n  #{root-variables.$border-right-width}\n);\n\n// --graupl-navigation-toggle-border-bottom-width\n$navigation-toggle-border-bottom-width: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-bottom-width,\n  #{root-variables.$border-bottom-width}\n);\n\n// --graupl-navigation-toggle-border-left-width\n$navigation-toggle-border-left-width: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-left-width,\n  #{root-variables.$border-left-width}\n);\n\n// --graupl-navigation-toggle-border-width\n$navigation-toggle-border-width: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-width,\n  #{$navigation-toggle-border-top-width}\n    #{$navigation-toggle-border-right-width}\n    #{$navigation-toggle-border-bottom-width}\n    #{$navigation-toggle-border-left-width}\n);\n\n// --graupl-navigation-toggle-border-top-style\n$navigation-toggle-border-top-style: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-navigation-toggle-border-right-style\n$navigation-toggle-border-right-style: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-navigation-toggle-border-bottom-style\n$navigation-toggle-border-bottom-style: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-navigation-toggle-border-left-style\n$navigation-toggle-border-left-style: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-navigation-toggle-border-style\n$navigation-toggle-border-style: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-style,\n  #{$navigation-toggle-border-top-style}\n    #{$navigation-toggle-border-right-style}\n    #{$navigation-toggle-border-bottom-style}\n    #{$navigation-toggle-border-left-style}\n);\n\n// --graupl-navigation-toggle-border-color\n$navigation-toggle-border-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-color,\n  #{$navigation-toggle-color}\n);\n\n// --graupl-navigation-toggle-visited-border-color\n$navigation-toggle-visited-border-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-visited-border-color,\n  #{$navigation-toggle-border-color}\n);\n\n// --graupl-navigation-toggle-focus-border-color\n$navigation-toggle-focus-border-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-focus-border-color,\n  #{$navigation-toggle-border-color}\n);\n\n// --graupl-navigation-toggle-hover-border-color\n$navigation-toggle-hover-border-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-hover-border-color,\n  #{$navigation-toggle-hover-color}\n);\n\n// --graupl-navigation-toggle-active-border-color\n$navigation-toggle-active-border-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-active-border-color,\n  #{$navigation-toggle-hover-border-color}\n);\n\n// --graupl-navigation-toggle-disabled-border-color\n$navigation-toggle-disabled-border-color: var(\n  --#{root-defaults.$prefix}navigation-toggle-disabled-border-color,\n  #{$navigation-toggle-disabled-color}\n);\n$navigation-toggle-border-color-states: (\n  default: $navigation-toggle-border-color,\n  visited: $navigation-toggle-visited-border-color,\n  focus: $navigation-toggle-focus-border-color,\n  hover: $navigation-toggle-hover-border-color,\n  active: $navigation-toggle-active-border-color,\n  disabled: $navigation-toggle-disabled-border-color,\n);\n\n// --graupl-navigation-toggle-border-top-left-radius\n$navigation-toggle-border-top-left-radius: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-navigation-toggle-border-top-right-radius\n$navigation-toggle-border-top-right-radius: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-navigation-toggle-border-bottom-left-radius\n$navigation-toggle-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-navigation-toggle-border-bottom-right-radius\n$navigation-toggle-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-navigation-toggle-border-radius\n$navigation-toggle-border-radius: var(\n  --#{root-defaults.$prefix}navigation-toggle-border-radius,\n  #{$navigation-toggle-border-top-left-radius}\n    #{$navigation-toggle-border-top-right-radius}\n    #{$navigation-toggle-border-bottom-right-radius}\n    #{$navigation-toggle-border-bottom-left-radius}\n);\n\n// Navigation branding properties.\n// --graupl-navigation-branding-font-size\n$navigation-branding-font-size: var(\n  --#{root-defaults.$prefix}navigation-branding-font-size,\n  #{map.get(typography.$font-sizes, \"lg\")}\n);\n\n// --graupl-navigation-branding-font-weight\n$navigation-branding-font-weight: var(\n  --#{root-defaults.$prefix}navigation-branding-font-weight,\n  #{typography.$font-weight-bold}\n);\n\n// --graupl-navigation-branding-padding-x\n$navigation-branding-padding-x: var(\n  --#{root-defaults.$prefix}navigation-branding-padding-x,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-navigation-branding-padding-y\n$navigation-branding-padding-y: var(\n  --#{root-defaults.$prefix}navigation-branding-padding-y,\n  #{map.get(root-variables.$spacers, 2)}\n);\n\n// --graupl-navigation-branding-padding\n$navigation-branding-padding: var(\n  --#{root-defaults.$prefix}navigation-branding-padding,\n  #{$navigation-branding-padding-y} #{$navigation-branding-padding-x}\n);\n\n// Navigation branding colors.\n// --graupl-navigation-branding-color\n$navigation-branding-color: var(\n  --#{root-defaults.$prefix}navigation-branding-color,\n  #{$navigation-color}\n);\n\n// --graupl-navigation-branding-visited-color\n$navigation-branding-visited-color: var(\n  --#{root-defaults.$prefix}navigation-branding-visited-color,\n  #{$navigation-branding-color}\n);\n\n// --graupl-navigation-branding-focus-color\n$navigation-branding-focus-color: var(\n  --#{root-defaults.$prefix}navigation-branding-focus-color,\n  #{$navigation-branding-color}\n);\n\n// --graupl-navigation-branding-hover-color\n$navigation-branding-hover-color: var(\n  --#{root-defaults.$prefix}navigation-branding-hover-color,\n  #{$navigation-color}\n);\n\n// --graupl-navigation-branding-active-color\n$navigation-branding-active-color: var(\n  --#{root-defaults.$prefix}navigation-branding-active-color,\n  #{$navigation-branding-hover-color}\n);\n\n// --graupl-navigation-branding-disabled-color\n$navigation-branding-disabled-color: var(\n  --#{root-defaults.$prefix}navigation-branding-disabled-color,\n  #{$navigation-color}\n);\n$navigation-branding-color-states: (\n  default: $navigation-branding-color,\n  visited: $navigation-branding-visited-color,\n  focus: $navigation-branding-focus-color,\n  hover: $navigation-branding-hover-color,\n  active: $navigation-branding-active-color,\n  disabled: $navigation-branding-disabled-color,\n);\n\n// Navigation branding text decoration properties.\n// --graupl-navigation-branding-text-decoration\n$navigation-branding-text-decoration: var(\n  --#{root-defaults.$prefix}navigation-branding-text-decoration,\n  #{defaults.$navigation-branding-initial-text-decoration}\n);\n\n// --graupl-navigation-branding-visited-text-decoration\n$navigation-branding-visited-text-decoration: var(\n  --#{root-defaults.$prefix}navigation-branding-visited-text-decoration,\n  #{$navigation-branding-text-decoration}\n);\n\n// --graupl-navigation-branding-focus-text-decoration\n$navigation-branding-focus-text-decoration: var(\n  --#{root-defaults.$prefix}navigation-branding-focus-text-decoration,\n  #{$navigation-branding-text-decoration}\n);\n\n// --graupl-navigation-branding-hover-text-decoration\n$navigation-branding-hover-text-decoration: var(\n  --#{root-defaults.$prefix}navigation-branding-hover-text-decoration,\n  #{defaults.$navigation-branding-final-text-decoration}\n);\n\n// --graupl-navigation-branding-active-text-decoration\n$navigation-branding-active-text-decoration: var(\n  --#{root-defaults.$prefix}navigation-branding-active-text-decoration,\n  #{$navigation-branding-hover-text-decoration}\n);\n\n// --graupl-navigation-branding-disabled-text-decoration\n$navigation-branding-disabled-text-decoration: var(\n  --#{root-defaults.$prefix}navigation-branding-disabled-text-decoration,\n  #{defaults.$navigation-branding-disabled-text-decoration}\n);\n$navigation-branding-text-decoration-states: (\n  default: $navigation-branding-text-decoration,\n  visited: $navigation-branding-visited-text-decoration,\n  focus: $navigation-branding-focus-text-decoration,\n  hover: $navigation-branding-hover-text-decoration,\n  active: $navigation-branding-active-text-decoration,\n  disabled: $navigation-branding-disabled-text-decoration,\n);\n\n// --graupl-navigation-branding-text-decoration-style\n$navigation-branding-text-decoration-style: var(\n  --#{root-defaults.$prefix}navigation-branding-text-decoration-style,\n  #{defaults.$navigation-branding-initial-text-decoration-style}\n);\n\n// --graupl-navigation-branding-visited-text-decoration-style\n$navigation-branding-visited-text-decoration-style: var(\n  --#{root-defaults.$prefix}navigation-branding-visited-text-decoration-style,\n  #{$navigation-branding-text-decoration-style}\n);\n\n// --graupl-navigation-branding-focus-text-decoration-style\n$navigation-branding-focus-text-decoration-style: var(\n  --#{root-defaults.$prefix}navigation-branding-focus-text-decoration-style,\n  #{$navigation-branding-text-decoration-style}\n);\n\n// --graupl-navigation-branding-hover-text-decoration-style\n$navigation-branding-hover-text-decoration-style: var(\n  --#{root-defaults.$prefix}navigation-branding-hover-text-decoration-style,\n  #{defaults.$navigation-branding-final-text-decoration-style}\n);\n\n// --graupl-navigation-branding-active-text-decoration-style\n$navigation-branding-active-text-decoration-style: var(\n  --#{root-defaults.$prefix}navigation-branding-active-text-decoration-style,\n  #{$navigation-branding-hover-text-decoration-style}\n);\n\n// --graupl-navigation-branding-disabled-text-decoration-style\n$navigation-branding-disabled-text-decoration-style: var(\n  --#{root-defaults.$prefix}navigation-branding-disabled-text-decoration-style,\n  #{defaults.$navigation-branding-disabled-text-decoration-style}\n);\n$navigation-branding-text-decoration-style-states: (\n  default: $navigation-branding-text-decoration-style,\n  visited: $navigation-branding-visited-text-decoration-style,\n  focus: $navigation-branding-focus-text-decoration-style,\n  hover: $navigation-branding-hover-text-decoration-style,\n  active: $navigation-branding-active-text-decoration-style,\n  disabled: $navigation-branding-disabled-text-decoration-style,\n);\n\n// --graupl-navigation-branding-text-decoration-thickness\n$navigation-branding-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}navigation-branding-text-decoration-thickness,\n  #{root-variables.$border-width}\n);\n\n// --graupl-navigation-branding-visited-text-decoration-thickness\n$navigation-branding-visited-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}navigation-branding-visited-text-decoration-thickness,\n  #{$navigation-branding-text-decoration-thickness}\n);\n\n// --graupl-navigation-branding-focus-text-decoration-thickness\n$navigation-branding-focus-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}navigation-branding-focus-text-decoration-thickness,\n  #{$navigation-branding-text-decoration-thickness}\n);\n\n// --graupl-navigation-branding-hover-text-decoration-thickness\n$navigation-branding-hover-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}navigation-branding-hover-text-decoration-thickness,\n  #{root-variables.$border-width}\n);\n\n// --graupl-navigation-branding-active-text-decoration-thickness\n$navigation-branding-active-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}navigation-branding-active-text-decoration-thickness,\n  #{$navigation-branding-hover-text-decoration-thickness}\n);\n\n// --graupl-navigation-branding-disabled-text-decoration-thickness\n$navigation-branding-disabled-text-decoration-thickness: var(\n  --#{root-defaults.$prefix}navigation-branding-disabled-text-decoration-thickness,\n  #{root-variables.$border-width}\n);\n$navigation-branding-text-decoration-thickness-states: (\n  default: $navigation-branding-text-decoration-thickness,\n  visited: $navigation-branding-visited-text-decoration-thickness,\n  focus: $navigation-branding-focus-text-decoration-thickness,\n  hover: $navigation-branding-hover-text-decoration-thickness,\n  active: $navigation-branding-active-text-decoration-thickness,\n  disabled: $navigation-branding-disabled-text-decoration-thickness,\n);\n\n// --graupl-navigation-branding-text-decoration-color\n$navigation-branding-text-decoration-color: var(\n  --#{root-defaults.$prefix}navigation-branding-text-decoration-color,\n  #{$navigation-branding-color}\n);\n\n// --graupl-navigation-branding-visited-text-decoration-color\n$navigation-branding-visited-text-decoration-color: var(\n  --#{root-defaults.$prefix}navigation-branding-visited-text-decoration-color,\n  #{$navigation-branding-visited-color}\n);\n\n// --graupl-navigation-branding-focus-text-decoration-color\n$navigation-branding-focus-text-decoration-color: var(\n  --#{root-defaults.$prefix}navigation-branding-focus-text-decoration-color,\n  #{$navigation-branding-focus-color}\n);\n\n// --graupl-navigation-branding-hover-text-decoration-color\n$navigation-branding-hover-text-decoration-color: var(\n  --#{root-defaults.$prefix}navigation-branding-hover-text-decoration-color,\n  #{$navigation-branding-hover-color}\n);\n\n// --graupl-navigation-branding-active-text-decoration-color\n$navigation-branding-active-text-decoration-color: var(\n  --#{root-defaults.$prefix}navigation-branding-active-text-decoration-color,\n  #{$navigation-branding-active-color}\n);\n\n// --graupl-navigation-branding-disabled-text-decoration-color\n$navigation-branding-disabled-text-decoration-color: var(\n  --#{root-defaults.$prefix}navigation-branding-disabled-text-decoration-color,\n  #{$navigation-branding-disabled-color}\n);\n$navigation-branding-text-decoration-color-states: (\n  default: $navigation-branding-text-decoration-color,\n  visited: $navigation-branding-visited-text-decoration-color,\n  focus: $navigation-branding-focus-text-decoration-color,\n  hover: $navigation-branding-hover-text-decoration-color,\n  active: $navigation-branding-active-text-decoration-color,\n  disabled: $navigation-branding-disabled-text-decoration-color,\n);\n\n// Navigation toggle properties.\n// --graupl-navigation-toggle-content\n$navigation-toggle-content: var(\n  --#{root-defaults.$prefix}navigation-toggle-content,\n  #{defaults.$navigation-toggle-content}\n);\n","// @graupl/core badge base variables.\n//\n// These values are to be used to directly style bases and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property                                      | Default                                                                                                                                                                                                                         |\n// | ---------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-tabs-padding-x                              | var(--graupl-spacer-0)                                                                                                                                                                                                          |\n// | --graupl-tabs-padding-y                              | var(--graupl-spacer-0)                                                                                                                                                                                                          |\n// | --graupl-tabs-padding                                | var(--graupl-tabs-padding-y) var(--graupl-tabs-padding-x)                                                                                                                                                                       |\n// | --graupl-tabs-color                                  | var(--graupl-color)                                                                                                                                                                                                             |\n// | --graupl-tabs-background                             | var(--graupl-background)                                                                                                                                                                                                        |\n// | --graupl-tabs-border-color                           | var(--graupl-tabs-color)                                                                                                                                                                                                        |\n// | --graupl-tabs-border-top-left-radius                 | var(--graupl-border-top-left-radius)                                                                                                                                                                                            |\n// | --graupl-tabs-border-top-right-radius                | var(--graupl-border-top-right-radius)                                                                                                                                                                                           |\n// | --graupl-tabs-border-bottom-left-radius              | var(--graupl-border-bottom-left-radius)                                                                                                                                                                                         |\n// | --graupl-tabs-border-bottom-right-radius             | var(--graupl-border-bottom-right-radius)                                                                                                                                                                                        |\n// | --graupl-tabs-border-radius                          | var(--graupl-tabs-border-top-left-radius) var(--graupl-tabs-border-top-right-radius) var(--graupl-tabs-border-bottom-right-radius) var(--graupl-tabs-border-bottom-left-radius)                                                 |\n// | --graupl-tabs-border-top-width                       | 0rem                                                                                                                                                                                                                            |\n// | --graupl-tabs-border-right-width                     | 0rem                                                                                                                                                                                                                            |\n// | --graupl-tabs-border-bottom-width                    | 0rem                                                                                                                                                                                                                            |\n// | --graupl-tabs-border-left-width                      | 0rem                                                                                                                                                                                                                            |\n// | --graupl-tabs-border-width                           | var(--graupl-tabs-border-top-width) var(--graupl-tabs-border-right-width) var(--graupl-tabs-border-bottom-width) var(--graupl-tabs-border-left-width)                                                                           |\n// | --graupl-tabs-border-top-style                       | var(--graupl-border-top-style)                                                                                                                                                                                                  |\n// | --graupl-tabs-border-right-style                     | var(--graupl-border-right-style)                                                                                                                                                                                                |\n// | --graupl-tabs-border-bottom-style                    | var(--graupl-border-bottom-style)                                                                                                                                                                                               |\n// | --graupl-tabs-border-left-style                      | var(--graupl-border-left-style)                                                                                                                                                                                                 |\n// | --graupl-tabs-border-style                           | var(--graupl-tabs-border-top-style) var(--graupl-tabs-border-right-style) var(--graupl-tabs-border-bottom-style) var(--graupl-tabs-border-left-style)                                                                           |\n// | --graupl-tabs-tab-list-column-gap                    | var(--graupl-spacer-0)                                                                                                                                                                                                          |\n// | --graupl-tabs-tab-list-row-gap                       | var(--graupl-spacer-2)                                                                                                                                                                                                          |\n// | --graupl-tabs-tab-list-gap                           | var(--graupl-tabs-tab-list-column-gap) var(--graupl-tabs-tab-list-row-gap)                                                                                                                                                      |\n// | --graupl-tabs-tab-list-background                    | var(--graupl-tabs-background)                                                                                                                                                                                                   |\n// | --graupl-tabs-tab-list-color                         | var(--graupl-tabs-color)                                                                                                                                                                                                        |\n// | --graupl-tabs-tab-list-border-color                  | var(--graupl-tabs-border-color)                                                                                                                                                                                                 |\n// | --graupl-tabs-tab-list-border-top-left-radius        | var(--graupl-border-top-left-radius)                                                                                                                                                                                            |\n// | --graupl-tabs-tab-list-border-top-right-radius       | var(--graupl-border-top-right-radius)                                                                                                                                                                                           |\n// | --graupl-tabs-tab-list-border-bottom-left-radius     | var(--graupl-border-bottom-left-radius)                                                                                                                                                                                         |\n// | --graupl-tabs-tab-list-border-bottom-right-radius    | var(--graupl-border-bottom-right-radius)                                                                                                                                                                                        |\n// | --graupl-tabs-tab-list-border-radius                 | var(--graupl-tabs-tab-list-border-top-left-radius) var(--graupl-tabs-tab-list-border-top-right-radius) var(--graupl-tabs-tab-list-border-bottom-right-radius) var(--graupl-tabs-tab-list-border-bottom-left-radius)             |\n// | --graupl-tabs-tab-list-border-top-width              | 0rem                                                                                                                                                                                                                            |\n// | --graupl-tabs-tab-list-border-right-width            | 0rem                                                                                                                                                                                                                            |\n// | --graupl-tabs-tab-list-border-bottom-width           | 0rem                                                                                                                                                                                                                            |\n// | --graupl-tabs-tab-list-border-left-width             | 0rem                                                                                                                                                                                                                            |\n// | --graupl-tabs-tab-list-border-width                  | var(--graupl-tabs-tab-list-border-top-width) var(--graupl-tabs-tab-list-border-right-width) var(--graupl-tabs-tab-list-border-bottom-width) var(--graupl-tabs-tab-list-border-left-width)                                       |\n// | --graupl-tabs-tab-list-border-top-style              | var(--graupl-border-top-style)                                                                                                                                                                                                  |\n// | --graupl-tabs-tab-list-border-right-style            | var(--graupl-border-right-style)                                                                                                                                                                                                |\n// | --graupl-tabs-tab-list-border-bottom-style           | var(--graupl-border-bottom-style)                                                                                                                                                                                               |\n// | --graupl-tabs-tab-list-border-left-style             | var(--graupl-border-left-style)                                                                                                                                                                                                 |\n// | --graupl-tabs-tab-list-border-style                  | var(--graupl-tabs-tab-list-border-top-style) var(--graupl-tabs-tab-list-border-right-style) var(--graupl-tabs-tab-list-border-bottom-style) var(--graupl-tabs-tab-list-border-left-style)                                       |\n// | --graupl-tabs-tab-toggle-padding-x                   | var(--graupl-spacer-5)                                                                                                                                                                                                          |\n// | --graupl-tabs-tab-toggle-padding-y                   | var(--graupl-spacer-3)                                                                                                                                                                                                          |\n// | --graupl-tabs-tab-toggle-padding                     | var(--graupl-tabs-tab-toggle-padding-y) var(--graupl-tabs-tab-toggle-padding-x)                                                                                                                                                 |\n// | --graupl-tabs-tab-toggle-border-top-left-radius      | var(--graupl-border-top-left-radius)                                                                                                                                                                                            |\n// | --graupl-tabs-tab-toggle-border-top-right-radius     | var(--graupl-border-top-right-radius)                                                                                                                                                                                           |\n// | --graupl-tabs-tab-toggle-border-bottom-left-radius   | var(--graupl-border-bottom-left-radius)                                                                                                                                                                                         |\n// | --graupl-tabs-tab-toggle-border-bottom-right-radius  | var(--graupl-border-bottom-right-radius)                                                                                                                                                                                        |\n// | --graupl-tabs-tab-toggle-border-radius               | var(--graupl-tabs-tab-toggle-border-top-left-radius) var(--graupl-tabs-tab-toggle-border-top-right-radius) var(--graupl-tabs-tab-toggle-border-bottom-right-radius) var(--graupl-tabs-tab-toggle-border-bottom-left-radius)     |\n// | --graupl-tabs-tab-toggle-border-top-width            | var(--graupl-border-top-width)                                                                                                                                                                                                  |\n// | --graupl-tabs-tab-toggle-border-right-width          | var(--graupl-border-right-width)                                                                                                                                                                                                |\n// | --graupl-tabs-tab-toggle-border-bottom-width         | var(--graupl-border-bottom-width)                                                                                                                                                                                               |\n// | --graupl-tabs-tab-toggle-border-left-width           | var(--graupl-border-left-width)                                                                                                                                                                                                 |\n// | --graupl-tabs-tab-toggle-border-width                | var(--graupl-tabs-tab-toggle-border-top-width) var(--graupl-tabs-tab-toggle-border-right-width) var(--graupl-tabs-tab-toggle-border-bottom-width) var(--graupl-tabs-tab-toggle-border-left-width)                               |\n// | --graupl-tabs-tab-toggle-border-top-style            | var(--graupl-border-top-style)                                                                                                                                                                                                  |\n// | --graupl-tabs-tab-toggle-border-right-style          | var(--graupl-border-right-style)                                                                                                                                                                                                |\n// | --graupl-tabs-tab-toggle-border-bottom-style         | var(--graupl-border-bottom-style)                                                                                                                                                                                               |\n// | --graupl-tabs-tab-toggle-border-left-style           | var(--graupl-border-left-style)                                                                                                                                                                                                 |\n// | --graupl-tabs-tab-toggle-border-style                | var(--graupl-tabs-tab-toggle-border-top-style) var(--graupl-tabs-tab-toggle-border-right-style) var(--graupl-tabs-tab-toggle-border-bottom-style) var(--graupl-tabs-tab-toggle-border-left-style)                               |\n// | --graupl-tabs-tab-content-padding-x                  | var(--graupl-spacer-3)                                                                                                                                                                                                          |\n// | --graupl-tabs-tab-content-padding-y                  | var(--graupl-spacer-3)                                                                                                                                                                                                          |\n// | --graupl-tabs-tab-content-padding                    | var(--graupl-tabs-tab-content-padding-y) var(--graupl-tabs-tab-content-padding-x)                                                                                                                                               |\n// | --graupl-tabs-tab-content-background                 | var(--graupl-tabs-background)                                                                                                                                                                                                   |\n// | --graupl-tabs-tab-content-color                      | var(--graupl-tabs-color)                                                                                                                                                                                                        |\n// | --graupl-tabs-tab-content-border-color               | var(--graupl-tabs-border-color)                                                                                                                                                                                                 |\n// | --graupl-tabs-tab-content-border-top-left-radius     | var(--graupl-border-top-left-radius)                                                                                                                                                                                            |\n// | --graupl-tabs-tab-content-border-top-right-radius    | var(--graupl-border-top-right-radius)                                                                                                                                                                                           |\n// | --graupl-tabs-tab-content-border-bottom-left-radius  | var(--graupl-border-bottom-left-radius)                                                                                                                                                                                         |\n// | --graupl-tabs-tab-content-border-bottom-right-radius | var(--graupl-border-bottom-right-radius)                                                                                                                                                                                        |\n// | --graupl-tabs-tab-content-border-radius              | var(--graupl-tabs-tab-content-border-top-left-radius) var(--graupl-tabs-tab-content-border-top-right-radius) var(--graupl-tabs-tab-content-border-bottom-right-radius) var(--graupl-tabs-tab-content-border-bottom-left-radius) |\n// | --graupl-tabs-tab-content-border-top-width           | var(--graupl-border-top-width)                                                                                                                                                                                                  |\n// | --graupl-tabs-tab-content-border-right-width         | var(--graupl-border-right-width)                                                                                                                                                                                                |\n// | --graupl-tabs-tab-content-border-bottom-width        | var(--graupl-border-bottom-width)                                                                                                                                                                                               |\n// | --graupl-tabs-tab-content-border-left-width          | var(--graupl-border-left-width)                                                                                                                                                                                                 |\n// | --graupl-tabs-tab-content-border-width               | var(--graupl-tabs-tab-content-border-top-width) var(--graupl-tabs-tab-content-border-right-width) var(--graupl-tabs-tab-content-border-bottom-width) var(--graupl-tabs-tab-content-border-left-width)                           |\n// | --graupl-tabs-tab-content-border-top-style           | var(--graupl-border-top-style)                                                                                                                                                                                                  |\n// | --graupl-tabs-tab-content-border-right-style         | var(--graupl-border-right-style)                                                                                                                                                                                                |\n// | --graupl-tabs-tab-content-border-bottom-style        | var(--graupl-border-bottom-style)                                                                                                                                                                                               |\n// | --graupl-tabs-tab-content-border-left-style          | var(--graupl-border-left-style)                                                                                                                                                                                                 |\n// | --graupl-tabs-tab-content-border-style               | var(--graupl-tabs-tab-content-border-top-style) var(--graupl-tabs-tab-content-border-right-style) var(--graupl-tabs-tab-content-border-bottom-style) var(--graupl-tabs-tab-content-border-left-style)                           |\n// | --graupl-tabs-tab-content-show-display               | block                                                                                                                                                                                                                           |\n// | --graupl-tabs-tab-content-hide-display               | none                                                                                                                                                                                                                            |\n// | --graupl-tabs-tab-content-transitioning-display      | block                                                                                                                                                                                                  |\n// | --graupl-tabs-tab-content-display                    | none                                                                                                                                                                                                                            |\n// | --graupl-tabs-tab-content-show-opacity               | 1                                                                                                                                                                                                                               |\n// | --graupl-tabs-tab-content-hide-opacity               | 0                                                                                                                                                                                                                               |\n// | --graupl-tabs-tab-content-transitioning-opacity      | 0                                                                                                                                                                                                  |\n// | --graupl-tabs-tab-content-opacity                    | 0                                                                                                                                                                                                                               |\n// | --graupl-tabs-tab-content-transition-duration        | var(--graupl-transition-duration-fast)                                                                                                                                                                                          |\n// | --graupl-tabs-tab-content-transition-timing-function | var(--graupl-transition-timing-function)                                                                                                                                                                                        |\n// | --graupl-tabs-tab-content-transition                 | opacity var(--graupl-tabs-tab-content-transition-duration) var(--graupl-tabs-tab-content-transition-timing-function)                                                                                                            |\n// | --graupl-tabs-tab-content-transition-reduced-motion  | opacity var(--graupl-tabs-tab-content-transition-duration) var(--graupl-tabs-tab-content-transition-timing-function)                                                                                                            |\n// | --graupl-tabs-tab-toggle-background                  | var(--graupl-tabs-tab-list-background)                                                                                                                                                                                          |\n// | --graupl-tabs-tab-toggle-visited-background          | var(--graupl-tabs-tab-toggle-background)                                                                                                                                                                                        |\n// | --graupl-tabs-tab-toggle-focus-background            | var(--graupl-tabs-tab-toggle-background)                                                                                                                                                                                        |\n// | --graupl-tabs-tab-toggle-hover-background            | var(--graupl-tabs-tab-list-color)                                                                                                                                                                                               |\n// | --graupl-tabs-tab-toggle-active-background           | var(--graupl-tabs-tab-toggle-hover-background)                                                                                                                                                                                  |\n// | --graupl-tabs-tab-toggle-selected-background         | var(--graupl-tabs-tab-toggle-hover-background)                                                                                                                                                                                  |\n// | --graupl-tabs-tab-toggle-disabled-background         | var(--graupl-tabs-tab-list-background)                                                                                                                                                                                          |\n// | --graupl-tabs-tab-toggle-color                       | var(--graupl-tabs-tab-list-color)                                                                                                                                                                                               |\n// | --graupl-tabs-tab-toggle-visited-color               | var(--graupl-tabs-tab-toggle-color)                                                                                                                                                                                             |\n// | --graupl-tabs-tab-toggle-focus-color                 | var(--graupl-tabs-tab-toggle-color)                                                                                                                                                                                             |\n// | --graupl-tabs-tab-toggle-hover-color                 | var(--graupl-tabs-tab-list-background)                                                                                                                                                                                          |\n// | --graupl-tabs-tab-toggle-active-color                | var(--graupl-tabs-tab-toggle-hover-color)                                                                                                                                                                                       |\n// | --graupl-tabs-tab-toggle-selected-color              | var(--graupl-tabs-tab-toggle-hover-color)                                                                                                                                                                                       |\n// | --graupl-tabs-tab-toggle-disabled-color              | var(--graupl-theme-active--primary--200)                                                                                                                                                                                        |\n// | --graupl-tabs-tab-toggle-border-color                | var(--graupl-tabs-tab-list-border-color)                                                                                                                                                                                        |\n// | --graupl-tabs-tab-toggle-visited-border-color        | var(--graupl-tabs-tab-toggle-border-color)                                                                                                                                                                                      |\n// | --graupl-tabs-tab-toggle-focus-border-color          | var(--graupl-tabs-tab-toggle-border-color)                                                                                                                                                                                      |\n// | --graupl-tabs-tab-toggle-hover-border-color          | var(--graupl-tabs-tab-list-border-color)                                                                                                                                                                                        |\n// | --graupl-tabs-tab-toggle-active-border-color         | var(--graupl-tabs-tab-toggle-hover-border-color)                                                                                                                                                                                |\n// | --graupl-tabs-tab-toggle-selected-border-color       | var(--graupl-tabs-tab-toggle-hover-border-color)                                                                                                                                                                                |\n// | --graupl-tabs-tab-toggle-disabled-border-color       | var(--graupl-theme-active--primary--200)                                                                                                                                                                                        |\n// | --graupl-tabs-tab-toggle-transform                   | none                                                                                                                                                                                                                            |\n// | --graupl-tabs-tab-toggle-visited-transform           | var(--graupl-tabs-tab-toggle-transform)                                                                                                                                                                                         |\n// | --graupl-tabs-tab-toggle-focus-transform             | var(--graupl-tabs-tab-toggle-transform)                                                                                                                                                                                         |\n// | --graupl-tabs-tab-toggle-hover-transform             | var(--graupl-tabs-tab-toggle-transform)                                                                                                                                                                                         |\n// | --graupl-tabs-tab-toggle-active-transform            | none                                                                                                                                                                                                                            |\n// | --graupl-tabs-tab-toggle-selected-transform          | none                                                                                                                                                                                                                            |\n// | --graupl-tabs-tab-toggle-disabled-transform          | none                                                                                                                                                                                              |\n// | --graupl-tabs-tab-list-padding-x                     | var(--graupl-spacer-0)                                                                                                                                                                                                          |\n// | --graupl-tabs-tab-list-padding-y                     | var(--graupl-spacer-0)                                                                                                                                                                                                          |\n// | --graupl-tabs-tab-list-padding                       | var(--graupl-tabs-tab-list-padding-y) var(--graupl-tabs-tab-list-padding-x)                                                                                                                                                     |\n// | --graupl-tabs-tab-list-margin                        | 0 0 calc( -1 * max( var(--graupl-tabs-tab-list-border-bottom-width), var(--graupl-tabs-tab-toggle-border-bottom-width) ) ) 0                                                                                                    |\n\n@use \"defaults\";\n@use \"../../variables\" as root-variables;\n@use \"../../defaults\" as root-defaults;\n@use \"../../theme/color/variables\" as color;\n@use \"../../theme/typography/variables\" as typography;\n@use \"../../functions/theme\";\n@use \"sass:map\";\n\n// Tabs properties.\n// --graupl-tabs-padding-x\n$tabs-padding-x: var(\n  --#{root-defaults.$prefix}tabs-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-tabs-padding-y\n$tabs-padding-y: var(\n  --#{root-defaults.$prefix}tabs-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-tabs-padding\n$tabs-padding: var(\n  --#{root-defaults.$prefix}tabs-padding,\n  #{$tabs-padding-y} #{$tabs-padding-x}\n);\n\n// Tabs color properties.\n// --graupl-tabs-color\n$tabs-color: var(--#{root-defaults.$prefix}tabs-color, #{color.$color});\n\n// --graupl-tabs-background\n$tabs-background: var(\n  --#{root-defaults.$prefix}tabs-background,\n  #{color.$background}\n);\n\n// Tabs border properties.\n// --graupl-tabs-border-color\n$tabs-border-color: var(\n  --#{root-defaults.$prefix}tabs-border-color,\n  #{$tabs-color}\n);\n\n// --graupl-tabs-border-top-left-radius\n$tabs-border-top-left-radius: var(\n  --#{root-defaults.$prefix}tabs-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-tabs-border-top-right-radius\n$tabs-border-top-right-radius: var(\n  --#{root-defaults.$prefix}tabs-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-tabs-border-bottom-left-radius\n$tabs-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}tabs-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-tabs-border-bottom-right-radius\n$tabs-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}tabs-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-tabs-border-radius\n$tabs-border-radius: var(\n  --#{root-defaults.$prefix}tabs-border-radius,\n  #{$tabs-border-top-left-radius} #{$tabs-border-top-right-radius}\n    #{$tabs-border-bottom-right-radius} #{$tabs-border-bottom-left-radius}\n);\n\n// --graupl-tabs-border-top-width\n$tabs-border-top-width: var(\n  --#{root-defaults.$prefix}tabs-border-top-width,\n  0rem\n);\n\n// --graupl-tabs-border-right-width\n$tabs-border-right-width: var(\n  --#{root-defaults.$prefix}tabs-border-right-width,\n  0rem\n);\n\n// --graupl-tabs-border-bottom-width\n$tabs-border-bottom-width: var(\n  --#{root-defaults.$prefix}tabs-border-bottom-width,\n  0rem\n);\n\n// --graupl-tabs-border-left-width\n$tabs-border-left-width: var(\n  --#{root-defaults.$prefix}tabs-border-left-width,\n  0rem\n);\n\n// --graupl-tabs-border-width\n$tabs-border-width: var(\n  --#{root-defaults.$prefix}tabs-border-width,\n  #{$tabs-border-top-width} #{$tabs-border-right-width}\n    #{$tabs-border-bottom-width} #{$tabs-border-left-width}\n);\n\n// --graupl-tabs-border-top-style\n$tabs-border-top-style: var(\n  --#{root-defaults.$prefix}tabs-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-tabs-border-right-style\n$tabs-border-right-style: var(\n  --#{root-defaults.$prefix}tabs-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-tabs-border-bottom-style\n$tabs-border-bottom-style: var(\n  --#{root-defaults.$prefix}tabs-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-tabs-border-left-style\n$tabs-border-left-style: var(\n  --#{root-defaults.$prefix}tabs-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-tabs-border-style\n$tabs-border-style: var(\n  --#{root-defaults.$prefix}tabs-border-style,\n  #{$tabs-border-top-style} #{$tabs-border-right-style}\n    #{$tabs-border-bottom-style} #{$tabs-border-left-style}\n);\n\n// Tab list gap properties.\n// --graupl-tabs-tab-list-column-gap\n$tabs-tab-list-column-gap: var(\n  --#{root-defaults.$prefix}tabs-tab-list-column-gap,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-tabs-tab-list-row-gap\n$tabs-tab-list-row-gap: var(\n  --#{root-defaults.$prefix}tabs-tab-list-row-gap,\n  #{map.get(root-variables.$spacers, 2)}\n);\n\n// --graupl-tabs-tab-list-gap\n$tabs-tab-list-gap: var(\n  --#{root-defaults.$prefix}tabs-tab-list-gap,\n  #{$tabs-tab-list-column-gap} #{$tabs-tab-list-row-gap}\n);\n\n// --graupl-tabs-tab-list-background\n$tabs-tab-list-background: var(\n  --#{root-defaults.$prefix}tabs-tab-list-background,\n  #{$tabs-background}\n);\n\n// --graupl-tabs-tab-list-color\n$tabs-tab-list-color: var(\n  --#{root-defaults.$prefix}tabs-tab-list-color,\n  #{$tabs-color}\n);\n\n// Tab list border properties.\n// --graupl-tabs-tab-list-border-color\n$tabs-tab-list-border-color: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-color,\n  #{$tabs-border-color}\n);\n\n// --graupl-tabs-tab-list-border-top-left-radius\n$tabs-tab-list-border-top-left-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-tabs-tab-list-border-top-right-radius\n$tabs-tab-list-border-top-right-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-tabs-tab-list-border-bottom-left-radius\n$tabs-tab-list-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-tabs-tab-list-border-bottom-right-radius\n$tabs-tab-list-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-tabs-tab-list-border-radius\n$tabs-tab-list-border-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-radius,\n  #{$tabs-tab-list-border-top-left-radius}\n    #{$tabs-tab-list-border-top-right-radius}\n    #{$tabs-tab-list-border-bottom-right-radius}\n    #{$tabs-tab-list-border-bottom-left-radius}\n);\n\n// --graupl-tabs-tab-list-border-top-width\n$tabs-tab-list-border-top-width: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-top-width,\n  0rem\n);\n\n// --graupl-tabs-tab-list-border-right-width\n$tabs-tab-list-border-right-width: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-right-width,\n  0rem\n);\n\n// --graupl-tabs-tab-list-border-bottom-width\n$tabs-tab-list-border-bottom-width: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-bottom-width,\n  0rem\n);\n\n// --graupl-tabs-tab-list-border-left-width\n$tabs-tab-list-border-left-width: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-left-width,\n  0rem\n);\n\n// --graupl-tabs-tab-list-border-width\n$tabs-tab-list-border-width: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-width,\n  #{$tabs-tab-list-border-top-width} #{$tabs-tab-list-border-right-width}\n    #{$tabs-tab-list-border-bottom-width} #{$tabs-tab-list-border-left-width}\n);\n\n// --graupl-tabs-tab-list-border-top-style\n$tabs-tab-list-border-top-style: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-tabs-tab-list-border-right-style\n$tabs-tab-list-border-right-style: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-tabs-tab-list-border-bottom-style\n$tabs-tab-list-border-bottom-style: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-tabs-tab-list-border-left-style\n$tabs-tab-list-border-left-style: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-tabs-tab-list-border-style\n$tabs-tab-list-border-style: var(\n  --#{root-defaults.$prefix}tabs-tab-list-border-style,\n  #{$tabs-tab-list-border-top-style} #{$tabs-tab-list-border-right-style}\n    #{$tabs-tab-list-border-bottom-style} #{$tabs-tab-list-border-left-style}\n);\n\n// Tab toggle properties.\n// --graupl-tabs-tab-toggle-padding-x\n$tabs-tab-toggle-padding-x: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-padding-x,\n  #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-tabs-tab-toggle-padding-y\n$tabs-tab-toggle-padding-y: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-padding-y,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-tabs-tab-toggle-padding\n$tabs-tab-toggle-padding: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-padding,\n  #{$tabs-tab-toggle-padding-y} #{$tabs-tab-toggle-padding-x}\n);\n\n// Tab toggle border properties.\n// --graupl-tabs-tab-toggle-border-top-left-radius\n$tabs-tab-toggle-border-top-left-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-tabs-tab-toggle-border-top-right-radius\n$tabs-tab-toggle-border-top-right-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-tabs-tab-toggle-border-bottom-left-radius\n$tabs-tab-toggle-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-tabs-tab-toggle-border-bottom-right-radius\n$tabs-tab-toggle-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-tabs-tab-toggle-border-radius\n$tabs-tab-toggle-border-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-radius,\n  #{$tabs-tab-toggle-border-top-left-radius}\n    #{$tabs-tab-toggle-border-top-right-radius}\n    #{$tabs-tab-toggle-border-bottom-right-radius}\n    #{$tabs-tab-toggle-border-bottom-left-radius}\n);\n\n// --graupl-tabs-tab-toggle-border-top-width\n$tabs-tab-toggle-border-top-width: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-top-width,\n  #{root-variables.$border-top-width}\n);\n\n// --graupl-tabs-tab-toggle-border-right-width\n$tabs-tab-toggle-border-right-width: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-right-width,\n  #{root-variables.$border-right-width}\n);\n\n// --graupl-tabs-tab-toggle-border-bottom-width\n$tabs-tab-toggle-border-bottom-width: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-bottom-width,\n  #{root-variables.$border-bottom-width}\n);\n\n// --graupl-tabs-tab-toggle-border-left-width\n$tabs-tab-toggle-border-left-width: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-left-width,\n  #{root-variables.$border-left-width}\n);\n\n// --graupl-tabs-tab-toggle-border-width\n$tabs-tab-toggle-border-width: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-width,\n  #{$tabs-tab-toggle-border-top-width} #{$tabs-tab-toggle-border-right-width}\n    #{$tabs-tab-toggle-border-bottom-width}\n    #{$tabs-tab-toggle-border-left-width}\n);\n\n// --graupl-tabs-tab-toggle-border-top-style\n$tabs-tab-toggle-border-top-style: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-tabs-tab-toggle-border-right-style\n$tabs-tab-toggle-border-right-style: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-tabs-tab-toggle-border-bottom-style\n$tabs-tab-toggle-border-bottom-style: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-tabs-tab-toggle-border-left-style\n$tabs-tab-toggle-border-left-style: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-tabs-tab-toggle-border-style\n$tabs-tab-toggle-border-style: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-style,\n  #{$tabs-tab-toggle-border-top-style} #{$tabs-tab-toggle-border-right-style}\n    #{$tabs-tab-toggle-border-bottom-style}\n    #{$tabs-tab-toggle-border-left-style}\n);\n\n// Tab content properties.\n// --graupl-tabs-tab-content-padding-x\n$tabs-tab-content-padding-x: var(\n  --#{root-defaults.$prefix}tabs-tab-content-padding-x,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-tabs-tab-content-padding-y\n$tabs-tab-content-padding-y: var(\n  --#{root-defaults.$prefix}tabs-tab-content-padding-y,\n  #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-tabs-tab-content-padding\n$tabs-tab-content-padding: var(\n  --#{root-defaults.$prefix}tabs-tab-content-padding,\n  #{$tabs-tab-content-padding-y} #{$tabs-tab-content-padding-x}\n);\n\n// --graupl-tabs-tab-content-background\n$tabs-tab-content-background: var(\n  --#{root-defaults.$prefix}tabs-tab-content-background,\n  #{$tabs-background}\n);\n\n// --graupl-tabs-tab-content-color\n$tabs-tab-content-color: var(\n  --#{root-defaults.$prefix}tabs-tab-content-color,\n  #{$tabs-color}\n);\n\n// Tab content border properties.\n// --graupl-tabs-tab-content-border-color\n$tabs-tab-content-border-color: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-color,\n  #{$tabs-border-color}\n);\n\n// --graupl-tabs-tab-content-border-top-left-radius\n$tabs-tab-content-border-top-left-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-top-left-radius,\n  #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-tabs-tab-content-border-top-right-radius\n$tabs-tab-content-border-top-right-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-top-right-radius,\n  #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-tabs-tab-content-border-bottom-left-radius\n$tabs-tab-content-border-bottom-left-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-bottom-left-radius,\n  #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-tabs-tab-content-border-bottom-right-radius\n$tabs-tab-content-border-bottom-right-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-bottom-right-radius,\n  #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-tabs-tab-content-border-radius\n$tabs-tab-content-border-radius: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-radius,\n  #{$tabs-tab-content-border-top-left-radius}\n    #{$tabs-tab-content-border-top-right-radius}\n    #{$tabs-tab-content-border-bottom-right-radius}\n    #{$tabs-tab-content-border-bottom-left-radius}\n);\n\n// --graupl-tabs-tab-content-border-top-width\n$tabs-tab-content-border-top-width: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-top-width,\n  #{root-variables.$border-top-width}\n);\n\n// --graupl-tabs-tab-content-border-right-width\n$tabs-tab-content-border-right-width: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-right-width,\n  #{root-variables.$border-right-width}\n);\n\n// --graupl-tabs-tab-content-border-bottom-width\n$tabs-tab-content-border-bottom-width: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-bottom-width,\n  #{root-variables.$border-bottom-width}\n);\n\n// --graupl-tabs-tab-content-border-left-width\n$tabs-tab-content-border-left-width: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-left-width,\n  #{root-variables.$border-left-width}\n);\n\n// --graupl-tabs-tab-content-border-width\n$tabs-tab-content-border-width: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-width,\n  #{$tabs-tab-content-border-top-width} #{$tabs-tab-content-border-right-width}\n    #{$tabs-tab-content-border-bottom-width}\n    #{$tabs-tab-content-border-left-width}\n);\n\n// --graupl-tabs-tab-content-border-top-style\n$tabs-tab-content-border-top-style: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-top-style,\n  #{root-variables.$border-top-style}\n);\n\n// --graupl-tabs-tab-content-border-right-style\n$tabs-tab-content-border-right-style: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-right-style,\n  #{root-variables.$border-right-style}\n);\n\n// --graupl-tabs-tab-content-border-bottom-style\n$tabs-tab-content-border-bottom-style: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-bottom-style,\n  #{root-variables.$border-bottom-style}\n);\n\n// --graupl-tabs-tab-content-border-left-style\n$tabs-tab-content-border-left-style: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-left-style,\n  #{root-variables.$border-left-style}\n);\n\n// --graupl-tabs-tab-content-border-style\n$tabs-tab-content-border-style: var(\n  --#{root-defaults.$prefix}tabs-tab-content-border-style,\n  #{$tabs-tab-content-border-top-style} #{$tabs-tab-content-border-right-style}\n    #{$tabs-tab-content-border-bottom-style}\n    #{$tabs-tab-content-border-left-style}\n);\n\n// Tab content display properties.\n// --graupl-tabs-tab-content-show-display\n$tabs-tab-content-show-display: var(\n  --#{root-defaults.$prefix}tabs-tab-content-show-display,\n  #{defaults.$tabs-tab-content-show-display}\n);\n\n// --graupl-tabs-tab-content-hide-display\n$tabs-tab-content-hide-display: var(\n  --#{root-defaults.$prefix}tabs-tab-content-hide-display,\n  #{defaults.$tabs-tab-content-hide-display}\n);\n\n// --graupl-tabs-tab-content-transitioning-display\n$tabs-tab-content-transitioning-display: var(\n  --#{root-defaults.$prefix}tabs-tab-content-transitioning-display,\n  #{defaults.$tabs-tab-content-transitioning-display}\n);\n\n// --graupl-tabs-tab-content-display\n$tabs-tab-content-display: var(\n  --#{root-defaults.$prefix}tabs-tab-content-display,\n  #{defaults.$tabs-tab-content-hide-display}\n);\n\n// Tab content opacity properties.\n// --graupl-tabs-tab-content-show-opacity\n$tabs-tab-content-show-opacity: var(\n  --#{root-defaults.$prefix}tabs-tab-content-show-opacity,\n  #{defaults.$tabs-tab-content-show-opacity}\n);\n\n// --graupl-tabs-tab-content-hide-opacity\n$tabs-tab-content-hide-opacity: var(\n  --#{root-defaults.$prefix}tabs-tab-content-hide-opacity,\n  #{defaults.$tabs-tab-content-hide-opacity}\n);\n\n// --graupl-tabs-tab-content-transitioning-opacity\n$tabs-tab-content-transitioning-opacity: var(\n  --#{root-defaults.$prefix}tabs-tab-content-transitioning-opacity,\n  #{defaults.$tabs-tab-content-transitioning-opacity}\n);\n\n// --graupl-tabs-tab-content-opacity\n$tabs-tab-content-opacity: var(\n  --#{root-defaults.$prefix}tabs-tab-content-opacity,\n  #{$tabs-tab-content-hide-opacity}\n);\n\n// Tab content transition properties.\n// --graupl-tabs-tab-content-transition-duration\n$tabs-tab-content-transition-duration: var(\n  --#{root-defaults.$prefix}tabs-tab-content-transition-duration,\n  #{map.get(root-variables.$transition-durations, fast)}\n);\n\n// --graupl-tabs-tab-content-transition-timing-function\n$tabs-tab-content-transition-timing-function: var(\n  --#{root-defaults.$prefix}tabs-tab-content-transition-timing-function,\n  #{root-variables.$transition-timing-function}\n);\n\n// --graupl-tabs-tab-content-transition\n$tabs-tab-content-transition: var(\n  --#{root-defaults.$prefix}tabs-tab-content-transition,\n  opacity #{$tabs-tab-content-transition-duration}\n    #{$tabs-tab-content-transition-timing-function}\n);\n\n// --graupl-tabs-tab-content-transition-reduced-motion\n$tabs-tab-content-transition-reduced-motion: var(\n  --#{root-defaults.$prefix}tabs-tab-content-transition-reduced-motion,\n  opacity #{$tabs-tab-content-transition-duration}\n    #{$tabs-tab-content-transition-timing-function}\n);\n\n// Tab toggle background properties.\n// --graupl-tabs-tab-toggle-background\n$tabs-tab-toggle-background: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-background,\n  #{$tabs-tab-list-background}\n);\n\n// --graupl-tabs-tab-toggle-visited-background\n$tabs-tab-toggle-visited-background: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-visited-background,\n  #{$tabs-tab-toggle-background}\n);\n\n// --graupl-tabs-tab-toggle-focus-background\n$tabs-tab-toggle-focus-background: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-focus-background,\n  #{$tabs-tab-toggle-background}\n);\n\n// --graupl-tabs-tab-toggle-hover-background\n$tabs-tab-toggle-hover-background: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-hover-background,\n  #{$tabs-tab-list-color}\n);\n\n// --graupl-tabs-tab-toggle-active-background\n$tabs-tab-toggle-active-background: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-active-background,\n  #{$tabs-tab-toggle-hover-background}\n);\n\n// --graupl-tabs-tab-toggle-selected-background\n$tabs-tab-toggle-selected-background: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-selected-background,\n  #{$tabs-tab-toggle-hover-background}\n);\n\n// --graupl-tabs-tab-toggle-disabled-background\n$tabs-tab-toggle-disabled-background: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-disabled-background,\n  #{$tabs-tab-list-background}\n);\n$tabs-tab-toggle-background-states: (\n  _default: $tabs-tab-toggle-background,\n  visited: $tabs-tab-toggle-visited-background,\n  focus: $tabs-tab-toggle-focus-background,\n  hover: $tabs-tab-toggle-hover-background,\n  active: $tabs-tab-toggle-active-background,\n  selected: $tabs-tab-toggle-selected-background,\n  disabled: $tabs-tab-toggle-disabled-background,\n);\n\n// Tab toggle text properties.\n// --graupl-tabs-tab-toggle-color\n$tabs-tab-toggle-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-color,\n  #{$tabs-tab-list-color}\n);\n\n// --graupl-tabs-tab-toggle-visited-color\n$tabs-tab-toggle-visited-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-visited-color,\n  #{$tabs-tab-toggle-color}\n);\n\n// --graupl-tabs-tab-toggle-focus-color\n$tabs-tab-toggle-focus-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-focus-color,\n  #{$tabs-tab-toggle-color}\n);\n\n// --graupl-tabs-tab-toggle-hover-color\n$tabs-tab-toggle-hover-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-hover-color,\n  #{$tabs-tab-list-background}\n);\n\n// --graupl-tabs-tab-toggle-active-color\n$tabs-tab-toggle-active-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-active-color,\n  #{$tabs-tab-toggle-hover-color}\n);\n\n// --graupl-tabs-tab-toggle-selected-color\n$tabs-tab-toggle-selected-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-selected-color,\n  #{$tabs-tab-toggle-hover-color}\n);\n\n// --graupl-tabs-tab-toggle-disabled-color\n$tabs-tab-toggle-disabled-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-disabled-color,\n  #{theme.get(primary, 200)}\n);\n$tabs-tab-toggle-color-states: (\n  _default: $tabs-tab-toggle-color,\n  visited: $tabs-tab-toggle-visited-color,\n  focus: $tabs-tab-toggle-focus-color,\n  hover: $tabs-tab-toggle-hover-color,\n  active: $tabs-tab-toggle-active-color,\n  selected: $tabs-tab-toggle-selected-color,\n  disabled: $tabs-tab-toggle-disabled-color,\n);\n\n// Tab toggle border colour properties.\n// --graupl-tabs-tab-toggle-border-color\n$tabs-tab-toggle-border-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-border-color,\n  #{$tabs-tab-list-border-color}\n);\n\n// --graupl-tabs-tab-toggle-visited-border-color\n$tabs-tab-toggle-visited-border-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-visited-border-color,\n  #{$tabs-tab-toggle-border-color}\n);\n\n// --graupl-tabs-tab-toggle-focus-border-color\n$tabs-tab-toggle-focus-border-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-focus-border-color,\n  #{$tabs-tab-toggle-border-color}\n);\n\n// --graupl-tabs-tab-toggle-hover-border-color\n$tabs-tab-toggle-hover-border-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-hover-border-color,\n  #{$tabs-tab-list-border-color}\n);\n\n// --graupl-tabs-tab-toggle-active-border-color\n$tabs-tab-toggle-active-border-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-active-border-color,\n  #{$tabs-tab-toggle-hover-border-color}\n);\n\n// --graupl-tabs-tab-toggle-selected-border-color\n$tabs-tab-toggle-selected-border-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-selected-border-color,\n  #{$tabs-tab-toggle-hover-border-color}\n);\n\n// --graupl-tabs-tab-toggle-disabled-border-color\n$tabs-tab-toggle-disabled-border-color: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-disabled-border-color,\n  #{theme.get(primary, 200)}\n);\n$tabs-tab-toggle-border-color-states: (\n  _default: $tabs-tab-toggle-border-color,\n  visited: $tabs-tab-toggle-visited-border-color,\n  focus: $tabs-tab-toggle-focus-border-color,\n  hover: $tabs-tab-toggle-hover-border-color,\n  active: $tabs-tab-toggle-active-border-color,\n  selected: $tabs-tab-toggle-selected-border-color,\n  disabled: $tabs-tab-toggle-disabled-border-color,\n);\n\n// Tab toggle transform properties.\n// --graupl-tabs-tab-toggle-transform\n$tabs-tab-toggle-transform: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-transform,\n  #{defaults.$tabs-tab-toggle-initial-transform}\n);\n\n// --graupl-tabs-tab-toggle-visited-transform\n$tabs-tab-toggle-visited-transform: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-visited-transform,\n  #{$tabs-tab-toggle-transform}\n);\n\n// --graupl-tabs-tab-toggle-focus-transform\n$tabs-tab-toggle-focus-transform: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-focus-transform,\n  #{$tabs-tab-toggle-transform}\n);\n\n// --graupl-tabs-tab-toggle-hover-transform\n$tabs-tab-toggle-hover-transform: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-hover-transform,\n  #{$tabs-tab-toggle-transform}\n);\n\n// --graupl-tabs-tab-toggle-active-transform\n$tabs-tab-toggle-active-transform: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-active-transform,\n  #{defaults.$tabs-tab-toggle-final-transform}\n);\n\n// --graupl-tabs-tab-toggle-selected-transform\n$tabs-tab-toggle-selected-transform: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-selected-transform,\n  #{defaults.$tabs-tab-toggle-final-transform}\n);\n\n// --graupl-tabs-tab-toggle-disabled-transform\n$tabs-tab-toggle-disabled-transform: var(\n  --#{root-defaults.$prefix}tabs-tab-toggle-disabled-transform,\n  #{defaults.$tabs-tab-toggle-disabled-transform}\n);\n$tabs-tab-toggle-transform-states: (\n  _default: $tabs-tab-toggle-transform,\n  visited: $tabs-tab-toggle-visited-transform,\n  focus: $tabs-tab-toggle-focus-transform,\n  hover: $tabs-tab-toggle-hover-transform,\n  active: $tabs-tab-toggle-active-transform,\n  selected: $tabs-tab-toggle-selected-transform,\n  disabled: $tabs-tab-toggle-disabled-transform,\n);\n\n// Tab list properties.\n// --graupl-tabs-tab-list-padding-x\n$tabs-tab-list-padding-x: var(\n  --#{root-defaults.$prefix}tabs-tab-list-padding-x,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-tabs-tab-list-padding-y\n$tabs-tab-list-padding-y: var(\n  --#{root-defaults.$prefix}tabs-tab-list-padding-y,\n  #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-tabs-tab-list-padding\n$tabs-tab-list-padding: var(\n  --#{root-defaults.$prefix}tabs-tab-list-padding,\n  #{$tabs-tab-list-padding-y} #{$tabs-tab-list-padding-x}\n);\n/* stylelint-disable scss/operator-no-newline-after -- Prettier wants to format it this way. */\n// --graupl-tabs-tab-list-margin\n$tabs-tab-list-margin: var(\n  --#{root-defaults.$prefix}tabs-tab-list-margin,\n  0 0\n    calc(\n      -1 *\n        max(\n          #{$tabs-tab-list-border-bottom-width},\n          #{$tabs-tab-toggle-border-bottom-width}\n        )\n    )\n    0\n);\n/* stylelint-enable  scss/operator-no-newline-after */\n","// @graupl/core tabs base styles.\n//\n// This module provides the base styles for the tabs component.\n//\n// The following selectors are generated by default:\n// - `.tabs`: The tabs component.\n// - `.tab-list`: The list of tabs in the tabs component.\n// - `.tab-toggle`: The individual tab toggle component.\n// - `.tab-content`: The individual tab content component.\n// - `.primary`: A component modifier to use the primary colour for the tabs component.\n// - `.secondary`: A component modifier to use the secondary colour for the tabs component.\n// - `.tertiary`: A component modifier to use the tertiary colour for the tabs component.\n//\n// The following custom properties can be used to customize the tabs component:\n// | Property                                               | Description                                                                                            | Default Value                                                                                                                                                                                                                     |\n// | ---                                                    | ---                                                                                                    | ---                                                                                                                                                                                                                               |\n// | `--graupl-tabs-padding-x`                              | The horizontal padding of the tabs component.                                                          | `var(--graupl-spacer-0)`                                                                                                                                                                                                          |\n// | `--graupl-tabs-padding-y`                              | The vertical padding of the tabs component.                                                            | `var(--graupl-spacer-0)`                                                                                                                                                                                                          |\n// | `--graupl-tabs-padding`                                | The padding of the tabs component (combines y and x padding).                                          | `var(--graupl-tabs-padding-y) var(--graupl-tabs-padding-x)`                                                                                                                                                                       |\n// | `--graupl-tabs-color`                                  | The text colour of the tabs component.                                                                 | `var(--graupl-color)`                                                                                                                                                                                                             |\n// | `--graupl-tabs-background`                             | The background colour of the tabs component.                                                           | `var(--graupl-background)`                                                                                                                                                                                                        |\n// | `--graupl-tabs-border-color`                           | The border colour of the tabs component.                                                               | `var(--graupl-tabs-color)`                                                                                                                                                                                                        |\n// | `--graupl-tabs-border-top-left-radius`                 | The top left border radius of the tabs component.                                                      | `var(--graupl-border-top-left-radius)`                                                                                                                                                                                            |\n// | `--graupl-tabs-border-top-right-radius`                | The top right border radius of the tabs component.                                                     | `var(--graupl-border-top-right-radius)`                                                                                                                                                                                           |\n// | `--graupl-tabs-border-bottom-right-radius`             | The bottom right border radius of the tabs component.                                                  | `var(--graupl-border-bottom-right-radius)`                                                                                                                                                                                        |\n// | `--graupl-tabs-border-bottom-left-radius`              | The bottom left border radius of the tabs component.                                                   | `var(--graupl-border-bottom-left-radius)`                                                                                                                                                                                         |\n// | `--graupl-tabs-border-radius`                          | The border radius of the tabs component (combines top-left, top-right, bottom-right, and bottom-left). | `var(--graupl-tabs-border-top-left-radius) var(--graupl-tabs-border-top-right-radius) var(--graupl-tabs-border-bottom-right-radius) var(--graupl-tabs-border-bottom-left-radius)`                                                 |\n// | `--graupl-tabs-border-top-width`                       | The top border width of the tabs component.                                                            | `0rem`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-border-right-width`                     | The right border width of the tabs component.                                                          | `0rem`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-border-bottom-width`                    | The bottom border width of the tabs component.                                                         | `0rem`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-border-left-width`                      | The left border width of the tabs component.                                                           | `0rem`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-border-width`                           | The border width of the tabs component (combines top, right, bottom, and left widths).                 | `var(--graupl-tabs-border-top-width) var(--graupl-tabs-border-right-width) var(--graupl-tabs-border-bottom-width) var(--graupl-tabs-border-left-width)`                                                                           |\n// | `--graupl-tabs-border-top-style`                       | The top border style of the tabs component.                                                            | `var(--graupl-border-top-style)`                                                                                                                                                                                                  |\n// | `--graupl-tabs-border-right-style`                     | The right border style of the tabs component.                                                          | `var(--graupl-border-right-style)`                                                                                                                                                                                                |\n// | `--graupl-tabs-border-bottom-style`                    | The bottom border style of the tabs component.                                                         | `var(--graupl-border-bottom-style)`                                                                                                                                                                                               |\n// | `--graupl-tabs-border-left-style`                      | The left border style of the tabs component.                                                           | `var(--graupl-border-left-style)`                                                                                                                                                                                                 |\n// | `--graupl-tabs-border-style`                           | The border style of the tabs component (combines top, right, bottom, and left styles).                 | `var(--graupl-tabs-border-top-style) var(--graupl-tabs-border-right-style) var(--graupl-tabs-border-bottom-style) var(--graupl-tabs-border-left-style)`                                                                           |\n// | `--graupl-tabs-tab-list-column-gap`                    | The column gap between tab toggles.                                                                    | `var(--graupl-spacer-0)`                                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-list-row-gap`                       | The row gap between tab toggles.                                                                       | `var(--graupl-spacer-2)`                                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-list-gap`                           | The gap between tab toggles (combines column and row gaps).                                            | `var(--graupl-tabs-tab-list-column-gap) var(--graupl-tabs-tab-list-row-gap)`                                                                                                                                                      |\n// | `--graupl-tabs-tab-list-background`                    | The background colour of the tab list component.                                                       | `var(--graupl-tabs-background)`                                                                                                                                                                                                   |\n// | `--graupl-tabs-tab-list-color`                         | The text colour of the tab list component.                                                             | `var(--graupl-tabs-color)`                                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-list-border-color`                  | The border colour of the tab list component.                                                           | `var(--graupl-tabs-border-color)`                                                                                                                                                                                                 |\n// | `--graupl-tabs-tab-list-border-top-left-radius`        | The top left border radius of the tab list component.                                                  | `var(--graupl-border-top-left-radius)`                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-list-border-top-right-radius`       | The top right border radius of the tab list component.                                                 | `var(--graupl-border-top-right-radius)`                                                                                                                                                                                           |\n// | `--graupl-tabs-tab-list-border-bottom-right-radius`    | The bottom right border radius of the tab list component.                                              | `var(--graupl-border-bottom-right-radius)`                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-list-border-bottom-left-radius`     | The bottom left border radius of the tab list component.                                               | `var(--graupl-border-bottom-left-radius)`                                                                                                                                                                                         |\n// | `--graupl-tabs-tab-list-border-radius`                 | The border radius of the tab list component.                                                           | `var(--graupl-tabs-tab-list-border-top-left-radius) var(--graupl-tabs-tab-list-border-top-right-radius) var(--graupl-tabs-tab-list-border-bottom-right-radius) var(--graupl-tabs-tab-list-border-bottom-left-radius)`             |\n// | `--graupl-tabs-tab-list-border-top-width`              | The top border width of the tab list component.                                                        | `0rem`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-list-border-right-width`            | The right border width of the tab list component.                                                      | `0rem`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-list-border-bottom-width`           | The bottom border width of the tab list component.                                                     | `0rem`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-list-border-left-width`             | The left border width of the tab list component.                                                       | `0rem`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-list-border-width`                  | The border width of the tab list component (combines top, right, bottom, and left widths).             | `var(--graupl-tabs-tab-list-border-top-width) var(--graupl-tabs-tab-list-border-right-width) var(--graupl-tabs-tab-list-border-bottom-width) var(--graupl-tabs-tab-list-border-left-width)`                                       |\n// | `--graupl-tabs-tab-list-border-top-style`              | The top border style of the tab list component.                                                        | `var(--graupl-border-top-style)`                                                                                                                                                                                                  |\n// | `--graupl-tabs-tab-list-border-right-style`            | The right border style of the tab list component.                                                      | `var(--graupl-border-right-style)`                                                                                                                                                                                                |\n// | `--graupl-tabs-tab-list-border-bottom-style`           | The bottom border style of the tab list component.                                                     | `var(--graupl-border-bottom-style)`                                                                                                                                                                                               |\n// | `--graupl-tabs-tab-list-border-left-style`             | The left border style of the tab list component.                                                       | `var(--graupl-border-left-style)`                                                                                                                                                                                                 |\n// | `--graupl-tabs-tab-list-border-style`                  | The border style of the tab list component (combines top, right, bottom, and left styles).             | `var(--graupl-tabs-tab-list-border-top-style) var(--graupl-tabs-tab-list-border-right-style) var(--graupl-tabs-tab-list-border-bottom-style) var(--graupl-tabs-tab-list-border-left-style)`                                       |\n// | `--graupl-tabs-tab-list-padding-x`                     | The horizontal padding of the tab list component.                                                      | `var(--graupl-spacer-0)`                                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-list-padding-y`                     | The vertical padding of the tab list component.                                                        | `var(--graupl-spacer-0)`                                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-list-padding`                       | The padding of the tab list component (combines y and x padding).                                      | `var(--graupl-tabs-tab-list-padding-y) var(--graupl-tabs-tab-list-padding-x)`                                                                                                                                                     |\n// | `--graupl-tabs-tab-list-margin`                        | The margin of the tab list component.                                                                  | `0 0 calc(-1 * max(var(--graupl-tabs-tab-list-border-bottom-width), var(--graupl-tabs-tab-toggle-border-bottom-width))) 0`                                                                                                        |\n// | `--graupl-tabs-tab-toggle-padding-x`                   | The horizontal padding of the tab toggle component.                                                    | `var(--graupl-spacer-5)`                                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-toggle-padding-y`                   | The vertical padding of the tab toggle component.                                                      | `var(--graupl-spacer-3)`                                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-toggle-padding`                     | The padding of the tab toggle component (combines y and x padding).                                    | `var(--graupl-tabs-tab-toggle-padding-y) var(--graupl-tabs-tab-toggle-padding-x)`                                                                                                                                                 |\n// | `--graupl-tabs-tab-toggle-border-top-left-radius`      | The top left border radius of the tab toggle component.                                                | `var(--graupl-border-top-left-radius)`                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-toggle-border-top-right-radius`     | The top right border radius of the tab toggle component.                                               | `var(--graupl-border-top-right-radius)`                                                                                                                                                                                           |\n// | `--graupl-tabs-tab-toggle-border-bottom-right-radius`  | The bottom right border radius of the tab toggle component.                                            | `var(--graupl-border-bottom-right-radius)`                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-toggle-border-bottom-left-radius`   | The bottom left border radius of the tab toggle component.                                             | `var(--graupl-border-bottom-left-radius)`                                                                                                                                                                                         |\n// | `--graupl-tabs-tab-toggle-border-radius`               | The border radius of the tab toggle component.                                                         | `var(--graupl-tabs-tab-toggle-border-top-left-radius) var(--graupl-tabs-tab-toggle-border-top-right-radius) var(--graupl-tabs-tab-toggle-border-bottom-right-radius) var(--graupl-tabs-tab-toggle-border-bottom-left-radius)`     |\n// | `--graupl-tabs-tab-toggle-border-top-width`            | The top border width of the tab toggle component.                                                      | `var(--graupl-border-top-width)`                                                                                                                                                                                                  |\n// | `--graupl-tabs-tab-toggle-border-right-width`          | The right border width of the tab toggle component.                                                    | `var(--graupl-border-right-width)`                                                                                                                                                                                                |\n// | `--graupl-tabs-tab-toggle-border-bottom-width`         | The bottom border width of the tab toggle component.                                                   | `var(--graupl-border-bottom-width)`                                                                                                                                                                                               |\n// | `--graupl-tabs-tab-toggle-border-left-width`           | The left border width of the tab toggle component.                                                     | `var(--graupl-border-left-width)`                                                                                                                                                                                                 |\n// | `--graupl-tabs-tab-toggle-border-width`                | The border width of the tab toggle component (combines top, right, bottom, and left widths).           | `var(--graupl-tabs-tab-toggle-border-top-width) var(--graupl-tabs-tab-toggle-border-right-width) var(--graupl-tabs-tab-toggle-border-bottom-width) var(--graupl-tabs-tab-toggle-border-left-width)`                               |\n// | `--graupl-tabs-tab-toggle-border-top-style`            | The top border style of the tab toggle component.                                                      | `var(--graupl-border-top-style)`                                                                                                                                                                                                  |\n// | `--graupl-tabs-tab-toggle-border-right-style`          | The right border style of the tab toggle component.                                                    | `var(--graupl-border-right-style)`                                                                                                                                                                                                |\n// | `--graupl-tabs-tab-toggle-border-bottom-style`         | The bottom border style of the tab toggle component.                                                   | `var(--graupl-border-bottom-style)`                                                                                                                                                                                               |\n// | `--graupl-tabs-tab-toggle-border-left-style`           | The left border style of the tab toggle component.                                                     | `var(--graupl-border-left-style)`                                                                                                                                                                                                 |\n// | `--graupl-tabs-tab-toggle-border-style`                | The border style of the tab toggle component (combines top, right, bottom, and left styles).           | `var(--graupl-tabs-tab-toggle-border-top-style) var(--graupl-tabs-tab-toggle-border-right-style) var(--graupl-tabs-tab-toggle-border-bottom-style) var(--graupl-tabs-tab-toggle-border-left-style)`                               |\n// | `--graupl-tabs-tab-toggle-background`                  | The background colour of the tab toggle component.                                                     | `var(--graupl-tabs-tab-list-background)`                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-toggle-visited-background`          | The background colour of a visited tab toggle component.                                               | `var(--graupl-tabs-tab-toggle-background)`                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-toggle-focus-background`            | The background colour of a focused tab toggle component.                                               | `var(--graupl-tabs-tab-toggle-background)`                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-toggle-hover-background`            | The background colour of a hovered tab toggle component.                                               | `var(--graupl-tabs-tab-list-color)`                                                                                                                                                                                               |\n// | `--graupl-tabs-tab-toggle-active-background`           | The background colour of an active tab toggle component.                                               | `var(--graupl-tabs-tab-toggle-hover-background)`                                                                                                                                                                                  |\n// | `--graupl-tabs-tab-toggle-selected-background`         | The background colour of a selected tab toggle component.                                              | `var(--graupl-tabs-tab-toggle-hover-background)`                                                                                                                                                                                  |\n// | `--graupl-tabs-tab-toggle-disabled-background`         | The background colour of a disabled tab toggle component.                                              | `var(--graupl-tabs-tab-list-background)`                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-toggle-color`                       | The text colour of the tab toggle component.                                                           | `var(--graupl-tabs-tab-list-color)`                                                                                                                                                                                               |\n// | `--graupl-tabs-tab-toggle-visited-color`               | The text colour of a visited tab toggle component.                                                     | `var(--graupl-tabs-tab-toggle-color)`                                                                                                                                                                                             |\n// | `--graupl-tabs-tab-toggle-focus-color`                 | The text colour of a focused tab toggle component.                                                     | `var(--graupl-tabs-tab-toggle-color)`                                                                                                                                                                                             |\n// | `--graupl-tabs-tab-toggle-hover-color`                 | The text colour of a hovered tab toggle component.                                                     | `var(--graupl-tabs-tab-list-background)`                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-toggle-active-color`                | The text colour of an active tab toggle component.                                                     | `var(--graupl-tabs-tab-toggle-hover-color)`                                                                                                                                                                                       |\n// | `--graupl-tabs-tab-toggle-selected-color`              | The text colour of a selected tab toggle component.                                                    | `var(--graupl-tabs-tab-toggle-hover-color)`                                                                                                                                                                                       |\n// | `--graupl-tabs-tab-toggle-disabled-color`              | The text colour of a disabled tab toggle component.                                                    | `var(--graupl-theme-active--primary--200)`                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-toggle-border-color`                | The border colour of the tab toggle component.                                                         | `var(--graupl-tabs-tab-list-border-color)`                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-toggle-visited-border-color`        | The border colour of a visited tab toggle component.                                                   | `var(--graupl-tabs-tab-toggle-border-color)`                                                                                                                                                                                      |\n// | `--graupl-tabs-tab-toggle-focus-border-color`          | The border colour of a focused tab toggle component.                                                   | `var(--graupl-tabs-tab-toggle-border-color)`                                                                                                                                                                                      |\n// | `--graupl-tabs-tab-toggle-hover-border-color`          | The border colour of a hovered tab toggle component.                                                   | `var(--graupl-tabs-tab-list-border-color)`                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-toggle-active-border-color`         | The border colour of an active tab toggle component.                                                   | `var(--graupl-tabs-tab-toggle-hover-border-color)`                                                                                                                                                                                |\n// | `--graupl-tabs-tab-toggle-selected-border-color`       | The border colour of a selected tab toggle component.                                                  | `var(--graupl-tabs-tab-toggle-hover-border-color)`                                                                                                                                                                                |\n// | `--graupl-tabs-tab-toggle-disabled-border-color`       | The border colour of a disabled tab toggle component.                                                  | `var(--graupl-theme-active--primary--200)`                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-toggle-transform`                   | The transform applied to the tab toggle component.                                                     | `none`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-toggle-visited-transform`           | The transform applied to a visited tab toggle component.                                               | `var(--graupl-tabs-tab-toggle-transform)`                                                                                                                                                                                         |\n// | `--graupl-tabs-tab-toggle-focus-transform`             | The transform applied to a focused tab toggle component.                                               | `var(--graupl-tabs-tab-toggle-transform)`                                                                                                                                                                                         |\n// | `--graupl-tabs-tab-toggle-hover-transform`             | The transform applied to a hovered tab toggle component.                                               | `var(--graupl-tabs-tab-toggle-transform)`                                                                                                                                                                                         |\n// | `--graupl-tabs-tab-toggle-active-transform`            | The transform applied to an active tab toggle component.                                               | `none`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-toggle-selected-transform`          | The transform applied to a selected tab toggle component.                                              | `none`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-toggle-disabled-transform`          | The transform applied to a disabled tab toggle component.                                              | `none`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-content-padding-x`                  | The horizontal padding of the tab content component.                                                   | `var(--graupl-spacer-3)`                                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-content-padding-y`                  | The vertical padding of the tab content component.                                                     | `var(--graupl-spacer-3)`                                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-content-padding`                    | The padding of the tab content component (combines y and x padding).                                   | `var(--graupl-tabs-tab-content-padding-y) var(--graupl-tabs-tab-content-padding-x)`                                                                                                                                               |\n// | `--graupl-tabs-tab-content-background`                 | The background colour of the tab content component.                                                    | `var(--graupl-tabs-background)`                                                                                                                                                                                                   |\n// | `--graupl-tabs-tab-content-color`                      | The text colour of the tab content component.                                                          | `var(--graupl-tabs-color)`                                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-content-border-color`               | The border colour of the tab content component.                                                        | `var(--graupl-tabs-border-color)`                                                                                                                                                                                                 |\n// | `--graupl-tabs-tab-content-border-top-left-radius`     | The top left border radius of the tab content component.                                               | `var(--graupl-border-top-left-radius)`                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-content-border-top-right-radius`    | The top right border radius of the tab content component.                                              | `var(--graupl-border-top-right-radius)`                                                                                                                                                                                           |\n// | `--graupl-tabs-tab-content-border-bottom-right-radius` | The bottom right border radius of the tab content component.                                           | `var(--graupl-border-bottom-right-radius)`                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-content-border-bottom-left-radius`  | The bottom left border radius of the tab content component.                                            | `var(--graupl-border-bottom-left-radius)`                                                                                                                                                                                         |\n// | `--graupl-tabs-tab-content-border-radius`              | The border radius of the tab content component.                                                        | `var(--graupl-tabs-tab-content-border-top-left-radius) var(--graupl-tabs-tab-content-border-top-right-radius) var(--graupl-tabs-tab-content-border-bottom-right-radius) var(--graupl-tabs-tab-content-border-bottom-left-radius)` |\n// | `--graupl-tabs-tab-content-border-top-width`           | The top border width of the tab content component.                                                     | `var(--graupl-border-top-width)`                                                                                                                                                                                                  |\n// | `--graupl-tabs-tab-content-border-right-width`         | The right border width of the tab content component.                                                   | `var(--graupl-border-right-width)`                                                                                                                                                                                                |\n// | `--graupl-tabs-tab-content-border-bottom-width`        | The bottom border width of the tab content component.                                                  | `var(--graupl-border-bottom-width)`                                                                                                                                                                                               |\n// | `--graupl-tabs-tab-content-border-left-width`          | The left border width of the tab content component.                                                    | `var(--graupl-border-left-width)`                                                                                                                                                                                                 |\n// | `--graupl-tabs-tab-content-border-width`               | The border width of the tab content component (combines top, right, bottom, and left widths).          | `var(--graupl-tabs-tab-content-border-top-width) var(--graupl-tabs-tab-content-border-right-width) var(--graupl-tabs-tab-content-border-bottom-width) var(--graupl-tabs-tab-content-border-left-width)`                           |\n// | `--graupl-tabs-tab-content-border-top-style`           | The top border style of the tab content component.                                                     | `var(--graupl-border-top-style)`                                                                                                                                                                                                  |\n// | `--graupl-tabs-tab-content-border-right-style`         | The right border style of the tab content component.                                                   | `var(--graupl-border-right-style)`                                                                                                                                                                                                |\n// | `--graupl-tabs-tab-content-border-bottom-style`        | The bottom border style of the tab content component.                                                  | `var(--graupl-border-bottom-style)`                                                                                                                                                                                               |\n// | `--graupl-tabs-tab-content-border-left-style`          | The left border style of the tab content component.                                                    | `var(--graupl-border-left-style)`                                                                                                                                                                                                 |\n// | `--graupl-tabs-tab-content-border-style`               | The border style of the tab content component (combines top, right, bottom, and left styles).          | `var(--graupl-tabs-tab-content-border-top-style) var(--graupl-tabs-tab-content-border-right-style) var(--graupl-tabs-tab-content-border-bottom-style) var(--graupl-tabs-tab-content-border-left-style)`                           |\n// | `--graupl-tabs-tab-content-show-display`               | The display value for tab content when shown.                                                          | `block`                                                                                                                                                                                                                           |\n// | `--graupl-tabs-tab-content-hide-display`               | The display value for tab content when hidden.                                                         | `none`                                                                                                                                                                                                                            |\n// | `--graupl-tabs-tab-content-transitioning-display`      | The display value for tab content while transitioning.                                                 | `var(--graupl-tabs-tab-content-show-display)`                                                                                                                                                                                     |\n// | `--graupl-tabs-tab-content-display`                    | The display value for tab content.                                                                     | `var(--graupl-tabs-tab-content-hide-display)`                                                                                                                                                                                     |\n// | `--graupl-tabs-tab-content-show-opacity`               | The opacity value for tab content when shown.                                                          | `1`                                                                                                                                                                                                                               |\n// | `--graupl-tabs-tab-content-hide-opacity`               | The opacity value for tab content when hidden.                                                         | `0`                                                                                                                                                                                                                               |\n// | `--graupl-tabs-tab-content-transitioning-opacity`      | The opacity value for tab content while transitioning.                                                 | `var(--graupl-tabs-tab-content-hide-opacity)`                                                                                                                                                                                     |\n// | `--graupl-tabs-tab-content-opacity`                    | The opacity value for tab content.                                                                     | `var(--graupl-tabs-tab-content-hide-opacity)`                                                                                                                                                                                     |\n// | `--graupl-tabs-tab-content-transition-duration`        | The transition duration for tab content.                                                               | `var(--graupl-transition-duration-fast)`                                                                                                                                                                                          |\n// | `--graupl-tabs-tab-content-transition-timing-function` | The transition timing function for tab content.                                                        | `var(--graupl-transition-timing-function)`                                                                                                                                                                                        |\n// | `--graupl-tabs-tab-content-transition`                 | The transition for tab content changes.                                                                | `opacity var(--graupl-tabs-tab-content-transition-duration) var(--graupl-tabs-tab-content-transition-timing-function)`                                                                                                            |\n// | `--graupl-tabs-tab-content-transition-reduced-motion`  | The transition for tab content changes when reduced motion is enabled.                                 | `opacity var(--graupl-tabs-tab-content-transition-duration) var(--graupl-tabs-tab-content-transition-timing-function)`                                                                                                            |\n//\n// The following sass variables can be used to customize the generation of the tabs component:\n// | Variable                                        | Description                                                                           | Default Value                        |\n// | ---                                             | ---                                                                                   | ---                                  |\n// | `$selector-base`                                | The selector base for the component.                                                  | `.`                                  |\n// | `$modifier-selector-base`                       | The selector base for component modifiers.                                            | `.`                                  |\n// | `$generate-base-theme-map`                      | A flag to generate the base theme maps for tabs variants.                             | `true`                               |\n// | `$themeable`                                    | A flag that determines whether theme modifiers are generated.                         | `false`                              |\n// | `$tabs-selector-base`                           | The selector base for the tabs component.                                             | `$selector-base`                     |\n// | `$tabs-selector`                                | The tabs component selector.                                                          | `\"tabs\"`                             |\n// | `$tabs-tab-list-selector-base`                  | The selector base for the tabs list component.                                        | `$selector-base`                     |\n// | `$tabs-tab-list-selector`                       | The tab list component selector.                                                      | `\"tab-list\"`                         |\n// | `$tabs-tab-toggle-selector-base`                | The selector base for the individual tab toggle component.                            | `$selector-base`                     |\n// | `$tabs-tab-toggle-selector`                     | The individual tab toggle component selector.                                         | `\"tab-toggle\"`                       |\n// | `$tabs-tab-content-selector-base`               | The selector base for the individual tab content component.                           | `$selector-base`                     |\n// | `$tabs-tab-content-selector`                    | The individual tab content component selector.                                        | `\"tab-content\"`                      |\n// | `$tabs-theme-selector-base`                     | The selector base for the tabs theme component modifiers.                             | `$modifier-selector-base`            |\n// | `$tabs-theme-selector-prefix`                   | The tabs theme component modifier selector prefix.                                    | `\"\"`                                 |\n// | `$tabs-tab-content-open-selector-base`          | The selector base applied to the open modifier.                                       | `$modifier-selector-base`            |\n// | `$tabs-tab-content-open-selector`               | The selector applied to the open modifier.                                            | `\"show\"`                             |\n// | `$tabs-tab-content-closed-selector-base`        | The selector base applied to the closed modifier.                                     | `$modifier-selector-base`            |\n// | `$tabs-tab-content-closed-selector`             | The selector applied to the closed modifier.                                          | `\"hide\"`                             |\n// | `$tabs-tab-content-transitioning-selector-base` | The selector base applied to the transitioning modifier.                              | `$modifier-selector-base`            |\n// | `$tabs-tab-content-transitioning-selector`      | The selector applied to the transitioning modifier.                                   | `\"transitioning\"`                    |\n// | `$tabs-tab-content-show-display`                | The default display value for open tab contents.                                      | `block`                              |\n// | `$tabs-tab-content-hide-display`                | The default display value for closed tab contents.                                    | `none`                               |\n// | `$tabs-tab-content-transitioning-display`       | The default display value for transitioning tab contents.                             | `$tabs-tab-content-show-display`     |\n// | `$tabs-tab-content-show-opacity`                | The default opacity value for open tab contents.                                      | `1`                                  |\n// | `$tabs-tab-content-hide-opacity`                | The default opacity value for closed tab contents.                                    | `0`                                  |\n// | `$tabs-tab-content-transitioning-opacity`       | The default opacity value for transitioning tab contents.                             | `$tabs-tab-content-hide-opacity`     |\n// | `$tabs-tab-toggle-initial-transform`            | The initial transform of the tab toggle component.                                    | `none`                               |\n// | `$tabs-tab-toggle-final-transform`              | The final transform of the tab toggle component.                                      | `none`                               |\n// | `$tabs-tab-toggle-disabled-transform`           | The disabled transform of the tab toggle component.                                   | `$tabs-tab-toggle-initial-transform` |\n// | `$tabs-theme-mappings`                          | A map of properties and color shades used generate all tabs variants.                 | `()`                                 |\n// | `$tabs-theme-map`                               | A map of all properties, colors, and color shades used to generate all tabs variants. | `()`                                 |\n//\n// The following javascript options can be used to customize the generation of the tabs component.\n// | Variable                      | Description                                                                | Default Value  |\n// | ---                           | ---                                                                        | ---            |\n// | `context`                     | The element that scopes the selector when locating tabs.                   | `document`     |\n// | `selector`                    | The selector used to find tabs in the DOM.                                 | `.tabs`        |\n// | `options`                     | An object of options passed through to the `Tabs` constructor (see below). | `{}`           |\n// | `options.tabListSelector`     | The selector for the tab list element.                                     | `.tab-list`    |\n// | `options.tabToggleSelector`   | The selector for tab toggle elements.                                      | `.tab-toggle`  |\n// | `options.tabContentSelector`  | The selector for tab content elements.                                     | `.tab-content` |\n// | `options.openClass`           | The class(es) applied when a tab is open.                                  | `show`         |\n// | `options.closeClass`          | The class(es) applied when a tab is closed.                                | `hide`         |\n// | `options.transitionClass`     | The class(es) applied while a tab is transitioning.                        | `null`         |\n// | `options.transitionDuration`  | Duration (ms) for transitions between open/closed states.                  | `300`          |\n// | `options.openDuration`        | Duration (ms) for closed → open; `-1` uses `transitionDuration`.           | `-1`           |\n// | `options.closeDuration`       | Duration (ms) for open → closed; `-1` uses `transitionDuration`.           | `-1`           |\n// | `options.automaticActivation` | When `true`, focusing a tab toggle also activates it.                      | `false`        |\n// | `options.prefix`              | Prefix for generated CSS custom properties.                                | `graupl-`      |\n// | `options.key`                 | Key used when generating IDs; `null` auto-generates a random key.          | `null`         |\n// | `options.initializeClass`     | The class applied while the tabs are initializing.                         | `initializing` |\n// | `options.initialize`          | When `true`, initializes the tabs immediately on creation.                 | `false`        |\n//\n// ## Using `$tabs-theme-mappings`\n//\n// `$tabs-theme-mappings` is a 1-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $tabs-theme-mappings: (\n//   border-color: 700,\n// )\n// ```\n//\n// This directly[1] maps to all tabs variants, telling them what shade to use for said property.\n// All tabs variants will use the following based on the example above:\n// - Primary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize _all_ tabs variants in the same way.\n//\n// For example, if you use the following map:\n// ```scss\n// $tabs-theme-mappings: (\n//   border-color: 500,\n// )\n// ```\n//\n// All tabs variants will use the following:\n// - Primary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--primary--500`,\n// - Secondary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--secondary--500`, and\n// - Tertiary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--tertiary--500`.\n//\n// [1] `$tabs-theme-mappings` gets parsed into a larger, more explicit map: `$tabs-theme-map`.\n//\n// Using `$tabs-theme-map`\n//\n// `$tabs-theme-map` is a multi-level map of properties, colors, and shade values.\n//\n// e.g.\n// ```scss\n// $tabs-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: primary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: tertiary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// This directly maps to all tabs variants, telling them what shade to use for said property.\n// The tabs variants will use the following based on the example above:\n// - Primary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--primary--700`,\n// - Secondary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--tertiary--700`.\n//\n// You can use this to customize tabs variants individually.\n//\n// For example, if you use the following map:\n//\n// ```scss\n// $tabs-theme-map: (\n//   primary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   secondary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n//   tertiary: (\n//     border-color: (\n//       color: secondary,\n//       shade: 700\n//     ),\n//   ),\n// )\n// ```\n//\n// The tabs variants will use the following:\n// - Primary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--secondary--700`,\n// - Secondary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--secondary--700`, and\n// - Tertiary tabs will have their `--graupl-tabs-border-color` property set to `--graupl-theme-active--secondary--700`.\n//\n//  ## Customizing the javascript generation.\n//\n//  The generator is a wrapper script around @drupal/once and the Tabs contructor class.\n//\n//  You can pass options to the generator using a custom data attributes: `data-graupl-tabs-options` which much be a stringified object.\n//  Any option available to the component, can be passed through this object, as an example:\n//\n//  ```html\n//  <div class=\"tabs\" data-graupl-tabs-options=\"{'initialize': false }\">\n//  ```\n//  Will ensure the the tabs element does not initialize itself automatically.\n//\n// @example\n// <div class=\"tabs\">\n//   <div class=\"tab-list\">\n//     <button class=\"tab-toggle\">Tab 1</button>\n//     <button class=\"tab-toggle\">Tab 2</button>\n//     <button class=\"tab-toggle\">Tab 3</button>\n//   </div>\n//   <div class=\"tab-content\">\n//     // Your tab content.\n//   </div>\n//   <div class=\"tab-content\">\n//     // Your tab content.\n//   </div>\n//   <div class=\"tab-content\">\n//     // Your tab content.\n//   </div>\n// </div>\n//\n// @example\n// <div class=\"tabs\" data-graupl-tabs-options=\"{'automaticActivation': true }\">\n//   <div class=\"tab-list\">\n//     <button class=\"tab-toggle\">Tab 1</button>\n//     <button class=\"tab-toggle\">Tab 2</button>\n//     <button class=\"tab-toggle\">Tab 3</button>\n//   </div>\n//   <div class=\"tab-content\">\n//     // Your tab content.\n//   </div>\n//   <div class=\"tab-content\">\n//     // Your tab content.\n//   </div>\n//   <div class=\"tab-content\">\n//     // Your tab content.\n//   </div>\n// </div>\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/theme\";\n@use \"../../mixins/state\";\n@use \"../../mixins/animation\";\n@use \"../../mixins/layer\" as *;\n@use \"../../base/button/mixins\" as button-mixins;\n@use \"defaults\";\n@use \"sass:map\";\n@use \"variables\" as *;\n\n@include layer(component) {\n  // .tabs\n  #{defaults.$tabs-selector-base}#{defaults.$tabs-selector} {\n    display: grid;\n    grid-template-columns: [list-start content-start] 1fr [content-end list-end];\n    grid-template-rows: [list-start] auto [content-start list-end] 1fr [content-end];\n    padding: $tabs-padding;\n    border-width: $tabs-border-width;\n    border-style: $tabs-border-style;\n    border-radius: $tabs-border-radius;\n    isolation: isolate;\n  }\n\n  // .tab-list\n  #{defaults.$tabs-tab-list-selector-base}#{defaults.$tabs-tab-list-selector} {\n    display: flex;\n    grid-area: list;\n    flex-wrap: wrap;\n    margin: $tabs-tab-list-margin;\n    padding: $tabs-tab-list-padding;\n    border-width: $tabs-tab-list-border-width;\n    border-style: $tabs-tab-list-border-style;\n    border-radius: $tabs-tab-list-border-radius;\n    gap: $tabs-tab-list-gap;\n  }\n\n  // .tab-toggle\n  #{defaults.$tabs-tab-toggle-selector-base}#{defaults.$tabs-tab-toggle-selector} {\n    @include button-mixins.apply-base;\n\n    z-index: 2;\n    flex: 1 1 auto;\n    padding: $tabs-tab-toggle-padding;\n    border-width: $tabs-tab-toggle-border-width;\n    border-style: $tabs-tab-toggle-border-style;\n    border-radius: $tabs-tab-toggle-border-radius;\n\n    @include state.generate-modifiers(\n      (\n        transform: $tabs-tab-toggle-transform-states,\n      )\n    );\n  }\n\n  // .tab-content\n  #{defaults.$tabs-tab-content-selector-base}#{defaults.$tabs-tab-content-selector} {\n    display: $tabs-tab-content-display;\n    z-index: 1;\n    grid-area: content;\n    padding: $tabs-tab-content-padding;\n    transition: $tabs-tab-content-transition;\n    border-width: $tabs-tab-content-border-width;\n    border-style: $tabs-tab-content-border-style;\n    border-radius: $tabs-tab-content-border-radius;\n    opacity: $tabs-tab-content-opacity;\n\n    // &.hide\n    &#{defaults.$tabs-tab-content-closed-selector-base}#{defaults.$tabs-tab-content-closed-selector} {\n      --#{root-defaults.$prefix}tabs-tab-content-display: #{$tabs-tab-content-hide-display};\n      --#{root-defaults.$prefix}tabs-tab-content-opacity: #{$tabs-tab-content-hide-opacity};\n    }\n\n    // &.transitioning\n    &#{defaults.$tabs-tab-content-transitioning-selector-base}#{defaults.$tabs-tab-content-transitioning-selector} {\n      --#{root-defaults.$prefix}tabs-tab-content-display: #{$tabs-tab-content-transitioning-display};\n      --#{root-defaults.$prefix}tabs-tab-content-opacity: #{$tabs-tab-content-transitioning-opacity};\n    }\n\n    // &.show\n    &#{defaults.$tabs-tab-content-open-selector-base}#{defaults.$tabs-tab-content-open-selector} {\n      --#{root-defaults.$prefix}tabs-tab-content-display: #{$tabs-tab-content-show-display};\n      --#{root-defaults.$prefix}tabs-tab-content-opacity: #{$tabs-tab-content-show-opacity};\n    }\n  }\n\n  @include animation.off {\n    #{defaults.$tabs-tab-content-selector-base}#{defaults.$tabs-tab-content-selector} {\n      --#{root-defaults.$prefix}tabs-tab-content-transition: #{$tabs-tab-content-transition-reduced-motion};\n    }\n  }\n}\n\n@include layer(theme) {\n  // .tabs\n  #{defaults.$tabs-selector-base}#{defaults.$tabs-selector} {\n    border-color: $tabs-border-color;\n    background: $tabs-background;\n    color: $tabs-color;\n\n    @if root-defaults.$themeable-components and defaults.$themeable {\n      @each $color, $map in defaults.$tabs-theme-map {\n        @include theme.generate-modifiers(\n          defaults.$tabs-theme-map,\n          defaults.$tabs-theme-selector-base,\n          defaults.$tabs-theme-selector-prefix,\n          \"tabs-\"\n        );\n      }\n\n      @each $color, $map in defaults.$tabs-theme-map {\n        @include theme.generate-modifiers(\n          defaults.$tabs-theme-map,\n          defaults.$tabs-theme-selector-base,\n          defaults.$tabs-theme-selector-prefix,\n          \"tabs-\",\n          \"\"\n        );\n      }\n    }\n  }\n\n  // .tab-list\n  #{defaults.$tabs-tab-list-selector-base}#{defaults.$tabs-tab-list-selector} {\n    border-color: $tabs-tab-list-border-color;\n    background: $tabs-tab-list-background;\n    color: $tabs-tab-list-color;\n  }\n\n  // .tab-toggle\n  #{defaults.$tabs-tab-toggle-selector-base}#{defaults.$tabs-tab-toggle-selector} {\n    @include button-mixins.apply-theme;\n\n    border-color: $tabs-tab-toggle-border-color;\n    background: $tabs-tab-toggle-background;\n    color: $tabs-tab-toggle-color;\n\n    @include state.generate-modifiers(\n      (\n        border-color: $tabs-tab-toggle-border-color-states,\n        background: $tabs-tab-toggle-background-states,\n        color: $tabs-tab-toggle-color-states,\n      )\n    );\n  }\n\n  // .tab-content\n  #{defaults.$tabs-tab-content-selector-base}#{defaults.$tabs-tab-content-selector} {\n    border-color: $tabs-tab-content-border-color;\n    background: $tabs-tab-content-background;\n    color: $tabs-tab-content-color;\n  }\n}\n"],"names":[]}