{
    "comp": {
        "tabs": {
            "text": {
                "font-family": {
                    "value": "{ref.font.family}"
                }
            },
            "border": {
                "color": {
                    "value": "{ref.color.grey.10}"
                }
            },
            "tab": {
                "padding": {
                    "value": "{ref.spacing.xs} {ref.spacing.sm}"
                },
                "font": {
                    "size": {
                        "value": "{sys.text.style.body.size}"
                    }
                },
                "line": {
                    "height": {
                        "value": "{sys.text.style.body.line-height}"
                    }
                },
                "min": {
                    "height": {
                        "value": "48px"
                    }
                },
                "text": {
                    "color": {
                        "default": {
                            "value": "{ref.color.grey.100}"
                        },
                        "active": {
                            "value": "{ref.color.electricBlue.150}"
                        },
                        "disabled": {
                            "value": "{ref.color.grey.60}"
                        },
                        "featureLocked": {
                            "focus": {
                                "value": "{ref.color.purple.100}"
                            },
                            "active": {
                                "value": "{ref.color.purple.100}"
                            }
                        }
                    }
                },
                "focus": {
                    "color": {
                        "value": "{ref.color.electricBlue.150}"
                    },
                    "border": {
                        "radius": {
                            "value": "{sys.border.radius.sm}"
                        }
                    },
                    "background": {
                        "color": {
                            "value": "{ref.color.electricBlue.10}"
                        }
                    }
                },
                "hover": {
                    "background": {
                        "color": {
                            "value": "{ref.color.electricBlue.10}"
                        }
                    }
                },
                "active": {
                    "indicator": {
                        "color": {
                            "value": "{ref.color.electricBlue.150}"
                        }
                    },
                    "background": {
                        "color": {
                            "value": "{ref.color.electricBlue.20}"
                        }
                    }
                },
                "feature": {
                    "lock": {
                        "color": {
                            "value": "{ref.color.purple.100}"
                        }
                    }
                },
                "featureLocked": {
                    "indicator": {
                        "color": {
                            "value": "{ref.color.purple.100}"
                        }
                    },
                    "hover": {
                        "background": {
                            "color": {
                                "value": "{ref.color.purple.10}"
                            }
                        }
                    },
                    "focus": {
                        "background": {
                            "color": {
                                "value": "{ref.color.purple.10}"
                            }
                        }
                    },
                    "active": {
                        "background": {
                            "color": {
                                "value": "{ref.color.purple.20}"
                            }
                        }
                    }
                },
                "content": {
                    "gap": {
                        "value": "4px"
                    }
                },
                "header": {
                    "gap": {
                        "value": "8px"
                    }
                }
            }
        }
    }
}