| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210321132123213321432153216321732183219322032213222322332243225322632273228322932303231323232333234323532363237323832393240324132423243324432453246324732483249325032513252325332543255325632573258325932603261326232633264326532663267326832693270327132723273327432753276327732783279328032813282328332843285328632873288328932903291329232933294329532963297329832993300330133023303330433053306330733083309331033113312331333143315331633173318331933203321332233233324332533263327332833293330333133323333333433353336333733383339334033413342334333443345334633473348334933503351335233533354335533563357335833593360336133623363336433653366336733683369337033713372337333743375337633773378337933803381338233833384338533863387338833893390339133923393339433953396339733983399340034013402340334043405340634073408340934103411341234133414341534163417341834193420342134223423342434253426342734283429343034313432343334343435343634373438343934403441344234433444344534463447344834493450345134523453345434553456345734583459346034613462346334643465346634673468346934703471347234733474347534763477347834793480348134823483348434853486348734883489349034913492349334943495349634973498349935003501350235033504350535063507350835093510351135123513351435153516351735183519352035213522352335243525352635273528352935303531353235333534353535363537353835393540354135423543354435453546354735483549355035513552355335543555355635573558355935603561356235633564356535663567356835693570357135723573357435753576357735783579358035813582358335843585358635873588358935903591359235933594359535963597359835993600360136023603360436053606360736083609361036113612361336143615361636173618361936203621362236233624362536263627362836293630363136323633363436353636363736383639364036413642364336443645364636473648364936503651365236533654365536563657365836593660366136623663366436653666366736683669367036713672367336743675367636773678367936803681368236833684368536863687368836893690369136923693369436953696369736983699370037013702370337043705370637073708370937103711371237133714371537163717371837193720372137223723372437253726372737283729373037313732373337343735373637373738373937403741374237433744374537463747374837493750375137523753375437553756375737583759376037613762376337643765376637673768376937703771377237733774377537763777377837793780378137823783378437853786378737883789379037913792379337943795379637973798379938003801380238033804380538063807380838093810381138123813381438153816381738183819382038213822382338243825382638273828382938303831383238333834383538363837383838393840384138423843384438453846384738483849385038513852385338543855385638573858385938603861386238633864386538663867386838693870387138723873387438753876387738783879388038813882388338843885388638873888388938903891389238933894389538963897389838993900390139023903390439053906390739083909391039113912391339143915391639173918391939203921392239233924392539263927392839293930393139323933393439353936393739383939394039413942394339443945394639473948394939503951395239533954395539563957395839593960396139623963396439653966396739683969397039713972397339743975397639773978397939803981398239833984398539863987398839893990399139923993399439953996399739983999400040014002400340044005400640074008400940104011401240134014401540164017401840194020402140224023402440254026402740284029403040314032403340344035403640374038403940404041404240434044404540464047404840494050405140524053405440554056405740584059406040614062406340644065406640674068406940704071407240734074407540764077407840794080408140824083408440854086408740884089409040914092409340944095409640974098409941004101410241034104410541064107410841094110411141124113411441154116411741184119412041214122412341244125412641274128412941304131413241334134413541364137413841394140414141424143414441454146414741484149415041514152415341544155415641574158415941604161416241634164416541664167416841694170417141724173417441754176417741784179418041814182418341844185418641874188418941904191419241934194419541964197419841994200420142024203420442054206420742084209421042114212421342144215421642174218421942204221422242234224422542264227422842294230423142324233423442354236423742384239424042414242424342444245424642474248424942504251425242534254425542564257425842594260426142624263426442654266426742684269427042714272427342744275427642774278427942804281428242834284428542864287428842894290429142924293429442954296429742984299430043014302430343044305430643074308430943104311431243134314431543164317431843194320432143224323432443254326432743284329433043314332433343344335433643374338433943404341434243434344434543464347434843494350435143524353435443554356435743584359436043614362436343644365436643674368436943704371437243734374437543764377437843794380438143824383438443854386438743884389439043914392439343944395439643974398439944004401440244034404440544064407440844094410441144124413441444154416441744184419442044214422442344244425442644274428442944304431443244334434443544364437443844394440444144424443444444454446444744484449445044514452445344544455445644574458445944604461446244634464446544664467446844694470447144724473447444754476447744784479448044814482448344844485448644874488448944904491449244934494449544964497449844994500450145024503450445054506450745084509451045114512451345144515451645174518451945204521452245234524452545264527452845294530453145324533453445354536453745384539454045414542454345444545454645474548454945504551455245534554455545564557455845594560456145624563456445654566456745684569457045714572457345744575457645774578457945804581458245834584458545864587458845894590459145924593459445954596459745984599460046014602460346044605460646074608460946104611461246134614461546164617461846194620462146224623462446254626462746284629463046314632463346344635463646374638463946404641464246434644464546464647464846494650465146524653465446554656465746584659466046614662466346644665466646674668466946704671467246734674467546764677467846794680468146824683468446854686468746884689469046914692469346944695469646974698469947004701470247034704470547064707470847094710471147124713471447154716471747184719472047214722472347244725472647274728472947304731473247334734473547364737473847394740474147424743474447454746474747484749475047514752475347544755475647574758475947604761476247634764476547664767476847694770477147724773477447754776477747784779478047814782478347844785478647874788478947904791479247934794479547964797479847994800480148024803480448054806480748084809481048114812481348144815481648174818481948204821482248234824482548264827482848294830483148324833483448354836483748384839484048414842484348444845484648474848484948504851485248534854485548564857485848594860486148624863486448654866486748684869487048714872487348744875487648774878487948804881488248834884488548864887488848894890489148924893489448954896489748984899490049014902490349044905490649074908490949104911491249134914491549164917491849194920492149224923492449254926492749284929493049314932493349344935493649374938493949404941494249434944494549464947494849494950495149524953495449554956495749584959496049614962496349644965496649674968496949704971497249734974497549764977497849794980498149824983498449854986498749884989499049914992499349944995499649974998499950005001500250035004500550065007500850095010501150125013501450155016501750185019502050215022502350245025502650275028502950305031503250335034503550365037503850395040504150425043504450455046504750485049505050515052505350545055505650575058505950605061506250635064506550665067506850695070507150725073507450755076507750785079508050815082508350845085508650875088508950905091509250935094509550965097509850995100510151025103510451055106510751085109511051115112511351145115511651175118511951205121512251235124512551265127512851295130513151325133513451355136513751385139514051415142514351445145514651475148514951505151515251535154515551565157515851595160516151625163516451655166516751685169517051715172517351745175517651775178517951805181518251835184518551865187518851895190519151925193519451955196519751985199520052015202520352045205520652075208520952105211521252135214521552165217521852195220522152225223522452255226522752285229523052315232523352345235523652375238523952405241524252435244524552465247524852495250525152525253525452555256525752585259526052615262526352645265526652675268526952705271527252735274527552765277527852795280528152825283528452855286528752885289529052915292529352945295529652975298529953005301530253035304530553065307530853095310531153125313531453155316531753185319532053215322532353245325532653275328532953305331533253335334533553365337533853395340534153425343534453455346534753485349535053515352535353545355535653575358535953605361536253635364536553665367536853695370537153725373537453755376537753785379538053815382538353845385538653875388538953905391539253935394539553965397539853995400540154025403540454055406540754085409541054115412541354145415541654175418541954205421542254235424542554265427542854295430543154325433543454355436543754385439544054415442544354445445544654475448544954505451545254535454545554565457545854595460546154625463546454655466546754685469547054715472547354745475547654775478547954805481548254835484548554865487548854895490549154925493549454955496549754985499550055015502550355045505550655075508550955105511551255135514551555165517551855195520552155225523552455255526552755285529553055315532553355345535553655375538553955405541554255435544554555465547554855495550555155525553555455555556555755585559556055615562556355645565556655675568556955705571557255735574557555765577557855795580558155825583558455855586558755885589559055915592559355945595559655975598559956005601560256035604560556065607560856095610561156125613561456155616561756185619562056215622562356245625562656275628562956305631563256335634563556365637563856395640564156425643564456455646564756485649565056515652565356545655565656575658565956605661566256635664566556665667566856695670567156725673567456755676567756785679568056815682568356845685568656875688568956905691569256935694569556965697569856995700570157025703570457055706570757085709571057115712571357145715571657175718571957205721572257235724572557265727572857295730573157325733573457355736573757385739574057415742574357445745574657475748574957505751575257535754575557565757575857595760576157625763576457655766576757685769577057715772577357745775577657775778577957805781578257835784578557865787578857895790579157925793579457955796579757985799580058015802580358045805580658075808580958105811581258135814581558165817581858195820582158225823582458255826582758285829583058315832583358345835583658375838583958405841584258435844584558465847584858495850585158525853585458555856585758585859586058615862586358645865586658675868586958705871587258735874587558765877587858795880588158825883588458855886588758885889589058915892589358945895589658975898589959005901590259035904590559065907590859095910591159125913591459155916591759185919592059215922592359245925592659275928592959305931593259335934593559365937593859395940594159425943594459455946594759485949595059515952595359545955595659575958595959605961596259635964596559665967596859695970597159725973597459755976597759785979598059815982598359845985598659875988598959905991599259935994599559965997599859996000600160026003600460056006600760086009601060116012601360146015601660176018601960206021602260236024602560266027602860296030603160326033603460356036603760386039604060416042604360446045604660476048604960506051605260536054605560566057605860596060606160626063606460656066606760686069607060716072607360746075607660776078607960806081608260836084608560866087608860896090609160926093609460956096609760986099610061016102610361046105610661076108610961106111611261136114611561166117611861196120612161226123612461256126612761286129613061316132613361346135613661376138613961406141614261436144614561466147614861496150615161526153615461556156615761586159616061616162616361646165616661676168616961706171617261736174617561766177617861796180618161826183618461856186618761886189619061916192619361946195619661976198619962006201620262036204620562066207620862096210621162126213621462156216621762186219622062216222622362246225622662276228622962306231623262336234623562366237623862396240624162426243624462456246624762486249625062516252625362546255625662576258625962606261626262636264626562666267626862696270627162726273627462756276627762786279628062816282628362846285628662876288628962906291629262936294629562966297629862996300630163026303630463056306630763086309631063116312631363146315631663176318631963206321632263236324632563266327632863296330633163326333633463356336633763386339634063416342634363446345634663476348634963506351635263536354635563566357635863596360636163626363636463656366636763686369637063716372637363746375637663776378637963806381638263836384638563866387638863896390639163926393639463956396639763986399640064016402640364046405640664076408640964106411641264136414641564166417641864196420 |
- /* Copyright 2014 Mozilla Foundation
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
- .messageBar{
- --closing-button-icon:url(images/messageBar_closingButton.svg);
- --message-bar-close-button-color:var(--text-primary-color);
- --message-bar-close-button-color-hover:var(--text-primary-color);
- --message-bar-close-button-border-radius:4px;
- --message-bar-close-button-border:none;
- --csstools-light-dark-toggle--31:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.14);
- --message-bar-close-button-hover-bg-color:var(--csstools-light-dark-toggle--31, rgb(21 20 26 / 0.14));
- --csstools-light-dark-toggle--32:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.21);
- --message-bar-close-button-active-bg-color:var(--csstools-light-dark-toggle--32, rgb(21 20 26 / 0.21));
- --csstools-light-dark-toggle--33:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.07);
- --message-bar-close-button-focus-bg-color:var(--csstools-light-dark-toggle--33, rgb(21 20 26 / 0.07));
- }
- @supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)){
- .messageBar{
- --message-bar-close-button-hover-bg-color:light-dark(
- rgb(21 20 26 / 0.14),
- rgb(251 251 254 / 0.14)
- );
- --message-bar-close-button-active-bg-color:light-dark(
- rgb(21 20 26 / 0.21),
- rgb(251 251 254 / 0.21)
- );
- --message-bar-close-button-focus-bg-color:light-dark(
- rgb(21 20 26 / 0.07),
- rgb(251 251 254 / 0.07)
- );
- }
- }
- @supports not (color: light-dark(tan, tan)){
- .messageBar *{
- --csstools-light-dark-toggle--31:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.14);
- --message-bar-close-button-hover-bg-color:var(--csstools-light-dark-toggle--31, rgb(21 20 26 / 0.14));
- --csstools-light-dark-toggle--32:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.21);
- --message-bar-close-button-active-bg-color:var(--csstools-light-dark-toggle--32, rgb(21 20 26 / 0.21));
- --csstools-light-dark-toggle--33:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.07);
- --message-bar-close-button-focus-bg-color:var(--csstools-light-dark-toggle--33, rgb(21 20 26 / 0.07));
- }
- }
- @media screen and (forced-colors: active){
- .messageBar{
- --message-bar-close-button-color:ButtonText;
- --message-bar-close-button-border:1px solid ButtonText;
- --message-bar-close-button-hover-bg-color:ButtonText;
- --message-bar-close-button-active-bg-color:ButtonText;
- --message-bar-close-button-focus-bg-color:ButtonText;
- --message-bar-close-button-color-hover:HighlightText;
- }
- }
- .messageBar{
- display:flex;
- position:relative;
- padding:8px 8px 8px 16px;
- flex-direction:column;
- justify-content:center;
- align-items:center;
- gap:8px;
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- border-radius:4px;
- border:1px solid var(--message-bar-border-color);
- background:var(--message-bar-bg-color);
- color:var(--message-bar-fg-color);
- }
- .messageBar > div{
- display:flex;
- align-items:flex-start;
- gap:8px;
- align-self:stretch;
- }
- :is(.messageBar > div)::before{
- content:"";
- display:inline-block;
- width:16px;
- height:16px;
- -webkit-mask-image:var(--message-bar-icon);
- mask-image:var(--message-bar-icon);
- -webkit-mask-size:cover;
- mask-size:cover;
- background-color:var(--message-bar-icon-color);
- flex-shrink:0;
- }
- .messageBar button{
- cursor:pointer;
- }
- :is(.messageBar button):focus-visible{
- outline:var(--focus-ring-outline);
- outline-offset:2px;
- }
- .messageBar .closeButton{
- width:32px;
- height:32px;
- background:none;
- border-radius:var(--message-bar-close-button-border-radius);
- border:var(--message-bar-close-button-border);
- display:flex;
- align-items:center;
- justify-content:center;
- }
- :is(.messageBar .closeButton)::before{
- content:"";
- display:inline-block;
- width:16px;
- height:16px;
- -webkit-mask-image:var(--closing-button-icon);
- mask-image:var(--closing-button-icon);
- -webkit-mask-size:cover;
- mask-size:cover;
- background-color:var(--message-bar-close-button-color);
- }
- :is(.messageBar .closeButton):is(:hover,:active,:focus)::before{
- background-color:var(--message-bar-close-button-color-hover);
- }
- :is(.messageBar .closeButton):hover{
- background-color:var(--message-bar-close-button-hover-bg-color);
- }
- :is(.messageBar .closeButton):active{
- background-color:var(--message-bar-close-button-active-bg-color);
- }
- :is(.messageBar .closeButton):focus{
- background-color:var(--message-bar-close-button-focus-bg-color);
- }
- :is(.messageBar .closeButton) > span{
- display:inline-block;
- width:0;
- height:0;
- overflow:hidden;
- }
- #editorUndoBar{
- --csstools-light-dark-toggle--34:var(--csstools-color-scheme--light) #fbfbfe;
- --text-primary-color:var(--csstools-light-dark-toggle--34, #15141a);
- --message-bar-icon:url(images/messageBar_info.svg);
- --csstools-light-dark-toggle--35:var(--csstools-color-scheme--light) #73a7f3;
- --message-bar-icon-color:var(--csstools-light-dark-toggle--35, #0060df);
- --csstools-light-dark-toggle--36:var(--csstools-color-scheme--light) #003070;
- --message-bar-bg-color:var(--csstools-light-dark-toggle--36, #deeafc);
- --message-bar-fg-color:var(--text-primary-color);
- --csstools-light-dark-toggle--37:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.08);
- --message-bar-border-color:var(--csstools-light-dark-toggle--37, rgb(0 0 0 / 0.08));
- --csstools-light-dark-toggle--38:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.08);
- --undo-button-bg-color:var(--csstools-light-dark-toggle--38, rgb(21 20 26 / 0.07));
- --csstools-light-dark-toggle--39:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.14);
- --undo-button-bg-color-hover:var(--csstools-light-dark-toggle--39, rgb(21 20 26 / 0.14));
- --csstools-light-dark-toggle--40:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.21);
- --undo-button-bg-color-active:var(--csstools-light-dark-toggle--40, rgb(21 20 26 / 0.21));
- --csstools-light-dark-toggle--41:var(--csstools-color-scheme--light) #0df;
- --undo-button-border:1px solid var(--csstools-light-dark-toggle--41, #0060df);
- --undo-button-fg-color:var(--message-bar-fg-color);
- --undo-button-fg-color-hover:var(--undo-button-fg-color);
- --undo-button-fg-color-active:var(--undo-button-fg-color);
- }
- @supports (color: light-dark(red, red)){
- #editorUndoBar{
- --text-primary-color:light-dark(#15141a, #fbfbfe);
- --message-bar-icon-color:light-dark(#0060df, #73a7f3);
- --message-bar-bg-color:light-dark(#deeafc, #003070);
- }
- }
- @supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)){
- #editorUndoBar{
- --message-bar-border-color:light-dark(
- rgb(0 0 0 / 0.08),
- rgb(255 255 255 / 0.08)
- );
- --undo-button-bg-color:light-dark(
- rgb(21 20 26 / 0.07),
- rgb(255 255 255 / 0.08)
- );
- --undo-button-bg-color-hover:light-dark(
- rgb(21 20 26 / 0.14),
- rgb(255 255 255 / 0.14)
- );
- --undo-button-bg-color-active:light-dark(
- rgb(21 20 26 / 0.21),
- rgb(255 255 255 / 0.21)
- );
- }
- }
- @supports (color: light-dark(red, red)){
- #editorUndoBar{
- --undo-button-border:1px solid light-dark(#0060df, #0df);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- #editorUndoBar *{
- --csstools-light-dark-toggle--34:var(--csstools-color-scheme--light) #fbfbfe;
- --text-primary-color:var(--csstools-light-dark-toggle--34, #15141a);
- --csstools-light-dark-toggle--35:var(--csstools-color-scheme--light) #73a7f3;
- --message-bar-icon-color:var(--csstools-light-dark-toggle--35, #0060df);
- --csstools-light-dark-toggle--36:var(--csstools-color-scheme--light) #003070;
- --message-bar-bg-color:var(--csstools-light-dark-toggle--36, #deeafc);
- --csstools-light-dark-toggle--37:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.08);
- --message-bar-border-color:var(--csstools-light-dark-toggle--37, rgb(0 0 0 / 0.08));
- --csstools-light-dark-toggle--38:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.08);
- --undo-button-bg-color:var(--csstools-light-dark-toggle--38, rgb(21 20 26 / 0.07));
- --csstools-light-dark-toggle--39:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.14);
- --undo-button-bg-color-hover:var(--csstools-light-dark-toggle--39, rgb(21 20 26 / 0.14));
- --csstools-light-dark-toggle--40:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.21);
- --undo-button-bg-color-active:var(--csstools-light-dark-toggle--40, rgb(21 20 26 / 0.21));
- --csstools-light-dark-toggle--41:var(--csstools-color-scheme--light) #0df;
- --undo-button-border:1px solid var(--csstools-light-dark-toggle--41, #0060df);
- }
- }
- @media screen and (forced-colors: active){
- #editorUndoBar{
- --text-primary-color:CanvasText;
- --message-bar-icon-color:CanvasText;
- --message-bar-bg-color:Canvas;
- --message-bar-border-color:CanvasText;
- --undo-button-bg-color:ButtonText;
- --undo-button-bg-color-hover:SelectedItem;
- --undo-button-bg-color-active:SelectedItem;
- --undo-button-fg-color:ButtonFace;
- --undo-button-fg-color-hover:SelectedItemText;
- --undo-button-fg-color-active:SelectedItemText;
- --undo-button-border:none;
- }
- }
- #editorUndoBar{
- position:fixed;
- top:50px;
- left:50%;
- transform:translateX(-50%);
- z-index:10;
- padding-block:8px;
- padding-inline:16px 8px;
- font:menu;
- font-size:15px;
- cursor:default;
- }
- #editorUndoBar button{
- cursor:pointer;
- }
- #editorUndoBar #editorUndoBarUndoButton{
- border-radius:4px;
- font-weight:590;
- line-height:19.5px;
- color:var(--undo-button-fg-color);
- border:var(--undo-button-border);
- padding:4px 16px;
- margin-inline-start:8px;
- height:32px;
- background-color:var(--undo-button-bg-color);
- }
- :is(#editorUndoBar #editorUndoBarUndoButton):hover{
- background-color:var(--undo-button-bg-color-hover);
- color:var(--undo-button-fg-color-hover);
- }
- :is(#editorUndoBar #editorUndoBarUndoButton):active{
- background-color:var(--undo-button-bg-color-active);
- color:var(--undo-button-fg-color-active);
- }
- #editorUndoBar > div{
- align-items:center;
- }
- .dialog{
- --csstools-light-dark-toggle--42:var(--csstools-color-scheme--light) #1c1b22;
- --dialog-bg-color:var(--csstools-light-dark-toggle--42, white);
- --csstools-light-dark-toggle--43:var(--csstools-color-scheme--light) #1c1b22;
- --dialog-border-color:var(--csstools-light-dark-toggle--43, white);
- --csstools-light-dark-toggle--44:var(--csstools-color-scheme--light) #15141a;
- --dialog-shadow:0 2px 14px 0 var(--csstools-light-dark-toggle--44, rgb(58 57 68 / 0.2));
- --csstools-light-dark-toggle--45:var(--csstools-color-scheme--light) #fbfbfe;
- --text-primary-color:var(--csstools-light-dark-toggle--45, #15141a);
- --csstools-light-dark-toggle--46:var(--csstools-color-scheme--light) #cfcfd8;
- --text-secondary-color:var(--csstools-light-dark-toggle--46, #5b5b66);
- --hover-filter:brightness(0.9);
- --csstools-light-dark-toggle--47:var(--csstools-color-scheme--light) #0df;
- --link-fg-color:var(--csstools-light-dark-toggle--47, #0060df);
- --csstools-light-dark-toggle--48:var(--csstools-color-scheme--light) #80ebff;
- --link-hover-fg-color:var(--csstools-light-dark-toggle--48, #0250bb);
- --csstools-light-dark-toggle--49:var(--csstools-color-scheme--light) #52525e;
- --separator-color:var(--csstools-light-dark-toggle--49, #f0f0f4);
- --textarea-border-color:#8f8f9d;
- --csstools-light-dark-toggle--50:var(--csstools-color-scheme--light) #42414d;
- --textarea-bg-color:var(--csstools-light-dark-toggle--50, white);
- --textarea-fg-color:var(--text-secondary-color);
- --csstools-light-dark-toggle--51:var(--csstools-color-scheme--light) #2b2a33;
- --radio-bg-color:var(--csstools-light-dark-toggle--51, #f0f0f4);
- --csstools-light-dark-toggle--52:var(--csstools-color-scheme--light) #15141a;
- --radio-checked-bg-color:var(--csstools-light-dark-toggle--52, #fbfbfe);
- --radio-border-color:#8f8f9d;
- --csstools-light-dark-toggle--53:var(--csstools-color-scheme--light) #0df;
- --radio-checked-border-color:var(--csstools-light-dark-toggle--53, #0060df);
- --csstools-light-dark-toggle--54:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.07);
- --button-secondary-bg-color:var(--csstools-light-dark-toggle--54, rgb(21 20 26 / 0.07));
- --button-secondary-fg-color:var(--text-primary-color);
- --button-secondary-border-color:var(--button-secondary-bg-color);
- --csstools-light-dark-toggle--55:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.21);
- --button-secondary-active-bg-color:var(--csstools-light-dark-toggle--55, rgb(21 20 26 / 0.21));
- --button-secondary-active-fg-color:var(--button-secondary-fg-color);
- --button-secondary-active-border-color:var(--button-secondary-bg-color);
- --csstools-light-dark-toggle--56:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.14);
- --button-secondary-hover-bg-color:var(--csstools-light-dark-toggle--56, rgb(21 20 26 / 0.14));
- --button-secondary-hover-fg-color:var(--button-secondary-fg-color);
- --button-secondary-hover-border-color:var(--button-secondary-hover-bg-color);
- --button-secondary-disabled-bg-color:var(--button-secondary-bg-color);
- --button-secondary-disabled-border-color:var(
- --button-secondary-border-color
- );
- --button-secondary-disabled-fg-color:var(--button-secondary-fg-color);
- --csstools-light-dark-toggle--57:var(--csstools-color-scheme--light) #0df;
- --button-primary-bg-color:var(--csstools-light-dark-toggle--57, #0060df);
- --csstools-light-dark-toggle--58:var(--csstools-color-scheme--light) #15141a;
- --button-primary-fg-color:var(--csstools-light-dark-toggle--58, #fbfbfe);
- --button-primary-border-color:var(--button-primary-bg-color);
- --csstools-light-dark-toggle--59:var(--csstools-color-scheme--light) #aaf2ff;
- --button-primary-active-bg-color:var(--csstools-light-dark-toggle--59, #054096);
- --button-primary-active-fg-color:var(--button-primary-fg-color);
- --button-primary-active-border-color:var(--button-primary-active-bg-color);
- --csstools-light-dark-toggle--60:var(--csstools-color-scheme--light) #80ebff;
- --button-primary-hover-bg-color:var(--csstools-light-dark-toggle--60, #0250bb);
- --button-primary-hover-fg-color:var(--button-primary-fg-color);
- --button-primary-hover-border-color:var(--button-primary-hover-bg-color);
- --button-primary-disabled-bg-color:var(--button-primary-bg-color);
- --button-primary-disabled-border-color:var(--button-primary-border-color);
- --button-primary-disabled-fg-color:var(--button-primary-fg-color);
- --button-disabled-opacity:0.4;
- --csstools-light-dark-toggle--61:var(--csstools-color-scheme--light) #42414d;
- --input-text-bg-color:var(--csstools-light-dark-toggle--61, white);
- --input-text-fg-color:var(--text-primary-color);
- }
- @supports (color: light-dark(red, red)){
- .dialog{
- --dialog-bg-color:light-dark(white, #1c1b22);
- --dialog-border-color:light-dark(white, #1c1b22);
- }
- }
- @supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)){
- .dialog{
- --dialog-shadow:0 2px 14px 0 light-dark(rgb(58 57 68 / 0.2), #15141a);
- }
- }
- @supports (color: light-dark(red, red)){
- .dialog{
- --text-primary-color:light-dark(#15141a, #fbfbfe);
- --text-secondary-color:light-dark(#5b5b66, #cfcfd8);
- --link-fg-color:light-dark(#0060df, #0df);
- --link-hover-fg-color:light-dark(#0250bb, #80ebff);
- --separator-color:light-dark(#f0f0f4, #52525e);
- --textarea-bg-color:light-dark(white, #42414d);
- --radio-bg-color:light-dark(#f0f0f4, #2b2a33);
- --radio-checked-bg-color:light-dark(#fbfbfe, #15141a);
- --radio-checked-border-color:light-dark(#0060df, #0df);
- }
- }
- @supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)){
- .dialog{
- --button-secondary-bg-color:light-dark(
- rgb(21 20 26 / 0.07),
- rgb(251 251 254 / 0.07)
- );
- --button-secondary-active-bg-color:light-dark(
- rgb(21 20 26 / 0.21),
- rgb(251 251 254 / 0.21)
- );
- --button-secondary-hover-bg-color:light-dark(
- rgb(21 20 26 / 0.14),
- rgb(251 251 254 / 0.14)
- );
- }
- }
- @supports (color: light-dark(red, red)){
- .dialog{
- --button-primary-bg-color:light-dark(#0060df, #0df);
- --button-primary-fg-color:light-dark(#fbfbfe, #15141a);
- --button-primary-active-bg-color:light-dark(#054096, #aaf2ff);
- --button-primary-hover-bg-color:light-dark(#0250bb, #80ebff);
- --input-text-bg-color:light-dark(white, #42414d);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- .dialog *{
- --csstools-light-dark-toggle--42:var(--csstools-color-scheme--light) #1c1b22;
- --dialog-bg-color:var(--csstools-light-dark-toggle--42, white);
- --csstools-light-dark-toggle--43:var(--csstools-color-scheme--light) #1c1b22;
- --dialog-border-color:var(--csstools-light-dark-toggle--43, white);
- --csstools-light-dark-toggle--44:var(--csstools-color-scheme--light) #15141a;
- --dialog-shadow:0 2px 14px 0 var(--csstools-light-dark-toggle--44, rgb(58 57 68 / 0.2));
- --csstools-light-dark-toggle--45:var(--csstools-color-scheme--light) #fbfbfe;
- --text-primary-color:var(--csstools-light-dark-toggle--45, #15141a);
- --csstools-light-dark-toggle--46:var(--csstools-color-scheme--light) #cfcfd8;
- --text-secondary-color:var(--csstools-light-dark-toggle--46, #5b5b66);
- --csstools-light-dark-toggle--47:var(--csstools-color-scheme--light) #0df;
- --link-fg-color:var(--csstools-light-dark-toggle--47, #0060df);
- --csstools-light-dark-toggle--48:var(--csstools-color-scheme--light) #80ebff;
- --link-hover-fg-color:var(--csstools-light-dark-toggle--48, #0250bb);
- --csstools-light-dark-toggle--49:var(--csstools-color-scheme--light) #52525e;
- --separator-color:var(--csstools-light-dark-toggle--49, #f0f0f4);
- --csstools-light-dark-toggle--50:var(--csstools-color-scheme--light) #42414d;
- --textarea-bg-color:var(--csstools-light-dark-toggle--50, white);
- --csstools-light-dark-toggle--51:var(--csstools-color-scheme--light) #2b2a33;
- --radio-bg-color:var(--csstools-light-dark-toggle--51, #f0f0f4);
- --csstools-light-dark-toggle--52:var(--csstools-color-scheme--light) #15141a;
- --radio-checked-bg-color:var(--csstools-light-dark-toggle--52, #fbfbfe);
- --csstools-light-dark-toggle--53:var(--csstools-color-scheme--light) #0df;
- --radio-checked-border-color:var(--csstools-light-dark-toggle--53, #0060df);
- --csstools-light-dark-toggle--54:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.07);
- --button-secondary-bg-color:var(--csstools-light-dark-toggle--54, rgb(21 20 26 / 0.07));
- --csstools-light-dark-toggle--55:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.21);
- --button-secondary-active-bg-color:var(--csstools-light-dark-toggle--55, rgb(21 20 26 / 0.21));
- --csstools-light-dark-toggle--56:var(--csstools-color-scheme--light) rgb(251 251 254 / 0.14);
- --button-secondary-hover-bg-color:var(--csstools-light-dark-toggle--56, rgb(21 20 26 / 0.14));
- --csstools-light-dark-toggle--57:var(--csstools-color-scheme--light) #0df;
- --button-primary-bg-color:var(--csstools-light-dark-toggle--57, #0060df);
- --csstools-light-dark-toggle--58:var(--csstools-color-scheme--light) #15141a;
- --button-primary-fg-color:var(--csstools-light-dark-toggle--58, #fbfbfe);
- --csstools-light-dark-toggle--59:var(--csstools-color-scheme--light) #aaf2ff;
- --button-primary-active-bg-color:var(--csstools-light-dark-toggle--59, #054096);
- --csstools-light-dark-toggle--60:var(--csstools-color-scheme--light) #80ebff;
- --button-primary-hover-bg-color:var(--csstools-light-dark-toggle--60, #0250bb);
- --csstools-light-dark-toggle--61:var(--csstools-color-scheme--light) #42414d;
- --input-text-bg-color:var(--csstools-light-dark-toggle--61, white);
- }
- }
- @media (prefers-color-scheme: dark){
- .dialog{
- --hover-filter:brightness(1.4);
- --button-disabled-opacity:0.6;
- }
- }
- @media screen and (forced-colors: active){
- .dialog{
- --dialog-bg-color:Canvas;
- --dialog-border-color:CanvasText;
- --dialog-shadow:none;
- --text-primary-color:CanvasText;
- --text-secondary-color:CanvasText;
- --hover-filter:none;
- --link-fg-color:LinkText;
- --link-hover-fg-color:LinkText;
- --separator-color:CanvasText;
- --textarea-border-color:ButtonBorder;
- --textarea-bg-color:Field;
- --textarea-fg-color:ButtonText;
- --radio-bg-color:ButtonFace;
- --radio-checked-bg-color:ButtonFace;
- --radio-border-color:ButtonText;
- --radio-checked-border-color:ButtonText;
- --button-secondary-bg-color:HighlightText;
- --button-secondary-fg-color:ButtonText;
- --button-secondary-border-color:ButtonText;
- --button-secondary-active-bg-color:HighlightText;
- --button-secondary-active-fg-color:SelectedItem;
- --button-secondary-active-border-color:ButtonText;
- --button-secondary-hover-bg-color:HighlightText;
- --button-secondary-hover-fg-color:SelectedItem;
- --button-secondary-hover-border-color:SelectedItem;
- --button-secondary-disabled-fg-color:GrayText;
- --button-secondary-disabled-border-color:GrayText;
- --button-primary-bg-color:ButtonText;
- --button-primary-fg-color:HighlightText;
- --button-primary-border-color:ButtonText;
- --button-primary-active-bg-color:SelectedItem;
- --button-primary-active-fg-color:HighlightText;
- --button-primary-active-border-color:ButtonText;
- --button-primary-hover-bg-color:SelectedItem;
- --button-primary-hover-fg-color:HighlightText;
- --button-primary-hover-border-color:SelectedItem;
- --button-primary-disabled-bg-color:GrayText;
- --button-primary-disabled-fg-color:ButtonFace;
- --button-primary-disabled-border-color:GrayText;
- --button-disabled-opacity:1;
- --input-text-bg-color:HighlightText;
- --input-text-fg-color:FieldText;
- }
- }
- .dialog{
- font:message-box;
- font-size:13px;
- font-weight:400;
- line-height:150%;
- border-radius:4px;
- padding:12px 16px;
- border:1px solid var(--dialog-border-color);
- background:var(--dialog-bg-color);
- color:var(--text-primary-color);
- box-shadow:var(--dialog-shadow);
- }
- :is(.dialog .mainContainer) *:focus-visible{
- outline:var(--focus-ring-outline);
- outline-offset:2px;
- }
- :is(.dialog .mainContainer) .title{
- display:flex;
- width:auto;
- flex-direction:column;
- justify-content:flex-end;
- align-items:flex-start;
- gap:12px;
- }
- :is(:is(.dialog .mainContainer) .title) > span{
- font-size:13px;
- font-style:normal;
- font-weight:590;
- line-height:150%;
- }
- :is(.dialog .mainContainer) .dialogSeparator{
- width:100%;
- height:0;
- margin-block:4px;
- border-top:1px solid var(--separator-color);
- border-bottom:none;
- }
- :is(.dialog .mainContainer) .dialogButtonsGroup{
- display:flex;
- gap:12px;
- align-self:flex-end;
- }
- :is(.dialog .mainContainer) .radio{
- display:flex;
- flex-direction:column;
- align-items:flex-start;
- gap:4px;
- }
- :is(:is(.dialog .mainContainer) .radio) > .radioButton{
- display:flex;
- gap:8px;
- align-self:stretch;
- align-items:center;
- }
- :is(:is(:is(.dialog .mainContainer) .radio) > .radioButton) input{
- -webkit-appearance:none;
- -moz-appearance:none;
- appearance:none;
- box-sizing:border-box;
- width:16px;
- height:16px;
- border-radius:50%;
- background-color:var(--radio-bg-color);
- border:1px solid var(--radio-border-color);
- }
- :is(:is(:is(:is(.dialog .mainContainer) .radio) > .radioButton) input):hover{
- filter:var(--hover-filter);
- }
- :is(:is(:is(:is(.dialog .mainContainer) .radio) > .radioButton) input):checked{
- background-color:var(--radio-checked-bg-color);
- border:4px solid var(--radio-checked-border-color);
- }
- :is(:is(.dialog .mainContainer) .radio) > .radioLabel{
- display:flex;
- padding-inline-start:24px;
- align-items:flex-start;
- gap:10px;
- align-self:stretch;
- }
- :is(:is(:is(.dialog .mainContainer) .radio) > .radioLabel) > span{
- flex:1 0 0;
- font-size:11px;
- color:var(--text-secondary-color);
- }
- :is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton)){
- border-radius:4px;
- border:1px solid;
- font:menu;
- font-weight:590;
- font-size:13px;
- padding:4px 16px;
- width:auto;
- height:32px;
- }
- :is(:is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton))):hover{
- cursor:pointer;
- filter:var(--hover-filter);
- }
- :is(:is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton))) > span{
- color:inherit;
- font:inherit;
- }
- .secondaryButton:is(:is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton))){
- color:var(--button-secondary-fg-color);
- background-color:var(--button-secondary-bg-color);
- border-color:var(--button-secondary-border-color);
- }
- .secondaryButton:is(:is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton))):hover{
- color:var(--button-secondary-hover-fg-color);
- background-color:var(--button-secondary-hover-bg-color);
- border-color:var(--button-secondary-hover-border-color);
- }
- .secondaryButton:is(:is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton))):active{
- color:var(--button-secondary-active-fg-color);
- background-color:var(--button-secondary-active-bg-color);
- border-color:var(--button-secondary-active-border-color);
- }
- .secondaryButton:is(:is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton))):disabled{
- background-color:var(--button-secondary-disabled-bg-color);
- border-color:var(--button-secondary-disabled-border-color);
- color:var(--button-secondary-disabled-fg-color);
- opacity:var(--button-disabled-opacity);
- }
- .primaryButton:is(:is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton))){
- color:var(--button-primary-fg-color);
- background-color:var(--button-primary-bg-color);
- border-color:var(--button-primary-border-color);
- opacity:1;
- }
- .primaryButton:is(:is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton))):hover{
- color:var(--button-primary-hover-fg-color);
- background-color:var(--button-primary-hover-bg-color);
- border-color:var(--button-primary-hover-border-color);
- }
- .primaryButton:is(:is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton))):active{
- color:var(--button-primary-active-fg-color);
- background-color:var(--button-primary-active-bg-color);
- border-color:var(--button-primary-active-border-color);
- }
- .primaryButton:is(:is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton))):disabled{
- background-color:var(--button-primary-disabled-bg-color);
- border-color:var(--button-primary-disabled-border-color);
- color:var(--button-primary-disabled-fg-color);
- opacity:var(--button-disabled-opacity);
- }
- :is(:is(.dialog .mainContainer) button:not(:is(.toggle-button,.closeButton,.clearInputButton))):disabled{
- pointer-events:none;
- }
- :is(.dialog .mainContainer) a{
- color:var(--link-fg-color);
- }
- :is(:is(.dialog .mainContainer) a):hover{
- color:var(--link-hover-fg-color);
- }
- :is(.dialog .mainContainer) textarea{
- font:inherit;
- padding:8px;
- resize:none;
- margin:0;
- box-sizing:border-box;
- border-radius:4px;
- border:1px solid var(--textarea-border-color);
- background:var(--textarea-bg-color);
- color:var(--textarea-fg-color);
- }
- :is(:is(.dialog .mainContainer) textarea):focus{
- outline-offset:0;
- border-color:transparent;
- }
- :is(:is(.dialog .mainContainer) textarea):disabled{
- pointer-events:none;
- opacity:0.4;
- }
- :is(.dialog .mainContainer) input[type="text"]{
- background-color:var(--input-text-bg-color);
- color:var(--input-text-fg-color);
- }
- :is(.dialog .mainContainer) .messageBar{
- --csstools-light-dark-toggle--62:var(--csstools-color-scheme--light) #5a3100;
- --message-bar-bg-color:var(--csstools-light-dark-toggle--62, #ffebcd);
- --csstools-light-dark-toggle--63:var(--csstools-color-scheme--light) #fbfbfe;
- --message-bar-fg-color:var(--csstools-light-dark-toggle--63, #15141a);
- --csstools-light-dark-toggle--64:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.08);
- --message-bar-border-color:var(--csstools-light-dark-toggle--64, rgb(0 0 0 / 0.08));
- --message-bar-icon:url(images/messageBar_warning.svg);
- --csstools-light-dark-toggle--65:var(--csstools-color-scheme--light) #e49c49;
- --message-bar-icon-color:var(--csstools-light-dark-toggle--65, #cd411e);
- }
- @supports (color: light-dark(red, red)){
- :is(.dialog .mainContainer) .messageBar{
- --message-bar-bg-color:light-dark(#ffebcd, #5a3100);
- --message-bar-fg-color:light-dark(#15141a, #fbfbfe);
- }
- }
- @supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)){
- :is(.dialog .mainContainer) .messageBar{
- --message-bar-border-color:light-dark(
- rgb(0 0 0 / 0.08),
- rgb(255 255 255 / 0.08)
- );
- }
- }
- @supports (color: light-dark(red, red)){
- :is(.dialog .mainContainer) .messageBar{
- --message-bar-icon-color:light-dark(#cd411e, #e49c49);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- :is(:is(.dialog .mainContainer) .messageBar) *{
- --csstools-light-dark-toggle--62:var(--csstools-color-scheme--light) #5a3100;
- --message-bar-bg-color:var(--csstools-light-dark-toggle--62, #ffebcd);
- --csstools-light-dark-toggle--63:var(--csstools-color-scheme--light) #fbfbfe;
- --message-bar-fg-color:var(--csstools-light-dark-toggle--63, #15141a);
- --csstools-light-dark-toggle--64:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.08);
- --message-bar-border-color:var(--csstools-light-dark-toggle--64, rgb(0 0 0 / 0.08));
- --csstools-light-dark-toggle--65:var(--csstools-color-scheme--light) #e49c49;
- --message-bar-icon-color:var(--csstools-light-dark-toggle--65, #cd411e);
- }
- }
- @media screen and (forced-colors: active){
- :is(.dialog .mainContainer) .messageBar{
- --message-bar-bg-color:HighlightText;
- --message-bar-fg-color:CanvasText;
- --message-bar-border-color:CanvasText;
- --message-bar-icon-color:CanvasText;
- }
- }
- :is(.dialog .mainContainer) .messageBar{
- align-self:stretch;
- }
- :is(:is(:is(.dialog .mainContainer) .messageBar) > div)::before,:is(:is(:is(.dialog .mainContainer) .messageBar) > div) > div{
- margin-block:4px;
- }
- :is(:is(:is(.dialog .mainContainer) .messageBar) > div) > div{
- display:flex;
- flex-direction:column;
- align-items:flex-start;
- gap:8px;
- flex:1 0 0;
- }
- :is(:is(:is(:is(.dialog .mainContainer) .messageBar) > div) > div) .title{
- font-size:13px;
- font-weight:590;
- }
- :is(:is(:is(:is(.dialog .mainContainer) .messageBar) > div) > div) .description{
- font-size:13px;
- }
- :is(.dialog .mainContainer) .toggler{
- display:flex;
- align-items:center;
- gap:8px;
- align-self:stretch;
- }
- :is(:is(.dialog .mainContainer) .toggler) > .togglerLabel{
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- }
- .textLayer{
- position:absolute;
- text-align:initial;
- inset:0;
- overflow:clip;
- opacity:1;
- line-height:1;
- -webkit-text-size-adjust:none;
- -moz-text-size-adjust:none;
- text-size-adjust:none;
- forced-color-adjust:none;
- transform-origin:0 0;
- caret-color:CanvasText;
- z-index:0;
- }
- .textLayer.highlighting{
- touch-action:none;
- }
- .textLayer :is(span,br){
- color:transparent;
- position:absolute;
- white-space:pre;
- cursor:text;
- transform-origin:0% 0%;
- }
- .textLayer > :not(.markedContent),.textLayer .markedContent span:not(.markedContent){
- z-index:1;
- }
- .textLayer span.markedContent{
- top:0;
- height:0;
- }
- .textLayer span[role="img"]{
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- cursor:default;
- }
- .textLayer .highlight{
- --highlight-bg-color:rgb(180 0 170 / 0.25);
- --highlight-selected-bg-color:rgb(0 100 0 / 0.25);
- --highlight-backdrop-filter:none;
- --highlight-selected-backdrop-filter:none;
- }
- @media screen and (forced-colors: active){
- .textLayer .highlight{
- --highlight-bg-color:transparent;
- --highlight-selected-bg-color:transparent;
- --highlight-backdrop-filter:var(--hcm-highlight-filter);
- --highlight-selected-backdrop-filter:var(
- --hcm-highlight-selected-filter
- );
- }
- }
- .textLayer .highlight{
- margin:-1px;
- padding:1px;
- background-color:var(--highlight-bg-color);
- -webkit-backdrop-filter:var(--highlight-backdrop-filter);
- backdrop-filter:var(--highlight-backdrop-filter);
- border-radius:4px;
- }
- .appended:is(.textLayer .highlight){
- position:initial;
- }
- .begin:is(.textLayer .highlight){
- border-radius:4px 0 0 4px;
- }
- .end:is(.textLayer .highlight){
- border-radius:0 4px 4px 0;
- }
- .middle:is(.textLayer .highlight){
- border-radius:0;
- }
- .selected:is(.textLayer .highlight){
- background-color:var(--highlight-selected-bg-color);
- -webkit-backdrop-filter:var(--highlight-selected-backdrop-filter);
- backdrop-filter:var(--highlight-selected-backdrop-filter);
- }
- .textLayer ::-moz-selection{
- background:rgba(0 0 255 / 0.25);
- background:color-mix(in srgb, AccentColor, transparent 75%);
- }
- .textLayer ::selection{
- background:rgba(0 0 255 / 0.25);
- background:color-mix(in srgb, AccentColor, transparent 75%);
- }
- .textLayer br::-moz-selection{
- background:transparent;
- }
- .textLayer br::selection{
- background:transparent;
- }
- .textLayer .endOfContent{
- display:block;
- position:absolute;
- inset:100% 0 0;
- z-index:0;
- cursor:default;
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- }
- .textLayer.selecting .endOfContent{
- top:0;
- }
- .annotationLayer{
- --csstools-color-scheme--light:initial;
- color-scheme:only light;
- --annotation-unfocused-field-background:url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
- --input-focus-border-color:Highlight;
- --input-focus-outline:1px solid Canvas;
- --input-unfocused-border-color:transparent;
- --input-disabled-border-color:transparent;
- --input-hover-border-color:black;
- --link-outline:none;
- }
- @media screen and (forced-colors: active){
- .annotationLayer{
- --input-focus-border-color:CanvasText;
- --input-unfocused-border-color:ActiveText;
- --input-disabled-border-color:GrayText;
- --input-hover-border-color:Highlight;
- --link-outline:1.5px solid LinkText;
- }
- .annotationLayer .textWidgetAnnotation :is(input,textarea):required,.annotationLayer .choiceWidgetAnnotation select:required,.annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input:required{
- outline:1.5px solid selectedItem;
- }
- .annotationLayer .linkAnnotation{
- outline:var(--link-outline);
- }
- :is(.annotationLayer .linkAnnotation):hover{
- -webkit-backdrop-filter:var(--hcm-highlight-filter);
- backdrop-filter:var(--hcm-highlight-filter);
- }
- :is(.annotationLayer .linkAnnotation) > a:hover{
- opacity:0 !important;
- background:none !important;
- box-shadow:none;
- }
- .annotationLayer .popupAnnotation .popup{
- outline:calc(1.5px * var(--total-scale-factor)) solid CanvasText !important;
- background-color:ButtonFace !important;
- color:ButtonText !important;
- }
- .annotationLayer .highlightArea:hover::after{
- position:absolute;
- top:0;
- left:0;
- width:100%;
- height:100%;
- -webkit-backdrop-filter:var(--hcm-highlight-filter);
- backdrop-filter:var(--hcm-highlight-filter);
- content:"";
- pointer-events:none;
- }
- .annotationLayer .popupAnnotation.focused .popup{
- outline:calc(3px * var(--total-scale-factor)) solid Highlight !important;
- }
- }
- .annotationLayer{
- position:absolute;
- top:0;
- left:0;
- pointer-events:none;
- transform-origin:0 0;
- }
- .annotationLayer[data-main-rotation="90"] .norotate{
- transform:rotate(270deg) translateX(-100%);
- }
- .annotationLayer[data-main-rotation="180"] .norotate{
- transform:rotate(180deg) translate(-100%, -100%);
- }
- .annotationLayer[data-main-rotation="270"] .norotate{
- transform:rotate(90deg) translateY(-100%);
- }
- .annotationLayer.disabled section,.annotationLayer.disabled .popup{
- pointer-events:none;
- }
- .annotationLayer .annotationContent{
- position:absolute;
- width:100%;
- height:100%;
- pointer-events:none;
- }
- .freetext:is(.annotationLayer .annotationContent){
- background:transparent;
- border:none;
- inset:0;
- overflow:visible;
- white-space:nowrap;
- font:10px sans-serif;
- line-height:1.35;
- }
- .annotationLayer section{
- position:absolute;
- text-align:initial;
- pointer-events:auto;
- box-sizing:border-box;
- transform-origin:0 0;
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- }
- :is(.annotationLayer section):has(div.annotationContent) canvas.annotationContent{
- display:none;
- }
- .textLayer.selecting ~ .annotationLayer section{
- pointer-events:none;
- }
- .annotationLayer :is(.linkAnnotation,.buttonWidgetAnnotation.pushButton) > a{
- position:absolute;
- font-size:1em;
- top:0;
- left:0;
- width:100%;
- height:100%;
- }
- .annotationLayer :is(.linkAnnotation,.buttonWidgetAnnotation.pushButton):not(.hasBorder) > a:hover{
- opacity:0.2;
- background-color:rgb(255 255 0);
- box-shadow:0 2px 10px rgb(255 255 0);
- }
- .annotationLayer .linkAnnotation.hasBorder:hover{
- background-color:rgb(255 255 0 / 0.2);
- }
- .annotationLayer .hasBorder{
- background-size:100% 100%;
- }
- .annotationLayer .textAnnotation img{
- position:absolute;
- cursor:pointer;
- width:100%;
- height:100%;
- top:0;
- left:0;
- }
- .annotationLayer .textWidgetAnnotation :is(input,textarea),.annotationLayer .choiceWidgetAnnotation select,.annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input{
- background-image:var(--annotation-unfocused-field-background);
- border:2px solid var(--input-unfocused-border-color);
- box-sizing:border-box;
- font:calc(9px * var(--total-scale-factor)) sans-serif;
- height:100%;
- margin:0;
- vertical-align:top;
- width:100%;
- }
- .annotationLayer .textWidgetAnnotation :is(input,textarea):required,.annotationLayer .choiceWidgetAnnotation select:required,.annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input:required{
- outline:1.5px solid red;
- }
- .annotationLayer .choiceWidgetAnnotation select option{
- padding:0;
- }
- .annotationLayer .buttonWidgetAnnotation.radioButton input{
- border-radius:50%;
- }
- .annotationLayer .textWidgetAnnotation textarea{
- resize:none;
- }
- .annotationLayer .textWidgetAnnotation [disabled]:is(input,textarea),.annotationLayer .choiceWidgetAnnotation select[disabled],.annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input[disabled]{
- background:none;
- border:2px solid var(--input-disabled-border-color);
- cursor:not-allowed;
- }
- .annotationLayer .textWidgetAnnotation :is(input,textarea):hover,.annotationLayer .choiceWidgetAnnotation select:hover,.annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input:hover{
- border:2px solid var(--input-hover-border-color);
- }
- .annotationLayer .textWidgetAnnotation :is(input,textarea):hover,.annotationLayer .choiceWidgetAnnotation select:hover,.annotationLayer .buttonWidgetAnnotation.checkBox input:hover{
- border-radius:2px;
- }
- .annotationLayer .textWidgetAnnotation :is(input,textarea):focus,.annotationLayer .choiceWidgetAnnotation select:focus{
- background:none;
- border:2px solid var(--input-focus-border-color);
- border-radius:2px;
- outline:var(--input-focus-outline);
- }
- .annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) :focus{
- background-image:none;
- background-color:transparent;
- }
- .annotationLayer .buttonWidgetAnnotation.checkBox :focus{
- border:2px solid var(--input-focus-border-color);
- border-radius:2px;
- outline:var(--input-focus-outline);
- }
- .annotationLayer .buttonWidgetAnnotation.radioButton :focus{
- border:2px solid var(--input-focus-border-color);
- outline:var(--input-focus-outline);
- }
- .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before,.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after,.annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before{
- background-color:CanvasText;
- content:"";
- display:block;
- position:absolute;
- }
- .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before,.annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after{
- height:80%;
- left:45%;
- width:1px;
- }
- .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before{
- transform:rotate(45deg);
- }
- .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after{
- transform:rotate(-45deg);
- }
- .annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before{
- border-radius:50%;
- height:50%;
- left:25%;
- top:25%;
- width:50%;
- }
- .annotationLayer .textWidgetAnnotation input.comb{
- font-family:monospace;
- padding-left:2px;
- padding-right:0;
- }
- .annotationLayer .textWidgetAnnotation input.comb:focus{
- width:103%;
- }
- .annotationLayer .buttonWidgetAnnotation:is(.checkBox,.radioButton) input{
- -webkit-appearance:none;
- -moz-appearance:none;
- appearance:none;
- }
- .annotationLayer .fileAttachmentAnnotation .popupTriggerArea{
- height:100%;
- width:100%;
- }
- .annotationLayer .popupAnnotation{
- position:absolute;
- font-size:calc(9px * var(--total-scale-factor));
- pointer-events:none;
- width:-moz-max-content;
- width:max-content;
- max-width:45%;
- height:auto;
- }
- .annotationLayer .popup{
- background-color:rgb(255 255 153);
- color:black;
- box-shadow:0 calc(2px * var(--total-scale-factor)) calc(5px * var(--total-scale-factor)) rgb(136 136 136);
- border-radius:calc(2px * var(--total-scale-factor));
- outline:1.5px solid rgb(255 255 74);
- padding:calc(6px * var(--total-scale-factor));
- cursor:pointer;
- font:message-box;
- white-space:normal;
- word-wrap:break-word;
- pointer-events:auto;
- -webkit-user-select:text;
- -moz-user-select:text;
- user-select:text;
- }
- .annotationLayer .popupAnnotation.focused .popup{
- outline-width:3px;
- }
- .annotationLayer .popup *{
- font-size:calc(9px * var(--total-scale-factor));
- }
- .annotationLayer .popup > .header{
- display:inline-block;
- }
- .annotationLayer .popup > .header h1{
- display:inline;
- }
- .annotationLayer .popup > .header .popupDate{
- display:inline-block;
- margin-left:calc(5px * var(--total-scale-factor));
- width:-moz-fit-content;
- width:fit-content;
- }
- .annotationLayer .popupContent{
- border-top:1px solid rgb(51 51 51);
- margin-top:calc(2px * var(--total-scale-factor));
- padding-top:calc(2px * var(--total-scale-factor));
- }
- .annotationLayer .richText > *{
- white-space:pre-wrap;
- font-size:calc(9px * var(--total-scale-factor));
- }
- .annotationLayer .popupTriggerArea{
- cursor:pointer;
- }
- .annotationLayer section svg{
- position:absolute;
- width:100%;
- height:100%;
- top:0;
- left:0;
- }
- .annotationLayer .annotationTextContent{
- position:absolute;
- width:100%;
- height:100%;
- opacity:0;
- color:transparent;
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- pointer-events:none;
- }
- :is(.annotationLayer .annotationTextContent) span{
- width:100%;
- display:inline-block;
- }
- .annotationLayer svg.quadrilateralsContainer{
- contain:strict;
- width:0;
- height:0;
- position:absolute;
- top:0;
- left:0;
- z-index:-1;
- }
- :root{
- --xfa-unfocused-field-background:url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
- --xfa-focus-outline:auto;
- }
- @media screen and (forced-colors: active){
- :root{
- --xfa-focus-outline:2px solid CanvasText;
- }
- .xfaLayer *:required{
- outline:1.5px solid selectedItem;
- }
- }
- .xfaLayer{
- --csstools-color-scheme--light:initial;
- color-scheme:only light;
- background-color:transparent;
- }
- .xfaLayer .highlight{
- margin:-1px;
- padding:1px;
- background-color:rgb(239 203 237);
- border-radius:4px;
- }
- .xfaLayer .highlight.appended{
- position:initial;
- }
- .xfaLayer .highlight.begin{
- border-radius:4px 0 0 4px;
- }
- .xfaLayer .highlight.end{
- border-radius:0 4px 4px 0;
- }
- .xfaLayer .highlight.middle{
- border-radius:0;
- }
- .xfaLayer .highlight.selected{
- background-color:rgb(203 223 203);
- }
- .xfaPage{
- overflow:hidden;
- position:relative;
- }
- .xfaContentarea{
- position:absolute;
- }
- .xfaPrintOnly{
- display:none;
- }
- .xfaLayer{
- position:absolute;
- text-align:initial;
- top:0;
- left:0;
- transform-origin:0 0;
- line-height:1.2;
- }
- .xfaLayer *{
- color:inherit;
- font:inherit;
- font-style:inherit;
- font-weight:inherit;
- font-kerning:inherit;
- letter-spacing:-0.01px;
- text-align:inherit;
- text-decoration:inherit;
- box-sizing:border-box;
- background-color:transparent;
- padding:0;
- margin:0;
- pointer-events:auto;
- line-height:inherit;
- }
- .xfaLayer *:required{
- outline:1.5px solid red;
- }
- .xfaLayer div,
- .xfaLayer svg,
- .xfaLayer svg *{
- pointer-events:none;
- }
- .xfaLayer a{
- color:blue;
- }
- .xfaRich li{
- margin-left:3em;
- }
- .xfaFont{
- color:black;
- font-weight:normal;
- font-kerning:none;
- font-size:10px;
- font-style:normal;
- letter-spacing:0;
- text-decoration:none;
- vertical-align:0;
- }
- .xfaCaption{
- overflow:hidden;
- flex:0 0 auto;
- }
- .xfaCaptionForCheckButton{
- overflow:hidden;
- flex:1 1 auto;
- }
- .xfaLabel{
- height:100%;
- width:100%;
- }
- .xfaLeft{
- display:flex;
- flex-direction:row;
- align-items:center;
- }
- .xfaRight{
- display:flex;
- flex-direction:row-reverse;
- align-items:center;
- }
- :is(.xfaLeft, .xfaRight) > :is(.xfaCaption, .xfaCaptionForCheckButton){
- max-height:100%;
- }
- .xfaTop{
- display:flex;
- flex-direction:column;
- align-items:flex-start;
- }
- .xfaBottom{
- display:flex;
- flex-direction:column-reverse;
- align-items:flex-start;
- }
- :is(.xfaTop, .xfaBottom) > :is(.xfaCaption, .xfaCaptionForCheckButton){
- width:100%;
- }
- .xfaBorder{
- background-color:transparent;
- position:absolute;
- pointer-events:none;
- }
- .xfaWrapped{
- width:100%;
- height:100%;
- }
- :is(.xfaTextfield, .xfaSelect):focus{
- background-image:none;
- background-color:transparent;
- outline:var(--xfa-focus-outline);
- outline-offset:-1px;
- }
- :is(.xfaCheckbox, .xfaRadio):focus{
- outline:var(--xfa-focus-outline);
- }
- .xfaTextfield,
- .xfaSelect{
- height:100%;
- width:100%;
- flex:1 1 auto;
- border:none;
- resize:none;
- background-image:var(--xfa-unfocused-field-background);
- }
- .xfaSelect{
- padding-inline:2px;
- }
- :is(.xfaTop, .xfaBottom) > :is(.xfaTextfield, .xfaSelect){
- flex:0 1 auto;
- }
- .xfaButton{
- cursor:pointer;
- width:100%;
- height:100%;
- border:none;
- text-align:center;
- }
- .xfaLink{
- width:100%;
- height:100%;
- position:absolute;
- top:0;
- left:0;
- }
- .xfaCheckbox,
- .xfaRadio{
- width:100%;
- height:100%;
- flex:0 0 auto;
- border:none;
- }
- .xfaRich{
- white-space:pre-wrap;
- width:100%;
- height:100%;
- }
- .xfaImage{
- -o-object-position:left top;
- object-position:left top;
- -o-object-fit:contain;
- object-fit:contain;
- width:100%;
- height:100%;
- }
- .xfaLrTb,
- .xfaRlTb,
- .xfaTb{
- display:flex;
- flex-direction:column;
- align-items:stretch;
- }
- .xfaLr{
- display:flex;
- flex-direction:row;
- align-items:stretch;
- }
- .xfaRl{
- display:flex;
- flex-direction:row-reverse;
- align-items:stretch;
- }
- .xfaTb > div{
- justify-content:left;
- }
- .xfaPosition{
- position:relative;
- }
- .xfaArea{
- position:relative;
- }
- .xfaValignMiddle{
- display:flex;
- align-items:center;
- }
- .xfaTable{
- display:flex;
- flex-direction:column;
- align-items:stretch;
- }
- .xfaTable .xfaRow{
- display:flex;
- flex-direction:row;
- align-items:stretch;
- }
- .xfaTable .xfaRlRow{
- display:flex;
- flex-direction:row-reverse;
- align-items:stretch;
- flex:1;
- }
- .xfaTable .xfaRlRow > div{
- flex:1;
- }
- :is(.xfaNonInteractive, .xfaDisabled, .xfaReadOnly) :is(input, textarea){
- background:initial;
- }
- @media print{
- .xfaTextfield,
- .xfaSelect{
- background:transparent;
- }
- .xfaSelect{
- -webkit-appearance:none;
- -moz-appearance:none;
- appearance:none;
- text-indent:1px;
- text-overflow:"";
- }
- }
- .canvasWrapper svg{
- transform:none;
- }
- .moving:is(.canvasWrapper svg){
- z-index:100000;
- }
- [data-main-rotation="90"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) mask,[data-main-rotation="90"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) use:not(.clip,.mask){
- transform:matrix(0, 1, -1, 0, 1, 0);
- }
- [data-main-rotation="180"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) mask,[data-main-rotation="180"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) use:not(.clip,.mask){
- transform:matrix(-1, 0, 0, -1, 1, 1);
- }
- [data-main-rotation="270"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) mask,[data-main-rotation="270"]:is(.highlight:is(.canvasWrapper svg),.highlightOutline:is(.canvasWrapper svg)) use:not(.clip,.mask){
- transform:matrix(0, -1, 1, 0, 0, 1);
- }
- .draw:is(.canvasWrapper svg){
- position:absolute;
- mix-blend-mode:normal;
- }
- .draw[data-draw-rotation="90"]:is(.canvasWrapper svg){
- transform:rotate(90deg);
- }
- .draw[data-draw-rotation="180"]:is(.canvasWrapper svg){
- transform:rotate(180deg);
- }
- .draw[data-draw-rotation="270"]:is(.canvasWrapper svg){
- transform:rotate(270deg);
- }
- .highlight:is(.canvasWrapper svg){
- --blend-mode:multiply;
- }
- @media screen and (forced-colors: active){
- .highlight:is(.canvasWrapper svg){
- --blend-mode:difference;
- }
- }
- .highlight:is(.canvasWrapper svg){
- position:absolute;
- mix-blend-mode:var(--blend-mode);
- }
- .highlight:is(.canvasWrapper svg):not(.free){
- fill-rule:evenodd;
- }
- .highlightOutline:is(.canvasWrapper svg){
- position:absolute;
- mix-blend-mode:normal;
- fill-rule:evenodd;
- fill:none;
- }
- .highlightOutline.hovered:is(.canvasWrapper svg):not(.free):not(.selected){
- stroke:var(--hover-outline-color);
- stroke-width:var(--outline-width);
- }
- .highlightOutline.selected:is(.canvasWrapper svg):not(.free) .mainOutline{
- stroke:var(--outline-around-color);
- stroke-width:calc(
- var(--outline-width) + 2 * var(--outline-around-width)
- );
- }
- .highlightOutline.selected:is(.canvasWrapper svg):not(.free) .secondaryOutline{
- stroke:var(--outline-color);
- stroke-width:var(--outline-width);
- }
- .highlightOutline.free.hovered:is(.canvasWrapper svg):not(.selected){
- stroke:var(--hover-outline-color);
- stroke-width:calc(2 * var(--outline-width));
- }
- .highlightOutline.free.selected:is(.canvasWrapper svg) .mainOutline{
- stroke:var(--outline-around-color);
- stroke-width:calc(
- 2 * (var(--outline-width) + var(--outline-around-width))
- );
- }
- .highlightOutline.free.selected:is(.canvasWrapper svg) .secondaryOutline{
- stroke:var(--outline-color);
- stroke-width:calc(2 * var(--outline-width));
- }
- .toggle-button{
- --button-background-color:color-mix(in srgb, currentColor 7%, transparent);
- --button-background-color-hover:color-mix(
- in srgb,
- currentColor 14%,
- transparent
- );
- --button-background-color-active:color-mix(
- in srgb,
- currentColor 21%,
- transparent
- );
- --csstools-light-dark-toggle--66:var(--csstools-color-scheme--light) #0df;
- --color-accent-primary:var(--csstools-light-dark-toggle--66, #0060df);
- --csstools-light-dark-toggle--67:var(--csstools-color-scheme--light) #80ebff;
- --color-accent-primary-hover:var(--csstools-light-dark-toggle--67, #0250bb);
- --csstools-light-dark-toggle--68:var(--csstools-color-scheme--light) #aaf2ff;
- --color-accent-primary-active:var(--csstools-light-dark-toggle--68, #054096);
- --border-radius-circle:9999px;
- --border-width:1px;
- --size-item-small:16px;
- --size-item-large:32px;
- --csstools-light-dark-toggle--69:var(--csstools-color-scheme--light) #1c1b22;
- --color-canvas:var(--csstools-light-dark-toggle--69, white);
- --background-color-canvas:var(--color-canvas);
- --csstools-light-dark-toggle--70:var(--csstools-color-scheme--light) #f9f9fa;
- --border-color-interactive:var(--csstools-light-dark-toggle--70, #8f8f9d);
- --border-color-interactive-hover:var(--border-color-interactive);
- --border-color-interactive-active:var(--border-color-interactive);
- }
- @supports (color: light-dark(red, red)){
- .toggle-button{
- --color-accent-primary:light-dark(#0060df, #0df);
- --color-accent-primary-hover:light-dark(#0250bb, #80ebff);
- --color-accent-primary-active:light-dark(#054096, #aaf2ff);
- --color-canvas:light-dark(white, #1c1b22);
- --border-color-interactive:light-dark(#8f8f9d, #f9f9fa);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- .toggle-button *{
- --csstools-light-dark-toggle--66:var(--csstools-color-scheme--light) #0df;
- --color-accent-primary:var(--csstools-light-dark-toggle--66, #0060df);
- --csstools-light-dark-toggle--67:var(--csstools-color-scheme--light) #80ebff;
- --color-accent-primary-hover:var(--csstools-light-dark-toggle--67, #0250bb);
- --csstools-light-dark-toggle--68:var(--csstools-color-scheme--light) #aaf2ff;
- --color-accent-primary-active:var(--csstools-light-dark-toggle--68, #054096);
- --csstools-light-dark-toggle--69:var(--csstools-color-scheme--light) #1c1b22;
- --color-canvas:var(--csstools-light-dark-toggle--69, white);
- --csstools-light-dark-toggle--70:var(--csstools-color-scheme--light) #f9f9fa;
- --border-color-interactive:var(--csstools-light-dark-toggle--70, #8f8f9d);
- }
- }
- @media (forced-colors: active){
- .toggle-button{
- --color-accent-primary:ButtonText;
- --color-accent-primary-hover:SelectedItem;
- --color-accent-primary-active:SelectedItem;
- --button-background-color:ButtonFace;
- --border-color-interactive:ButtonText;
- --border-color-interactive-hover:SelectedItem;
- --border-color-interactive-active:ButtonText;
- --color-canvas:ButtonText;
- --background-color-canvas:Canvas;
- }
- }
- .toggle-button{
- --toggle-background-color:var(--button-background-color);
- --toggle-background-color-hover:var(--button-background-color-hover);
- --toggle-background-color-active:var(--button-background-color-active);
- --toggle-background-color-pressed:var(--color-accent-primary);
- --toggle-background-color-pressed-hover:var(--color-accent-primary-hover);
- --toggle-background-color-pressed-active:var(--color-accent-primary-active);
- --toggle-border-color:var(--border-color-interactive);
- --toggle-border-color-hover:var(--toggle-border-color);
- --toggle-border-color-active:var(--toggle-border-color);
- --toggle-border-radius:var(--border-radius-circle);
- --toggle-border-width:var(--border-width);
- --toggle-height:var(--size-item-small);
- --toggle-width:var(--size-item-large);
- --toggle-dot-background-color:var(--toggle-border-color);
- --toggle-dot-background-color-hover:var(--toggle-dot-background-color);
- --toggle-dot-background-color-active:var(--toggle-dot-background-color);
- --toggle-dot-background-color-on-pressed:var(--background-color-canvas);
- --toggle-dot-margin:1px;
- --toggle-dot-height:calc(
- var(--toggle-height) - 2 * var(--toggle-dot-margin) - 2 *
- var(--toggle-border-width)
- );
- --toggle-dot-width:var(--toggle-dot-height);
- --toggle-dot-transform-x:calc(
- var(--toggle-width) - 4 * var(--toggle-dot-margin) - var(--toggle-dot-width)
- );
- --input-width:var(--toggle-width);
- -webkit-appearance:none;
- -moz-appearance:none;
- appearance:none;
- padding:0;
- border:var(--toggle-border-width) solid var(--toggle-border-color);
- height:var(--toggle-height);
- width:var(--toggle-width);
- border-radius:var(--toggle-border-radius);
- background-color:var(--toggle-background-color);
- box-sizing:border-box;
- }
- .toggle-button:focus-visible{
- outline:var(--focus-outline);
- outline-offset:var(--focus-outline-offset);
- }
- .toggle-button:enabled:hover{
- background-color:var(--toggle-background-color-hover);
- border-color:var(--toggle-border-color);
- }
- .toggle-button:enabled:hover:active{
- background-color:var(--toggle-background-color-active);
- border-color:var(--toggle-border-color);
- }
- .toggle-button::before{
- display:block;
- content:"";
- background-color:var(--toggle-dot-background-color);
- height:var(--toggle-dot-height);
- width:var(--toggle-dot-width);
- margin:var(--toggle-dot-margin);
- border-radius:var(--toggle-border-radius);
- translate:0;
- }
- .toggle-button[aria-pressed="true"]{
- background-color:var(--toggle-background-color-pressed);
- border-color:transparent;
- }
- .toggle-button[aria-pressed="true"]:enabled:hover{
- background-color:var(--toggle-background-color-pressed-hover);
- border-color:transparent;
- }
- .toggle-button[aria-pressed="true"]:enabled:hover:active{
- background-color:var(--toggle-background-color-pressed-active);
- border-color:transparent;
- }
- .toggle-button[aria-pressed="true"]::before{
- translate:var(--toggle-dot-transform-x);
- background-color:var(--toggle-dot-background-color-on-pressed);
- }
- .toggle-button[aria-pressed="true"]:enabled:hover::before,.toggle-button[aria-pressed="true"]:enabled:hover:active::before{
- background-color:var(--toggle-dot-background-color-on-pressed);
- }
- .toggle-button[aria-pressed="true"]:-moz-locale-dir(rtl)::before,[dir="rtl"] .toggle-button[aria-pressed="true"]::before{
- translate:calc(-1 * var(--toggle-dot-transform-x));
- }
- @media (prefers-reduced-motion: no-preference){
- .toggle-button::before{
- transition:translate 100ms;
- }
- }
- @media (prefers-contrast){
- .toggle-button:enabled:hover{
- border-color:var(--toggle-border-color-hover);
- }
- .toggle-button:enabled:hover:active{
- border-color:var(--toggle-border-color-active);
- }
- .toggle-button[aria-pressed="true"]:enabled{
- border-color:var(--toggle-border-color);
- position:relative;
- }
- .toggle-button[aria-pressed="true"]:enabled:hover{
- border-color:var(--toggle-border-color-hover);
- }
- .toggle-button[aria-pressed="true"]:enabled:hover:active{
- background-color:var(--toggle-dot-background-color-active);
- border-color:var(--toggle-dot-background-color-hover);
- }
- .toggle-button:enabled:hover::before,
- .toggle-button:enabled:hover:active::before{
- background-color:var(--toggle-dot-background-color-hover);
- }
- }
- @media (forced-colors){
- .toggle-button{
- --toggle-dot-background-color:var(--color-accent-primary);
- --toggle-dot-background-color-hover:var(--color-accent-primary-hover);
- --toggle-dot-background-color-active:var(--color-accent-primary-active);
- --toggle-dot-background-color-on-pressed:var(--button-background-color);
- --toggle-border-color-hover:var(--border-color-interactive-hover);
- --toggle-border-color-active:var(--border-color-interactive-active);
- }
- .toggle-button[aria-pressed="true"]:enabled::after{
- border:1px solid var(--button-background-color);
- content:"";
- position:absolute;
- height:var(--toggle-height);
- width:var(--toggle-width);
- display:block;
- border-radius:var(--toggle-border-radius);
- inset:-2px;
- }
- .toggle-button[aria-pressed="true"]:enabled:hover:active::after{
- border-color:var(--toggle-border-color-active);
- }
- }
- :root{
- --clear-signature-button-icon:url(images/editor-toolbar-delete.svg);
- --csstools-light-dark-toggle--71:var(--csstools-color-scheme--light) #2b2a33;
- --signature-bg:var(--csstools-light-dark-toggle--71, #f9f9fb);
- --csstools-light-dark-toggle--72:var(--csstools-color-scheme--light) var(--signature-bg);
- --signature-hover-bg:var(--csstools-light-dark-toggle--72, #f0f0f4);
- --button-signature-bg:transparent;
- --button-signature-color:var(--main-color);
- --csstools-light-dark-toggle--73:var(--csstools-color-scheme--light) #5b5b66;
- --button-signature-active-bg:var(--csstools-light-dark-toggle--73, #cfcfd8);
- --button-signature-active-border:none;
- --button-signature-active-color:var(--button-signature-color);
- --button-signature-border:none;
- --csstools-light-dark-toggle--74:var(--csstools-color-scheme--light) #52525e;
- --button-signature-hover-bg:var(--csstools-light-dark-toggle--74, #e0e0e6);
- --button-signature-hover-color:var(--button-signature-color);
- }
- @supports (color: light-dark(red, red)){
- :root{
- --signature-bg:light-dark(#f9f9fb, #2b2a33);
- --signature-hover-bg:light-dark(#f0f0f4, var(--signature-bg));
- --button-signature-active-bg:light-dark(#cfcfd8, #5b5b66);
- --button-signature-hover-bg:light-dark(#e0e0e6, #52525e);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- :root *{
- --csstools-light-dark-toggle--71:var(--csstools-color-scheme--light) #2b2a33;
- --signature-bg:var(--csstools-light-dark-toggle--71, #f9f9fb);
- --csstools-light-dark-toggle--72:var(--csstools-color-scheme--light) var(--signature-bg);
- --signature-hover-bg:var(--csstools-light-dark-toggle--72, #f0f0f4);
- --csstools-light-dark-toggle--73:var(--csstools-color-scheme--light) #5b5b66;
- --button-signature-active-bg:var(--csstools-light-dark-toggle--73, #cfcfd8);
- --csstools-light-dark-toggle--74:var(--csstools-color-scheme--light) #52525e;
- --button-signature-hover-bg:var(--csstools-light-dark-toggle--74, #e0e0e6);
- }
- }
- @media screen and (forced-colors: active){
- :root{
- --signature-bg:HighlightText;
- --signature-hover-bg:var(--signature-bg);
- --button-signature-bg:HighlightText;
- --button-signature-color:ButtonText;
- --button-signature-active-bg:ButtonText;
- --button-signature-active-color:HighlightText;
- --button-signature-border:1px solid ButtonText;
- --button-signature-hover-bg:Highlight;
- --button-signature-hover-color:HighlightText;
- }
- }
- .signatureDialog{
- --primary-color:var(--text-primary-color);
- --border-color:#8f8f9d;
- --open-link-fg:var(--link-fg-color);
- --open-link-hover-fg:var(--link-hover-fg-color);
- }
- @media screen and (forced-colors: active){
- .signatureDialog{
- --primary-color:ButtonText;
- --border-color:ButtonText;
- --open-link-fg:ButtonText;
- --open-link-hover-fg:ButtonText;
- }
- }
- .signatureDialog{
- width:570px;
- max-width:100%;
- min-width:300px;
- padding:16px 0;
- }
- .signatureDialog .mainContainer{
- width:100%;
- display:flex;
- flex-direction:column;
- align-items:flex-start;
- gap:12px;
- }
- :is(.signatureDialog .mainContainer) span:not([role="sectionhead"]){
- font-size:13px;
- font-style:normal;
- font-weight:400;
- line-height:normal;
- }
- :is(.signatureDialog .mainContainer) .title{
- margin-inline-start:16px;
- }
- .signatureDialog .inputWithClearButton{
- --button-dimension:24px;
- --clear-button-icon:url(images/messageBar_closingButton.svg);
- width:100%;
- position:relative;
- display:flex;
- align-items:center;
- justify-content:center;
- }
- :is(.signatureDialog .inputWithClearButton) > input{
- width:100%;
- height:32px;
- padding-inline:8px calc(4px + var(--button-dimension));
- box-sizing:border-box;
- border-radius:4px;
- border:1px solid var(--border-color);
- }
- :is(.signatureDialog .inputWithClearButton) .clearInputButton{
- position:absolute;
- inset-block-start:4px;
- inset-inline-end:4px;
- display:inline-block;
- width:var(--button-dimension);
- height:var(--button-dimension);
- background-color:var(--input-text-fg-color);
- -webkit-mask-size:cover;
- mask-size:cover;
- -webkit-mask-image:var(--clear-button-icon);
- mask-image:var(--clear-button-icon);
- padding:0;
- border:0;
- }
- #addSignatureDialog{
- --secondary-color:var(--text-secondary-color);
- --bg-hover:#e0e0e6;
- --tab-top-line-active-color:#0060df;
- --tab-top-line-active-hover-color:var(--tab-text-hover-color);
- --tab-top-line-hover-color:#8f8f9d;
- --tab-top-line-inactive-color:#cfcfd8;
- --tab-bottom-line-active-color:var(--tab-top-line-inactive-color);
- --tab-bottom-line-hover-color:var(--tab-top-line-inactive-color);
- --tab-bottom-line-inactive-color:var(--tab-top-line-inactive-color);
- --tab-bg:var(--dialog-bg-color);
- --tab-bg-active-color:var(--tab-bg);
- --tab-bg-active-hover-color:var(--bg-hover);
- --tab-bg-hover:var(--bg-hover);
- --tab-panel-border:none;
- --tab-panel-border-radius:4px;
- --tab-text-color:var(--primary-color);
- --tab-text-active-color:var(--tab-top-line-active-color);
- --tab-text-active-hover-color:var(--tab-text-hover-color);
- --tab-text-hover-color:var(--tab-text-color);
- --signature-placeholder-color:var(--secondary-color);
- --signature-draw-placeholder-color:var(--primary-color);
- --signature-color:var(--primary-color);
- --clear-signature-button-border-width:0;
- --clear-signature-button-border-style:solid;
- --clear-signature-button-border-color:transparent;
- --clear-signature-button-border-disabled-color:transparent;
- --clear-signature-button-color:var(--primary-color);
- --clear-signature-button-hover-color:var(--clear-signature-button-color);
- --clear-signature-button-active-color:var(--clear-signature-button-color);
- --clear-signature-button-disabled-color:var(--clear-signature-button-color);
- --clear-signature-button-focus-color:var(--clear-signature-button-color);
- --clear-signature-button-bg:var(--dialog-bg-color);
- --clear-signature-button-bg-hover:var(--bg-hover);
- --clear-signature-button-bg-active:#cfcfd8;
- --clear-signature-button-bg-focus:#f0f0f4;
- --clear-signature-button-bg-disabled:color-mix(
- in srgb,
- #f0f0f4,
- transparent 40%
- );
- --save-warning-color:var(--secondary-color);
- --thickness-bg:var(--dialog-bg-color);
- --thickness-label-color:var(--primary-color);
- --thickness-slider-color:var(--primary-color);
- --thickness-border:none;
- --draw-cursor:url(images/cursor-editorInk.svg) 0 16, pointer;
- }
- @media (prefers-color-scheme: dark){
- #addSignatureDialog{
- --dialog-bg-color:#42414d;
- --bg-hover:#52525e;
- --primary-color:#fbfbfe;
- --secondary-color:#cfcfd8;
- --tab-top-line-active-color:#0df;
- --tab-top-line-inactive-color:#8f8f9d;
- --clear-signature-button-bg-active:#5b5b66;
- --clear-signature-button-bg-focus:#2b2a33;
- --clear-signature-button-bg-disabled:color-mix(
- in srgb,
- #2b2a33,
- transparent 40%
- );
- }
- }
- @media screen and (forced-colors: active){
- #addSignatureDialog{
- --secondary-color:ButtonText;
- --bg:HighlightText;
- --bg-hover:var(--bg);
- --tab-top-line-active-color:ButtonText;
- --tab-top-line-active-hover-color:HighlightText;
- --tab-top-line-hover-color:SelectedItem;
- --tab-top-line-inactive-color:ButtonText;
- --tab-bottom-line-active-color:var(--tab-top-line-active-color);
- --tab-bottom-line-hover-color:var(--tab-top-line-hover-color);
- --tab-bg:var(--bg);
- --tab-bg-active-color:SelectedItem;
- --tab-bg-active-hover-color:SelectedItem;
- --tab-panel-border:1px solid ButtonText;
- --tab-panel-border-radius:8px;
- --tab-text-color:ButtonText;
- --tab-text-active-color:HighlightText;
- --tab-text-active-hover-color:HighlightText;
- --tab-text-hover-color:SelectedItem;
- --signature-color:ButtonText;
- --clear-signature-button-border-width:1px;
- --clear-signature-button-border-style:solid;
- --clear-signature-button-border-color:ButtonText;
- --clear-signature-button-border-disabled-color:GrayText;
- --clear-signature-button-color:ButtonText;
- --clear-signature-button-hover-color:HighlightText;
- --clear-signature-button-active-color:SelectedItem;
- --clear-signature-button-focus-color:CanvasText;
- --clear-signature-button-disabled-color:GrayText;
- --clear-signature-button-bg:var(--bg);
- --clear-signature-button-bg-hover:SelectedItem;
- --clear-signature-button-bg-active:var(--bg);
- --clear-signature-button-bg-focus:var(--bg);
- --clear-signature-button-bg-disabled:var(--bg);
- --thickness-bg:Canvas;
- --thickness-label-color:CanvasText;
- --thickness-slider-color:ButtonText;
- --thickness-border:1px solid var(--border-color);
- }
- }
- #addSignatureDialog #addSignatureDialogLabel{
- overflow:hidden;
- position:absolute;
- inset:0;
- width:0;
- height:0;
- }
- #addSignatureDialog.waiting::after{
- content:"";
- cursor:wait;
- position:absolute;
- inset:0;
- width:100%;
- height:100%;
- }
- :is(#addSignatureDialog .mainContainer) [role="tablist"]{
- width:100%;
- display:flex;
- align-items:flex-start;
- gap:0;
- }
- :is(:is(#addSignatureDialog .mainContainer) [role="tablist"]) > [role="tab"]{
- flex:1 0 0;
- align-self:stretch;
- background-color:var(--tab-bg);
- padding-inline:0;
- cursor:default;
- border-inline:0;
- border-block-width:1px;
- border-block-style:solid;
- border-block-start-color:var(--tab-top-line-inactive-color);
- border-block-end-color:var(--tab-bottom-line-inactive-color);
- border-radius:0;
- font:menu;
- font-size:13px;
- font-style:normal;
- line-height:normal;
- font-weight:400;
- color:var(--tab-text-color);
- }
- :is(:is(:is(#addSignatureDialog .mainContainer) [role="tablist"]) > [role="tab"]):hover{
- border-block-start-width:2px;
- border-block-start-color:var(--tab-top-line-hover-color);
- border-block-end-color:var(--tab-bottom-line-hover-color);
- background-color:var(--tab-bg-hover);
- color:var(--tab-text-hover-color);
- }
- :is(:is(:is(#addSignatureDialog .mainContainer) [role="tablist"]) > [role="tab"]):focus-visible{
- outline:2px solid var(--tab-top-line-active-color);
- outline-offset:-2px;
- }
- [aria-selected="true"]:is(:is(:is(#addSignatureDialog .mainContainer) [role="tablist"]) > [role="tab"]){
- border-block-start-width:2px;
- border-block-start-color:var(--tab-top-line-active-color);
- border-block-end-color:var(--tab-bottom-line-active-color);
- background-color:var(--tab-bg-active-color);
- font-weight:590;
- color:var(--tab-text-active-color);
- }
- [aria-selected="true"]:is(:is(:is(#addSignatureDialog .mainContainer) [role="tablist"]) > [role="tab"]):hover{
- border-block-start-color:var(--tab-top-line-active-hover-color);
- background-color:var(--tab-bg-active-hover-color);
- color:var(--tab-text-active-hover-color);
- }
- :is(#addSignatureDialog .mainContainer) #addSignatureActionContainer{
- width:100%;
- height:auto;
- display:flex;
- flex-direction:column;
- align-items:flex-end;
- align-self:stretch;
- gap:12px;
- padding-inline:16px;
- box-sizing:border-box;
- }
- :is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]{
- position:relative;
- width:100%;
- height:220px;
- background-color:var(--signature-bg);
- border:var(--tab-panel-border);
- border-radius:var(--tab-panel-border-radius);
- }
- :is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) > svg{
- position:absolute;
- inset:0;
- width:100%;
- height:100%;
- background-color:transparent;
- }
- #addSignatureTypeContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]){
- display:none;
- }
- #addSignatureTypeContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureTypeInput{
- position:absolute;
- inset:0;
- width:100%;
- height:100%;
- border:0;
- padding:0;
- text-align:center;
- color:var(--signature-color);
- background-color:transparent;
- border-radius:var(--tab-panel-border-radius);
- font-family:"Brush script", "Apple Chancery", "Segoe script", "Freestyle Script", "Palace Script MT", "Brush Script MT", TK, cursive, serif;
- font-size:44px;
- font-style:italic;
- font-weight:400;
- }
- :is(#addSignatureTypeContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureTypeInput)::-moz-placeholder{
- color:var(--signature-placeholder-color);
- text-align:center;
- font:menu;
- font-style:normal;
- font-weight:274;
- font-size:44px;
- line-height:normal;
- }
- :is(#addSignatureTypeContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureTypeInput)::placeholder{
- color:var(--signature-placeholder-color);
- text-align:center;
- font:menu;
- font-style:normal;
- font-weight:274;
- font-size:44px;
- line-height:normal;
- }
- #addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]){
- display:none;
- }
- #addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) > span{
- position:absolute;
- top:0;
- left:0;
- width:100%;
- height:100%;
- display:grid;
- align-items:center;
- justify-content:center;
- background-color:transparent;
- color:var(--signature-placeholder-color);
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- }
- #addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) > svg{
- stroke:var(--signature-color);
- fill:none;
- stroke-opacity:1;
- stroke-linecap:round;
- stroke-linejoin:round;
- stroke-miterlimit:10;
- }
- :is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) > svg):hover{
- cursor:var(--draw-cursor);
- }
- #addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness{
- position:absolute;
- width:100%;
- inset-block-end:0;
- display:grid;
- align-items:center;
- justify-content:center;
- pointer-events:none;
- }
- :is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > span{
- color:var(--signature-draw-placeholder-color);
- }
- :is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div{
- width:auto;
- height:auto;
- display:flex;
- align-items:center;
- justify-content:center;
- gap:8px;
- padding:6px 8px 7px;
- margin:0;
- background-color:var(--thickness-bg);
- border-radius:4px 4px 0 0;
- border-inline:var(--thickness-border);
- border-top:var(--thickness-border);
- pointer-events:auto;
- position:relative;
- top:1px;
- }
- :is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > label{
- color:var(--thickness-label-color);
- }
- :is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input{
- width:100px;
- height:14px;
- background-color:transparent;
- }
- :is(:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input)::-webkit-slider-runnable-track,:is(:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input)::-moz-range-track,:is(:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input)::-moz-range-progress{
- background-color:var(--thickness-slider-color);
- }
- :is(:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input)::-webkit-slider-thumb,:is(:is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input)::-moz-range-thumb{
- background-color:var(--thickness-bg);
- }
- :is(:is(#addSignatureDrawContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #thickness) > div) > input{
- border-radius:4.5px;
- border:0;
- color:var(--signature-color);
- }
- #addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]){
- display:none;
- }
- #addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) > svg{
- stroke:none;
- stroke-width:0;
- fill:var(--signature-color);
- fill-opacity:1;
- }
- #addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureImagePlaceholder{
- position:absolute;
- top:0;
- left:0;
- width:100%;
- height:100%;
- background-color:transparent;
- display:flex;
- flex-direction:column;
- align-items:center;
- justify-content:center;
- }
- :is(#addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureImagePlaceholder) span{
- color:var(--signature-placeholder-color);
- }
- :is(#addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureImagePlaceholder) a{
- color:var(--open-link-fg);
- text-decoration:underline;
- cursor:pointer;
- }
- :is(:is(#addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureImagePlaceholder) a):hover{
- color:var(--open-link-hover-fg);
- }
- #addSignatureImageContainer:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > [role="tabpanel"]) #addSignatureFilePicker{
- visibility:hidden;
- position:relative;
- width:0;
- height:0;
- }
- [data-selected="type"]:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > #addSignatureTypeContainer,[data-selected="draw"]:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > #addSignatureDrawContainer,[data-selected="image"]:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) > #addSignatureImageContainer{
- display:block;
- }
- :is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls{
- display:flex;
- flex-direction:column;
- justify-content:center;
- align-items:flex-start;
- gap:12px;
- align-self:stretch;
- }
- :is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer{
- display:flex;
- align-items:flex-end;
- gap:16px;
- align-self:stretch;
- }
- :is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #addSignatureDescriptionContainer{
- display:flex;
- flex-direction:column;
- align-items:flex-start;
- gap:4px;
- flex:1 0 0;
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #addSignatureDescriptionContainer):has(input:disabled) > label{
- opacity:0.4;
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #addSignatureDescriptionContainer) > label{
- width:auto;
- }
- :is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton{
- display:flex;
- height:32px;
- padding:4px 8px;
- align-items:center;
- background-color:var(--clear-signature-button-bg);
- border-width:var(--clear-signature-button-border-width);
- border-style:var(--clear-signature-button-border-style);
- border-color:var(--clear-signature-button-border-color);
- border-radius:4px;
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton) > span{
- display:flex;
- height:24px;
- align-items:center;
- gap:4px;
- flex-shrink:0;
- color:var(--clear-signature-button-color);
- }
- :is(:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton) > span)::after{
- content:"";
- display:inline-block;
- width:16px;
- height:16px;
- -webkit-mask-image:var(--clear-signature-button-icon);
- mask-image:var(--clear-signature-button-icon);
- -webkit-mask-size:cover;
- mask-size:cover;
- background-color:var(--clear-signature-button-color);
- flex-shrink:0;
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):hover{
- background-color:var(--clear-signature-button-bg-hover);
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):hover > span{
- color:var(--clear-signature-button-hover-color);
- }
- :is(:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):hover > span)::after{
- background-color:var(--clear-signature-button-hover-color);
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):active{
- background-color:var(--clear-signature-button-bg-active);
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):active > span{
- color:var(--clear-signature-button-active-color);
- }
- :is(:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):active > span)::after{
- background-color:var(--clear-signature-button-active-color);
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):focus-visible{
- background-color:var(--clear-signature-button-bg-focus);
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):focus-visible > span{
- color:var(--clear-signature-button-focus-color);
- }
- :is(:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):focus-visible > span)::after{
- background-color:var(--clear-signature-button-focus-color);
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):disabled{
- background-color:var(--clear-signature-button-bg-disabled);
- border-color:var(--clear-signature-button-border-disabled-color);
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):disabled > span{
- color:var(--clear-signature-button-disabled-color);
- }
- :is(:is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #horizontalContainer) #clearSignatureButton):disabled > span)::after{
- background-color:var(
- --clear-signature-button-disabled-color
- );
- }
- :is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer{
- display:grid;
- grid-template-columns:max-content auto;
- gap:4px;
- width:100%;
- }
- :is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer) > input{
- margin:0;
- }
- :is(:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer) > input):disabled + label{
- opacity:0.4;
- }
- :is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer) > label{
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- }
- :is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer):not(.fullStorage) #addSignatureSaveWarning{
- display:none;
- }
- .fullStorage:is(:is(:is(:is(#addSignatureDialog .mainContainer) #addSignatureActionContainer) #addSignatureControls) #addSignatureSaveContainer) #addSignatureSaveWarning{
- display:block;
- opacity:1;
- color:var(--save-warning-color);
- font-size:11px;
- }
- #editSignatureDescriptionDialog .mainContainer{
- padding-inline:16px;
- box-sizing:border-box;
- }
- :is(#editSignatureDescriptionDialog .mainContainer) .title{
- margin-inline-start:0;
- }
- :is(#editSignatureDescriptionDialog .mainContainer) #editSignatureDescriptionAndView{
- width:auto;
- display:flex;
- justify-content:flex-end;
- align-items:flex-start;
- gap:12px;
- align-self:stretch;
- }
- :is(:is(#editSignatureDescriptionDialog .mainContainer) #editSignatureDescriptionAndView) #editSignatureDescriptionContainer{
- display:flex;
- flex-direction:column;
- align-items:flex-start;
- gap:4px;
- flex:1 1 auto;
- }
- :is(:is(#editSignatureDescriptionDialog .mainContainer) #editSignatureDescriptionAndView) > svg{
- width:210px;
- height:180px;
- padding:8px;
- background-color:var(--signature-bg);
- }
- :is(:is(:is(#editSignatureDescriptionDialog .mainContainer) #editSignatureDescriptionAndView) > svg) > path{
- stroke:var(--button-signature-color);
- stroke-width:1px;
- stroke-linecap:round;
- stroke-linejoin:round;
- stroke-miterlimit:10;
- vector-effect:non-scaling-stroke;
- fill:none;
- }
- .contours:is(:is(:is(:is(#editSignatureDescriptionDialog .mainContainer) #editSignatureDescriptionAndView) > svg) > path){
- fill:var(--button-signature-color);
- stroke-width:0.5px;
- }
- #editorSignatureParamsToolbar{
- padding:8px;
- }
- #editorSignatureParamsToolbar #addSignatureDoorHanger{
- gap:8px;
- padding:2px;
- }
- :is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer{
- height:32px;
- display:flex;
- justify-content:space-between;
- align-items:center;
- align-self:stretch;
- gap:8px;
- }
- :is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button{
- border:var(--button-signature-border);
- border-radius:4px;
- background-color:var(--button-signature-bg);
- color:var(--button-signature-color);
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button):hover{
- background-color:var(--button-signature-hover-bg);
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button):active{
- border:var(--button-signature-active-border);
- background-color:var(--button-signature-active-bg);
- color:var(--button-signature-active-color);
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button):active::before{
- background-color:var(--button-signature-active-color);
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button):focus-visible{
- outline:var(--focus-ring-outline);
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) button):focus-visible::before{
- background-color:var(--button-signature-color);
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .deleteButton)::before{
- -webkit-mask-image:var(--clear-signature-button-icon);
- mask-image:var(--clear-signature-button-icon);
- }
- :is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton{
- width:auto;
- height:100%;
- min-height:var(--menuitem-height);
- aspect-ratio:unset;
- display:flex;
- align-items:center;
- justify-content:flex-start;
- outline:none;
- border-radius:4px;
- box-sizing:border-box;
- font:message-box;
- position:relative;
- flex:1 1 auto;
- padding:0;
- gap:8px;
- text-align:start;
- white-space:normal;
- cursor:default;
- overflow:hidden;
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton) > svg{
- display:inline-block;
- height:100%;
- aspect-ratio:1;
- background-color:var(--signature-bg);
- flex:none;
- padding:4px;
- box-sizing:border-box;
- border:none;
- border-radius:4px;
- }
- :is(:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton) > svg) > path{
- stroke:var(--button-signature-color);
- stroke-width:1px;
- stroke-linecap:round;
- stroke-linejoin:round;
- stroke-miterlimit:10;
- vector-effect:non-scaling-stroke;
- fill:none;
- }
- .contours:is(:is(:is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton) > svg) > path){
- fill:var(--button-signature-color);
- stroke-width:0.5px;
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton):is(:hover,:active) > svg{
- border-radius:4px 0 0 4px;
- background-color:var(--signature-hover-bg);
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton):hover > span{
- color:var(--button-signature-hover-color);
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton):active{
- background-color:var(--button-signature-active-bg);
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton):is([disabled="disabled"],[disabled]){
- opacity:0.5;
- pointer-events:none;
- }
- :is(:is(:is(#editorSignatureParamsToolbar #addSignatureDoorHanger) .toolbarAddSignatureButtonContainer) .toolbarAddSignatureButton) > span{
- height:auto;
- text-overflow:ellipsis;
- white-space:nowrap;
- flex:1 1 auto;
- font:menu;
- font-size:13px;
- font-style:normal;
- font-weight:400;
- line-height:normal;
- overflow:hidden;
- }
- .editDescription.altText{
- --alt-text-add-image:url(images/editor-toolbar-edit.svg) !important;
- }
- .editDescription.altText::before{
- width:16px !important;
- height:16px !important;
- }
- :root{
- --outline-width:2px;
- --outline-color:#0060df;
- --outline-around-width:1px;
- --outline-around-color:#f0f0f4;
- --hover-outline-around-color:var(--outline-around-color);
- --focus-outline:solid var(--outline-width) var(--outline-color);
- --unfocus-outline:solid var(--outline-width) transparent;
- --focus-outline-around:solid var(--outline-around-width) var(--outline-around-color);
- --hover-outline-color:#8f8f9d;
- --hover-outline:solid var(--outline-width) var(--hover-outline-color);
- --hover-outline-around:solid var(--outline-around-width) var(--hover-outline-around-color);
- --freetext-line-height:1.35;
- --freetext-padding:2px;
- --resizer-bg-color:var(--outline-color);
- --resizer-size:6px;
- --resizer-shift:calc(
- 0px - (var(--outline-width) + var(--resizer-size)) / 2 -
- var(--outline-around-width)
- );
- --editorFreeText-editing-cursor:text;
- --editorInk-editing-cursor:url(images/cursor-editorInk.svg) 0 16, pointer;
- --editorHighlight-editing-cursor:url(images/cursor-editorTextHighlight.svg) 24 24, text;
- --editorFreeHighlight-editing-cursor:url(images/cursor-editorFreeHighlight.svg) 1 18, pointer;
- --new-alt-text-warning-image:url(images/altText_warning.svg);
- }
- .visuallyHidden{
- position:absolute;
- top:0;
- left:0;
- border:0;
- margin:0;
- padding:0;
- width:0;
- height:0;
- overflow:hidden;
- white-space:nowrap;
- font-size:0;
- }
- .textLayer.highlighting{
- cursor:var(--editorFreeHighlight-editing-cursor);
- }
- .textLayer.highlighting:not(.free) span{
- cursor:var(--editorHighlight-editing-cursor);
- }
- [role="img"]:is(.textLayer.highlighting:not(.free) span){
- cursor:var(--editorFreeHighlight-editing-cursor);
- }
- .textLayer.highlighting.free span{
- cursor:var(--editorFreeHighlight-editing-cursor);
- }
- :is(#viewerContainer.pdfPresentationMode:fullscreen,.annotationEditorLayer.disabled) .noAltTextBadge{
- display:none !important;
- }
- @media (min-resolution: 1.1dppx){
- :root{
- --editorFreeText-editing-cursor:url(images/cursor-editorFreeText.svg) 0 16, text;
- }
- }
- @media screen and (forced-colors: active){
- :root{
- --outline-color:CanvasText;
- --outline-around-color:ButtonFace;
- --resizer-bg-color:ButtonText;
- --hover-outline-color:Highlight;
- --hover-outline-around-color:SelectedItemText;
- }
- }
- [data-editor-rotation="90"]{
- transform:rotate(90deg);
- }
- [data-editor-rotation="180"]{
- transform:rotate(180deg);
- }
- [data-editor-rotation="270"]{
- transform:rotate(270deg);
- }
- .annotationEditorLayer{
- background:transparent;
- position:absolute;
- inset:0;
- font-size:calc(100px * var(--total-scale-factor));
- transform-origin:0 0;
- cursor:auto;
- }
- .annotationEditorLayer .selectedEditor{
- z-index:100000 !important;
- }
- .annotationEditorLayer.drawing *{
- pointer-events:none !important;
- }
- .annotationEditorLayer.waiting{
- content:"";
- cursor:wait;
- position:absolute;
- inset:0;
- width:100%;
- height:100%;
- }
- .annotationEditorLayer.disabled{
- pointer-events:none;
- }
- .annotationEditorLayer.disabled.highlightEditing :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor){
- pointer-events:auto;
- }
- .annotationEditorLayer.freetextEditing{
- cursor:var(--editorFreeText-editing-cursor);
- }
- .annotationEditorLayer.inkEditing{
- cursor:var(--editorInk-editing-cursor);
- }
- .annotationEditorLayer .draw{
- box-sizing:border-box;
- }
- .annotationEditorLayer
- :is(.freeTextEditor, .inkEditor, .stampEditor, .signatureEditor){
- position:absolute;
- background:transparent;
- z-index:1;
- transform-origin:0 0;
- cursor:auto;
- max-width:100%;
- max-height:100%;
- border:var(--unfocus-outline);
- }
- .draggable.selectedEditor:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)){
- cursor:move;
- }
- .selectedEditor:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)){
- border:var(--focus-outline);
- outline:var(--focus-outline-around);
- }
- .selectedEditor:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor))::before{
- content:"";
- position:absolute;
- inset:0;
- border:var(--focus-outline-around);
- pointer-events:none;
- }
- :is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)):hover:not(.selectedEditor){
- border:var(--hover-outline);
- outline:var(--hover-outline-around);
- }
- :is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)):hover:not(.selectedEditor)::before{
- content:"";
- position:absolute;
- inset:0;
- border:var(--focus-outline-around);
- }
- :is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar{
- --editor-toolbar-delete-image:url(images/editor-toolbar-delete.svg);
- --csstools-light-dark-toggle--75:var(--csstools-color-scheme--light) #2b2a33;
- --editor-toolbar-bg-color:var(--csstools-light-dark-toggle--75, #f0f0f4);
- --editor-toolbar-highlight-image:url(images/toolbarButton-editorHighlight.svg);
- --csstools-light-dark-toggle--76:var(--csstools-color-scheme--light) #fbfbfe;
- --editor-toolbar-fg-color:var(--csstools-light-dark-toggle--76, #2e2e56);
- --editor-toolbar-border-color:#8f8f9d;
- --editor-toolbar-hover-border-color:var(--editor-toolbar-border-color);
- --csstools-light-dark-toggle--77:var(--csstools-color-scheme--light) #52525e;
- --editor-toolbar-hover-bg-color:var(--csstools-light-dark-toggle--77, #e0e0e6);
- --editor-toolbar-hover-fg-color:var(--editor-toolbar-fg-color);
- --editor-toolbar-hover-outline:none;
- --csstools-light-dark-toggle--78:var(--csstools-color-scheme--light) #0df;
- --editor-toolbar-focus-outline-color:var(--csstools-light-dark-toggle--78, #0060df);
- --editor-toolbar-shadow:0 2px 6px 0 rgb(58 57 68 / 0.2);
- --editor-toolbar-vert-offset:6px;
- --editor-toolbar-height:28px;
- --editor-toolbar-padding:2px;
- --csstools-light-dark-toggle--79:var(--csstools-color-scheme--light) #54ffbd;
- --alt-text-done-color:var(--csstools-light-dark-toggle--79, #2ac3a2);
- --csstools-light-dark-toggle--80:var(--csstools-color-scheme--light) #80ebff;
- --alt-text-warning-color:var(--csstools-light-dark-toggle--80, #0090ed);
- --alt-text-hover-done-color:var(--alt-text-done-color);
- --alt-text-hover-warning-color:var(--alt-text-warning-color);
- }
- @supports (color: light-dark(red, red)){
- :is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar{
- --editor-toolbar-bg-color:light-dark(#f0f0f4, #2b2a33);
- --editor-toolbar-fg-color:light-dark(#2e2e56, #fbfbfe);
- --editor-toolbar-hover-bg-color:light-dark(#e0e0e6, #52525e);
- --editor-toolbar-focus-outline-color:light-dark(#0060df, #0df);
- --alt-text-done-color:light-dark(#2ac3a2, #54ffbd);
- --alt-text-warning-color:light-dark(#0090ed, #80ebff);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- :is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) *{
- --csstools-light-dark-toggle--75:var(--csstools-color-scheme--light) #2b2a33;
- --editor-toolbar-bg-color:var(--csstools-light-dark-toggle--75, #f0f0f4);
- --csstools-light-dark-toggle--76:var(--csstools-color-scheme--light) #fbfbfe;
- --editor-toolbar-fg-color:var(--csstools-light-dark-toggle--76, #2e2e56);
- --csstools-light-dark-toggle--77:var(--csstools-color-scheme--light) #52525e;
- --editor-toolbar-hover-bg-color:var(--csstools-light-dark-toggle--77, #e0e0e6);
- --csstools-light-dark-toggle--78:var(--csstools-color-scheme--light) #0df;
- --editor-toolbar-focus-outline-color:var(--csstools-light-dark-toggle--78, #0060df);
- --csstools-light-dark-toggle--79:var(--csstools-color-scheme--light) #54ffbd;
- --alt-text-done-color:var(--csstools-light-dark-toggle--79, #2ac3a2);
- --csstools-light-dark-toggle--80:var(--csstools-color-scheme--light) #80ebff;
- --alt-text-warning-color:var(--csstools-light-dark-toggle--80, #0090ed);
- }
- }
- @media screen and (forced-colors: active){
- :is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar{
- --editor-toolbar-bg-color:ButtonFace;
- --editor-toolbar-fg-color:ButtonText;
- --editor-toolbar-border-color:ButtonText;
- --editor-toolbar-hover-border-color:AccentColor;
- --editor-toolbar-hover-bg-color:ButtonFace;
- --editor-toolbar-hover-fg-color:AccentColor;
- --editor-toolbar-hover-outline:2px solid var(--editor-toolbar-hover-border-color);
- --editor-toolbar-focus-outline-color:ButtonBorder;
- --editor-toolbar-shadow:none;
- --alt-text-done-color:var(--editor-toolbar-fg-color);
- --alt-text-warning-color:var(--editor-toolbar-fg-color);
- --alt-text-hover-done-color:var(--editor-toolbar-hover-fg-color);
- --alt-text-hover-warning-color:var(--editor-toolbar-hover-fg-color);
- }
- }
- :is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar{
- display:flex;
- width:-moz-fit-content;
- width:fit-content;
- height:var(--editor-toolbar-height);
- flex-direction:column;
- justify-content:center;
- align-items:center;
- cursor:default;
- pointer-events:auto;
- box-sizing:content-box;
- padding:var(--editor-toolbar-padding);
- position:absolute;
- inset-inline-end:0;
- inset-block-start:calc(100% + var(--editor-toolbar-vert-offset));
- border-radius:6px;
- background-color:var(--editor-toolbar-bg-color);
- border:1px solid var(--editor-toolbar-border-color);
- box-shadow:var(--editor-toolbar-shadow);
- }
- .hidden:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar){
- display:none;
- }
- :is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar):has(:focus-visible){
- border-color:transparent;
- }
- [dir="ltr"] :is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar){
- transform-origin:100% 0;
- }
- [dir="rtl"] :is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar){
- transform-origin:0 0;
- }
- :is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons{
- display:flex;
- justify-content:center;
- align-items:center;
- gap:0;
- height:100%;
- }
- :is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) button{
- padding:0;
- }
- :is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .divider{
- width:0;
- height:calc(
- 2 * var(--editor-toolbar-padding) + var(--editor-toolbar-height)
- );
- border-left:1px solid var(--editor-toolbar-border-color);
- border-right:none;
- display:inline-block;
- margin-inline:2px;
- }
- :is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .highlightButton{
- width:var(--editor-toolbar-height);
- }
- :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .highlightButton)::before{
- content:"";
- -webkit-mask-image:var(--editor-toolbar-highlight-image);
- mask-image:var(--editor-toolbar-highlight-image);
- -webkit-mask-repeat:no-repeat;
- mask-repeat:no-repeat;
- -webkit-mask-position:center;
- mask-position:center;
- display:inline-block;
- background-color:var(--editor-toolbar-fg-color);
- width:100%;
- height:100%;
- }
- :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .highlightButton):hover::before{
- background-color:var(--editor-toolbar-hover-fg-color);
- }
- :is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .delete{
- width:var(--editor-toolbar-height);
- }
- :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .delete)::before{
- content:"";
- -webkit-mask-image:var(--editor-toolbar-delete-image);
- mask-image:var(--editor-toolbar-delete-image);
- -webkit-mask-repeat:no-repeat;
- mask-repeat:no-repeat;
- -webkit-mask-position:center;
- mask-position:center;
- display:inline-block;
- background-color:var(--editor-toolbar-fg-color);
- width:100%;
- height:100%;
- }
- :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .delete):hover::before{
- background-color:var(--editor-toolbar-hover-fg-color);
- }
- :is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) > *{
- height:var(--editor-toolbar-height);
- }
- :is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) > :not(.divider){
- border:none;
- background-color:transparent;
- cursor:pointer;
- }
- :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) > :not(.divider)):hover{
- border-radius:2px;
- background-color:var(--editor-toolbar-hover-bg-color);
- color:var(--editor-toolbar-hover-fg-color);
- outline:var(--editor-toolbar-hover-outline);
- outline-offset:1px;
- }
- :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) > :not(.divider)):hover:active{
- outline:none;
- }
- :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) > :not(.divider)):focus-visible{
- border-radius:2px;
- outline:2px solid var(--editor-toolbar-focus-outline-color);
- }
- :is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText{
- --alt-text-add-image:url(images/altText_add.svg);
- --alt-text-done-image:url(images/altText_done.svg);
- display:flex;
- align-items:center;
- justify-content:center;
- width:-moz-max-content;
- width:max-content;
- padding-inline:8px;
- pointer-events:all;
- font:menu;
- font-weight:590;
- font-size:12px;
- color:var(--editor-toolbar-fg-color);
- }
- :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText):disabled{
- pointer-events:none;
- }
- :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText)::before{
- content:"";
- -webkit-mask-image:var(--alt-text-add-image);
- mask-image:var(--alt-text-add-image);
- -webkit-mask-repeat:no-repeat;
- mask-repeat:no-repeat;
- -webkit-mask-position:center;
- mask-position:center;
- display:inline-block;
- width:12px;
- height:13px;
- background-color:var(--editor-toolbar-fg-color);
- margin-inline-end:4px;
- }
- :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText):hover::before{
- background-color:var(--editor-toolbar-hover-fg-color);
- }
- .done:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText)::before{
- -webkit-mask-image:var(--alt-text-done-image);
- mask-image:var(--alt-text-done-image);
- }
- .new:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText)::before{
- width:16px;
- height:16px;
- -webkit-mask-image:var(--new-alt-text-warning-image);
- mask-image:var(--new-alt-text-warning-image);
- background-color:var(--alt-text-warning-color);
- -webkit-mask-size:cover;
- mask-size:cover;
- }
- .new:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText):hover::before{
- background-color:var(--alt-text-hover-warning-color);
- }
- .new.done:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText)::before{
- -webkit-mask-image:var(--alt-text-done-image);
- mask-image:var(--alt-text-done-image);
- background-color:var(--alt-text-done-color);
- }
- .new.done:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText):hover::before{
- background-color:var(--alt-text-hover-done-color);
- }
- :is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip{
- display:none;
- word-wrap:anywhere;
- }
- .show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip){
- --csstools-light-dark-toggle--81:var(--csstools-color-scheme--light) #1c1b22;
- --alt-text-tooltip-bg:var(--csstools-light-dark-toggle--81, #f0f0f4);
- --csstools-light-dark-toggle--82:var(--csstools-color-scheme--light) #fbfbfe;
- --alt-text-tooltip-fg:var(--csstools-light-dark-toggle--82, #15141a);
- --alt-text-tooltip-border:#8f8f9d;
- --csstools-light-dark-toggle--83:var(--csstools-color-scheme--light) #15141a;
- --alt-text-tooltip-shadow:0px 2px 6px 0px var(--csstools-light-dark-toggle--83, rgb(58 57 68 / 0.2));
- }
- @supports (color: light-dark(red, red)){
- .show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip){
- --alt-text-tooltip-bg:light-dark(#f0f0f4, #1c1b22);
- --alt-text-tooltip-fg:light-dark(#15141a, #fbfbfe);
- }
- }
- @supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)){
- .show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip){
- --alt-text-tooltip-shadow:0px 2px 6px 0px light-dark(rgb(58 57 68 / 0.2), #15141a);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- .show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip) *{
- --csstools-light-dark-toggle--81:var(--csstools-color-scheme--light) #1c1b22;
- --alt-text-tooltip-bg:var(--csstools-light-dark-toggle--81, #f0f0f4);
- --csstools-light-dark-toggle--82:var(--csstools-color-scheme--light) #fbfbfe;
- --alt-text-tooltip-fg:var(--csstools-light-dark-toggle--82, #15141a);
- --csstools-light-dark-toggle--83:var(--csstools-color-scheme--light) #15141a;
- --alt-text-tooltip-shadow:0px 2px 6px 0px var(--csstools-light-dark-toggle--83, rgb(58 57 68 / 0.2));
- }
- }
- @media screen and (forced-colors: active){
- .show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip){
- --alt-text-tooltip-bg:Canvas;
- --alt-text-tooltip-fg:CanvasText;
- --alt-text-tooltip-border:CanvasText;
- --alt-text-tooltip-shadow:none;
- }
- }
- .show:is(:is(:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.highlightEditor,.signatureEditor),.textLayer) .editToolbar) .buttons) .altText) .tooltip){
- display:inline-flex;
- flex-direction:column;
- align-items:center;
- justify-content:center;
- position:absolute;
- top:calc(100% + 2px);
- inset-inline-start:0;
- padding-block:2px 3px;
- padding-inline:3px;
- max-width:300px;
- width:-moz-max-content;
- width:max-content;
- height:auto;
- font-size:12px;
- border:0.5px solid var(--alt-text-tooltip-border);
- background:var(--alt-text-tooltip-bg);
- box-shadow:var(--alt-text-tooltip-shadow);
- color:var(--alt-text-tooltip-fg);
- pointer-events:none;
- }
- .annotationEditorLayer .freeTextEditor{
- padding:calc(var(--freetext-padding) * var(--total-scale-factor));
- width:auto;
- height:auto;
- touch-action:none;
- }
- .annotationEditorLayer .freeTextEditor .internal{
- background:transparent;
- border:none;
- inset:0;
- overflow:visible;
- white-space:nowrap;
- font:10px sans-serif;
- line-height:var(--freetext-line-height);
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- }
- .annotationEditorLayer .freeTextEditor .overlay{
- position:absolute;
- display:none;
- background:transparent;
- inset:0;
- width:100%;
- height:100%;
- }
- .annotationEditorLayer freeTextEditor .overlay.enabled{
- display:block;
- }
- .annotationEditorLayer .freeTextEditor .internal:empty::before{
- content:attr(default-content);
- color:gray;
- }
- .annotationEditorLayer .freeTextEditor .internal:focus{
- outline:none;
- -webkit-user-select:auto;
- -moz-user-select:auto;
- user-select:auto;
- }
- .annotationEditorLayer .inkEditor{
- width:100%;
- height:100%;
- }
- .annotationEditorLayer .inkEditor.editing{
- cursor:inherit;
- }
- .annotationEditorLayer .inkEditor .inkEditorCanvas{
- position:absolute;
- inset:0;
- width:100%;
- height:100%;
- touch-action:none;
- }
- .annotationEditorLayer .stampEditor{
- width:auto;
- height:auto;
- }
- :is(.annotationEditorLayer .stampEditor) canvas{
- position:absolute;
- width:100%;
- height:100%;
- margin:0;
- top:0;
- left:0;
- }
- :is(.annotationEditorLayer .stampEditor) .noAltTextBadge{
- --csstools-light-dark-toggle--84:var(--csstools-color-scheme--light) #52525e;
- --no-alt-text-badge-border-color:var(--csstools-light-dark-toggle--84, #f0f0f4);
- --csstools-light-dark-toggle--85:var(--csstools-color-scheme--light) #fbfbfe;
- --no-alt-text-badge-bg-color:var(--csstools-light-dark-toggle--85, #cfcfd8);
- --csstools-light-dark-toggle--86:var(--csstools-color-scheme--light) #15141a;
- --no-alt-text-badge-fg-color:var(--csstools-light-dark-toggle--86, #5b5b66);
- }
- @supports (color: light-dark(red, red)){
- :is(.annotationEditorLayer .stampEditor) .noAltTextBadge{
- --no-alt-text-badge-border-color:light-dark(#f0f0f4, #52525e);
- --no-alt-text-badge-bg-color:light-dark(#cfcfd8, #fbfbfe);
- --no-alt-text-badge-fg-color:light-dark(#5b5b66, #15141a);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- :is(:is(.annotationEditorLayer .stampEditor) .noAltTextBadge) *{
- --csstools-light-dark-toggle--84:var(--csstools-color-scheme--light) #52525e;
- --no-alt-text-badge-border-color:var(--csstools-light-dark-toggle--84, #f0f0f4);
- --csstools-light-dark-toggle--85:var(--csstools-color-scheme--light) #fbfbfe;
- --no-alt-text-badge-bg-color:var(--csstools-light-dark-toggle--85, #cfcfd8);
- --csstools-light-dark-toggle--86:var(--csstools-color-scheme--light) #15141a;
- --no-alt-text-badge-fg-color:var(--csstools-light-dark-toggle--86, #5b5b66);
- }
- }
- @media screen and (forced-colors: active){
- :is(.annotationEditorLayer .stampEditor) .noAltTextBadge{
- --no-alt-text-badge-border-color:ButtonText;
- --no-alt-text-badge-bg-color:ButtonFace;
- --no-alt-text-badge-fg-color:ButtonText;
- }
- }
- :is(.annotationEditorLayer .stampEditor) .noAltTextBadge{
- position:absolute;
- inset-inline-end:5px;
- inset-block-end:5px;
- display:inline-flex;
- width:32px;
- height:32px;
- padding:3px;
- justify-content:center;
- align-items:center;
- pointer-events:none;
- z-index:1;
- border-radius:2px;
- border:1px solid var(--no-alt-text-badge-border-color);
- background:var(--no-alt-text-badge-bg-color);
- }
- :is(:is(.annotationEditorLayer .stampEditor) .noAltTextBadge)::before{
- content:"";
- display:inline-block;
- width:16px;
- height:16px;
- -webkit-mask-image:var(--new-alt-text-warning-image);
- mask-image:var(--new-alt-text-warning-image);
- -webkit-mask-size:cover;
- mask-size:cover;
- background-color:var(--no-alt-text-badge-fg-color);
- }
- :is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers{
- position:absolute;
- inset:0;
- }
- .hidden:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers){
- display:none;
- }
- :is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer{
- width:var(--resizer-size);
- height:var(--resizer-size);
- background:content-box var(--resizer-bg-color);
- border:var(--focus-outline-around);
- border-radius:2px;
- position:absolute;
- }
- .topLeft:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer){
- top:var(--resizer-shift);
- left:var(--resizer-shift);
- }
- .topMiddle:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer){
- top:var(--resizer-shift);
- left:calc(50% + var(--resizer-shift));
- }
- .topRight:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer){
- top:var(--resizer-shift);
- right:var(--resizer-shift);
- }
- .middleRight:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer){
- top:calc(50% + var(--resizer-shift));
- right:var(--resizer-shift);
- }
- .bottomRight:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer){
- bottom:var(--resizer-shift);
- right:var(--resizer-shift);
- }
- .bottomMiddle:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer){
- bottom:var(--resizer-shift);
- left:calc(50% + var(--resizer-shift));
- }
- .bottomLeft:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer){
- bottom:var(--resizer-shift);
- left:var(--resizer-shift);
- }
- .middleLeft:is(:is(:is(.annotationEditorLayer :is(.freeTextEditor,.inkEditor,.stampEditor,.signatureEditor)) > .resizers) > .resizer){
- top:calc(50% + var(--resizer-shift));
- left:var(--resizer-shift);
- }
- .topLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer),.bottomRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer){
- cursor:nwse-resize;
- }
- .topMiddle:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer),.bottomMiddle:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer){
- cursor:ns-resize;
- }
- .topRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer),.bottomLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer){
- cursor:nesw-resize;
- }
- .middleRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer),.middleLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="180"],[data-editor-rotation="0"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="90"],[data-editor-rotation="270"])) > .resizers > .resizer){
- cursor:ew-resize;
- }
- .topLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer),.bottomRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer){
- cursor:nesw-resize;
- }
- .topMiddle:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer),.bottomMiddle:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer){
- cursor:ew-resize;
- }
- .topRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer),.bottomLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer){
- cursor:nwse-resize;
- }
- .middleRight:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer),.middleLeft:is(:is(.annotationEditorLayer[data-main-rotation="0"] :is([data-editor-rotation="90"],[data-editor-rotation="270"]),.annotationEditorLayer[data-main-rotation="90"] :is([data-editor-rotation="0"],[data-editor-rotation="180"]),.annotationEditorLayer[data-main-rotation="180"] :is([data-editor-rotation="270"],[data-editor-rotation="90"]),.annotationEditorLayer[data-main-rotation="270"] :is([data-editor-rotation="180"],[data-editor-rotation="0"])) > .resizers > .resizer){
- cursor:ns-resize;
- }
- :is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="90"],[data-main-rotation="90"] [data-editor-rotation="0"],[data-main-rotation="180"] [data-editor-rotation="270"],[data-main-rotation="270"] [data-editor-rotation="180"])) .editToolbar{
- rotate:270deg;
- }
- [dir="ltr"] :is(:is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="90"],[data-main-rotation="90"] [data-editor-rotation="0"],[data-main-rotation="180"] [data-editor-rotation="270"],[data-main-rotation="270"] [data-editor-rotation="180"])) .editToolbar){
- inset-inline-end:calc(0px - var(--editor-toolbar-vert-offset));
- inset-block-start:0;
- }
- [dir="rtl"] :is(:is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="90"],[data-main-rotation="90"] [data-editor-rotation="0"],[data-main-rotation="180"] [data-editor-rotation="270"],[data-main-rotation="270"] [data-editor-rotation="180"])) .editToolbar){
- inset-inline-end:calc(100% + var(--editor-toolbar-vert-offset));
- inset-block-start:0;
- }
- :is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="180"],[data-main-rotation="90"] [data-editor-rotation="90"],[data-main-rotation="180"] [data-editor-rotation="0"],[data-main-rotation="270"] [data-editor-rotation="270"])) .editToolbar{
- rotate:180deg;
- inset-inline-end:100%;
- inset-block-start:calc(0pc - var(--editor-toolbar-vert-offset));
- }
- :is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="270"],[data-main-rotation="90"] [data-editor-rotation="180"],[data-main-rotation="180"] [data-editor-rotation="90"],[data-main-rotation="270"] [data-editor-rotation="0"])) .editToolbar{
- rotate:90deg;
- }
- [dir="ltr"] :is(:is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="270"],[data-main-rotation="90"] [data-editor-rotation="180"],[data-main-rotation="180"] [data-editor-rotation="90"],[data-main-rotation="270"] [data-editor-rotation="0"])) .editToolbar){
- inset-inline-end:calc(100% + var(--editor-toolbar-vert-offset));
- inset-block-start:100%;
- }
- [dir="rtl"] :is(:is(.annotationEditorLayer :is([data-main-rotation="0"] [data-editor-rotation="270"],[data-main-rotation="90"] [data-editor-rotation="180"],[data-main-rotation="180"] [data-editor-rotation="90"],[data-main-rotation="270"] [data-editor-rotation="0"])) .editToolbar){
- inset-inline-start:calc(0px - var(--editor-toolbar-vert-offset));
- inset-block-start:0;
- }
- .dialog.altText::backdrop{
- -webkit-mask:url(#alttext-manager-mask);
- mask:url(#alttext-manager-mask);
- }
- .dialog.altText.positioned{
- margin:0;
- }
- .dialog.altText #altTextContainer{
- width:300px;
- height:-moz-fit-content;
- height:fit-content;
- display:inline-flex;
- flex-direction:column;
- align-items:flex-start;
- gap:16px;
- }
- :is(.dialog.altText #altTextContainer) #overallDescription{
- display:flex;
- flex-direction:column;
- align-items:flex-start;
- gap:4px;
- align-self:stretch;
- }
- :is(:is(.dialog.altText #altTextContainer) #overallDescription) span{
- align-self:stretch;
- }
- :is(:is(.dialog.altText #altTextContainer) #overallDescription) .title{
- font-size:13px;
- font-style:normal;
- font-weight:590;
- }
- :is(.dialog.altText #altTextContainer) #addDescription{
- display:flex;
- flex-direction:column;
- align-items:stretch;
- gap:8px;
- }
- :is(:is(.dialog.altText #altTextContainer) #addDescription) .descriptionArea{
- flex:1;
- padding-inline:24px 10px;
- }
- :is(:is(:is(.dialog.altText #altTextContainer) #addDescription) .descriptionArea) textarea{
- width:100%;
- min-height:75px;
- }
- :is(.dialog.altText #altTextContainer) #buttons{
- display:flex;
- justify-content:flex-end;
- align-items:flex-start;
- gap:8px;
- align-self:stretch;
- }
- .dialog.newAltText{
- --new-alt-text-ai-disclaimer-icon:url(images/altText_disclaimer.svg);
- --new-alt-text-spinner-icon:url(images/altText_spinner.svg);
- --csstools-light-dark-toggle--87:var(--csstools-color-scheme--light) #2b2a33;
- --preview-image-bg-color:var(--csstools-light-dark-toggle--87, #f0f0f4);
- --preview-image-border:none;
- }
- @supports (color: light-dark(red, red)){
- .dialog.newAltText{
- --preview-image-bg-color:light-dark(#f0f0f4, #2b2a33);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- .dialog.newAltText *{
- --csstools-light-dark-toggle--87:var(--csstools-color-scheme--light) #2b2a33;
- --preview-image-bg-color:var(--csstools-light-dark-toggle--87, #f0f0f4);
- }
- }
- @media screen and (forced-colors: active){
- .dialog.newAltText{
- --preview-image-bg-color:ButtonFace;
- --preview-image-border:1px solid ButtonText;
- }
- }
- .dialog.newAltText{
- width:80%;
- max-width:570px;
- min-width:300px;
- padding:0;
- }
- .dialog.newAltText.noAi #newAltTextDisclaimer,.dialog.newAltText.noAi #newAltTextCreateAutomatically{
- display:none !important;
- }
- .dialog.newAltText.aiInstalling #newAltTextCreateAutomatically{
- display:none !important;
- }
- .dialog.newAltText.aiInstalling #newAltTextDownloadModel{
- display:flex !important;
- }
- .dialog.newAltText.error #newAltTextNotNow{
- display:none !important;
- }
- .dialog.newAltText.error #newAltTextCancel{
- display:inline-block !important;
- }
- .dialog.newAltText:not(.error) #newAltTextError{
- display:none !important;
- }
- .dialog.newAltText #newAltTextContainer{
- display:flex;
- width:auto;
- padding:16px;
- flex-direction:column;
- justify-content:flex-end;
- align-items:flex-start;
- gap:12px;
- flex:0 1 auto;
- line-height:normal;
- }
- :is(.dialog.newAltText #newAltTextContainer) #mainContent{
- display:flex;
- justify-content:flex-end;
- align-items:flex-start;
- gap:12px;
- align-self:stretch;
- flex:1 1 auto;
- }
- :is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionAndSettings{
- display:flex;
- flex-direction:column;
- align-items:flex-start;
- gap:16px;
- flex:1 0 0;
- align-self:stretch;
- }
- :is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction{
- display:flex;
- flex-direction:column;
- align-items:flex-start;
- gap:8px;
- align-self:stretch;
- flex:1 1 auto;
- }
- :is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction) #newAltTextDescriptionContainer{
- width:100%;
- height:70px;
- position:relative;
- }
- :is(:is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction) #newAltTextDescriptionContainer) textarea{
- width:100%;
- height:100%;
- padding:8px;
- }
- :is(:is(:is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction) #newAltTextDescriptionContainer) textarea)::-moz-placeholder{
- color:var(--text-secondary-color);
- }
- :is(:is(:is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction) #newAltTextDescriptionContainer) textarea)::placeholder{
- color:var(--text-secondary-color);
- }
- :is(:is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction) #newAltTextDescriptionContainer) .altTextSpinner{
- display:none;
- position:absolute;
- width:16px;
- height:16px;
- inset-inline-start:8px;
- inset-block-start:8px;
- -webkit-mask-size:cover;
- mask-size:cover;
- background-color:var(--text-secondary-color);
- pointer-events:none;
- }
- .loading:is(:is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction) #newAltTextDescriptionContainer) textarea::-moz-placeholder{
- color:transparent;
- }
- .loading:is(:is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction) #newAltTextDescriptionContainer) textarea::placeholder{
- color:transparent;
- }
- .loading:is(:is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction) #newAltTextDescriptionContainer) .altTextSpinner{
- display:inline-block;
- -webkit-mask-image:var(--new-alt-text-spinner-icon);
- mask-image:var(--new-alt-text-spinner-icon);
- }
- :is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction) #newAltTextDescription{
- font-size:11px;
- }
- :is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction) #newAltTextDisclaimer{
- display:flex;
- flex-direction:row;
- align-items:flex-start;
- gap:4px;
- font-size:11px;
- }
- :is(:is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #descriptionInstruction) #newAltTextDisclaimer)::before{
- content:"";
- display:inline-block;
- width:17px;
- height:16px;
- -webkit-mask-image:var(--new-alt-text-ai-disclaimer-icon);
- mask-image:var(--new-alt-text-ai-disclaimer-icon);
- -webkit-mask-size:cover;
- mask-size:cover;
- background-color:var(--text-secondary-color);
- flex:1 0 auto;
- }
- :is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #newAltTextDownloadModel{
- display:flex;
- align-items:center;
- gap:4px;
- align-self:stretch;
- }
- :is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #newAltTextDownloadModel)::before{
- content:"";
- display:inline-block;
- width:16px;
- height:16px;
- -webkit-mask-image:var(--new-alt-text-spinner-icon);
- mask-image:var(--new-alt-text-spinner-icon);
- -webkit-mask-size:cover;
- mask-size:cover;
- background-color:var(--text-secondary-color);
- }
- :is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #newAltTextImagePreview{
- width:180px;
- aspect-ratio:1;
- display:flex;
- justify-content:center;
- align-items:center;
- flex:0 0 auto;
- background-color:var(--preview-image-bg-color);
- border:var(--preview-image-border);
- }
- :is(:is(:is(.dialog.newAltText #newAltTextContainer) #mainContent) #newAltTextImagePreview) > canvas{
- max-width:100%;
- max-height:100%;
- }
- .colorPicker{
- --csstools-light-dark-toggle--88:var(--csstools-color-scheme--light) #80ebff;
- --hover-outline-color:var(--csstools-light-dark-toggle--88, #0250bb);
- --csstools-light-dark-toggle--89:var(--csstools-color-scheme--light) #aaf2ff;
- --selected-outline-color:var(--csstools-light-dark-toggle--89, #0060df);
- --csstools-light-dark-toggle--90:var(--csstools-color-scheme--light) #52525e;
- --swatch-border-color:var(--csstools-light-dark-toggle--90, #cfcfd8);
- }
- @supports (color: light-dark(red, red)){
- .colorPicker{
- --hover-outline-color:light-dark(#0250bb, #80ebff);
- --selected-outline-color:light-dark(#0060df, #aaf2ff);
- --swatch-border-color:light-dark(#cfcfd8, #52525e);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- .colorPicker *{
- --csstools-light-dark-toggle--88:var(--csstools-color-scheme--light) #80ebff;
- --hover-outline-color:var(--csstools-light-dark-toggle--88, #0250bb);
- --csstools-light-dark-toggle--89:var(--csstools-color-scheme--light) #aaf2ff;
- --selected-outline-color:var(--csstools-light-dark-toggle--89, #0060df);
- --csstools-light-dark-toggle--90:var(--csstools-color-scheme--light) #52525e;
- --swatch-border-color:var(--csstools-light-dark-toggle--90, #cfcfd8);
- }
- }
- @media screen and (forced-colors: active){
- .colorPicker{
- --hover-outline-color:Highlight;
- --selected-outline-color:var(--hover-outline-color);
- --swatch-border-color:ButtonText;
- }
- }
- .colorPicker .swatch{
- width:16px;
- height:16px;
- border:1px solid var(--swatch-border-color);
- border-radius:100%;
- outline-offset:2px;
- box-sizing:border-box;
- forced-color-adjust:none;
- }
- .colorPicker button:is(:hover,.selected) > .swatch{
- border:none;
- }
- .annotationEditorLayer[data-main-rotation="0"] .highlightEditor:not(.free) > .editToolbar{
- rotate:0deg;
- }
- .annotationEditorLayer[data-main-rotation="90"] .highlightEditor:not(.free) > .editToolbar{
- rotate:270deg;
- }
- .annotationEditorLayer[data-main-rotation="180"] .highlightEditor:not(.free) > .editToolbar{
- rotate:180deg;
- }
- .annotationEditorLayer[data-main-rotation="270"] .highlightEditor:not(.free) > .editToolbar{
- rotate:90deg;
- }
- .annotationEditorLayer .highlightEditor{
- position:absolute;
- background:transparent;
- z-index:1;
- cursor:auto;
- max-width:100%;
- max-height:100%;
- border:none;
- outline:none;
- pointer-events:none;
- transform-origin:0 0;
- }
- :is(.annotationEditorLayer .highlightEditor):not(.free){
- transform:none;
- }
- :is(.annotationEditorLayer .highlightEditor) .internal{
- position:absolute;
- top:0;
- left:0;
- width:100%;
- height:100%;
- pointer-events:auto;
- }
- .disabled:is(.annotationEditorLayer .highlightEditor) .internal{
- pointer-events:none;
- }
- .selectedEditor:is(.annotationEditorLayer .highlightEditor) .internal{
- cursor:pointer;
- }
- :is(.annotationEditorLayer .highlightEditor) .editToolbar{
- --editor-toolbar-colorpicker-arrow-image:url(images/toolbarButton-menuArrow.svg);
- transform-origin:center !important;
- }
- :is(:is(:is(.annotationEditorLayer .highlightEditor) .editToolbar) .buttons) .colorPicker{
- position:relative;
- width:auto;
- display:flex;
- justify-content:center;
- align-items:center;
- gap:4px;
- padding:4px;
- }
- :is(:is(:is(:is(.annotationEditorLayer .highlightEditor) .editToolbar) .buttons) .colorPicker)::after{
- content:"";
- -webkit-mask-image:var(--editor-toolbar-colorpicker-arrow-image);
- mask-image:var(--editor-toolbar-colorpicker-arrow-image);
- -webkit-mask-repeat:no-repeat;
- mask-repeat:no-repeat;
- -webkit-mask-position:center;
- mask-position:center;
- display:inline-block;
- background-color:var(--editor-toolbar-fg-color);
- width:12px;
- height:12px;
- }
- :is(:is(:is(:is(.annotationEditorLayer .highlightEditor) .editToolbar) .buttons) .colorPicker):hover::after{
- background-color:var(--editor-toolbar-hover-fg-color);
- }
- :is(:is(:is(:is(.annotationEditorLayer .highlightEditor) .editToolbar) .buttons) .colorPicker):has(.dropdown:not(.hidden)){
- background-color:var(--editor-toolbar-hover-bg-color);
- }
- :is(:is(:is(:is(.annotationEditorLayer .highlightEditor) .editToolbar) .buttons) .colorPicker):has(.dropdown:not(.hidden))::after{
- scale:-1;
- }
- :is(:is(:is(:is(.annotationEditorLayer .highlightEditor) .editToolbar) .buttons) .colorPicker) .dropdown{
- position:absolute;
- display:flex;
- justify-content:center;
- align-items:center;
- flex-direction:column;
- gap:11px;
- padding-block:8px;
- border-radius:6px;
- background-color:var(--editor-toolbar-bg-color);
- border:1px solid var(--editor-toolbar-border-color);
- box-shadow:var(--editor-toolbar-shadow);
- inset-block-start:calc(100% + 4px);
- width:calc(100% + 2 * var(--editor-toolbar-padding));
- }
- :is(:is(:is(:is(:is(.annotationEditorLayer .highlightEditor) .editToolbar) .buttons) .colorPicker) .dropdown) button{
- width:100%;
- height:auto;
- border:none;
- cursor:pointer;
- display:flex;
- justify-content:center;
- align-items:center;
- background:none;
- }
- :is(:is(:is(:is(:is(:is(.annotationEditorLayer .highlightEditor) .editToolbar) .buttons) .colorPicker) .dropdown) button):is(:active,:focus-visible){
- outline:none;
- }
- :is(:is(:is(:is(:is(:is(.annotationEditorLayer .highlightEditor) .editToolbar) .buttons) .colorPicker) .dropdown) button) > .swatch{
- outline-offset:2px;
- }
- [aria-selected="true"]:is(:is(:is(:is(:is(:is(.annotationEditorLayer .highlightEditor) .editToolbar) .buttons) .colorPicker) .dropdown) button) > .swatch{
- outline:2px solid var(--selected-outline-color);
- }
- :is(:is(:is(:is(:is(:is(.annotationEditorLayer .highlightEditor) .editToolbar) .buttons) .colorPicker) .dropdown) button):is(:hover,:active,:focus-visible) > .swatch{
- outline:2px solid var(--hover-outline-color);
- }
- .editorParamsToolbar:has(#highlightParamsToolbarContainer){
- padding:unset;
- }
- #highlightParamsToolbarContainer{
- gap:16px;
- padding-inline:10px;
- padding-block-end:12px;
- }
- #highlightParamsToolbarContainer .colorPicker{
- display:flex;
- flex-direction:column;
- gap:8px;
- }
- :is(#highlightParamsToolbarContainer .colorPicker) .dropdown{
- display:flex;
- justify-content:space-between;
- align-items:center;
- flex-direction:row;
- height:auto;
- }
- :is(:is(#highlightParamsToolbarContainer .colorPicker) .dropdown) button{
- width:auto;
- height:auto;
- border:none;
- cursor:pointer;
- display:flex;
- justify-content:center;
- align-items:center;
- background:none;
- flex:0 0 auto;
- padding:0;
- }
- :is(:is(:is(#highlightParamsToolbarContainer .colorPicker) .dropdown) button) .swatch{
- width:24px;
- height:24px;
- }
- :is(:is(:is(#highlightParamsToolbarContainer .colorPicker) .dropdown) button):is(:active,:focus-visible){
- outline:none;
- }
- [aria-selected="true"]:is(:is(:is(#highlightParamsToolbarContainer .colorPicker) .dropdown) button) > .swatch{
- outline:2px solid var(--selected-outline-color);
- }
- :is(:is(:is(#highlightParamsToolbarContainer .colorPicker) .dropdown) button):is(:hover,:active,:focus-visible) > .swatch{
- outline:2px solid var(--hover-outline-color);
- }
- #highlightParamsToolbarContainer #editorHighlightThickness{
- display:flex;
- flex-direction:column;
- align-items:center;
- gap:4px;
- align-self:stretch;
- }
- :is(#highlightParamsToolbarContainer #editorHighlightThickness) .editorParamsLabel{
- height:auto;
- align-self:stretch;
- }
- :is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker{
- display:flex;
- justify-content:space-between;
- align-items:center;
- align-self:stretch;
- --csstools-light-dark-toggle--91:var(--csstools-color-scheme--light) #80808e;
- --example-color:var(--csstools-light-dark-toggle--91, #bfbfc9);
- }
- @supports (color: light-dark(red, red)){
- :is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker{
- --example-color:light-dark(#bfbfc9, #80808e);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- :is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker) *{
- --csstools-light-dark-toggle--91:var(--csstools-color-scheme--light) #80808e;
- --example-color:var(--csstools-light-dark-toggle--91, #bfbfc9);
- }
- }
- @media screen and (forced-colors: active){
- :is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker{
- --example-color:CanvasText;
- }
- }
- :is(:is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker) > .editorParamsSlider[disabled]){
- opacity:0.4;
- }
- :is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker)::before,:is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker)::after{
- content:"";
- width:8px;
- aspect-ratio:1;
- display:block;
- border-radius:100%;
- background-color:var(--example-color);
- }
- :is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker)::after{
- width:24px;
- }
- :is(:is(#highlightParamsToolbarContainer #editorHighlightThickness) .thicknessPicker) .editorParamsSlider{
- width:unset;
- height:14px;
- }
- #highlightParamsToolbarContainer #editorHighlightVisibility{
- display:flex;
- flex-direction:column;
- align-items:flex-start;
- gap:8px;
- align-self:stretch;
- }
- :is(#highlightParamsToolbarContainer #editorHighlightVisibility) .divider{
- --csstools-light-dark-toggle--92:var(--csstools-color-scheme--light) #8f8f9d;
- --divider-color:var(--csstools-light-dark-toggle--92, #d7d7db);
- }
- @supports (color: light-dark(red, red)){
- :is(#highlightParamsToolbarContainer #editorHighlightVisibility) .divider{
- --divider-color:light-dark(#d7d7db, #8f8f9d);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- :is(:is(#highlightParamsToolbarContainer #editorHighlightVisibility) .divider) *{
- --csstools-light-dark-toggle--92:var(--csstools-color-scheme--light) #8f8f9d;
- --divider-color:var(--csstools-light-dark-toggle--92, #d7d7db);
- }
- }
- @media screen and (forced-colors: active){
- :is(#highlightParamsToolbarContainer #editorHighlightVisibility) .divider{
- --divider-color:CanvasText;
- }
- }
- :is(#highlightParamsToolbarContainer #editorHighlightVisibility) .divider{
- margin-block:4px;
- width:100%;
- height:1px;
- background-color:var(--divider-color);
- }
- :is(#highlightParamsToolbarContainer #editorHighlightVisibility) .toggler{
- display:flex;
- justify-content:space-between;
- align-items:center;
- align-self:stretch;
- }
- #altTextSettingsDialog{
- padding:16px;
- }
- #altTextSettingsDialog #altTextSettingsContainer{
- display:flex;
- width:573px;
- flex-direction:column;
- gap:16px;
- }
- :is(#altTextSettingsDialog #altTextSettingsContainer) .mainContainer{
- gap:16px;
- }
- :is(#altTextSettingsDialog #altTextSettingsContainer) .description{
- color:var(--text-secondary-color);
- }
- :is(#altTextSettingsDialog #altTextSettingsContainer) #aiModelSettings{
- display:flex;
- flex-direction:column;
- gap:12px;
- }
- :is(:is(#altTextSettingsDialog #altTextSettingsContainer) #aiModelSettings) button{
- width:-moz-fit-content;
- width:fit-content;
- }
- .download:is(:is(#altTextSettingsDialog #altTextSettingsContainer) #aiModelSettings) #deleteModelButton{
- display:none;
- }
- :is(:is(#altTextSettingsDialog #altTextSettingsContainer) #aiModelSettings):not(.download) #downloadModelButton{
- display:none;
- }
- :is(#altTextSettingsDialog #altTextSettingsContainer) #automaticAltText,:is(#altTextSettingsDialog #altTextSettingsContainer) #altTextEditor{
- display:flex;
- flex-direction:column;
- gap:8px;
- }
- :is(#altTextSettingsDialog #altTextSettingsContainer) #createModelDescription,:is(#altTextSettingsDialog #altTextSettingsContainer) #aiModelSettings,:is(#altTextSettingsDialog #altTextSettingsContainer) #showAltTextDialogDescription{
- padding-inline-start:40px;
- }
- :is(#altTextSettingsDialog #altTextSettingsContainer) #automaticSettings{
- display:flex;
- flex-direction:column;
- gap:16px;
- }
- :root{
- --csstools-color-scheme--light:initial;
- color-scheme:light dark;
- --viewer-container-height:0;
- --pdfViewer-padding-bottom:0;
- --page-margin:1px auto -8px;
- --page-border:9px solid transparent;
- --spreadHorizontalWrapped-margin-LR:-3.5px;
- --loading-icon-delay:400ms;
- --csstools-light-dark-toggle--93:var(--csstools-color-scheme--light) #0df;
- --focus-ring-color:var(--csstools-light-dark-toggle--93, #0060df);
- --focus-ring-outline:2px solid var(--focus-ring-color);
- }
- @supports (color: light-dark(red, red)){
- :root{
- --focus-ring-color:light-dark(#0060df, #0df);
- }
- }
- @supports not (color: light-dark(tan, tan)){
- :root *{
- --csstools-light-dark-toggle--93:var(--csstools-color-scheme--light) #0df;
- --focus-ring-color:var(--csstools-light-dark-toggle--93, #0060df);
- }
- }
- @media (prefers-color-scheme: dark){
- :root{
- --csstools-color-scheme--light:;
- }
- }
- @media screen and (forced-colors: active){
- :root{
- --pdfViewer-padding-bottom:9px;
- --page-margin:8px auto -1px;
- --page-border:1px solid CanvasText;
- --spreadHorizontalWrapped-margin-LR:3.5px;
- --focus-ring-color:CanvasText;
- }
- }
- [data-main-rotation="90"]{
- transform:rotate(90deg) translateY(-100%);
- }
- [data-main-rotation="180"]{
- transform:rotate(180deg) translate(-100%, -100%);
- }
- [data-main-rotation="270"]{
- transform:rotate(270deg) translateX(-100%);
- }
- #hiddenCopyElement,
- .hiddenCanvasElement{
- position:absolute;
- top:0;
- left:0;
- width:0;
- height:0;
- display:none;
- }
- .pdfViewer{
- --scale-factor:1;
- --page-bg-color:unset;
- padding-bottom:var(--pdfViewer-padding-bottom);
- --hcm-highlight-filter:none;
- --hcm-highlight-selected-filter:none;
- }
- @media screen and (forced-colors: active){
- .pdfViewer{
- --hcm-highlight-filter:invert(100%);
- }
- }
- .pdfViewer.copyAll{
- cursor:wait;
- }
- .pdfViewer .canvasWrapper{
- overflow:hidden;
- width:100%;
- height:100%;
- }
- :is(.pdfViewer .canvasWrapper) canvas{
- position:absolute;
- top:0;
- left:0;
- margin:0;
- display:block;
- width:100%;
- height:100%;
- contain:content;
- }
- :is(:is(.pdfViewer .canvasWrapper) canvas) .structTree{
- contain:strict;
- }
- .pdfViewer .page{
- --user-unit:1;
- --total-scale-factor:calc(var(--scale-factor) * var(--user-unit));
- --scale-round-x:1px;
- --scale-round-y:1px;
- direction:ltr;
- width:816px;
- height:1056px;
- margin:var(--page-margin);
- position:relative;
- overflow:visible;
- border:var(--page-border);
- background-clip:content-box;
- background-color:var(--page-bg-color, rgb(255 255 255));
- }
- .pdfViewer .dummyPage{
- position:relative;
- width:0;
- height:var(--viewer-container-height);
- }
- .pdfViewer.noUserSelect{
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- }
- .pdfViewer.removePageBorders .page{
- margin:0 auto 10px;
- border:none;
- }
- .pdfViewer:is(.scrollHorizontal, .scrollWrapped),
- .spread{
- margin-inline:3.5px;
- text-align:center;
- }
- .pdfViewer.scrollHorizontal,
- .spread{
- white-space:nowrap;
- }
- .pdfViewer.removePageBorders,
- .pdfViewer:is(.scrollHorizontal, .scrollWrapped) .spread{
- margin-inline:0;
- }
- .spread :is(.page, .dummyPage),
- .pdfViewer:is(.scrollHorizontal, .scrollWrapped) :is(.page, .spread){
- display:inline-block;
- vertical-align:middle;
- }
- .spread .page,
- .pdfViewer:is(.scrollHorizontal, .scrollWrapped) .page{
- margin-inline:var(--spreadHorizontalWrapped-margin-LR);
- }
- .pdfViewer.removePageBorders .spread .page,
- .pdfViewer.removePageBorders:is(.scrollHorizontal, .scrollWrapped) .page{
- margin-inline:5px;
- }
- .pdfViewer .page.loadingIcon::after{
- position:absolute;
- top:0;
- left:0;
- content:"";
- width:100%;
- height:100%;
- background:url("images/loading-icon.gif") center no-repeat;
- display:none;
- transition-property:display;
- transition-delay:var(--loading-icon-delay);
- z-index:5;
- contain:strict;
- }
- .pdfViewer .page.loading::after{
- display:block;
- }
- .pdfViewer .page:not(.loading)::after{
- transition-property:none;
- display:none;
- }
- .pdfPresentationMode .pdfViewer{
- padding-bottom:0;
- }
- .pdfPresentationMode .spread{
- margin:0;
- }
- .pdfPresentationMode .pdfViewer .page{
- margin:0 auto;
- border:2px solid transparent;
- }
- :root{
- --dir-factor:1;
- --inline-start:left;
- --inline-end:right;
- --sidebar-width:200px;
- --sidebar-transition-duration:200ms;
- --sidebar-transition-timing-function:ease;
- --toolbar-height:32px;
- --toolbar-horizontal-padding:1px;
- --toolbar-vertical-padding:2px;
- --icon-size:16px;
- --toolbar-icon-opacity:0.7;
- --doorhanger-icon-opacity:0.9;
- --doorhanger-height:8px;
- --csstools-light-dark-toggle--0:var(--csstools-color-scheme--light) rgb(249 249 250);
- --main-color:var(--csstools-light-dark-toggle--0, rgb(12 12 13));
- --csstools-light-dark-toggle--1:var(--csstools-color-scheme--light) rgb(42 42 46);
- --body-bg-color:var(--csstools-light-dark-toggle--1, rgb(212 212 215));
- --csstools-light-dark-toggle--2:var(--csstools-color-scheme--light) rgb(0 96 223);
- --progressBar-color:var(--csstools-light-dark-toggle--2, rgb(10 132 255));
- --csstools-light-dark-toggle--3:var(--csstools-color-scheme--light) rgb(40 40 43);
- --progressBar-bg-color:var(--csstools-light-dark-toggle--3, rgb(221 221 222));
- --csstools-light-dark-toggle--4:var(--csstools-color-scheme--light) rgb(20 68 133);
- --progressBar-blend-color:var(--csstools-light-dark-toggle--4, rgb(116 177 239));
- --csstools-light-dark-toggle--5:var(--csstools-color-scheme--light) rgb(121 121 123);
- --scrollbar-color:var(--csstools-light-dark-toggle--5, auto);
- --csstools-light-dark-toggle--6:var(--csstools-color-scheme--light) rgb(35 35 39);
- --scrollbar-bg-color:var(--csstools-light-dark-toggle--6, auto);
- --csstools-light-dark-toggle--7:var(--csstools-color-scheme--light) rgb(255 255 255);
- --toolbar-icon-bg-color:var(--csstools-light-dark-toggle--7, rgb(0 0 0));
- --csstools-light-dark-toggle--8:var(--csstools-color-scheme--light) rgb(255 255 255);
- --toolbar-icon-hover-bg-color:var(--csstools-light-dark-toggle--8, rgb(0 0 0));
- --csstools-light-dark-toggle--9:var(--csstools-color-scheme--light) rgb(42 42 46 / 0.9);
- --sidebar-narrow-bg-color:var(--csstools-light-dark-toggle--9, rgb(212 212 215 / 0.9));
- --csstools-light-dark-toggle--10:var(--csstools-color-scheme--light) rgb(50 50 52);
- --sidebar-toolbar-bg-color:var(--csstools-light-dark-toggle--10, rgb(245 246 247));
- --csstools-light-dark-toggle--11:var(--csstools-color-scheme--light) rgb(56 56 61);
- --toolbar-bg-color:var(--csstools-light-dark-toggle--11, rgb(249 249 250));
- --csstools-light-dark-toggle--12:var(--csstools-color-scheme--light) rgb(12 12 13);
- --toolbar-border-color:var(--csstools-light-dark-toggle--12, rgb(184 184 184));
- --toolbar-box-shadow:0 1px 0 var(--toolbar-border-color);
- --toolbar-border-bottom:none;
- --toolbarSidebar-box-shadow:inset calc(-1px * var(--dir-factor)) 0 0 rgb(0 0 0 / 0.25), 0 1px 0 rgb(0 0 0 / 0.15), 0 0 1px rgb(0 0 0 / 0.1);
- --toolbarSidebar-border-bottom:none;
- --button-hover-color:color-mix(in srgb, currentColor 17%, transparent);
- --csstools-light-dark-toggle--13:var(--csstools-color-scheme--light) rgb(255 255 255);
- --toggled-btn-color:var(--csstools-light-dark-toggle--13, rgb(0 0 0));
- --toggled-btn-bg-color:rgb(0 0 0 / 0.3);
- --toggled-hover-active-btn-color:rgb(0 0 0 / 0.4);
- --toggled-hover-btn-outline:none;
- --csstools-light-dark-toggle--14:var(--csstools-color-scheme--light) rgb(74 74 79);
- --dropdown-btn-bg-color:var(--csstools-light-dark-toggle--14, rgb(215 215 219));
- --dropdown-btn-border:none;
- --separator-color:rgb(0 0 0 / 0.3);
- --csstools-light-dark-toggle--15:var(--csstools-color-scheme--light) rgb(250 250 250);
- --field-color:var(--csstools-light-dark-toggle--15, rgb(6 6 6));
- --csstools-light-dark-toggle--16:var(--csstools-color-scheme--light) rgb(64 64 68);
- --field-bg-color:var(--csstools-light-dark-toggle--16, rgb(255 255 255));
- --csstools-light-dark-toggle--17:var(--csstools-color-scheme--light) rgb(115 115 115);
- --field-border-color:var(--csstools-light-dark-toggle--17, rgb(187 187 188));
- --csstools-light-dark-toggle--18:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.8);
- --treeitem-color:var(--csstools-light-dark-toggle--18, rgb(0 0 0 / 0.8));
- --csstools-light-dark-toggle--19:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.15);
- --treeitem-bg-color:var(--csstools-light-dark-toggle--19, rgb(0 0 0 / 0.15));
- --csstools-light-dark-toggle--20:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.9);
- --treeitem-hover-color:var(--csstools-light-dark-toggle--20, rgb(0 0 0 / 0.9));
- --csstools-light-dark-toggle--21:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.9);
- --treeitem-selected-color:var(--csstools-light-dark-toggle--21, rgb(0 0 0 / 0.9));
- --csstools-light-dark-toggle--22:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.25);
- --treeitem-selected-bg-color:var(--csstools-light-dark-toggle--22, rgb(0 0 0 / 0.25));
- --csstools-light-dark-toggle--23:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.1);
- --thumbnail-hover-color:var(--csstools-light-dark-toggle--23, rgb(0 0 0 / 0.1));
- --csstools-light-dark-toggle--24:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.2);
- --thumbnail-selected-color:var(--csstools-light-dark-toggle--24, rgb(0 0 0 / 0.2));
- --csstools-light-dark-toggle--25:var(--csstools-color-scheme--light) #42414d;
- --doorhanger-bg-color:var(--csstools-light-dark-toggle--25, rgb(255 255 255));
- --csstools-light-dark-toggle--26:var(--csstools-color-scheme--light) rgb(39 39 43);
- --doorhanger-border-color:var(--csstools-light-dark-toggle--26, rgb(12 12 13 / 0.2));
- --csstools-light-dark-toggle--27:var(--csstools-color-scheme--light) rgb(249 249 250);
- --doorhanger-hover-color:var(--csstools-light-dark-toggle--27, rgb(12 12 13));
- --csstools-light-dark-toggle--28:var(--csstools-color-scheme--light) rgb(92 92 97);
- --doorhanger-separator-color:var(--csstools-light-dark-toggle--28, rgb(222 222 222));
- --dialog-button-border:none;
- --csstools-light-dark-toggle--29:var(--csstools-color-scheme--light) rgb(92 92 97);
- --dialog-button-bg-color:var(--csstools-light-dark-toggle--29, rgb(12 12 13 / 0.1));
- --csstools-light-dark-toggle--30:var(--csstools-color-scheme--light) rgb(115 115 115);
- --dialog-button-hover-bg-color:var(--csstools-light-dark-toggle--30, rgb(12 12 13 / 0.3));
- --loading-icon:url(images/loading.svg);
- --treeitem-expanded-icon:url(images/treeitem-expanded.svg);
- --treeitem-collapsed-icon:url(images/treeitem-collapsed.svg);
- --toolbarButton-editorFreeText-icon:url(images/toolbarButton-editorFreeText.svg);
- --toolbarButton-editorHighlight-icon:url(images/toolbarButton-editorHighlight.svg);
- --toolbarButton-editorInk-icon:url(images/toolbarButton-editorInk.svg);
- --toolbarButton-editorStamp-icon:url(images/toolbarButton-editorStamp.svg);
- --toolbarButton-editorSignature-icon:url(images/toolbarButton-editorSignature.svg);
- --toolbarButton-menuArrow-icon:url(images/toolbarButton-menuArrow.svg);
- --toolbarButton-sidebarToggle-icon:url(images/toolbarButton-sidebarToggle.svg);
- --toolbarButton-secondaryToolbarToggle-icon:url(images/toolbarButton-secondaryToolbarToggle.svg);
- --toolbarButton-pageUp-icon:url(images/toolbarButton-pageUp.svg);
- --toolbarButton-pageDown-icon:url(images/toolbarButton-pageDown.svg);
- --toolbarButton-zoomOut-icon:url(images/toolbarButton-zoomOut.svg);
- --toolbarButton-zoomIn-icon:url(images/toolbarButton-zoomIn.svg);
- --toolbarButton-presentationMode-icon:url(images/toolbarButton-presentationMode.svg);
- --toolbarButton-print-icon:url(images/toolbarButton-print.svg);
- --toolbarButton-openFile-icon:url(images/toolbarButton-openFile.svg);
- --toolbarButton-download-icon:url(images/toolbarButton-download.svg);
- --toolbarButton-bookmark-icon:url(images/toolbarButton-bookmark.svg);
- --toolbarButton-viewThumbnail-icon:url(images/toolbarButton-viewThumbnail.svg);
- --toolbarButton-viewOutline-icon:url(images/toolbarButton-viewOutline.svg);
- --toolbarButton-viewAttachments-icon:url(images/toolbarButton-viewAttachments.svg);
- --toolbarButton-viewLayers-icon:url(images/toolbarButton-viewLayers.svg);
- --toolbarButton-currentOutlineItem-icon:url(images/toolbarButton-currentOutlineItem.svg);
- --toolbarButton-search-icon:url(images/toolbarButton-search.svg);
- --findbarButton-previous-icon:url(images/findbarButton-previous.svg);
- --findbarButton-next-icon:url(images/findbarButton-next.svg);
- --secondaryToolbarButton-firstPage-icon:url(images/secondaryToolbarButton-firstPage.svg);
- --secondaryToolbarButton-lastPage-icon:url(images/secondaryToolbarButton-lastPage.svg);
- --secondaryToolbarButton-rotateCcw-icon:url(images/secondaryToolbarButton-rotateCcw.svg);
- --secondaryToolbarButton-rotateCw-icon:url(images/secondaryToolbarButton-rotateCw.svg);
- --secondaryToolbarButton-selectTool-icon:url(images/secondaryToolbarButton-selectTool.svg);
- --secondaryToolbarButton-handTool-icon:url(images/secondaryToolbarButton-handTool.svg);
- --secondaryToolbarButton-scrollPage-icon:url(images/secondaryToolbarButton-scrollPage.svg);
- --secondaryToolbarButton-scrollVertical-icon:url(images/secondaryToolbarButton-scrollVertical.svg);
- --secondaryToolbarButton-scrollHorizontal-icon:url(images/secondaryToolbarButton-scrollHorizontal.svg);
- --secondaryToolbarButton-scrollWrapped-icon:url(images/secondaryToolbarButton-scrollWrapped.svg);
- --secondaryToolbarButton-spreadNone-icon:url(images/secondaryToolbarButton-spreadNone.svg);
- --secondaryToolbarButton-spreadOdd-icon:url(images/secondaryToolbarButton-spreadOdd.svg);
- --secondaryToolbarButton-spreadEven-icon:url(images/secondaryToolbarButton-spreadEven.svg);
- --secondaryToolbarButton-imageAltTextSettings-icon:var(
- --toolbarButton-editorStamp-icon
- );
- --secondaryToolbarButton-documentProperties-icon:url(images/secondaryToolbarButton-documentProperties.svg);
- --editorParams-stampAddImage-icon:url(images/toolbarButton-zoomIn.svg);
- }
- @supports (color: light-dark(red, red)) and (color: rgb(0 0 0 / 0)){
- :root{
- --main-color:light-dark(rgb(12 12 13), rgb(249 249 250));
- --body-bg-color:light-dark(rgb(212 212 215), rgb(42 42 46));
- --progressBar-color:light-dark(rgb(10 132 255), rgb(0 96 223));
- --progressBar-bg-color:light-dark(rgb(221 221 222), rgb(40 40 43));
- --progressBar-blend-color:light-dark(rgb(116 177 239), rgb(20 68 133));
- --scrollbar-color:light-dark(auto, rgb(121 121 123));
- --scrollbar-bg-color:light-dark(auto, rgb(35 35 39));
- --toolbar-icon-bg-color:light-dark(rgb(0 0 0), rgb(255 255 255));
- --toolbar-icon-hover-bg-color:light-dark(rgb(0 0 0), rgb(255 255 255));
- --sidebar-narrow-bg-color:light-dark(
- rgb(212 212 215 / 0.9),
- rgb(42 42 46 / 0.9)
- );
- --sidebar-toolbar-bg-color:light-dark(rgb(245 246 247), rgb(50 50 52));
- --toolbar-bg-color:light-dark(rgb(249 249 250), rgb(56 56 61));
- --toolbar-border-color:light-dark(rgb(184 184 184), rgb(12 12 13));
- --toggled-btn-color:light-dark(rgb(0 0 0), rgb(255 255 255));
- --dropdown-btn-bg-color:light-dark(rgb(215 215 219), rgb(74 74 79));
- --field-color:light-dark(rgb(6 6 6), rgb(250 250 250));
- --field-bg-color:light-dark(rgb(255 255 255), rgb(64 64 68));
- --field-border-color:light-dark(rgb(187 187 188), rgb(115 115 115));
- --treeitem-color:light-dark(rgb(0 0 0 / 0.8), rgb(255 255 255 / 0.8));
- --treeitem-bg-color:light-dark(rgb(0 0 0 / 0.15), rgb(255 255 255 / 0.15));
- --treeitem-hover-color:light-dark(rgb(0 0 0 / 0.9), rgb(255 255 255 / 0.9));
- --treeitem-selected-color:light-dark(
- rgb(0 0 0 / 0.9),
- rgb(255 255 255 / 0.9)
- );
- --treeitem-selected-bg-color:light-dark(
- rgb(0 0 0 / 0.25),
- rgb(255 255 255 / 0.25)
- );
- --thumbnail-hover-color:light-dark(rgb(0 0 0 / 0.1), rgb(255 255 255 / 0.1));
- --thumbnail-selected-color:light-dark(
- rgb(0 0 0 / 0.2),
- rgb(255 255 255 / 0.2)
- );
- --doorhanger-bg-color:light-dark(rgb(255 255 255), #42414d);
- --doorhanger-border-color:light-dark(rgb(12 12 13 / 0.2), rgb(39 39 43));
- --doorhanger-hover-color:light-dark(rgb(12 12 13), rgb(249 249 250));
- --doorhanger-separator-color:light-dark(rgb(222 222 222), rgb(92 92 97));
- --dialog-button-bg-color:light-dark(rgb(12 12 13 / 0.1), rgb(92 92 97));
- --dialog-button-hover-bg-color:light-dark(
- rgb(12 12 13 / 0.3),
- rgb(115 115 115)
- );
- }
- }
- @supports not (color: light-dark(tan, tan)){
- :root *{
- --csstools-light-dark-toggle--0:var(--csstools-color-scheme--light) rgb(249 249 250);
- --main-color:var(--csstools-light-dark-toggle--0, rgb(12 12 13));
- --csstools-light-dark-toggle--1:var(--csstools-color-scheme--light) rgb(42 42 46);
- --body-bg-color:var(--csstools-light-dark-toggle--1, rgb(212 212 215));
- --csstools-light-dark-toggle--2:var(--csstools-color-scheme--light) rgb(0 96 223);
- --progressBar-color:var(--csstools-light-dark-toggle--2, rgb(10 132 255));
- --csstools-light-dark-toggle--3:var(--csstools-color-scheme--light) rgb(40 40 43);
- --progressBar-bg-color:var(--csstools-light-dark-toggle--3, rgb(221 221 222));
- --csstools-light-dark-toggle--4:var(--csstools-color-scheme--light) rgb(20 68 133);
- --progressBar-blend-color:var(--csstools-light-dark-toggle--4, rgb(116 177 239));
- --csstools-light-dark-toggle--5:var(--csstools-color-scheme--light) rgb(121 121 123);
- --scrollbar-color:var(--csstools-light-dark-toggle--5, auto);
- --csstools-light-dark-toggle--6:var(--csstools-color-scheme--light) rgb(35 35 39);
- --scrollbar-bg-color:var(--csstools-light-dark-toggle--6, auto);
- --csstools-light-dark-toggle--7:var(--csstools-color-scheme--light) rgb(255 255 255);
- --toolbar-icon-bg-color:var(--csstools-light-dark-toggle--7, rgb(0 0 0));
- --csstools-light-dark-toggle--8:var(--csstools-color-scheme--light) rgb(255 255 255);
- --toolbar-icon-hover-bg-color:var(--csstools-light-dark-toggle--8, rgb(0 0 0));
- --csstools-light-dark-toggle--9:var(--csstools-color-scheme--light) rgb(42 42 46 / 0.9);
- --sidebar-narrow-bg-color:var(--csstools-light-dark-toggle--9, rgb(212 212 215 / 0.9));
- --csstools-light-dark-toggle--10:var(--csstools-color-scheme--light) rgb(50 50 52);
- --sidebar-toolbar-bg-color:var(--csstools-light-dark-toggle--10, rgb(245 246 247));
- --csstools-light-dark-toggle--11:var(--csstools-color-scheme--light) rgb(56 56 61);
- --toolbar-bg-color:var(--csstools-light-dark-toggle--11, rgb(249 249 250));
- --csstools-light-dark-toggle--12:var(--csstools-color-scheme--light) rgb(12 12 13);
- --toolbar-border-color:var(--csstools-light-dark-toggle--12, rgb(184 184 184));
- --csstools-light-dark-toggle--13:var(--csstools-color-scheme--light) rgb(255 255 255);
- --toggled-btn-color:var(--csstools-light-dark-toggle--13, rgb(0 0 0));
- --csstools-light-dark-toggle--14:var(--csstools-color-scheme--light) rgb(74 74 79);
- --dropdown-btn-bg-color:var(--csstools-light-dark-toggle--14, rgb(215 215 219));
- --csstools-light-dark-toggle--15:var(--csstools-color-scheme--light) rgb(250 250 250);
- --field-color:var(--csstools-light-dark-toggle--15, rgb(6 6 6));
- --csstools-light-dark-toggle--16:var(--csstools-color-scheme--light) rgb(64 64 68);
- --field-bg-color:var(--csstools-light-dark-toggle--16, rgb(255 255 255));
- --csstools-light-dark-toggle--17:var(--csstools-color-scheme--light) rgb(115 115 115);
- --field-border-color:var(--csstools-light-dark-toggle--17, rgb(187 187 188));
- --csstools-light-dark-toggle--18:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.8);
- --treeitem-color:var(--csstools-light-dark-toggle--18, rgb(0 0 0 / 0.8));
- --csstools-light-dark-toggle--19:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.15);
- --treeitem-bg-color:var(--csstools-light-dark-toggle--19, rgb(0 0 0 / 0.15));
- --csstools-light-dark-toggle--20:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.9);
- --treeitem-hover-color:var(--csstools-light-dark-toggle--20, rgb(0 0 0 / 0.9));
- --csstools-light-dark-toggle--21:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.9);
- --treeitem-selected-color:var(--csstools-light-dark-toggle--21, rgb(0 0 0 / 0.9));
- --csstools-light-dark-toggle--22:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.25);
- --treeitem-selected-bg-color:var(--csstools-light-dark-toggle--22, rgb(0 0 0 / 0.25));
- --csstools-light-dark-toggle--23:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.1);
- --thumbnail-hover-color:var(--csstools-light-dark-toggle--23, rgb(0 0 0 / 0.1));
- --csstools-light-dark-toggle--24:var(--csstools-color-scheme--light) rgb(255 255 255 / 0.2);
- --thumbnail-selected-color:var(--csstools-light-dark-toggle--24, rgb(0 0 0 / 0.2));
- --csstools-light-dark-toggle--25:var(--csstools-color-scheme--light) #42414d;
- --doorhanger-bg-color:var(--csstools-light-dark-toggle--25, rgb(255 255 255));
- --csstools-light-dark-toggle--26:var(--csstools-color-scheme--light) rgb(39 39 43);
- --doorhanger-border-color:var(--csstools-light-dark-toggle--26, rgb(12 12 13 / 0.2));
- --csstools-light-dark-toggle--27:var(--csstools-color-scheme--light) rgb(249 249 250);
- --doorhanger-hover-color:var(--csstools-light-dark-toggle--27, rgb(12 12 13));
- --csstools-light-dark-toggle--28:var(--csstools-color-scheme--light) rgb(92 92 97);
- --doorhanger-separator-color:var(--csstools-light-dark-toggle--28, rgb(222 222 222));
- --csstools-light-dark-toggle--29:var(--csstools-color-scheme--light) rgb(92 92 97);
- --dialog-button-bg-color:var(--csstools-light-dark-toggle--29, rgb(12 12 13 / 0.1));
- --csstools-light-dark-toggle--30:var(--csstools-color-scheme--light) rgb(115 115 115);
- --dialog-button-hover-bg-color:var(--csstools-light-dark-toggle--30, rgb(12 12 13 / 0.3));
- }
- }
- [dir="rtl"]:root{
- --dir-factor:-1;
- --inline-start:right;
- --inline-end:left;
- }
- @media screen and (forced-colors: active){
- :root{
- --button-hover-color:Highlight;
- --toolbar-icon-opacity:1;
- --toolbar-icon-bg-color:ButtonText;
- --toolbar-icon-hover-bg-color:ButtonFace;
- --toggled-hover-active-btn-color:ButtonText;
- --toggled-hover-btn-outline:2px solid ButtonBorder;
- --toolbar-border-color:CanvasText;
- --toolbar-border-bottom:1px solid var(--toolbar-border-color);
- --toolbar-box-shadow:none;
- --toggled-btn-color:HighlightText;
- --toggled-btn-bg-color:LinkText;
- --doorhanger-hover-color:ButtonFace;
- --doorhanger-border-color-whcm:1px solid ButtonText;
- --doorhanger-triangle-opacity-whcm:0;
- --dialog-button-border:1px solid Highlight;
- --dialog-button-hover-bg-color:Highlight;
- --dialog-button-hover-color:ButtonFace;
- --dropdown-btn-border:1px solid ButtonText;
- --field-border-color:ButtonText;
- --main-color:CanvasText;
- --separator-color:GrayText;
- --doorhanger-separator-color:GrayText;
- --toolbarSidebar-box-shadow:none;
- --toolbarSidebar-border-bottom:1px solid var(--toolbar-border-color);
- }
- }
- @media screen and (prefers-reduced-motion: reduce){
- :root{
- --sidebar-transition-duration:0;
- }
- }
- @keyframes progressIndeterminate{
- 0%{
- transform:translateX(calc(-142px * var(--dir-factor)));
- }
- 100%{
- transform:translateX(0);
- }
- }
- html[data-toolbar-density="compact"]{
- --toolbar-height:30px;
- }
- html[data-toolbar-density="touch"]{
- --toolbar-height:44px;
- }
- html,
- body{
- height:100%;
- width:100%;
- }
- body{
- margin:0;
- background-color:var(--body-bg-color);
- scrollbar-color:var(--scrollbar-color) var(--scrollbar-bg-color);
- }
- body.wait::before{
- content:"";
- position:fixed;
- width:100%;
- height:100%;
- z-index:100000;
- cursor:wait;
- }
- .hidden,
- [hidden]{
- display:none !important;
- }
- #viewerContainer.pdfPresentationMode:fullscreen{
- top:0;
- background-color:rgb(0 0 0);
- width:100%;
- height:100%;
- overflow:hidden;
- cursor:none;
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- }
- .pdfPresentationMode:fullscreen section:not([data-internal-link]){
- pointer-events:none;
- }
- .pdfPresentationMode:fullscreen .textLayer span{
- cursor:none;
- }
- .pdfPresentationMode.pdfPresentationModeControls > *,
- .pdfPresentationMode.pdfPresentationModeControls .textLayer span{
- cursor:default;
- }
- #outerContainer{
- width:100%;
- height:100%;
- position:relative;
- margin:0;
- }
- #sidebarContainer{
- position:absolute;
- inset-block:var(--toolbar-height) 0;
- inset-inline-start:calc(-1 * var(--sidebar-width));
- width:var(--sidebar-width);
- visibility:hidden;
- z-index:1;
- font:message-box;
- border-top:1px solid transparent;
- border-inline-end:var(--doorhanger-border-color-whcm);
- transition-property:inset-inline-start;
- transition-duration:var(--sidebar-transition-duration);
- transition-timing-function:var(--sidebar-transition-timing-function);
- }
- #outerContainer:is(.sidebarMoving, .sidebarOpen) #sidebarContainer{
- visibility:visible;
- }
- #outerContainer.sidebarOpen #sidebarContainer{
- inset-inline-start:0;
- }
- #mainContainer{
- position:absolute;
- inset:0;
- min-width:350px;
- margin:0;
- display:flex;
- flex-direction:column;
- }
- #sidebarContent{
- inset-block:var(--toolbar-height) 0;
- inset-inline-start:0;
- overflow:auto;
- position:absolute;
- width:100%;
- box-shadow:inset calc(-1px * var(--dir-factor)) 0 0 rgb(0 0 0 / 0.25);
- }
- #viewerContainer{
- overflow:auto;
- position:absolute;
- inset:var(--toolbar-height) 0 0;
- outline:none;
- z-index:0;
- }
- #viewerContainer:not(.pdfPresentationMode){
- transition-duration:var(--sidebar-transition-duration);
- transition-timing-function:var(--sidebar-transition-timing-function);
- }
- #outerContainer.sidebarOpen #viewerContainer:not(.pdfPresentationMode){
- inset-inline-start:var(--sidebar-width);
- transition-property:inset-inline-start;
- }
- #sidebarContainer :is(input, button, select){
- font:message-box;
- }
- .toolbar{
- z-index:2;
- }
- #toolbarSidebar{
- width:100%;
- height:var(--toolbar-height);
- background-color:var(--sidebar-toolbar-bg-color);
- box-shadow:var(--toolbarSidebar-box-shadow);
- border-bottom:var(--toolbarSidebar-border-bottom);
- padding:var(--toolbar-vertical-padding) var(--toolbar-horizontal-padding);
- justify-content:space-between;
- }
- #toolbarSidebar #toolbarSidebarLeft{
- width:auto;
- height:100%;
- }
- :is(#toolbarSidebar #toolbarSidebarLeft) #viewThumbnail::before{
- -webkit-mask-image:var(--toolbarButton-viewThumbnail-icon);
- mask-image:var(--toolbarButton-viewThumbnail-icon);
- }
- :is(#toolbarSidebar #toolbarSidebarLeft) #viewOutline::before{
- -webkit-mask-image:var(--toolbarButton-viewOutline-icon);
- mask-image:var(--toolbarButton-viewOutline-icon);
- transform:scaleX(var(--dir-factor));
- }
- :is(#toolbarSidebar #toolbarSidebarLeft) #viewAttachments::before{
- -webkit-mask-image:var(--toolbarButton-viewAttachments-icon);
- mask-image:var(--toolbarButton-viewAttachments-icon);
- }
- :is(#toolbarSidebar #toolbarSidebarLeft) #viewLayers::before{
- -webkit-mask-image:var(--toolbarButton-viewLayers-icon);
- mask-image:var(--toolbarButton-viewLayers-icon);
- }
- #toolbarSidebar #toolbarSidebarRight{
- width:auto;
- height:100%;
- padding-inline-end:2px;
- }
- #sidebarResizer{
- position:absolute;
- inset-block:0;
- inset-inline-end:-6px;
- width:6px;
- z-index:200;
- cursor:ew-resize;
- }
- #outerContainer.sidebarOpen #loadingBar{
- inset-inline-start:var(--sidebar-width);
- }
- #outerContainer.sidebarResizing
- :is(#sidebarContainer, #viewerContainer, #loadingBar){
- transition-duration:0s;
- }
- .doorHanger,
- .doorHangerRight{
- border-radius:2px;
- box-shadow:0 1px 5px var(--doorhanger-border-color), 0 0 0 1px var(--doorhanger-border-color);
- border:var(--doorhanger-border-color-whcm);
- background-color:var(--doorhanger-bg-color);
- inset-block-start:calc(100% + var(--doorhanger-height) - 2px);
- }
- :is(.doorHanger,.doorHangerRight)::after,:is(.doorHanger,.doorHangerRight)::before{
- bottom:100%;
- border-style:solid;
- border-color:transparent;
- content:"";
- height:0;
- width:0;
- position:absolute;
- pointer-events:none;
- opacity:var(--doorhanger-triangle-opacity-whcm);
- }
- :is(.doorHanger,.doorHangerRight)::before{
- border-width:calc(var(--doorhanger-height) + 2px);
- border-bottom-color:var(--doorhanger-border-color);
- }
- :is(.doorHanger,.doorHangerRight)::after{
- border-width:var(--doorhanger-height);
- }
- .doorHangerRight{
- inset-inline-end:calc(50% - var(--doorhanger-height) - 1px);
- }
- .doorHangerRight::before{
- inset-inline-end:-1px;
- }
- .doorHangerRight::after{
- border-bottom-color:var(--doorhanger-bg-color);
- inset-inline-end:1px;
- }
- .doorHanger{
- inset-inline-start:calc(50% - var(--doorhanger-height) - 1px);
- }
- .doorHanger::before{
- inset-inline-start:-1px;
- }
- .doorHanger::after{
- border-bottom-color:var(--toolbar-bg-color);
- inset-inline-start:1px;
- }
- .dialogButton{
- border:none;
- background:none;
- width:28px;
- height:28px;
- outline:none;
- }
- .dialogButton:is(:hover, :focus-visible){
- background-color:var(--dialog-button-hover-bg-color);
- }
- .dialogButton:is(:hover, :focus-visible) > span{
- color:var(--dialog-button-hover-color);
- }
- .splitToolbarButtonSeparator{
- float:var(--inline-start);
- width:0;
- height:62%;
- border-left:1px solid var(--separator-color);
- border-right:none;
- }
- .dialogButton{
- min-width:16px;
- margin:2px 1px;
- padding:2px 6px 0;
- border:none;
- border-radius:2px;
- color:var(--main-color);
- font-size:12px;
- line-height:14px;
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- cursor:default;
- box-sizing:border-box;
- }
- .treeItemToggler::before{
- position:absolute;
- display:inline-block;
- width:16px;
- height:16px;
- content:"";
- background-color:var(--toolbar-icon-bg-color);
- -webkit-mask-size:cover;
- mask-size:cover;
- }
- #sidebarToggleButton::before{
- -webkit-mask-image:var(--toolbarButton-sidebarToggle-icon);
- mask-image:var(--toolbarButton-sidebarToggle-icon);
- transform:scaleX(var(--dir-factor));
- }
- #secondaryToolbarToggleButton::before{
- -webkit-mask-image:var(--toolbarButton-secondaryToolbarToggle-icon);
- mask-image:var(--toolbarButton-secondaryToolbarToggle-icon);
- transform:scaleX(var(--dir-factor));
- }
- #previous::before{
- -webkit-mask-image:var(--toolbarButton-pageUp-icon);
- mask-image:var(--toolbarButton-pageUp-icon);
- }
- #next::before{
- -webkit-mask-image:var(--toolbarButton-pageDown-icon);
- mask-image:var(--toolbarButton-pageDown-icon);
- }
- #zoomOutButton::before{
- -webkit-mask-image:var(--toolbarButton-zoomOut-icon);
- mask-image:var(--toolbarButton-zoomOut-icon);
- }
- #zoomInButton::before{
- -webkit-mask-image:var(--toolbarButton-zoomIn-icon);
- mask-image:var(--toolbarButton-zoomIn-icon);
- }
- #editorFreeTextButton::before{
- -webkit-mask-image:var(--toolbarButton-editorFreeText-icon);
- mask-image:var(--toolbarButton-editorFreeText-icon);
- }
- #editorHighlightButton::before{
- -webkit-mask-image:var(--toolbarButton-editorHighlight-icon);
- mask-image:var(--toolbarButton-editorHighlight-icon);
- }
- #editorInkButton::before{
- -webkit-mask-image:var(--toolbarButton-editorInk-icon);
- mask-image:var(--toolbarButton-editorInk-icon);
- }
- #editorStampButton::before{
- -webkit-mask-image:var(--toolbarButton-editorStamp-icon);
- mask-image:var(--toolbarButton-editorStamp-icon);
- }
- #editorSignatureButton::before{
- -webkit-mask-image:var(--toolbarButton-editorSignature-icon);
- mask-image:var(--toolbarButton-editorSignature-icon);
- }
- #printButton::before{
- -webkit-mask-image:var(--toolbarButton-print-icon);
- mask-image:var(--toolbarButton-print-icon);
- }
- #downloadButton::before{
- -webkit-mask-image:var(--toolbarButton-download-icon);
- mask-image:var(--toolbarButton-download-icon);
- }
- #currentOutlineItem::before{
- -webkit-mask-image:var(--toolbarButton-currentOutlineItem-icon);
- mask-image:var(--toolbarButton-currentOutlineItem-icon);
- transform:scaleX(var(--dir-factor));
- }
- #viewFindButton::before{
- -webkit-mask-image:var(--toolbarButton-search-icon);
- mask-image:var(--toolbarButton-search-icon);
- }
- .pdfSidebarNotification::after{
- position:absolute;
- display:inline-block;
- top:2px;
- inset-inline-end:2px;
- content:"";
- background-color:rgb(112 219 85);
- height:9px;
- width:9px;
- border-radius:50%;
- }
- .verticalToolbarSeparator{
- display:block;
- margin-inline:2px;
- width:0;
- height:80%;
- border-left:1px solid var(--separator-color);
- border-right:none;
- box-sizing:border-box;
- }
- .horizontalToolbarSeparator{
- display:block;
- margin:6px 0;
- border-top:1px solid var(--doorhanger-separator-color);
- border-bottom:none;
- height:0;
- width:100%;
- }
- .toggleButton{
- display:inline;
- }
- .toggleButton:has( > input:checked){
- color:var(--toggled-btn-color);
- background-color:var(--toggled-btn-bg-color);
- }
- .toggleButton:is(:hover,:has( > input:focus-visible)){
- color:var(--toggled-btn-color);
- background-color:var(--button-hover-color);
- }
- .toggleButton > input{
- position:absolute;
- top:50%;
- left:50%;
- opacity:0;
- width:0;
- height:0;
- }
- .toolbarField{
- padding:4px 7px;
- margin:3px 0;
- border-radius:2px;
- background-color:var(--field-bg-color);
- background-clip:padding-box;
- border:1px solid var(--field-border-color);
- box-shadow:none;
- color:var(--field-color);
- font-size:12px;
- line-height:16px;
- outline:none;
- }
- .toolbarField:focus{
- border-color:#0a84ff;
- }
- #pageNumber{
- -moz-appearance:textfield;
- text-align:end;
- width:40px;
- background-size:0 0;
- transition-property:none;
- }
- #pageNumber::-webkit-inner-spin-button{
- -webkit-appearance:none;
- }
- .loadingInput:has( > .loading:is(#pageNumber))::after{
- display:inline;
- visibility:visible;
- transition-property:visibility;
- transition-delay:var(--loading-icon-delay);
- }
- .loadingInput{
- position:relative;
- }
- .loadingInput::after{
- position:absolute;
- visibility:hidden;
- display:none;
- width:var(--icon-size);
- height:var(--icon-size);
- content:"";
- background-color:var(--toolbar-icon-bg-color);
- -webkit-mask-size:cover;
- mask-size:cover;
- -webkit-mask-image:var(--loading-icon);
- mask-image:var(--loading-icon);
- }
- .loadingInput.start::after{
- inset-inline-start:4px;
- }
- .loadingInput.end::after{
- inset-inline-end:4px;
- }
- #thumbnailView,
- #outlineView,
- #attachmentsView,
- #layersView{
- position:absolute;
- width:calc(100% - 8px);
- inset-block:0;
- padding:4px 4px 0;
- overflow:auto;
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- }
- #thumbnailView{
- width:calc(100% - 60px);
- padding:10px 30px 0;
- }
- #thumbnailView > a:is(:active, :focus){
- outline:0;
- }
- .thumbnail{
- --thumbnail-width:0;
- --thumbnail-height:0;
- float:var(--inline-start);
- width:var(--thumbnail-width);
- height:var(--thumbnail-height);
- margin:0 10px 5px;
- padding:1px;
- border:7px solid transparent;
- border-radius:2px;
- }
- #thumbnailView > a:last-of-type > .thumbnail{
- margin-bottom:10px;
- }
- a:focus > .thumbnail,
- .thumbnail:hover{
- border-color:var(--thumbnail-hover-color);
- }
- .thumbnail.selected{
- border-color:var(--thumbnail-selected-color) !important;
- }
- .thumbnailImage{
- width:var(--thumbnail-width);
- height:var(--thumbnail-height);
- opacity:0.9;
- }
- a:focus > .thumbnail > .thumbnailImage,
- .thumbnail:hover > .thumbnailImage{
- opacity:0.95;
- }
- .thumbnail.selected > .thumbnailImage{
- opacity:1 !important;
- }
- .thumbnail:not([data-loaded]) > .thumbnailImage{
- width:calc(var(--thumbnail-width) - 2px);
- height:calc(var(--thumbnail-height) - 2px);
- border:1px dashed rgb(132 132 132);
- }
- .treeWithDeepNesting > .treeItem,
- .treeItem > .treeItems{
- margin-inline-start:20px;
- }
- .treeItem > a{
- text-decoration:none;
- display:inline-block;
- min-width:calc(100% - 4px);
- height:auto;
- margin-bottom:1px;
- padding:2px 0 5px;
- padding-inline-start:4px;
- border-radius:2px;
- color:var(--treeitem-color);
- font-size:13px;
- line-height:15px;
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- white-space:normal;
- cursor:pointer;
- }
- #layersView .treeItem > a *{
- cursor:pointer;
- }
- #layersView .treeItem > a > label{
- padding-inline-start:4px;
- }
- #layersView .treeItem > a > label > input{
- float:var(--inline-start);
- margin-top:1px;
- }
- .treeItemToggler{
- position:relative;
- float:var(--inline-start);
- height:0;
- width:0;
- color:rgb(255 255 255 / 0.5);
- }
- .treeItemToggler::before{
- inset-inline-end:4px;
- -webkit-mask-image:var(--treeitem-expanded-icon);
- mask-image:var(--treeitem-expanded-icon);
- }
- .treeItemToggler.treeItemsHidden::before{
- -webkit-mask-image:var(--treeitem-collapsed-icon);
- mask-image:var(--treeitem-collapsed-icon);
- transform:scaleX(var(--dir-factor));
- }
- .treeItemToggler.treeItemsHidden ~ .treeItems{
- display:none;
- }
- .treeItem.selected > a{
- background-color:var(--treeitem-selected-bg-color);
- color:var(--treeitem-selected-color);
- }
- .treeItemToggler:hover,
- .treeItemToggler:hover + a,
- .treeItemToggler:hover ~ .treeItems,
- .treeItem > a:hover{
- background-color:var(--treeitem-bg-color);
- background-clip:padding-box;
- border-radius:2px;
- color:var(--treeitem-hover-color);
- }
- #outlineOptionsContainer{
- display:none;
- }
- #sidebarContainer:has(#outlineView:not(.hidden)) #outlineOptionsContainer{
- display:inline flex;
- }
- .dialogButton{
- width:auto;
- margin:3px 4px 2px !important;
- padding:2px 11px;
- color:var(--main-color);
- background-color:var(--dialog-button-bg-color);
- border:var(--dialog-button-border) !important;
- }
- dialog{
- margin:auto;
- padding:15px;
- border-spacing:4px;
- color:var(--main-color);
- font:message-box;
- font-size:12px;
- line-height:14px;
- background-color:var(--doorhanger-bg-color);
- border:1px solid rgb(0 0 0 / 0.5);
- border-radius:4px;
- box-shadow:0 1px 4px rgb(0 0 0 / 0.3);
- }
- dialog::backdrop{
- background-color:rgb(0 0 0 / 0.2);
- }
- dialog > .row{
- display:table-row;
- }
- dialog > .row > *{
- display:table-cell;
- }
- dialog .toolbarField{
- margin:5px 0;
- }
- dialog .separator{
- display:block;
- margin:4px 0;
- height:0;
- width:100%;
- border-top:1px solid var(--separator-color);
- border-bottom:none;
- }
- dialog .buttonRow{
- text-align:center;
- vertical-align:middle;
- }
- dialog :link{
- color:rgb(255 255 255);
- }
- #passwordDialog{
- text-align:center;
- }
- #passwordDialog .toolbarField{
- width:200px;
- }
- #documentPropertiesDialog{
- text-align:left;
- }
- #documentPropertiesDialog .row > *{
- min-width:100px;
- text-align:start;
- }
- #documentPropertiesDialog .row > span{
- width:125px;
- word-wrap:break-word;
- }
- #documentPropertiesDialog .row > p{
- max-width:225px;
- word-wrap:break-word;
- }
- #documentPropertiesDialog .buttonRow{
- margin-top:10px;
- }
- .grab-to-pan-grab{
- cursor:grab !important;
- }
- .grab-to-pan-grab
- *:not(input):not(textarea):not(button):not(select):not(:link){
- cursor:inherit !important;
- }
- .grab-to-pan-grab:active,
- .grab-to-pan-grabbing{
- cursor:grabbing !important;
- }
- .grab-to-pan-grabbing{
- position:fixed;
- background:rgb(0 0 0 / 0);
- display:block;
- inset:0;
- overflow:hidden;
- z-index:50000;
- }
- .toolbarButton{
- height:100%;
- aspect-ratio:1;
- display:flex;
- align-items:center;
- justify-content:center;
- background:none;
- border:none;
- color:var(--main-color);
- outline:none;
- border-radius:2px;
- box-sizing:border-box;
- font:message-box;
- flex:none;
- position:relative;
- padding:0;
- }
- .toolbarButton > span{
- display:inline-block;
- width:0;
- height:0;
- overflow:hidden;
- }
- .toolbarButton::before{
- opacity:var(--toolbar-icon-opacity);
- display:inline-block;
- width:var(--icon-size);
- height:var(--icon-size);
- content:"";
- background-color:var(--toolbar-icon-bg-color);
- -webkit-mask-size:cover;
- mask-size:cover;
- -webkit-mask-position:center;
- mask-position:center;
- }
- .toolbarButton.toggled{
- background-color:var(--toggled-btn-bg-color);
- color:var(--toggled-btn-color);
- }
- .toolbarButton.toggled::before{
- background-color:var(--toggled-btn-color);
- }
- .toolbarButton.toggled:hover{
- outline:var(--toggled-hover-btn-outline) !important;
- }
- .toolbarButton.toggled:hover:active{
- background-color:var(--toggled-hover-active-btn-color);
- }
- .toolbarButton:is(:hover,:focus-visible){
- background-color:var(--button-hover-color);
- }
- .toolbarButton:is(:hover,:focus-visible)::before{
- background-color:var(--toolbar-icon-hover-bg-color);
- }
- .toolbarButton:is([disabled="disabled"],[disabled]){
- opacity:0.5;
- pointer-events:none;
- }
- .toolbarButton.labeled{
- width:100%;
- min-height:var(--menuitem-height);
- justify-content:flex-start;
- gap:8px;
- padding-inline-start:12px;
- aspect-ratio:unset;
- text-align:start;
- white-space:normal;
- cursor:default;
- }
- .toolbarButton.labeled:is(a){
- text-decoration:none;
- }
- .toolbarButton.labeled[href="#"]:is(a){
- opacity:0.5;
- pointer-events:none;
- }
- .toolbarButton.labeled::before{
- opacity:var(--doorhanger-icon-opacity);
- }
- .toolbarButton.labeled:is(:hover,:focus-visible){
- color:var(--doorhanger-hover-color);
- }
- .toolbarButton.labeled > span{
- display:inline-block;
- width:-moz-max-content;
- width:max-content;
- height:auto;
- }
- .toolbarButtonWithContainer{
- height:100%;
- aspect-ratio:1;
- display:inline-block;
- position:relative;
- flex:none;
- }
- .toolbarButtonWithContainer > .toolbarButton{
- width:100%;
- height:100%;
- }
- .toolbarButtonWithContainer .menu{
- padding-block:5px;
- }
- .toolbarButtonWithContainer .menuContainer{
- width:100%;
- height:auto;
- max-height:calc(
- var(--viewer-container-height) - var(--toolbar-height) -
- var(--doorhanger-height)
- );
- display:flex;
- flex-direction:column;
- box-sizing:border-box;
- overflow-y:auto;
- }
- .toolbarButtonWithContainer .editorParamsToolbar{
- height:auto;
- width:220px;
- position:absolute;
- z-index:30000;
- cursor:default;
- }
- :is(.toolbarButtonWithContainer .editorParamsToolbar) :is(#editorStampAddImage,#editorSignatureAddSignature)::before{
- -webkit-mask-image:var(--editorParams-stampAddImage-icon);
- mask-image:var(--editorParams-stampAddImage-icon);
- }
- :is(.toolbarButtonWithContainer .editorParamsToolbar) .editorParamsLabel{
- flex:none;
- font:menu;
- font-size:13px;
- font-style:normal;
- font-weight:400;
- line-height:150%;
- width:-moz-fit-content;
- width:fit-content;
- inset-inline-start:0;
- color:var(--main-color);
- }
- :is(.toolbarButtonWithContainer .editorParamsToolbar) button:is(:hover,:focus-visible) .editorParamsLabel{
- color:var(--doorhanger-hover-color);
- }
- :is(.toolbarButtonWithContainer .editorParamsToolbar) .editorParamsToolbarContainer{
- width:100%;
- height:auto;
- display:flex;
- flex-direction:column;
- box-sizing:border-box;
- padding-inline:10px;
- padding-block:10px;
- }
- :is(:is(.toolbarButtonWithContainer .editorParamsToolbar) .editorParamsToolbarContainer) > .editorParamsSetter{
- min-height:26px;
- display:flex;
- align-items:center;
- justify-content:space-between;
- }
- :is(:is(.toolbarButtonWithContainer .editorParamsToolbar) .editorParamsToolbarContainer) .editorParamsColor{
- width:32px;
- height:32px;
- flex:none;
- padding:0;
- }
- :is(:is(.toolbarButtonWithContainer .editorParamsToolbar) .editorParamsToolbarContainer) .editorParamsSlider{
- background-color:transparent;
- width:90px;
- flex:0 1 0;
- font:message-box;
- }
- :is(:is(:is(.toolbarButtonWithContainer .editorParamsToolbar) .editorParamsToolbarContainer) .editorParamsSlider)::-moz-range-progress{
- background-color:black;
- }
- :is(:is(:is(.toolbarButtonWithContainer .editorParamsToolbar) .editorParamsToolbarContainer) .editorParamsSlider)::-webkit-slider-runnable-track,:is(:is(:is(.toolbarButtonWithContainer .editorParamsToolbar) .editorParamsToolbarContainer) .editorParamsSlider)::-moz-range-track{
- background-color:black;
- }
- :is(:is(:is(.toolbarButtonWithContainer .editorParamsToolbar) .editorParamsToolbarContainer) .editorParamsSlider)::-webkit-slider-thumb,:is(:is(:is(.toolbarButtonWithContainer .editorParamsToolbar) .editorParamsToolbarContainer) .editorParamsSlider)::-moz-range-thumb{
- background-color:white;
- }
- #secondaryToolbar{
- height:auto;
- width:220px;
- position:absolute;
- z-index:30000;
- cursor:default;
- min-height:26px;
- max-height:calc(var(--viewer-container-height) - 40px);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #secondaryOpenFile::before{
- -webkit-mask-image:var(--toolbarButton-openFile-icon);
- mask-image:var(--toolbarButton-openFile-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #secondaryPrint::before{
- -webkit-mask-image:var(--toolbarButton-print-icon);
- mask-image:var(--toolbarButton-print-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #secondaryDownload::before{
- -webkit-mask-image:var(--toolbarButton-download-icon);
- mask-image:var(--toolbarButton-download-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #presentationMode::before{
- -webkit-mask-image:var(--toolbarButton-presentationMode-icon);
- mask-image:var(--toolbarButton-presentationMode-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #viewBookmark::before{
- -webkit-mask-image:var(--toolbarButton-bookmark-icon);
- mask-image:var(--toolbarButton-bookmark-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #firstPage::before{
- -webkit-mask-image:var(--secondaryToolbarButton-firstPage-icon);
- mask-image:var(--secondaryToolbarButton-firstPage-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #lastPage::before{
- -webkit-mask-image:var(--secondaryToolbarButton-lastPage-icon);
- mask-image:var(--secondaryToolbarButton-lastPage-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #pageRotateCcw::before{
- -webkit-mask-image:var(--secondaryToolbarButton-rotateCcw-icon);
- mask-image:var(--secondaryToolbarButton-rotateCcw-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #pageRotateCw::before{
- -webkit-mask-image:var(--secondaryToolbarButton-rotateCw-icon);
- mask-image:var(--secondaryToolbarButton-rotateCw-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #cursorSelectTool::before{
- -webkit-mask-image:var(--secondaryToolbarButton-selectTool-icon);
- mask-image:var(--secondaryToolbarButton-selectTool-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #cursorHandTool::before{
- -webkit-mask-image:var(--secondaryToolbarButton-handTool-icon);
- mask-image:var(--secondaryToolbarButton-handTool-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #scrollPage::before{
- -webkit-mask-image:var(--secondaryToolbarButton-scrollPage-icon);
- mask-image:var(--secondaryToolbarButton-scrollPage-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #scrollVertical::before{
- -webkit-mask-image:var(--secondaryToolbarButton-scrollVertical-icon);
- mask-image:var(--secondaryToolbarButton-scrollVertical-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #scrollHorizontal::before{
- -webkit-mask-image:var(--secondaryToolbarButton-scrollHorizontal-icon);
- mask-image:var(--secondaryToolbarButton-scrollHorizontal-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #scrollWrapped::before{
- -webkit-mask-image:var(--secondaryToolbarButton-scrollWrapped-icon);
- mask-image:var(--secondaryToolbarButton-scrollWrapped-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #spreadNone::before{
- -webkit-mask-image:var(--secondaryToolbarButton-spreadNone-icon);
- mask-image:var(--secondaryToolbarButton-spreadNone-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #spreadOdd::before{
- -webkit-mask-image:var(--secondaryToolbarButton-spreadOdd-icon);
- mask-image:var(--secondaryToolbarButton-spreadOdd-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #spreadEven::before{
- -webkit-mask-image:var(--secondaryToolbarButton-spreadEven-icon);
- mask-image:var(--secondaryToolbarButton-spreadEven-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #imageAltTextSettings::before{
- -webkit-mask-image:var(--secondaryToolbarButton-imageAltTextSettings-icon);
- mask-image:var(--secondaryToolbarButton-imageAltTextSettings-icon);
- }
- :is(#secondaryToolbar #secondaryToolbarButtonContainer) #documentProperties::before{
- -webkit-mask-image:var(--secondaryToolbarButton-documentProperties-icon);
- mask-image:var(--secondaryToolbarButton-documentProperties-icon);
- }
- #findbar{
- --input-horizontal-padding:4px;
- --findbar-padding:2px;
- width:-moz-max-content;
- width:max-content;
- max-width:90vw;
- min-height:var(--toolbar-height);
- height:auto;
- position:absolute;
- z-index:30000;
- cursor:default;
- padding:0;
- min-width:300px;
- background-color:var(--toolbar-bg-color);
- box-sizing:border-box;
- flex-wrap:wrap;
- justify-content:flex-start;
- }
- #findbar > *{
- height:var(--toolbar-height);
- padding:var(--findbar-padding);
- }
- #findbar #findInputContainer{
- margin-inline-start:2px;
- }
- :is(#findbar #findInputContainer) #findPreviousButton::before{
- -webkit-mask-image:var(--findbarButton-previous-icon);
- mask-image:var(--findbarButton-previous-icon);
- }
- :is(#findbar #findInputContainer) #findNextButton::before{
- -webkit-mask-image:var(--findbarButton-next-icon);
- mask-image:var(--findbarButton-next-icon);
- }
- :is(#findbar #findInputContainer) #findInput{
- width:200px;
- padding:5px var(--input-horizontal-padding);
- }
- :is(:is(#findbar #findInputContainer) #findInput)::-moz-placeholder{
- font-style:normal;
- }
- :is(:is(#findbar #findInputContainer) #findInput)::placeholder{
- font-style:normal;
- }
- .loadingInput:has( > [data-status="pending"]:is(:is(#findbar #findInputContainer) #findInput))::after{
- display:inline;
- visibility:visible;
- inset-inline-end:calc(var(--input-horizontal-padding) + 1px);
- }
- [data-status="notFound"]:is(:is(#findbar #findInputContainer) #findInput){
- background-color:rgb(255 102 102);
- }
- #findbar #findbarMessageContainer{
- display:none;
- gap:4px;
- }
- :is(#findbar #findbarMessageContainer):has( > :is(#findResultsCount,#findMsg):not(:empty)){
- display:inline flex;
- }
- :is(#findbar #findbarMessageContainer) #findResultsCount{
- background-color:rgb(217 217 217);
- color:rgb(82 82 82);
- padding-block:4px;
- }
- :is(:is(#findbar #findbarMessageContainer) #findResultsCount):empty{
- display:none;
- }
- [data-status="notFound"]:is(:is(#findbar #findbarMessageContainer) #findMsg){
- font-weight:bold;
- }
- :is(:is(#findbar #findbarMessageContainer) #findMsg):empty{
- display:none;
- }
- #findbar.wrapContainers{
- flex-direction:column;
- align-items:flex-start;
- height:-moz-max-content;
- height:max-content;
- }
- #findbar.wrapContainers .toolbarLabel{
- margin:0 4px;
- }
- #findbar.wrapContainers #findbarMessageContainer{
- flex-wrap:wrap;
- flex-flow:column nowrap;
- align-items:flex-start;
- height:-moz-max-content;
- height:max-content;
- }
- :is(#findbar.wrapContainers #findbarMessageContainer) #findResultsCount{
- height:calc(var(--toolbar-height) - 2 * var(--findbar-padding));
- }
- :is(#findbar.wrapContainers #findbarMessageContainer) #findMsg{
- min-height:var(--toolbar-height);
- }
- @page{
- margin:0;
- }
- #printContainer{
- display:none;
- }
- @media print{
- body{
- background:rgb(0 0 0 / 0) none;
- }
- body[data-pdfjsprinting] #outerContainer{
- display:none;
- }
- body[data-pdfjsprinting] #printContainer{
- display:block;
- }
- #printContainer{
- height:100%;
- }
- #printContainer > .printedPage{
- page-break-after:always;
- page-break-inside:avoid;
- height:100%;
- width:100%;
- display:flex;
- flex-direction:column;
- justify-content:center;
- align-items:center;
- }
- #printContainer > .xfaPrintedPage .xfaPage{
- position:absolute;
- }
- #printContainer > .xfaPrintedPage{
- page-break-after:always;
- page-break-inside:avoid;
- width:100%;
- height:100%;
- position:relative;
- }
- #printContainer > .printedPage :is(canvas, img){
- max-width:100%;
- max-height:100%;
- direction:ltr;
- display:block;
- }
- }
- .visibleMediumView{
- display:none !important;
- }
- .toolbarLabel{
- width:-moz-max-content;
- width:max-content;
- min-width:16px;
- height:100%;
- padding-inline:4px;
- margin:2px;
- border-radius:2px;
- color:var(--main-color);
- font-size:12px;
- line-height:14px;
- text-align:left;
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- cursor:default;
- box-sizing:border-box;
- display:inline flex;
- flex-direction:column;
- align-items:center;
- justify-content:center;
- }
- .toolbarLabel > label{
- width:100%;
- }
- .toolbarHorizontalGroup{
- height:100%;
- display:inline flex;
- flex-direction:row;
- align-items:center;
- justify-content:space-between;
- gap:1px;
- box-sizing:border-box;
- }
- .dropdownToolbarButton{
- display:inline flex;
- flex-direction:row;
- align-items:center;
- justify-content:center;
- position:relative;
- width:-moz-fit-content;
- width:fit-content;
- min-width:140px;
- padding:0;
- background-color:var(--dropdown-btn-bg-color);
- border:var(--dropdown-btn-border);
- border-radius:2px;
- color:var(--main-color);
- font-size:12px;
- line-height:14px;
- -webkit-user-select:none;
- -moz-user-select:none;
- user-select:none;
- cursor:default;
- box-sizing:border-box;
- outline:none;
- }
- .dropdownToolbarButton:hover{
- background-color:var(--button-hover-color);
- }
- .dropdownToolbarButton > select{
- -webkit-appearance:none;
- -moz-appearance:none;
- appearance:none;
- width:inherit;
- min-width:inherit;
- height:28px;
- font:message-box;
- font-size:12px;
- color:var(--main-color);
- margin:0;
- padding-block:1px 2px;
- padding-inline:6px 38px;
- border:none;
- outline:none;
- background-color:var(--dropdown-btn-bg-color);
- }
- :is(.dropdownToolbarButton > select) > option{
- background:var(--doorhanger-bg-color);
- color:var(--main-color);
- }
- :is(.dropdownToolbarButton > select):is(:hover,:focus-visible){
- background-color:var(--button-hover-color);
- color:var(--toggled-btn-color);
- }
- .dropdownToolbarButton::after{
- position:absolute;
- display:inline;
- width:var(--icon-size);
- height:var(--icon-size);
- content:"";
- background-color:var(--toolbar-icon-bg-color);
- -webkit-mask-size:cover;
- mask-size:cover;
- inset-inline-end:4px;
- pointer-events:none;
- -webkit-mask-image:var(--toolbarButton-menuArrow-icon);
- mask-image:var(--toolbarButton-menuArrow-icon);
- }
- .dropdownToolbarButton:is(:hover,:focus-visible,:active)::after{
- background-color:var(--toolbar-icon-hover-bg-color);
- }
- #toolbarContainer{
- --menuitem-height:calc(var(--toolbar-height) - 6px);
- width:100%;
- height:var(--toolbar-height);
- padding:var(--toolbar-vertical-padding) var(--toolbar-horizontal-padding);
- position:relative;
- box-sizing:border-box;
- font:message-box;
- background-color:var(--toolbar-bg-color);
- box-shadow:var(--toolbar-box-shadow);
- border-bottom:var(--toolbar-border-bottom);
- }
- #toolbarContainer #toolbarViewer{
- width:100%;
- height:100%;
- justify-content:space-between;
- }
- :is(#toolbarContainer #toolbarViewer) > *{
- flex:none;
- }
- :is(#toolbarContainer #toolbarViewer) input{
- font:message-box;
- }
- :is(#toolbarContainer #toolbarViewer) .toolbarButtonSpacer{
- width:30px;
- display:block;
- height:1px;
- }
- :is(#toolbarContainer #toolbarViewer) #toolbarViewerLeft #numPages.toolbarLabel{
- padding-inline-start:3px;
- flex:none;
- }
- #toolbarContainer #loadingBar{
- --progressBar-percent:0%;
- --progressBar-end-offset:0;
- position:absolute;
- top:var(--toolbar-height);
- inset-inline:0 var(--progressBar-end-offset);
- height:4px;
- background-color:var(--progressBar-bg-color);
- border-bottom:1px solid var(--toolbar-border-color);
- transition-property:inset-inline-start;
- transition-duration:var(--sidebar-transition-duration);
- transition-timing-function:var(--sidebar-transition-timing-function);
- }
- :is(#toolbarContainer #loadingBar) .progress{
- position:absolute;
- top:0;
- inset-inline-start:0;
- width:100%;
- transform:scaleX(var(--progressBar-percent));
- transform-origin:calc(50% - 50% * var(--dir-factor)) 0;
- height:100%;
- background-color:var(--progressBar-color);
- overflow:hidden;
- transition:transform 200ms;
- }
- .indeterminate:is(#toolbarContainer #loadingBar) .progress{
- transform:none;
- background-color:var(--progressBar-bg-color);
- transition:none;
- }
- :is(.indeterminate:is(#toolbarContainer #loadingBar) .progress) .glimmer{
- position:absolute;
- top:0;
- inset-inline-start:0;
- height:100%;
- width:calc(100% + 150px);
- background:repeating-linear-gradient(
- 135deg,
- var(--progressBar-blend-color) 0,
- var(--progressBar-bg-color) 5px,
- var(--progressBar-bg-color) 45px,
- var(--progressBar-color) 55px,
- var(--progressBar-color) 95px,
- var(--progressBar-blend-color) 100px
- );
- animation:progressIndeterminate 1s linear infinite;
- }
- @media all and (max-width: 840px){
- #sidebarContainer{
- background-color:var(--sidebar-narrow-bg-color);
- }
- #outerContainer.sidebarOpen #viewerContainer{
- inset-inline-start:0 !important;
- }
- }
- @media all and (max-width: 750px){
- #outerContainer .hiddenMediumView{
- display:none !important;
- }
- #outerContainer .visibleMediumView:not(.hidden, [hidden]){
- display:inline-block !important;
- }
- }
- @media all and (max-width: 690px){
- .hiddenSmallView,
- .hiddenSmallView *{
- display:none !important;
- }
- #toolbarContainer #toolbarViewer .toolbarButtonSpacer{
- width:0;
- }
- }
- @media all and (max-width: 560px){
- #scaleSelectContainer{
- display:none;
- }
- }
|