/* COMPARISON — static component styles.
 * Search the sg- class in HTML to find the element. Reused classes share a rule.
 * The :is() scope preserves former inline priority over template selectors.
 * No element with id smart-static-priority is required. Keep this scope.
 * JavaScript can override normal properties inline during interactions.
 */

:is(#smart-static-priority,:root) .sg-comparison-surface-01 {
  background: linear-gradient(180deg,var(--token-260f9222-11bc-40e3-a74c-4f1dae7b4ffa,
                                    rgb(255, 255, 255)
                                  ) 0%,var(--token-1b8f888c-e7bb-4096-83cf-bc6a0a87c24d,
                                    rgba(255, 255, 255, 0)
                                  ) 100%);
}

:is(#smart-static-priority,:root) .sg-comparison-surface-02 {
  background-color: var(--token-260f9222-11bc-40e3-a74c-4f1dae7b4ffa,
                                rgb(255, 255, 255)
                              );
}

:is(#smart-static-priority,:root) .sg-comparison-border-01 {
  --border-bottom-width:  1px;
  --border-color:  var(
                                --token-3992e4b1-4934-4fc5-9122-067e1dd544fa,
                                rgb(221, 229, 237)
                              );
  --border-left-width:  0px;
  --border-right-width:  1px;
  --border-style:  solid;
  --border-top-width:  0px;
  border-bottom-right-radius: 20px;
}

:is(#smart-static-priority,:root) .sg-comparison-layout-01 {
  filter: drop-shadow(0px 2px 2px var(--token-22e76413-54a7-49e7-b94c-fb66f119d431,
                                        rgba(0, 0, 0, 0.1)
                                      )) drop-shadow(0px 7px 9px var(--token-1da6f336-7e27-4609-af93-da7817fb442b,
                                        rgba(0, 0, 0, 0.2)
                                      ));
  -webkit-filter: drop-shadow(0px 2px 2px var(--token-22e76413-54a7-49e7-b94c-fb66f119d431,
                                        rgba(0, 0, 0, 0.1)
                                      )) drop-shadow(0px 7px 9px var(--token-1da6f336-7e27-4609-af93-da7817fb442b,
                                        rgba(0, 0, 0, 0.2)
                                      ));
  height: auto;
  aspect-ratio: 0.8125;
  transform: translateX(-50%);
}

:is(#smart-static-priority,:root) .sg-comparison-border-02 {
  --border-bottom-width:  1px;
  --border-color:  var(
                                --token-3992e4b1-4934-4fc5-9122-067e1dd544fa,
                                rgb(221, 229, 237)
                              );
  --border-left-width:  1px;
  --border-right-width:  0px;
  --border-style:  solid;
  --border-top-width:  0px;
  border-bottom-left-radius: 20px;
}

:is(#smart-static-priority,:root) .sg-comparison-layout-02 {
  --extracted-r6o4lv:  var(
                                  --token-0edc2e6a-5fd1-47c5-a905-c3de9f07cea3,
                                  rgb(29, 29, 29)
                                );
  --fx-link-text-color:  rgb(0, 153, 255);
  --fx-link-text-decoration:  underline;
  opacity: 0.3;
  transform: none;
}

:is(#smart-static-priority,:root) .sg-comparison-layout-03 {
  --extracted-a0htzi:  var(
                                    --token-0edc2e6a-5fd1-47c5-a905-c3de9f07cea3,
                                    rgb(29, 29, 29)
                                  );
  --fx-link-text-color:  rgb(0, 153, 255);
  --fx-link-text-decoration:  underline;
  transform: none;
}

:is(#smart-static-priority,:root) .sg-comparison-text-01 {
  --fx-text-alignment:  left;
  --fx-text-color:  var(
                                      --extracted-a0htzi,
                                      var(
                                        --token-0edc2e6a-5fd1-47c5-a905-c3de9f07cea3,
                                        rgb(29, 29, 29)
                                      )
                                    );
}

:is(#smart-static-priority,:root) .sg-comparison-text-02 {
  display: inline-block;
}

:is(#smart-static-priority,:root) .sg-comparison-border-03 {
  --border-bottom-width:  1px;
  --border-color:  var(
                                    --token-1b12818c-058c-4797-a04f-5ca5424b73cd,
                                    rgba(255, 13, 13, 0.3)
                                  );
  --border-left-width:  1px;
  --border-right-width:  1px;
  --border-style:  solid;
  --border-top-width:  1px;
  background-color: var(--token-a545ebfd-5179-4ff0-bfb3-68703755a1be,
                                    rgba(255, 13, 13, 0.05)
                                  );
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

:is(#smart-static-priority,:root) .sg-comparison-border-04 {
  --border-bottom-width:  1px;
  --border-color:  var(
                                    --token-1b12818c-058c-4797-a04f-5ca5424b73cd,
                                    rgba(255, 13, 13, 0.3)
                                  );
  --border-left-width:  1px;
  --border-right-width:  1px;
  --border-style:  solid;
  --border-top-width:  1px;
  background-color: var(--token-a545ebfd-5179-4ff0-bfb3-68703755a1be,
                                    rgba(255, 13, 13, 0.05)
                                  );
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

