
/* /fairphone_website_sale_configurator/static/src/scss/product_configurator.scss */
 .f_configurator{--bg-input: var(--bg-neutral-default); --content-subtle: var(--content-default-light); --content-placeholder: var(--content-default-lighter); --border-input: var(--border-default-light); --border-divider: var(--border-default-lighter);}:where(.f_configurator, .f_configurator *, .f_configurator *::before, .f_configurator *::after){box-sizing: border-box; margin: 0; padding: 0;}:where(.f_configurator ul){list-style: none;}:where(.f_configurator a){text-decoration: none; color: inherit;}.f_config_section{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--gap-lg);}.f_config_section_heading{font-family: var(--font-familly-body), sans-serif; font-size: var(--fontsize-16); font-weight: var(--font-weight-semi-bold); line-height: 1.16; color: var(--content-default);}.f_config_section_heading_muted{color: var(--content-default-light); font-weight: var(--font-weight-semi-bold);}.f_config_selector_group{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--gap-lg);}.f_config_selector{background: var(--bg-surface); border: 2px solid var(--border-default-lighter); border-radius: var(--border-radius-200); padding: var(--spacing-16); display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--spacing-8); width: 100%; text-align: left; cursor: pointer; font-family: var(--font-familly-body), sans-serif; transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;}.f_config_selector.f_selected{border-color: var(--border-on-selected); background: var(--bg-brand-primary-lighter); box-shadow: 0 1px 2px rgba(139, 139, 139, 0.16);}@media (hover: hover){.f_config_selector:not(.f_selected):hover{border-color: var(--border-default-light);}}.f_config_selector_row{display: -webkit-box; display: -webkit-flex; display: flex; align-items: flex-start; gap: var(--spacing-8); width: 100%;}.f_config_selector_title_group{display: -webkit-inline-box; display: -webkit-inline-flex; display: inline-flex; align-items: center; gap: var(--spacing-8); flex: 1; min-width: 0; -webkit-flex-wrap: wrap; flex-wrap: wrap;}.f_config_selector_name{font-weight: var(--font-weight-semi-bold); font-size: var(--fontsize-16); line-height: 1.16; color: var(--content-brand);}.f_config_selector_price{font-size: var(--fontsize-14); line-height: 1.16; color: var(--content-brand); text-align: right; flex-shrink: 0; margin-left: auto;}.f_config_selector_desc{font-size: var(--fontsize-14); line-height: 1.16; color: var(--content-default-light);}.f_color_swatch{height: 48px; padding: 0 var(--gap-lg); display: -webkit-inline-box; display: -webkit-inline-flex; display: inline-flex; align-items: center; justify-content: center; gap: var(--gap-sm); border-radius: var(--border-radius-xl); border: var(--border-width-xs) solid var(--border-default-lighter); background: var(--bg-surface); opacity: 0.88; cursor: pointer; user-select: none; transition: border-color 0.15s, background-color 0.15s, box-shadow 0.15s, opacity 0.15s, color 0.15s; font-family: var(--font-familly-body), sans-serif; font-size: var(--fontsize-16); font-weight: var(--font-weight-regular); color: var(--content-default-light); line-height: 1.5; letter-spacing: 0; white-space: nowrap; flex-shrink: 0; text-decoration: none;}.f_color_swatch:hover{border-color: var(--border-default-light); color: var(--content-brand); opacity: 0.88;}.f_color_swatch.f_selected{background: rgba(237, 251, 204, 0.2); border: 1px solid var(--content-brand); color: var(--content-brand); opacity: 1; box-shadow: 0px 1px 4px 0px rgba(139, 139, 139, 0.16);}.f_color_swatch.f_pressed, .f_color_swatch:active{background: rgba(237, 251, 204, 0.6); border: 1px solid var(--content-brand); color: var(--content-brand); opacity: 1; box-shadow: 0px 1px 4px 0px rgba(139, 139, 139, 0.16);}.f_color_swatch.f_out_of_stock{opacity: 0.88; cursor: not-allowed;}.f_color_swatch.f_out_of_stock .f_swatch_dot::after{content: ''; position: absolute; top: 50%; left: 50%; width: 16px; height: 1.5px; background: var(--content-default-light); border-radius: 1px; transform: translate(-50%, -50%) rotate(130deg);}.f_swatch_dot{width: 12px; height: 12px; border-radius: 50%; background: var(--swatch-color, #aaaaaa); flex-shrink: 0; position: relative;}.f_color_swatch_grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap-sm);}.f_color_swatch.f_card{height: auto; min-height: 120px; width: auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; padding: var(--gap-lg); gap: var(--gap-sm); border-width: var(--border-width-sm); border-radius: var(--border-radius-xs); white-space: normal; text-align: center;}.f_color_swatch.f_card .f_swatch_dot{width: 32px; height: 32px; border: var(--border-width-xs) solid rgba(0, 0, 0, 0.06);}.f_swatch_name{line-height: 1.5;}.f_choice_card_group{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--gap-sm);}.f_choice_card{background: var(--bg-input); border-radius: var(--border-radius-lg); padding: var(--gap-xl); display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: 14px; cursor: pointer; position: relative; box-shadow: inset 0 0 0 2px transparent; transition: background-color 0.2s ease, box-shadow 0.2s ease;}.f_choice_card.f_minimal{padding: 14px var(--gap-xl); gap: 0;}.f_choice_card.f_static{cursor: default;}.f_choice_card.f_selected{background: var(--bg-brand-primary-lighter); box-shadow: inset 0 0 0 2px var(--border-on-selected);}.f_choice_card:focus-visible{outline: var(--border-width-sm) solid var(--border-on-selected); outline-offset: 2px;}@media (hover: hover){.f_choice_card:not(.f_selected):not(.f_static):hover{background: var(--bg-brand-primary-lighter);}}.f_choice_card_head{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; gap: var(--gap-md); min-height: 24px;}.f_choice_card_head_text{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: 3px; min-width: 0;}.f_choice_card_radio{width: 20px; height: 20px; border-radius: var(--border-radius-full); border: var(--border-width-sm) solid var(--border-default-lighter); background: var(--bg-surface); flex-shrink: 0; display: -webkit-inline-box; display: -webkit-inline-flex; display: inline-flex; align-items: center; justify-content: center; transition: border-color 0.15s ease, background-color 0.15s ease; position: relative;}.f_choice_card_radio::after{content: ""; width: 10px; height: 10px; border-radius: var(--border-radius-full); background: var(--bg-brand-primary); transform: scale(0); transition: transform 0.15s ease;}.f_choice_card.f_selected .f_choice_card_radio{border-color: var(--bg-brand-primary);}.f_choice_card.f_selected .f_choice_card_radio::after{transform: scale(1);}.f_choice_card_title{font-family: var(--font-familly-body), sans-serif; font-weight: var(--font-weight-semi-bold); font-size: var(--fontsize-16); line-height: 1.16; color: var(--content-brand); margin: 0;}.f_choice_card_sub{font-size: var(--fontsize-14); line-height: 1.35; color: var(--content-default-light); max-width: 312px; margin: 0;}.f_choice_card_sub strong{color: var(--content-default); font-weight: var(--font-weight-semi-bold);}.f_choice_card_sub_inline{font-size: var(--fontsize-12); line-height: 1.3; color: var(--content-default-light); margin: 0;}.f_choice_card_body{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--gap-sm);}.f_choice_card_reveal{display: none; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--gap-md);}.f_choice_card.f_selected .f_choice_card_reveal{display: -webkit-box; display: -webkit-flex; display: flex;}.f_choice_card_badge{position: absolute; top: -10px; left: var(--gap-lg); background: var(--bg-selected); color: var(--content-brand); font-size: var(--fontsize-12); font-weight: var(--font-weight-bold); text-transform: uppercase; letter-spacing: 0.04em; padding: 4px 10px; border-radius: var(--border-radius-full); display: none; z-index: 1;}.f_choice_card.f_recommended{box-shadow: inset 0 0 0 2px var(--border-on-selected);}.f_choice_card.f_recommended .f_choice_card_badge{display: inline-block;}.f_choice_card.f_recommended.f_selected .f_choice_card_badge{display: none;}@keyframes f_choice_card_shake{0%, 100%{transform: translateX(0);}20%{transform: translateX(-8px);}40%{transform: translateX(8px);}60%{transform: translateX(-5px);}80%{transform: translateX(5px);}}.f_choice_card_group.f_shaking{animation: f_choice_card_shake 420ms ease-in-out;}@media (min-width: 992px){.f_choice_card_group{gap: var(--gap-lg);}}.f_product_gallery{background: transparent; border-radius: var(--border-radius-lg); padding: 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--gap-md);}.f_gallery_hero{border-radius: var(--border-radius-xl); overflow: hidden; display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; justify-content: center; aspect-ratio: 928 / 560; background: transparent;}.f_gallery_hero img{width: 100%; height: 100%; object-fit: contain; display: block; -webkit-user-drag: none; user-select: none; pointer-events: none;}.f_gallery_dots{display: -webkit-box; display: -webkit-flex; display: flex; gap: var(--gap-sm); align-items: center; justify-content: center; padding: 8px 0 4px 0;}.f_gallery_dots span{width: 4px; height: 4px; border-radius: var(--border-radius-full); background: var(--border-default-lighter); cursor: pointer; transition: width 0.15s ease, height 0.15s ease, background 0.15s ease; flex-shrink: 0;}.f_gallery_dots span.f_active{width: 8px; height: 8px; background: var(--content-default);}.f_gallery_thumbs_row{display: none; align-items: center; justify-content: center; gap: var(--gap-md); width: 100%; max-width: 100%; padding: 4px var(--gap-md) 0 var(--gap-md);}.f_gallery_thumb_arrow{width: 40px; height: 40px; background: transparent; border: none; color: var(--content-default); cursor: pointer; display: -webkit-inline-box; display: -webkit-inline-flex; display: inline-flex; align-items: center; justify-content: center; transition: background-color 0.15s ease;}.f_gallery_thumb_arrow .f_icon{width: 24px; height: 24px; min-width: 24px; min-height: 24px;}.f_gallery_thumb_arrow:hover{background: var(--bg-brand-primary-lighter); border-radius: var(--border-radius-full);}.f_gallery_thumb_arrow:focus-visible{outline: var(--border-width-sm) solid var(--border-on-selected); outline-offset: 2px;}.f_gallery_thumbs{display: -webkit-box; display: -webkit-flex; display: flex; gap: var(--border-radius-100); align-items: center; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; flex: 0 1 auto; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: none; -ms-overflow-style: none;}.f_gallery_thumbs::-webkit-scrollbar{display: none;}.f_gallery_thumb{width: 48px; height: 48px; border: var(--border-width-xs) solid var(--border-default-lighter); border-radius: var(--border-radius-sm); background: var(--bg-surface); overflow: hidden; cursor: pointer; padding: 0; -webkit-box-flex: 0; -webkit-flex: 0 0 auto; flex: 0 0 auto; opacity: 0.6; transition: opacity 0.15s ease, border-color 0.15s ease;}.f_gallery_thumb img{width: 100%; height: 100%; object-fit: cover; display: block;}.f_gallery_thumb.f_active{opacity: 1; border-color: var(--content-default);}.f_gallery_thumb:not(.f_active):hover{opacity: 0.9; border-color: var(--border-on-selected);}.f_gallery_thumb:focus-visible{outline: var(--border-width-sm) solid var(--border-on-selected); outline-offset: 2px;}@media (max-width: 991px){.f_gallery_hero{touch-action: pan-y;}}@media (min-width: 992px){.f_product_gallery{background: var(--bg-input); height: 676px; align-self: flex-start; padding: 28px 0 16px 0; justify-content: space-between;}.f_gallery_hero{aspect-ratio: auto; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; flex: 1 1 auto; min-height: 0; height: auto;}.f_gallery_dots{display: none;}.f_gallery_thumbs_row{display: -webkit-box; display: -webkit-flex; display: flex;}}.f_sticky_cart_bar{position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; background: var(--bg-surface); border-top: var(--border-width-xs) solid var(--bg-neutral-stronger); padding: var(--gap-lg); box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.04);}.f_sticky_cart_row{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; gap: var(--gap-md); max-width: 480px; margin: 0 auto;}.f_sticky_cart_price_block{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--border-radius-100); min-width: 0;}.f_sticky_cart_price_row{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; gap: var(--gap-sm);}.f_sticky_cart_price_row .f_price_crossed{position: relative; color: #646462; font-size: var(--fontsize-16); line-height: 1; white-space: nowrap;}.f_sticky_cart_price_row .f_price_crossed:before{position: absolute; content: ""; left: 0; top: 49%; right: 0; border-top: 1px solid #646462;}.f_sticky_cart_price_row .f_price_crossed[hidden]{display: none;}.f_sticky_cart_price{font-family: var(--font-familly-body), sans-serif; font-weight: var(--font-weight-regular); font-size: var(--fontsize-24); line-height: 1; color: var(--content-default); white-space: nowrap;}.f_sticky_cart_delivery{margin: 0; font-size: var(--fontsize-12); line-height: 1.16; color: var(--content-default-light);}.f_sticky_cart_delivery strong{font-weight: var(--font-weight-bold);}.f_sticky_cart_label_long{display: none;}.f_sticky_cart_label_short{display: inline;}@media (min-width: 992px){.f_sticky_cart_bar{padding: var(--gap-lg) var(--spacing-40);}.f_sticky_cart_row{max-width: 1480px; gap: var(--gap-xl); -webkit-box-pack: end; justify-content: flex-end;}.f_sticky_cart_price_block{align-items: flex-end; text-align: right;}.f_sticky_cart_label_long{display: inline;}.f_sticky_cart_label_short{display: none;}}.f_combobox_label{display: block; font-family: var(--font-familly-body), sans-serif; font-size: var(--fontsize-14); color: var(--content-default-light); margin-bottom: var(--gap-sm);}.f_combobox{position: relative; width: 100%;}.f_combobox_trigger{width: 100%; background: var(--bg-surface); border: var(--border-width-xs) solid var(--border-default-lighter); border-radius: var(--border-radius-200); padding: 14px var(--gap-lg); display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; gap: var(--gap-md); cursor: pointer; font-family: var(--font-familly-body), sans-serif; font-size: var(--fontsize-16); line-height: 1.2; color: var(--content-default); text-align: left; transition: border-color 0.15s ease, box-shadow 0.15s ease;}.f_combobox_trigger.f_placeholder{color: var(--content-default-light);}.f_combobox_trigger:hover{border-color: var(--border-on-selected);}.f_combobox_trigger[aria-expanded="true"]{border-color: var(--border-on-selected); box-shadow: 0 0 0 3px rgba(158, 184, 76, 0.18);}.f_combobox_trigger:focus-visible{outline: var(--border-width-sm) solid var(--border-on-selected); outline-offset: 2px;}.f_combobox_chevron{width: 18px; height: 18px; transition: transform 0.2s ease; flex-shrink: 0;}.f_combobox_trigger[aria-expanded="true"] .f_combobox_chevron{transform: rotate(180deg);}.f_combobox_list{position: absolute; top: calc(100% + 6px); left: 0; right: 0; background: var(--bg-surface); border: var(--border-width-xs) solid var(--border-default-lighter); border-radius: var(--border-radius-200); box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08); list-style: none; padding: 6px; margin: 0; z-index: 50; max-height: 320px; overflow-y: auto;}.f_combobox_list[hidden]{display: none;}.f_combobox_item{padding: 10px var(--gap-md); border-radius: var(--border-radius-200); cursor: pointer; font-size: var(--fontsize-16); line-height: 1.3; color: var(--content-default); display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; gap: var(--gap-sm);}.f_combobox_item:hover, .f_combobox_item.f_focused{background: var(--bg-brand-primary-lighter);}.f_combobox_item.f_selected{background: rgba(237, 251, 204, 0.32); color: var(--content-default); font-weight: var(--font-weight-semi-bold);}.f_combobox_divider{height: var(--border-width-xs); background: var(--border-default-lighter); margin: 6px var(--gap-sm);}.f_help_prompt{background: var(--bg-neutral-default); border-radius: var(--border-radius-200); padding: var(--spacing-16); display: -webkit-box; display: -webkit-flex; display: flex; align-items: flex-start; gap: var(--spacing-8); text-decoration: none; color: inherit; opacity: 0.88; transition: opacity 0.15s ease, background-color 0.15s ease;}.f_help_prompt:hover{opacity: 1; background: var(--bg-neutral-stronger);}.f_help_prompt_col{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--spacing-8); flex: 1; min-width: 0;}.f_help_prompt_title{font-family: var(--font-familly-body), sans-serif; font-weight: var(--font-weight-semi-bold); font-size: var(--fontsize-16); line-height: 1.16; color: var(--content-brand);}.f_help_prompt_sub{font-family: var(--font-familly-body), sans-serif; font-size: var(--fontsize-14); line-height: 1.16; color: var(--content-brand);}.f_help_prompt_icon{width: 24px; height: 24px; flex-shrink: 0; color: var(--content-brand);}header.f_head_container:not(.o_header_affixed){position: relative; z-index: 2000;}.f_configurator{--configurator-nav-offset: 56px; --configurator-sticky-top: var(--configurator-nav-offset); display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; width: 100%; max-width: 1480px; margin: 0 auto; padding-bottom: 96px; font-family: var(--font-familly-body), sans-serif; color: var(--content-default); background: var(--bg-surface);}.f_configurator_body{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--gap-sm); padding: calc(var(--gap-xl) + var(--configurator-nav-offset)) var(--gap-lg) var(--spacing-40) var(--gap-lg);}.f_product_title_col{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--spacing-4); width: 100%; justify-content: center;}.f_product_title_row{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; gap: var(--gap-sm); -webkit-flex-wrap: wrap; flex-wrap: wrap;}.f_title_tag_set{display: -webkit-inline-box; display: -webkit-inline-flex; display: inline-flex; align-items: center; gap: var(--gap-sm);}.f_title_tag_set[hidden]{display: none;}.f_product_title_name{font-family: var(--font-familly-title), sans-serif; font-weight: var(--font-weight-semi-bold); font-size: var(--fontsize-20); line-height: 1.04; color: var(--content-brand); margin: 0;}.f_product_title_variant{font-family: var(--font-familly-body), sans-serif; font-weight: var(--font-weight-semi-bold); font-size: var(--fontsize-14); color: var(--content-default-light); line-height: 1.16; margin: 0;}.f_configurator_top_title{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; padding: var(--gap-lg); border-bottom: var(--border-width-xs) solid var(--bg-neutral-stronger); position: sticky; top: var(--configurator-sticky-top); z-index: 30; background: rgba(255, 255, 255, 0.96); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);}.f_configurator_panel_title{display: none; align-items: center; padding: 0 0 var(--gap-lg) 0; border-bottom: var(--border-width-xs) solid var(--bg-neutral-stronger);}.f_configurator_panel{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--spacing-40); width: 100%;}.f_configurator_panel > section{scroll-margin-top: 88px;}.f_configurator_panel > section[hidden]{display: none;}.f_carrier_checker{gap: var(--gap-md);}.f_carrier_verdict[hidden]{display: none;}.f_carrier_verdict .f_link[hidden]{display: none;}.f_boost_logo{display: block; height: 22px; width: auto; flex-shrink: 0;}.f_boost_legal{font-size: var(--fontsize-12); line-height: 1.35; color: var(--content-subtle); max-width: 312px;}.f_color_swatch.f_out_of_stock, .f_config_selector.f_out_of_stock{opacity: 0.66; cursor: pointer;}.f_color_swatch.f_out_of_stock:hover{border-color: var(--border-default-light);}.f_color_swatch.f_out_of_stock.f_selected, .f_config_selector.f_out_of_stock.f_selected{opacity: 1;}.f_color_swatch.f_end_of_sale, .f_config_selector.f_end_of_sale{opacity: 0.5; cursor: not-allowed; pointer-events: none;}.f_end_of_sale .f_swatch_name, .f_end_of_sale .f_config_selector_name{text-decoration: line-through;}.f_color_swatch.f_end_of_sale .f_swatch_dot{filter: grayscale(1);}.f_config_selector[hidden]{display: none;}.f_color_swatch[hidden]{display: none;}.f_configurator .f_color_swatch_grid{grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--spacing-8);}.f_configurator .f_color_swatch.f_card{min-height: 0; padding: var(--gap-md); gap: var(--spacing-8);}.f_configurator .f_color_swatch.f_card .f_swatch_dot{width: 28px; height: 28px;}.f_configurator .f_color_swatch .f_swatch_name{font-size: var(--fontsize-14); line-height: 1.2;}.f_configurator .f_color_swatch .f_stock_note{display: block; white-space: normal; height: calc(1.16em * 2); overflow: hidden;}.f_configurator .f_color_swatch .f_stock_note[hidden]{visibility: hidden;}.f_stock_note{font-size: var(--fontsize-12); font-weight: var(--font-weight-semi-bold); line-height: 1.16; color: var(--content-subtle); white-space: nowrap;}.f_end_of_sale .f_stock_note{color: var(--content-default-lighter);}.f_config_selector_price.f_stock_note{text-align: right;}.f_stock_note[hidden]{display: none;}.f_sticky_cart_bar .f_button{margin-bottom: 0;}.f_notify_title{font-family: var(--font-familly-body), sans-serif; font-size: var(--fontsize-14); font-weight: var(--font-weight-semi-bold); color: var(--content-default); line-height: 1.16;}.f_notify_sub{font-size: var(--fontsize-12); color: var(--content-subtle); line-height: 1.35;}.f_notify_sub strong{color: var(--content-default); font-weight: var(--font-weight-semi-bold);}.f_sticky_cart_bar .f_sticky_cart_row[hidden]{display: none;}.f_notify_row[hidden], .f_notify_done[hidden], .f_notify_panel[hidden]{display: none;}.f_notify_row{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; align-items: stretch; -webkit-box-pack: start; justify-content: flex-start; gap: var(--gap-md); width: 100%;}.f_notify_copy{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--spacing-2);}.f_notify_action{display: -webkit-box; display: -webkit-flex; display: flex; align-items: stretch; gap: var(--gap-sm);}.f_notify_field{-webkit-box-flex: 1; -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; height: auto; border: var(--border-width-xs) solid var(--border-input); border-radius: var(--border-radius-100); background: var(--bg-surface); padding: 0 var(--gap-md); font-family: var(--font-familly-body), sans-serif; font-size: var(--fontsize-16); color: var(--content-default);}.f_notify_field::placeholder{color: var(--content-placeholder);}.f_notify_field:focus{outline: none; border-color: var(--content-brand);}.f_notify_action .f_button{-webkit-box-flex: 0; -webkit-flex: 0 0 auto; flex: 0 0 auto;}.f_delay_row{flex-direction: row; align-items: center; gap: var(--gap-md);}.f_delay_row .f_notify_copy{min-width: 0;}.f_delay_row .f_notify_action{margin-left: auto;}.f_delay_row .f_button .f_text{white-space: nowrap;}@media (min-width: 992px){.f_notify_row{flex-direction: row; align-items: center; gap: var(--gap-lg);}.f_notify_action{margin-left: auto; -webkit-box-flex: 0; -webkit-flex: 0 0 auto; flex: 0 0 auto;}.f_notify_field{flex: 0 0 280px; width: 280px;}}@keyframes f_notify_in{from{opacity: 0; transform: translateY(10px);}to{opacity: 1; transform: translateY(0);}}.f_notify_row, .f_notify_done, .f_notify_panel{animation: f_notify_in 0.3s cubic-bezier(0.22, 1, 0.36, 1) both;}@keyframes f_bar_highlight{0%{background-color: var(--bg-surface);}22%{background-color: rgba(237, 251, 204, 0.7);}100%{background-color: var(--bg-surface);}}.f_sticky_cart_bar.f_bar_highlight{animation: f_bar_highlight 1.1s ease-out;}@media (prefers-reduced-motion: reduce){.f_notify_row, .f_notify_done, .f_notify_panel, .f_sticky_cart_bar.f_bar_highlight{animation: none;}}.f_notify_done{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; gap: var(--gap-sm); color: var(--content-brand);}.f_notify_done .f_notify_title{color: var(--content-brand);}.f_notify_done_icon{color: var(--content-brand); flex-shrink: 0;}.f_notify_panel{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: var(--gap-md); padding: var(--gap-lg); border: var(--border-width-xs) solid var(--border-divider); border-radius: var(--border-radius-xs); background: var(--bg-input);}.f_notify_panel .f_notify_form{display: -webkit-box; display: -webkit-flex; display: flex; gap: var(--gap-sm); align-items: flex-end; -webkit-flex-wrap: wrap; flex-wrap: wrap;}.f_notify_panel .f_input_wrapper{flex: 1 1 200px;}.f_notify_panel_done{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; gap: var(--gap-sm); color: var(--content-brand);}@media (min-width: 992px){.f_configurator{--configurator-nav-offset: 72px;}.f_configurator_body{flex-direction: row; align-items: flex-start; justify-content: space-between; gap: var(--gap-2xl); padding: var(--spacing-32) var(--spacing-40) var(--spacing-40) var(--spacing-40);}.f_configurator_body .f_product_gallery{-webkit-box-flex: 1; -webkit-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; max-width: 928px; position: sticky; top: 96px; max-height: calc(100vh - 192px);}.f_configurator_panel{flex: 0 0 382px; max-width: 382px; gap: var(--gap-4xl);}.f_color_preview{display: none;}.f_configurator_panel > section{scroll-margin-top: 150px;}.f_product_title_name{font-size: var(--fontsize-24);}.f_product_title_variant{font-size: var(--fontsize-16);}.f_configurator_top_title{display: none;}.f_configurator_panel_title{display: -webkit-box; display: -webkit-flex; display: flex; position: sticky; top: var(--configurator-sticky-top); z-index: 30; background: rgba(255, 255, 255, 0.96); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); padding: var(--gap-lg) 0;}}.f_help_prompt[data-lightbox]{cursor: pointer;}.f_cfg_lightbox_overlay{position: fixed; inset: 0; z-index: 2100; display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; justify-content: center; padding: var(--gap-lg); background: rgba(31, 32, 33, 0.5); animation: f_notify_in 0.2s ease both;}.f_cfg_lightbox_overlay[hidden]{display: none;}.f_cfg_lightbox_card{position: relative; width: 100%; max-width: 480px; max-height: calc(100dvh - 48px); overflow-y: auto; background: var(--bg-surface); border-radius: var(--border-radius-300); padding: var(--spacing-32); box-shadow: 0 12px 48px rgba(0, 0, 0, 0.18);}.f_cfg_lightbox_close{position: absolute; top: var(--gap-md); right: var(--gap-md); width: 32px; height: 32px; border: 0; background: transparent; cursor: pointer; display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; justify-content: center;}.f_cfg_lightbox_title{font-family: var(--font-familly-title), sans-serif; font-size: var(--fontsize-24); font-weight: var(--font-weight-semi-bold); color: var(--content-brand); line-height: 1.1; margin-bottom: var(--gap-lg); padding-right: var(--spacing-32);}.f_cfg_cmp{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column;}.f_cfg_cmp_head{display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap-md); padding-bottom: var(--gap-md); border-bottom: var(--border-width-xs) solid var(--border-divider);}.f_cfg_cmp_head_col{font-family: var(--font-familly-body), sans-serif; font-size: var(--fontsize-16); color: var(--content-default);}.f_cfg_cmp_logo{display: block; width: 40px; height: 28px; margin-bottom: var(--spacing-8); border: var(--border-width-xs) dashed var(--border-input); border-radius: var(--border-radius-100); background-repeat: no-repeat; background-position: left center; background-size: contain;}.f_cfg_cmp_group{padding: var(--gap-md) 0; border-bottom: var(--border-width-xs) solid var(--border-divider);}.f_cfg_cmp_cat{font-family: var(--font-familly-title), sans-serif; font-size: var(--fontsize-20); font-weight: var(--font-weight-bold); color: var(--content-default); margin-bottom: var(--spacing-8);}.f_cfg_cmp_vals{display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap-md);}.f_cfg_cmp_val{font-size: var(--fontsize-16); color: var(--content-default); line-height: 1.35;}.f_cfg_cmp_note{font-size: var(--fontsize-14); color: var(--content-subtle); line-height: 1.4; padding-top: var(--gap-md);}

/* /fairphone_website_sale_configurator/static/src/scss/help_lightbox.scss */
 @keyframes f_notify_in{from{opacity: 0; transform: translateY(10px);}to{opacity: 1; transform: translateY(0);}}.f_help_prompt[data-lightbox]{cursor: pointer;}.f_cfg_lightbox_overlay{position: fixed; inset: 0; z-index: 2100; display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; justify-content: center; padding: var(--gap-lg); background: rgba(31, 32, 33, 0.5); animation: f_notify_in 0.2s ease both;}.f_cfg_lightbox_overlay[hidden]{display: none;}.f_cfg_topic[hidden]{display: none;}.f_cfg_lightbox_card{position: relative; width: 100%; max-width: 640px; max-height: calc(100dvh - 48px); overflow: auto; background: var(--bg-surface); border-radius: var(--border-radius-300); padding: var(--spacing-32); box-shadow: 0 12px 48px rgba(0, 0, 0, 0.18);}.f_cfg_lightbox_close{position: absolute; top: var(--gap-md); right: var(--gap-md); width: 32px; height: 32px; border: 0; background: transparent; cursor: pointer; display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; justify-content: center;}.f_cfg_lightbox_title{font-family: var(--font-familly-title), sans-serif; font-size: var(--fontsize-24); font-weight: var(--font-weight-semi-bold); color: var(--content-brand); line-height: 1.1; margin-bottom: var(--gap-lg); padding-right: var(--spacing-32);}.f_cfg_cmp{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; min-width: calc(var(--cfg-cmp-cols, 2) * 140px);}.f_cfg_cmp_head{display: grid; grid-template-columns: repeat(var(--cfg-cmp-cols, 2), minmax(0, 1fr)); gap: var(--gap-md); padding-bottom: var(--gap-md); border-bottom: var(--border-width-xs) solid var(--border-divider);}.f_cfg_cmp_head_col{font-family: var(--font-familly-body), sans-serif; font-size: var(--fontsize-16); color: var(--content-default);}.f_cfg_cmp_logo{display: block; width: 40px; height: 28px; margin-bottom: var(--spacing-8); object-fit: contain; object-position: left center;}.f_cfg_cmp_group{padding: var(--gap-md) 0; border-bottom: var(--border-width-xs) solid var(--border-divider);}.f_cfg_cmp_cat{font-family: var(--font-familly-title), sans-serif; font-size: var(--fontsize-20); font-weight: var(--font-weight-bold); color: var(--content-default); margin-bottom: var(--spacing-8);}.f_cfg_cmp_vals{display: grid; grid-template-columns: repeat(var(--cfg-cmp-cols, 2), minmax(0, 1fr)); gap: var(--gap-md);}.f_cfg_cmp_val{font-size: var(--fontsize-16); color: var(--content-default); line-height: 1.35;}.f_cfg_cmp_note{font-size: var(--fontsize-14); color: var(--content-subtle); line-height: 1.4; padding-top: var(--gap-md);}

/* /fairphone_website_sale_configurator/static/src/scss/configurator.scss */
 .f_color_swatch .f_swatch_dot{background: radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--swatch-color) 60%, #ffffff) 0%, var(--swatch-color) 58%, color-mix(in srgb, var(--swatch-color) 72%, #000000) 100%);}

/* /fairphone_website_sale_configurator/static/src/scss/configurator_page.scss */
 body:has(.f_configurator_doc) header.f_head_container{display: none !important;}body:has(.f_configurator_doc) footer{display: none !important;}.f_configurator_doc{--c-content-brand: var(--content-brand); --c-content-default: var(--content-default); --c-content-default-light: var(--content-default-light); --c-bg-surface: var(--bg-surface); --c-bg-card: var(--bg-input, var(--bg-neutral-default)); --c-bg-card-strong: var(--bg-neutral-default); --c-bg-brand-primary-lighter: var(--bg-brand-primary-lighter); --c-border-default-lighter: var(--border-default-lighter); --c-divider: var(--border-divider, var(--border-default-lighter)); --c-ok-bg: var(--bg-positive-light); --c-ok-ink: var(--content-succes); --c-bad-bg: var(--bg-error-light); --c-bad-ink: var(--content-error); --c-warn-bg: var(--bg-warning-light); --c-warn-ink: var(--content-on-warning); min-height: 100vh; background-color: var(--c-bg-surface); font-family: var(--font-familly-body), sans-serif; color: var(--c-content-default); -webkit-font-smoothing: antialiased; padding-top: 56px; padding-bottom: 40px;}.f_configurator_doc .f_doc_topbar{position: fixed; top: 0; left: 0; right: 0; height: 56px; background: var(--c-bg-surface); display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; padding: 0 12px; border-bottom: 1px solid var(--c-divider); z-index: 10;}.f_configurator_doc .f_doc_back{-webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent; border: 0; color: var(--c-content-default); font-family: inherit; font-size: var(--fontsize-16); font-weight: var(--font-weight-semi-bold); display: -webkit-inline-box; display: -webkit-inline-flex; display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px 8px 6px; margin-right: 4px; border-radius: 8px; cursor: pointer; -webkit-tap-highlight-color: transparent;}.f_configurator_doc .f_doc_back:hover{background: var(--c-bg-card);}.f_configurator_doc .f_doc_topbar_title{font-size: var(--fontsize-14); font-weight: var(--font-weight-semi-bold); color: var(--c-content-default); margin-left: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1;}.f_configurator_doc .f_doc{max-width: 720px; margin: 0 auto; padding: 16px 20px 24px;}.f_configurator_doc .f_doc p{font-size: var(--fontsize-16); line-height: 1.5; color: var(--c-content-default); margin-bottom: 14px;}.f_configurator_doc .f_doc p strong{font-weight: var(--font-weight-bold);}.f_configurator_doc .f_doc_eyebrow{font-size: var(--fontsize-12); font-weight: var(--font-weight-bold); letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-content-brand); margin-bottom: 6px;}.f_configurator_doc .f_doc_title{font-family: var(--font-familly-body), sans-serif; font-size: var(--fontsize-28); line-height: 1.15; font-weight: var(--font-weight-bold); color: var(--c-content-default); letter-spacing: -0.01em; margin-bottom: 12px;}.f_configurator_doc .f_doc_h2{font-size: var(--fontsize-20); font-weight: var(--font-weight-bold); line-height: 1.2; color: var(--c-content-default); letter-spacing: -0.005em; margin: 28px 0 10px;}.f_configurator_doc .f_doc_h3{font-size: var(--fontsize-16); font-weight: var(--font-weight-bold); line-height: 1.3; color: var(--c-content-default); margin: 18px 0 6px;}.f_configurator_doc .f_doc_muted{color: var(--c-content-default-light); font-size: var(--fontsize-12); line-height: 1.45; margin-bottom: 12px;}.f_configurator_doc .f_doc_bullets{margin: 4px 0 14px 18px;}.f_configurator_doc .f_doc_bullets li{font-size: var(--fontsize-14); line-height: 1.5; color: var(--c-content-default); margin-bottom: 4px;}.f_configurator_doc .f_doc_bullets li strong{font-weight: var(--font-weight-bold);}.f_configurator_doc .f_doc_warn{margin: 14px 0 8px; background: var(--c-bad-bg); border: 1px solid var(--c-bad-ink); border-radius: 12px; padding: 14px 14px 14px 16px; display: -webkit-box; display: -webkit-flex; display: flex; gap: 12px; align-items: flex-start;}.f_configurator_doc .f_doc_warn h4{font-size: var(--fontsize-14); font-weight: var(--font-weight-bold); color: var(--c-bad-ink); margin-bottom: 4px; letter-spacing: 0.02em; text-transform: uppercase;}.f_configurator_doc .f_doc_warn p{font-size: var(--fontsize-12); line-height: 1.5; color: var(--c-content-default); margin: 0;}.f_configurator_doc .f_doc_warn_icon{flex-shrink: 0; margin-top: 1px;}.f_configurator_doc .f_doc_summary{display: grid; grid-template-columns: 1fr; gap: 10px; margin: 6px 0 8px;}@media (min-width: 600px){.f_configurator_doc .f_doc_summary{grid-template-columns: 1fr 1fr 1fr;}}.f_configurator_doc .f_doc_summary_card{border: 1px solid var(--c-border-default-lighter); background: var(--c-bg-card); border-radius: 12px; padding: 14px 14px;}.f_configurator_doc .f_doc_summary_card h4{font-size: var(--fontsize-12); font-weight: var(--font-weight-bold); margin-bottom: 6px; color: var(--c-content-default);}.f_configurator_doc .f_doc_summary_card p{font-size: var(--fontsize-12); line-height: 1.45; color: var(--c-content-default-light); margin: 0;}.f_configurator_doc .f_doc_summary_card--ok h4::before, .f_configurator_doc .f_doc_summary_card--warn h4::before, .f_configurator_doc .f_doc_summary_card--bad h4::before{content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: middle;}.f_configurator_doc .f_doc_summary_card--ok h4::before{background: var(--c-ok-ink);}.f_configurator_doc .f_doc_summary_card--warn h4::before{background: var(--c-warn-ink);}.f_configurator_doc .f_doc_summary_card--bad h4::before{background: var(--c-bad-ink);}.f_configurator_doc .f_doc_list{list-style: none; border-top: 1px solid var(--c-divider); margin: 8px 0 4px;}.f_configurator_doc .f_doc_list li{display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; padding: 12px 2px; border-bottom: 1px solid var(--c-divider);}.f_configurator_doc .f_doc_search_wrap{position: sticky; top: 56px; z-index: 5; background: var(--c-bg-surface); padding: 10px 0 12px; margin: 0 0 4px;}.f_configurator_doc .f_doc_search_input{width: 100%; font-family: inherit; font-size: var(--fontsize-16); color: var(--c-content-default); background: var(--c-bg-card); border: 1px solid var(--c-border-default-lighter); border-radius: 10px; padding: 10px 14px;}.f_configurator_doc .f_doc_search_input:focus{outline: none; border-color: var(--c-content-brand);}.f_configurator_doc .f_js_carrier_placeholder{display: block; color: var(--c-content-default-light); font-size: var(--fontsize-14); font-style: italic;}.f_configurator_doc .f_doc_search_empty{padding: 16px 2px;}.f_configurator_doc .f_doc_search_empty .f_doc_search_empty_heading{font-size: var(--fontsize-14); font-weight: var(--font-weight-bold); color: var(--c-content-default); margin-bottom: 2px;}.f_configurator_doc .f_doc_search_empty .f_doc_search_empty_hint{font-size: var(--fontsize-12); color: var(--c-content-default-light); margin: 0;}.f_configurator_doc .s_fp_doc_carrier_row{display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; padding: 12px 2px; border-bottom: 1px solid var(--c-divider);}.f_configurator_doc .f_doc_carrier_name{font-size: var(--fontsize-16); font-weight: var(--font-weight-semi-bold); color: var(--c-content-default); line-height: 1.2;}.f_configurator_doc .f_doc_carrier_net{font-size: var(--fontsize-12); color: var(--c-content-default-light); margin-top: 2px;}.f_configurator_doc .f_doc_pill{display: -webkit-inline-box; display: -webkit-inline-flex; display: inline-flex; align-items: center; gap: 4px; font-size: var(--fontsize-12); font-weight: var(--font-weight-semi-bold); padding: 4px 10px; border-radius: 999px; white-space: nowrap; line-height: 1.2;}.f_configurator_doc .f_doc_pill.f_doc_pill--ok{background: var(--c-ok-bg); color: var(--c-ok-ink);}.f_configurator_doc .f_doc_pill.f_doc_pill--bad{background: var(--c-bad-bg); color: var(--c-bad-ink);}.f_configurator_doc .f_doc_pill.f_doc_pill--warn{background: var(--c-warn-bg); color: var(--c-warn-ink);}.f_configurator_doc .f_doc_list_subheading{display: block; grid-column: 1 / -1; font-size: var(--fontsize-12); font-weight: var(--font-weight-bold); letter-spacing: 0.06em; text-transform: uppercase; color: var(--c-content-default-light); padding: 14px 2px 4px; border-bottom: 0;}.f_configurator_doc .f_doc_explain{display: -webkit-box; display: -webkit-flex; display: flex; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--c-divider); align-items: flex-start;}.f_configurator_doc .f_doc_explain:last-child{border-bottom: 0;}.f_configurator_doc .f_doc_explain h4{font-size: var(--fontsize-14); font-weight: var(--font-weight-bold); margin-bottom: 2px; color: var(--c-content-default);}.f_configurator_doc .f_doc_explain p{font-size: var(--fontsize-12); line-height: 1.45; color: var(--c-content-default-light); margin: 0;}.f_configurator_doc .f_doc_explain_dot{flex-shrink: 0; width: 10px; height: 10px; border-radius: 50%; margin-top: 7px;}.f_configurator_doc .f_doc_explain_dot.f_doc_explain_dot--ok{background: var(--c-ok-ink);}.f_configurator_doc .f_doc_explain_dot.f_doc_explain_dot--bad{background: var(--c-bad-ink);}.f_configurator_doc .f_doc_explain_dot.f_doc_explain_dot--warn{background: var(--c-warn-ink);}.f_configurator_doc .f_doc_bands{background: var(--c-bg-card); border-radius: 10px; padding: 10px 12px; margin: 4px 0 14px; font-size: var(--fontsize-12); line-height: 1.6; color: var(--c-content-default);}.f_configurator_doc .f_doc_bands_row{display: -webkit-box; display: -webkit-flex; display: flex; gap: 8px;}.f_configurator_doc .f_doc_bands_label{flex-shrink: 0; font-weight: var(--font-weight-bold); min-width: 64px;}.f_configurator_doc .f_doc_bands_val{font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--c-content-default-light); font-size: var(--fontsize-12);}.f_configurator_doc .f_doc_note{margin-top: 24px; padding-top: 14px; border-top: 1px solid var(--c-divider); font-size: var(--fontsize-12); line-height: 1.45; color: var(--c-content-default-light); font-style: italic;}.f_configurator_doc .f_doc_cta_wrap{margin-top: var(--spacing-24);}