1import{r as g,a as h,c as o,b as p,L as u,x as s,e as v}from"./main-DdEGjCiE.js";import{e as l}from"./query-D1pSaKds.js";import{L as b}from"./backdrop.component-BY7qhLG6.js";import{i as f}from"./is-mobile-D5iCr1X9.js";import{a as x}from"./light-dom-styles-BIHJ4wFY.js";const w=`@charset "UTF-8"; 2/*------------------------------------*\\ 3 #RESET 4\\*------------------------------------*/ 5/** 6 * Border-Box http:/paulirish.com/2012/box-sizing-border-box-ftw/ 7 */ 8*, 9::slotted(*), 10*:before, 11*:after { 12 box-sizing: border-box; 13} 14 15:host *, 16:host *::before, 17:host *::after { 18 box-sizing: inherit; 19} 20 21[hidden] { 22 display: none !important; 23} 24 25/* ------------------------------------*\\ 26 #TYPOGRAPHY PLACEHOLDERS 27\\*------------------------------------ */ 28.leaf-container-full-width, .iw_columns.large-fullwidth { 29 left: 50%; 30 margin-left: -50dvw; 31 margin-right: -50dvw; 32 position: relative; 33 right: 50%; 34 width: 100dvw; 35} 36 37.leaf-grid-container { 38 box-sizing: border-box; 39 margin-left: auto; 40 margin-right: auto; 41 padding-left: 1rem; 42 padding-right: 1rem; 43 width: 100%; 44} 45@media (min-width: 35rem) { 46 .leaf-grid-container { 47 max-width: 540px; 48 } 49} 50@media (min-width: 48rem) { 51 .leaf-grid-container { 52 max-width: 720px; 53 } 54} 55@media (min-width: 60rem) { 56 .leaf-grid-container { 57 max-width: 960px; 58 } 59} 60@media (min-width: 75rem) { 61 .leaf-grid-container { 62 max-width: 1140px; 63 } 64} 65@media (min-width: 87.5rem) { 66 .leaf-grid-container { 67 max-width: 1320px; 68 } 69} 70 71.leaf-container-12, .leaf-container-4-1-7, .leaf-container-5-1-6, .leaf-container-7-1-4, .leaf-container-5-7, .leaf-container-7-5, .leaf-container-6-6, .leaf-container-6-1-5, .leaf-container-8-1-3, .leaf-container-4-4-4, .leaf-container-2-8-2, .leaf-container-3-2-2-2-3, .leaf-container-3-2-4-3, .leaf-container-3-3-3-3, .leaf-container-1-10-1, .leaf-container-3-6-3, .leaf-container-8-4, .leaf-container-4-8, .leaf-container-9-3, .leaf-container-3-9 { 72 display: grid; 73} 74 75/* 76 Hiding class, making content visible only to screen readers but not visually ("sr" meaning "screen-reader") 77 Is the hidden content read by a screen reader? - Yes 78 Will the hidden element affect the document layout? - No 79 Will the hidden elementâs box model be rendered? - No 80 Does the element detect clicks or focus? - Yes 81 https://css-tricks.com/comparing-various-ways-to-hide-things-in-css/#method-5-the-visually-hidden-class 82*/ 83.leaf-container-12 { 84 grid-template-columns: minmax(0, 1fr); 85} 86@media (min-width: 48rem) { 87 .leaf-container-4-1-7 { 88 grid-gap: var(--leaf-spacing-24); 89 grid-template-columns: minmax(0, calc(8.3333333333% * 4 - 16px)) minmax(0, calc(8.3333333333% * 1 - 16px)) minmax(0, calc(8.3333333333% * 7 - 16px)); 90 } 91} 92@media (min-width: 48rem) { 93 .leaf-container-5-1-6 { 94 grid-gap: var(--leaf-spacing-24); 95 grid-template-columns: minmax(0, calc(8.3333333333% * 5 - 16px)) minmax(0, calc(8.3333333333% * 1 - 16px)) minmax(0, calc(8.3333333333% * 6 - 16px)); 96 } 97} 98@media (min-width: 48rem) { 99 .leaf-container-7-1-4 { 100 grid-gap: var(--leaf-spacing-24); 101 grid-template-columns: minmax(0, calc(8.3333333333% * 7 - 16px)) minmax(0, calc(8.3333333333% * 1 - 16px)) minmax(0, calc(8.3333333333% * 4 - 16px)); 102 } 103} 104@media (min-width: 48rem) { 105 .leaf-container-5-7 { 106 grid-gap: var(--leaf-spacing-24); 107 grid-template-columns: minmax(0, calc(8.3333333333% * 5 - 12px)) minmax(0, calc(8.3333333333% * 7 - 12px)); 108 } 109} 110@media (min-width: 48rem) { 111 .leaf-container-7-5 { 112 grid-gap: var(--leaf-spacing-24); 113 grid-template-columns: minmax(0, calc(8.3333333333% * 7 - 12px)) minmax(0, calc(8.3333333333% * 5 - 12px)); 114 } 115} 116@media (min-width: 48rem) { 117 .leaf-container-6-6 { 118 grid-gap: var(--leaf-spacing-24); 119 grid-template-columns: minmax(0, calc(8.3333333333% * 6 - 12px)) minmax(0, calc(8.3333333333% * 6 - 12px)); 120 } 121} 122@media (min-width: 48rem) { 123 .leaf-container-6-1-5 { 124 grid-gap: var(--leaf-spacing-24); 125 grid-template-columns: minmax(0, calc(8.3333333333% * 6 - 16px)) minmax(0, calc(8.3333333333% * 1 - 16px)) minmax(0, calc(8.3333333333% * 5 - 16px)); 126 } 127} 128@media (min-width: 48rem) { 129 .leaf-container-8-1-3 { 130 grid-gap: var(--leaf-spacing-24); 131 grid-template-columns: minmax(0, calc(8.3333333333% * 8 - 16px)) minmax(0, calc(8.3333333333% * 1 - 16px)) minmax(0, calc(8.3333333333% * 3 - 16px)); 132 } 133} 134@media (min-width: 48rem) { 135 .leaf-container-4-4-4 { 136 grid-gap: var(--leaf-spacing-24); 137 grid-template-columns: minmax(0, calc(8.3333333333% * 4 - 16px)) minmax(0, calc(8.3333333333% * 4 - 16px)) minmax(0, calc(8.3333333333% * 4 - 16px)); 138 } 139} 140@media (min-width: 48rem) {
141 .leaf-container-2-8-2 { 142 grid-gap: var(--leaf-spacing-24); 143 grid-template-columns: minmax(0, calc(8.3333333333% * 2 - 16px)) minmax(0, calc(8.3333333333% * 8 - 16px)) minmax(0, calc(8.3333333333% * 2 - 16px)); 144 } 145} 146@media (min-width: 48rem) { 147 .leaf-container-3-2-2-2-3 { 148 grid-gap: var(--leaf-spacing-24); 149 grid-template-columns: minmax(0, calc(8.3333333333% * 3 - 19.2px)) minmax(0, calc(8.3333333333% * 2 - 19.2px)) minmax(0, calc(8.3333333333% * 2 - 19.2px)) minmax(0, calc(8.3333333333% * 2 - 19.2px)) minmax(0, calc(8.3333333333% * 3 - 19.2px)); 150 } 151} 152@media (min-width: 48rem) { 153 .leaf-container-3-2-4-3 { 154 grid-gap: var(--leaf-spacing-24); 155 grid-template-columns: minmax(0, calc(8.3333333333% * 3 - 18px)) minmax(0, calc(8.3333333333% * 2 - 18px)) minmax(0, calc(8.3333333333% * 4 - 18px)) minmax(0, calc(8.3333333333% * 3 - 18px)); 156 } 157} 158@media (min-width: 48rem) { 159 .leaf-container-3-3-3-3 { 160 grid-gap: var(--leaf-spacing-24); 161 grid-template-columns: minmax(0, calc(8.3333333333% * 3 - 18px)) minmax(0, calc(8.3333333333% * 3 - 18px)) minmax(0, calc(8.3333333333% * 3 - 18px)) minmax(0, calc(8.3333333333% * 3 - 18px)); 162 } 163} 164@media (min-width: 48rem) { 165 .leaf-container-1-10-1 { 166 grid-gap: var(--leaf-spacing-24); 167 grid-template-columns: minmax(0, calc(8.3333333333% * 1 - 16px)) minmax(0, calc(8.3333333333% * 10 - 16px)) minmax(0, calc(8.3333333333% * 1 - 16px)); 168 } 169} 170@media (min-width: 48rem) { 171 .leaf-container-3-6-3 { 172 grid-gap: var(--leaf-spacing-24); 173 grid-template-columns: minmax(0, calc(8.3333333333% * 3 - 16px)) minmax(0, calc(8.3333333333% * 6 - 16px)) minmax(0, calc(8.3333333333% * 3 - 16px)); 174 } 175} 176@media (min-width: 48rem) { 177 .leaf-container-8-4 { 178 grid-gap: var(--leaf-spacing-24); 179 grid-template-columns: minmax(0, calc(8.3333333333% * 8 - 12px)) minmax(0, calc(8.3333333333% * 4 - 12px)); 180 } 181} 182@media (min-width: 48rem) { 183 .leaf-container-4-8 { 184 grid-gap: var(--leaf-spacing-24); 185 grid-template-columns: minmax(0, calc(8.3333333333% * 4 - 12px)) minmax(0, calc(8.3333333333% * 8 - 12px)); 186 } 187} 188@media (min-width: 48rem) { 189 .leaf-container-9-3 { 190 grid-gap: var(--leaf-spacing-24); 191 grid-template-columns: minmax(0, calc(8.3333333333% * 9 - 12px)) minmax(0, calc(8.3333333333% * 3 - 12px)); 192 } 193} 194@media (min-width: 48rem) { 195 .leaf-container-3-9 { 196 grid-gap: var(--leaf-spacing-24); 197 grid-template-columns: minmax(0, calc(8.3333333333% * 3 - 12px)) minmax(0, calc(8.3333333333% * 9 - 12px)); 198 } 199} 200@media (max-width: 47.999rem) { 201 .leaf-container-7-1-4, .leaf-container-4-1-7, .leaf-container-5-7, .leaf-container-7-5, .leaf-container-6-6 { 202 grid-template-areas: "row-1" "row-2"; 203 } 204 .leaf-container-7-1-4.container-inverted, .leaf-container-4-1-7.container-inverted, .leaf-container-5-7.container-inverted, .leaf-container-7-5.container-inverted, .leaf-container-6-6.container-inverted { 205 /* stylelint-disable-next-line max-nesting-depth */ 206 } 207 .leaf-container-7-1-4.container-inverted > :nth-child(1), .leaf-container-4-1-7.container-inverted > :nth-child(1), .leaf-container-5-7.container-inverted > :nth-child(1), .leaf-container-7-5.container-inverted > :nth-child(1), .leaf-container-6-6.container-inverted > :nth-child(1) { 208 grid-area: row-2; 209 } 210} 211.iw_row { 212 display: grid; 213} 214@media (min-width: 48rem) { 215 .iw_row { 216 gap: var(--leaf-spacing-24); 217 grid-template-columns: repeat(12, 1fr); 218 } 219} 220 221.iw_columns { 222 display: grid; 223} 224.iw_columns.large-fullwidth { 225 grid-column: span 12; 226} 227@media (min-width: 48rem) { 228 .iw_columns.large-1 { 229 grid-column: span 1; 230 } 231 .iw_columns.large-2 { 232 grid-column: span 2; 233 } 234 .iw_columns.large-3 { 235 grid-column: span 3; 236 } 237 .iw_columns.large-4 { 238 grid-column: span 4; 239 } 240 .iw_columns.large-5 { 241 grid-column: span 5; 242 } 243 .iw_columns.large-6 { 244 grid-column: span 6; 245 } 246 .iw_columns.large-7 { 247 grid-column: span 7; 248 } 249 .iw_columns.large-8 { 250 grid-column: span 8; 251 } 252 .iw_columns.large-9 { 253 grid-column: span 9; 254 } 255 .iw_columns.large-10 { 256 grid-column: span 10; 257 } 258 .iw_columns.large-11 { 259 grid-column: span 11; 260 } 261 .iw_columns.large-12 { 262 grid-column: span 12; 263 } 264} 265 266leaf-accordion, 267leaf-alert, 268leaf-card, 269leaf-list, 270leaf-multimedia-limelight, 271leaf-tab, 272.leaf-c-content-block, 273.leaf-c-picture-image { 274 display: block; 275 margin-top: var(--leaf-spacing-32); 276} 277@media (min-width: 48rem) { 278 leaf-accordion, 279 leaf-alert, 280 leaf-card, 281 leaf-list, 282 leaf-multimedia-limelight, 283 leaf-tab, 284 .leaf-c-content-block, 285 .leaf-c-picture-image { 286 margin-top: var(--leaf-spacing-48); 287 } 288} 289@media (min-width: 60rem) { 290 leaf-accordion, 291 leaf-alert, 292 leaf-card, 293 leaf-list, 294 leaf-multimedia-limelight, 295 leaf-tab, 296 .leaf-c-content-block, 297 .leaf-c-picture-image { 298 margin-top: var(--leaf-spacing-64); 299 } 300} 301 302:host { 303 --leafdcws-header-dropdown-border-color: var(--leaf-base-color-navy-10); 304 --leafdcws-header-wrapper-mobile-height: 88px; 305 --leafdcws-header-logo-desktop-height: 60px; 306 --leafdcws-header-logo-mobile-height: 44px; 307 --leafdcws-header-logo-desktop-width: 152.45px; 308 --leafdcws-header-logo-mobile-width: 111.8px; 309} 310 311.leaf-c-tcg-header { 312 left: 0; 313 position: fixed; 314 right: 0; 315 top: 0; 316 z-index: var(--leafdcws-z-index-1030); 317} 318@media (max-width: 59.999rem) { 319 .leaf-c-tcg-header { 320 height: var(--leafdcws-header-wrapper-mobile-height); 321 overflow: scroll; 322 } 323} 324.leaf-c-tcg-header ::slotted([slot*=top-nav]) { 325 margin: 0; 326} 327@media (max-width: 59.999rem) { 328 .leaf-c-tcg-header ::slotted([slot=main-nav-mobile-links][class=language-toggle-link]) { 329 border-top: var(--leaf-border-width-default) solid var(--leaf-color-border-default); 330 margin-top: var(--leaf-spacing-12); 331 } 332} 333.leaf-c-tcg-header ::slotted([slot=main-nav-links]) { 334 margin: 0; 335} 336@media (min-width: 60rem) { 337 .leaf-c-tcg-header ::slotted([slot=main-nav-links]) { 338 display: flex; 339 min-height: calc(var(--leaf-spacing-80) + var(--leaf-spacing-4)); 340 } 341} 342 343/* 344======= 345Mobile Nav 346======= 347*/ 348.leaf-c-tcg-header__mobile-menu-button { 349 align-self: center; 350 background: transparent; 351 border: none; 352 display: block; 353 height: calc(var(--leaf-spacing-40) + var(--leaf-spacing-4)); 354 padding: calc(var(--leaf-spacing-8) + var(--leaf-spacing-2)); 355} 356.leaf-c-tcg-header__mobile-menu-button:focus { 357 background-color: var(--leaf-color-header-menu-content-default); 358 border-radius: var(--leaf-border-radius-round); 359 outline: none; 360} 361.leaf-c-tcg-header__mobile-menu-button:focus leaf-icon { 362 color: var(--leaf-color-header-bg-default); 363} 364@media (min-width: 60rem) { 365 .leaf-c-tcg-header__mobile-menu-button { 366 display: none; 367 } 368} 369 370.leaf-c-tcg-header__mobile-menu-button leaf-icon { 371 color: var(--leaf-color-header-menu-content-default); 372} 373 374.leaf-c-tcg-header__main-nav-mobile-list { 375 background: var(--leaf-color-header-bg-secondary); 376 list-style: none; 377 margin: 0; 378 padding: var(--leaf-spacing-24); 379} 380@media (min-width: 60rem) { 381 .leaf-c-tcg-header__main-nav-mobile-list { 382 display: none; 383 } 384} 385 386/* 387======= 388Top Nav 389======= 390*/ 391.leaf-c-tcg-header__top-nav { 392 background-color: var(--leaf-color-header-bg-secondary); 393 display: none; 394 height: var(--leaf-spacing-32); 395 padding-bottom: var(--leaf-spacing-4); 396 padding-top: var(--leaf-spacing-4); 397 position: relative; 398} 399@media (min-width: 60rem) { 400 .leaf-c-tcg-header__top-nav { 401 display: block; 402 } 403} 404 405.leaf-c-tcg-header__top-nav-container { 406 align-items: center; 407 display: flex; 408 flex-wrap: inherit; 409 justify-content: flex-end; 410} 411 412.leaf-c-tcg-header__top-nav-pipe { 413 align-self: center; 414 border-right: var(--leaf-border-width-default) solid var(--leaf-color-content-default); 415 height: calc(var(--leaf-spacing-16) - var(--leaf-spacing-2)); 416} 417 418/* 419======= 420Main Nav 421======= 422*/ 423.leaf-c-tcg-header__main-nav { 424 align-items: center; 425 background-color: var(--leaf-color-header-bg-default); 426 box-shadow: var(--leaf-shadow-default); 427 display: flex; 428 flex-wrap: nowrap; 429 justify-content: flex-start; 430 padding: 0; 431 position: relative; 432} 433 434.leaf-c-tcg-header__main-nav-container { 435 display: block; 436 padding-right: 0; 437 width: 100%; 438} 439@media (max-width: 59.999rem) { 440 .leaf-c-tcg-header__main-nav-container { 441 max-width: 100%; 442 padding: 0; 443 } 444} 445@media (min-width: 60rem) { 446 .leaf-c-tcg-header__main-nav-container {
447 align-items: center; 448 display: flex; 449 justify-content: space-between; 450 } 451} 452 453@media (max-width: 59.999rem) { 454 .leaf-c-tcg-header__main-nav-logo-container { 455 display: flex; 456 justify-content: space-between; 457 padding: 0 var(--leaf-spacing-16); 458 max-width: 100%; 459 width: 100%; 460 } 461} 462 463@media (max-width: 59.999rem) { 464 .leaf-c-tcg-header__main-nav-logo { 465 padding: var(--leaf-spacing-16) 0 var(--leaf-spacing-16) 0; 466 } 467} 468 469.leaf-c-tcg-header__main-nav-links-container { 470 display: block; 471} 472@media (max-width: 59.999rem) { 473 .leaf-c-tcg-header__main-nav-links-container { 474 height: 0; 475 overflow: hidden; 476 transition: height var(--leafdcws-anim-fade-quick) var(--leafdcws-anim-ease), visibility var(--leafdcws-anim-fade-quick) var(--leafdcws-anim-ease); 477 visibility: hidden; 478 } 479 .leaf-c-tcg-header__main-nav-links-container.open { 480 visibility: visible; 481 } 482 .leaf-c-tcg-header__main-nav-links-container.close { 483 visibility: hidden; 484 } 485} 486@media (min-width: 60rem) { 487 .leaf-c-tcg-header__main-nav-links-container { 488 align-items: center; 489 display: flex; 490 justify-self: flex-end; 491 } 492} 493 494.leaf-c-tcg-header__main-nav-list, 495.leaf-c-tcg-header__top-nav-list { 496 display: flex; 497 flex-direction: column; 498 list-style: none; 499 padding: 0 var(--leaf-spacing-24) var(--leaf-spacing-24); 500 margin: 0; 501} 502@media (min-width: 60rem) { 503 .leaf-c-tcg-header__main-nav-list, 504 .leaf-c-tcg-header__top-nav-list { 505 flex-direction: row; 506 padding: 0; 507 } 508} 509 510@media (min-width: 60rem) { 511 .leaf-c-tcg-header__main-nav-list { 512 gap: var(--leaf-spacing-16); 513 } 514} 515 516.leaf-c-tcg-header__top-nav-list { 517 gap: var(--leaf-spacing-24); 518}`,y=`tcg-header [slot=main-nav-logo] leaf-icon { 519 --icon-height: var(--leafdcws-header-logo-mobile-height); 520 max-height: var(--leafdcws-header-logo-mobile-height); 521 max-width: var(--leafdcws-header-logo-mobile-width); 522 width: auto; 523} 524@media (min-width: 60rem) { 525 tcg-header [slot=main-nav-logo] leaf-icon { 526 --icon-height: var(--leafdcws-header-logo-desktop-height); 527 max-width: var(--leafdcws-header-logo-desktop-width); 528 max-height: var(--leafdcws-header-logo-desktop-height); 529 } 530} 531tcg-header [slot=main-nav-logo]:focus { 532 background-color: unset; 533 border: 0; 534 outline: var(--leaf-border-width-focus) solid var(--leaf-color-border-brand); 535 outline-offset: var(--leaf-border-width-focus); 536} 537tcg-header a { 538 border-bottom: 0; 539} 540tcg-header [slot*=top-nav] a { 541 font-family: var(--leaf-typography-body-small-font-family); 542 font-size: var(--leaf-typography-body-small-font-size); 543 font-weight: var(--leaf-typography-body-small-font-weight); 544 line-height: var(--leaf-typography-body-small-line-height); 545 -webkit-text-decoration: var(--leaf-typography-body-small-text-decoration); 546 text-decoration: var(--leaf-typography-body-small-text-decoration); 547 text-transform: var(--leaf-typography-body-small-text-transform); 548 border: var(--leaf-border-width-default) solid transparent; 549 color: var(--leaf-color-content-default); 550 padding: 0; 551} 552tcg-header [slot*=top-nav] a:hover { 553 text-decoration: underline; 554} 555tcg-header [slot*=top-nav] a:focus { 556 background: var(--leaf-color-content-default); 557 color: var(--leaf-color-header-bg-default); 558 outline: none; 559 text-decoration: none; 560 width: -moz-fit-content; 561 width: fit-content; 562} 563tcg-header [slot=main-nav-links] > a { 564 align-items: center; 565 color: var(--leaf-color-header-menu-content-default); 566 display: flex; 567 font-weight: var(--leafdcws-font-weight-semibold); 568 height: 100%; 569 margin-inline: 0; 570 padding: 0; 571 text-decoration: none; 572} 573tcg-header [slot=main-nav-links] > a:focus { 574 background: var(--leaf-color-header-menu-content-default); 575 color: var(--leaf-color-header-bg-default); 576 outline: none; 577 width: -moz-fit-content; 578 width: fit-content; 579} 580tcg-header [slot=main-nav-links] > a:active { 581 background: var(--leaf-color-header-submenu-bg-pressed); 582 color: var(--leaf-color-header-menu-content-default); 583 text-decoration: none; 584} 585tcg-header [slot=main-nav-links] > a.leaf-u-link--external::after { 586 padding: calc(var(--leaf-spacing-8) - var(--leaf-spacing-2)); 587} 588@media (min-width: 60rem) { 589 tcg-header [slot=main-nav-links] > a { 590 border-bottom: var(--leaf-border-width-button-default) solid transparent; 591 margin-top: 0; 592 padding: var(--leaf-spacing-12) var(--leaf-spacing-16); 593 } 594 tcg-header [slot=main-nav-links] > a:hover { 595 background: var(--leaf-color-header-submenu-bg-hover); 596 border-bottom: var(--leaf-border-width-button-default) solid var(--leaf-color-header-menu-content-default); 597 } 598 tcg-header [slot=main-nav-links] > a:focus { 599 background: var(--leaf-color-header-menu-content-default); 600 color: var(--leaf-color-header-bg-default); 601 outline: none; 602 width: -moz-fit-content; 603 width: fit-content; 604 } 605 tcg-header [slot=main-nav-links] > a:active { 606 background: var(--leaf-color-header-submenu-bg-pressed); 607 border-bottom: var(--leaf-border-width-button-default) solid var(--leaf-color-header-menu-content-default); 608 color: var(--leaf-color-header-menu-content-default); 609 text-decoration: none; 610 } 611} 612@media (max-width: 59.999rem) { 613 tcg-header [slot=main-nav-links] leaf-accordion, 614 tcg-header [slot=main-nav-links] a { 615 margin-bottom: var(--leaf-spacing-16); 616 margin-top: var(--leaf-spacing-16); 617 } 618} 619tcg-header [slot=main-nav-mobile-links] { 620 display: flex; 621} 622tcg-header [slot=main-nav-mobile-links] a { 623 font-family: var(--leaf-typography-body-small-font-family); 624 font-size: var(--leaf-typography-body-small-font-size);
625 font-weight: var(--leaf-typography-body-small-font-weight); 626 line-height: var(--leaf-typography-body-small-line-height); 627 -webkit-text-decoration: var(--leaf-typography-body-small-text-decoration); 628 text-decoration: var(--leaf-typography-body-small-text-decoration); 629 text-transform: var(--leaf-typography-body-small-text-transform); 630 color: var(--leaf-color-content-default); 631 display: block; 632 margin: var(--leaf-spacing-12) 0; 633 padding: 0; 634} 635tcg-header [slot=main-nav-mobile-links] a:focus { 636 background: var(--leaf-color-content-default); 637 color: var(--leaf-color-header-bg-default); 638 outline: none; 639 width: -moz-fit-content; 640 width: fit-content; 641} 642tcg-header [slot=main-nav-mobile-links] a:active { 643 text-decoration: underline; 644} 645tcg-header [slot=main-nav-mobile-links][class=language-toggle-link] a { 646 margin-top: var(--leaf-spacing-24); 647} 648tcg-header .tcg-header-mobile-dropdown { 649 color: var(--leaf-color-header-menu-content-default); 650} 651tcg-header .tcg-header-mobile-dropdown ::part(body-inner) { 652 padding: 0; 653} 654tcg-header .tcg-header-mobile-dropdown leaf-accordion-panel-inline a { 655 color: var(--leaf-color-header-menu-content-default); 656} 657tcg-header .tcg-header-mobile-dropdown leaf-accordion-panel-inline ::part(header), 658tcg-header .tcg-header-mobile-dropdown leaf-accordion-panel-inline a { 659 display: block; 660 font-weight: var(--leaf-typography-body-default-font-weight); 661 text-decoration: none; 662} 663tcg-header .tcg-header-mobile-dropdown leaf-accordion-panel-inline ::part(header):focus, 664tcg-header .tcg-header-mobile-dropdown leaf-accordion-panel-inline a:focus { 665 background: var(--leaf-color-header-menu-content-pressed); 666 color: var(--leaf-color-header-bg-default); 667 outline: none; 668 width: -moz-fit-content; 669 width: fit-content; 670} 671@media (max-width: 47.999rem) { 672 tcg-header .tcg-header-mobile-dropdown leaf-accordion-panel-inline ::part(header):focus, 673 tcg-header .tcg-header-mobile-dropdown leaf-accordion-panel-inline a:focus { 674 background: var(--leaf-color-bg-opacity-transparent); 675 color: var(--leaf-color-header-menu-content-default); 676 } 677} 678tcg-header .tcg-header-mobile-dropdown ::part(button) { 679 color: var(--leaf-color-header-menu-content-default); 680 font-family: var(--leaf-typography-body-default-font-family); 681} 682tcg-header .tcg-header-mobile-dropdown ::part(button):focus { 683 background: var(--leaf-color-header-menu-content-pressed); 684 color: var(--leaf-color-header-bg-default); 685 outline: none; 686 width: -moz-fit-content; 687 width: fit-content; 688} 689@media (max-width: 47.999rem) { 690 tcg-header .tcg-header-mobile-dropdown ::part(button):focus { 691 background: var(--leaf-color-bg-opacity-transparent); 692 color: var(--leaf-color-header-menu-content-default); 693 } 694} 695tcg-header .tcg-header-mobile-dropdown ul { 696 list-style: none; 697} 698@media (min-width: 60rem) { 699 tcg-header .tcg-header-mobile-dropdown { 700 display: none; 701 } 702} 703tcg-header .tcg-header-desktop-dropdown { 704 display: none; 705} 706@media (min-width: 60rem) { 707 tcg-header .tcg-header-desktop-dropdown { 708 display: flex; 709 } 710}`;var _=Object.defineProperty,a=(r,n,i,k)=>{for(var t=void 0,c=r.length-1,m;c>=0;c--)(m=r[c])&&(t=m(n,i,t)||t);return t&&_(n,i,t),t};const d=class extends p(u){constructor(){super(),this.windowBackdrop=!1,this.animationSpeed=350,this.animationDelay=50,x("tcg-header-styles",y)}get topNavLeftLinks(){return this.querySelectorAll('[slot="top-nav-left-links"]')}get topNavRightLinks(){return this.querySelectorAll('[slot="top-nav-right-links"]')}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",()=>{this.closeMobileMenu(void 0,!1),setTimeout(()=>this.height=f("lg")?"0":"auto",50),this.requestUpdate()}),this.addEventListener("keydown",n=>{n.key==="Escape"&&(n.preventDefault(),this.closeMobileMenu())}),this.querySelectorAll("tcg-header-dropdown").forEach(n=>n.addEventListener("focusout",i=>{n.contains(i.relatedTarget)||n.resetDropdownMenu()}))}async updated(){await this.updateComplete,setTimeout(()=>{const n=f("lg")?76:this.mainHeader.clientHeight;this.headerOverlay.style.paddingTop=n+"px"},this.animationSpeed)}openMobileMenu(){this.mainHeader.style.height="100%",this.height=this.mobileMenu.scrollHeight+"px",this.mobileMenu.classList.add("open"),this.mobileMenu.classList.remove("close"),this.windowBackdrop=!0,this.mobileMenuButton.setAttribute("aria-expanded","true"),this.openMenuIcon.setAttribute("hidden","true"),this.closeMenuIcon.removeAttribute("hidden"),setTimeout(()=>{this.height="auto"},this.animationSpeed)}closeMobileMenu(n,i=!0){this.mobileMenu.classList.contains("open")&&(this.height=this.mobileMenu.scrollHeight+"px",setTimeout(()=>{this.mobileMenu.classList.add("close"),this.height="0",this.mobileMenu.classList.remove("open"),this.windowBackdrop=!1,this.mobileMenuButton.setAttribute("aria-expanded","fal
710se"),this.closeMenuIcon.setAttribute("hidden","true"),this.openMenuIcon.removeAttribute("hidden"),i&&this.mobileMenuButton.focus()},this.animationDelay),setTimeout(()=>{this.mainHeader.style.height=""},this.animationSpeed+this.animationDelay))}toggleMobileMenu(){this.mobileMenuButton.getAttribute("aria-expanded")==="true"?this.closeMobileMenu():this.openMobileMenu()}render(){return s` <div class="leaf-c-tcg-header__overlay"></div> 711 <header class=${v({"leaf-c-tcg-header":!0})}> 712 <slot name="skip-links"></slot> 713 714 <nav class="leaf-c-tcg-header__top-nav" aria-label="utility"> 715 <div class="leaf-c-tcg-header__top-nav-container leaf-grid-container"> 716 <ul class="leaf-c-tcg-header__top-nav-list"> 717 <slot name="top-nav-left-links"></slot> 718 ${this.topNavLeftLinks.length&&this.topNavRightLinks.length?s`<li class="leaf-c-tcg-header__top-nav-pipe"></li>`:""} 719 <slot name="top-nav-right-links"></slot> 720 </ul> 721 </div> 722 </nav> 723 724 <nav class="leaf-c-tcg-header__main-nav" id="main-navigation" aria-label="main"> 725 <div class="leaf-c-tcg-header__main-nav-container leaf-grid-container"> 726 <div class="leaf-c-tcg-header__main-nav-logo-container"> 727 <div class="leaf-c-tcg-header__main-nav-logo"> 728 <slot name="main-nav-logo"></slot> 729 </div> 730 <button 731 class="leaf-c-tcg-header__mobile-menu-button" 732 aria-controls="tcg-header-mobile-menu" 733 aria-expanded="false" 734 aria-label="Menu" 735 @click="${this.toggleMobileMenu}" 736 > 737 <leaf-icon set="system" name="menu" size="large"></leaf-icon> 738 <leaf-icon set="system" name="close" size="large" hidden></leaf-icon> 739 </button> 740 </div> 741 742 <div 743 class="leaf-c-tcg-header__main-nav-links-container" 744 id="tcg-header-mobile-menu" 745 style=${"height: "+this.height} 746 > 747 <ul class="leaf-c-tcg-header__main-nav-list"> 748 <slot name="main-nav-links"></slot> 749 </ul> 750 <ul class="leaf-c-tcg-header__main-nav-mobile-list"> 751 <slot name="main-nav-mobile-links"></slot> 752 </ul> 753 </div> 754 </div> 755 </nav> 756 </header> 757 <leaf-backdrop ?active=${this.windowBackdrop}></leaf-backdrop>`}};d.styles=g(w);d.elementDefinitions={"leaf-backdrop":b,"leaf-icon":h};let e=d;a([o()],e.prototype,"windowBackdrop");a([o()],e.prototype,"height");a([o()],e.prototype,"animationSpeed");a([o()],e.prototype,"animationDelay");a([l("header")],e.prototype,"mainHeader");a([l("#tcg-header-mobile-menu")],e.prototype,"mobileMenu");a([l(".leaf-c-tcg-header__mobile-menu-button")],e.prototype,"mobileMenuButton");a([l('[name="menu"]')],e.prototype,"openMenuIcon");a([l('[name="close"]')],e.prototype,"closeMenuIcon");a([l(".leaf-c-tcg-header__overlay")],e.prototype,"headerOverlay");customElements.define("tcg-header",e);export{e as TCGHeader}; 758//# sourceMappingURL=header-CxLHxO9s.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.