@alifd/theme-panda 0.1.2 → 0.2.0

package/dist/next-noreset.var.css

@@ -1,5 +1,5 @@
 /*!
- * @alifd/theme-panda@0.1.2 (https://fusion.design)
+ * @alifd/theme-panda@0.2.0 (https://fusion.design)
  * @alifd/next@1.25.51 (https://fusion.design)
  * Copyright 2018-present Alibaba Group,
  * Licensed under MIT (https://github.com/alibaba-fusion/next/blob/master/LICENSE)
@@ -4229,8 +4229,8 @@
     border-style: var(--btn-pure-normal-border-style, solid);
     background: #FFFFFF;
     background: var(--btn-pure-normal-bg, #FFFFFF);
-    border-color: #f0f0f0;
-    border-color: var(--btn-pure-normal-border-color, #f0f0f0); }
+    border-color: #edeef2;
+    border-color: var(--btn-pure-normal-border-color, #edeef2); }
     .next-btn.next-btn-normal, .next-btn.next-btn-normal:link, .next-btn.next-btn-normal:visited, .next-btn.next-btn-normal.visited {
       color: #2e3038;
       color: var(--btn-pure-normal-color, #2e3038); }
@@ -13732,10 +13732,10 @@
     content: ''; }
   .next-nav.next-hoz {
     padding: 0;
-    height: calc(44px + 0px*2);
-    height: calc(var(--nav-hoz-height, 44px) + var(--nav-hoz-item-margin-tb, 0px)*2);
-    line-height: calc(44px - 0px*2);
-    line-height: calc(var(--nav-hoz-height, 44px) - var(--popup-local-border-width, 0px)*2);
+    height: calc(32px + 8px*2);
+    height: calc(var(--nav-hoz-height, 32px) + var(--nav-hoz-item-margin-tb, 8px)*2);
+    line-height: calc(32px - 0px*2);
+    line-height: calc(var(--nav-hoz-height, 32px) - var(--popup-local-border-width, 0px)*2);
     font-size: 14px;
     font-size: var(--nav-hoz-font-size, 14px); }
     .next-nav.next-hoz .next-menu-item.next-nav-item {
@@ -13745,17 +13745,17 @@
       margin-right: var(--nav-hoz-item-margin-lr, 0px);
       padding: 0 20px;
       padding: 0 var(--nav-hoz-item-padding-lr, 20px);
-      border-radius: 0px;
-      border-radius: var(--nav-hoz-item-corner, 0px); }
+      border-radius: 8px;
+      border-radius: var(--nav-hoz-item-corner, 8px); }
     .next-nav.next-hoz .next-menu-item,
     .next-nav.next-hoz .next-menu-sub-menu-wrapper > .next-menu-item {
-      margin-top: 0px;
-      margin-top: var(--nav-hoz-item-margin-tb, 0px);
-      margin-bottom: 0px;
-      margin-bottom: var(--nav-hoz-item-margin-tb, 0px); }
+      margin-top: 8px;
+      margin-top: var(--nav-hoz-item-margin-tb, 8px);
+      margin-bottom: 8px;
+      margin-bottom: var(--nav-hoz-item-margin-tb, 8px); }
     .next-nav.next-hoz .next-menu-item-inner {
-      height: calc(44px - 0px*2);
-      height: calc(var(--nav-hoz-height, 44px) - var(--popup-local-border-width, 0px)*2);
+      height: calc(32px - 0px*2);
+      height: calc(var(--nav-hoz-height, 32px) - var(--popup-local-border-width, 0px)*2);
       font-size: 14px;
       font-size: var(--nav-hoz-font-size, 14px); }
     .next-nav.next-hoz .next-menu-item.next-nav-item.next-nav-with-title {
@@ -13763,8 +13763,8 @@
       padding: 12px 8px; }
       .next-nav.next-hoz .next-menu-item.next-nav-item.next-nav-with-title .next-menu-item-inner {
         height: auto;
-        min-height: calc(44px - 0px*2);
-        min-height: calc(var(--nav-hoz-height, 44px) - var(--popup-local-border-width, 0px)*2); }
+        min-height: calc(32px - 0px*2);
+        min-height: calc(var(--nav-hoz-height, 32px) - var(--popup-local-border-width, 0px)*2); }
       .next-nav.next-hoz .next-menu-item.next-nav-item.next-nav-with-title .next-nav-text {
         display: block;
         line-height: 1;
@@ -13780,12 +13780,12 @@
       font-size: var(--nav-group-font-size, 14px); }
     .next-nav.next-hoz .next-menu-header {
       float: left;
-      height: calc(44px - 0px*2);
-      height: calc(var(--nav-hoz-height, 44px) - var(--popup-local-border-width, 0px)*2); }
+      height: calc(32px - 0px*2);
+      height: calc(var(--nav-hoz-height, 32px) - var(--popup-local-border-width, 0px)*2); }
     .next-nav.next-hoz .next-menu-footer {
       float: right;
-      height: calc(44px - 0px*2);
-      height: calc(var(--nav-hoz-height, 44px) - var(--popup-local-border-width, 0px)*2); }
+      height: calc(32px - 0px*2);
+      height: calc(var(--nav-hoz-height, 32px) - var(--popup-local-border-width, 0px)*2); }
     .next-nav.next-hoz .next-nav-item:before {
       width: 0;
       left: 50%;
@@ -13895,30 +13895,30 @@
   .next-nav.next-primary {
     border-width: 0px;
     border-width: var(--nav-primary-border-width, 0px);
-    background: #001529;
-    background: var(--nav-primary-bg-color, #001529);
+    background: #000a24;
+    background: var(--nav-primary-bg-color, #000a24);
     border-color: transparent;
     border-color: var(--nav-primary-border-color, transparent);
     color: rgba(255, 255, 255, 0.65);
     color: var(--nav-primary-text-color, rgba(255, 255, 255, 0.65));
-    font-weight: 300;
-    font-weight: var(--nav-primary-text-style, 300);
+    font-weight: normal;
+    font-weight: var(--nav-primary-text-style, normal);
     -webkit-box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.12);
     -webkit-box-shadow: var(--nav-primary-shadow, 2px 2px 4px 0px rgba(0, 0, 0, 0.12));
             box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.12);
             box-shadow: var(--nav-primary-shadow, 2px 2px 4px 0px rgba(0, 0, 0, 0.12)); }
     .next-nav.next-primary.next-hoz {
-      line-height: 44px;
-      line-height: var(--nav-hoz-height, 44px);
-      line-height: calc(44px - 0px*2);
-      line-height: calc(var(--nav-hoz-height, 44px) - var(--nav-primary-border-width, 0px)*2); }
+      line-height: 32px;
+      line-height: var(--nav-hoz-height, 32px);
+      line-height: calc(32px - 0px*2);
+      line-height: calc(var(--nav-hoz-height, 32px) - var(--nav-primary-border-width, 0px)*2); }
       .next-nav.next-primary.next-hoz .next-menu-header,
       .next-nav.next-primary.next-hoz .next-menu-footer,
       .next-nav.next-primary.next-hoz .next-menu-item-inner {
-        line-height: 44px;
-        line-height: var(--nav-hoz-height, 44px);
-        height: calc(44px - 0px*2);
-        height: calc(var(--nav-hoz-height, 44px) - var(--nav-primary-border-width, 0px)*2); }
+        line-height: 32px;
+        line-height: var(--nav-hoz-height, 32px);
+        height: calc(32px - 0px*2);
+        height: calc(var(--nav-hoz-height, 32px) - var(--nav-primary-border-width, 0px)*2); }
       .next-nav.next-primary.next-hoz.next-top .next-nav-item:before {
         top: 0;
         top: calc(0px - 0px);
@@ -13936,8 +13936,8 @@
       right: calc(0px - 0px);
       right: calc(0px - var(--nav-primary-border-width, 0px)); }
     .next-nav.next-primary .next-nav-item.next-menu-item {
-      background: #001529;
-      background: var(--nav-primary-bg-color, #001529);
+      background: #000a24;
+      background: var(--nav-primary-bg-color, #000a24);
       color: rgba(255, 255, 255, 0.65);
       color: var(--nav-primary-text-color, rgba(255, 255, 255, 0.65)); }
       .next-nav.next-primary .next-nav-item.next-menu-item.next-focused, .next-nav.next-primary .next-nav-item.next-menu-item:hover {
@@ -13945,15 +13945,15 @@
         background: var(--nav-primary-item-hover-bg-color, transparent);
         color: #FFFFFF;
         color: var(--nav-primary-item-hover-text-color, #FFFFFF);
-        font-weight: 300;
-        font-weight: var(--nav-primary-item-hover-text-style, 300); }
+        font-weight: 500;
+        font-weight: var(--nav-primary-item-hover-text-style, 500); }
       .next-nav.next-primary .next-nav-item.next-menu-item.next-selected {
         background: #257df9;
         background: var(--nav-primary-item-selected-bg-color, #257df9);
         color: #FFFFFF;
         color: var(--nav-primary-item-selected-text-color, #FFFFFF);
-        font-weight: 300;
-        font-weight: var(--nav-primary-item-selected-text-style, 300); }
+        font-weight: 500;
+        font-weight: var(--nav-primary-item-selected-text-style, 500); }
         .next-nav.next-primary .next-nav-item.next-menu-item.next-selected.next-nav-item {
           background: #257df9;
           background: var(--nav-primary-item-selected-bg-color, #257df9);
@@ -14044,17 +14044,17 @@
             box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.12);
             box-shadow: var(--nav-secondary-shadow, 2px 2px 4px 0px rgba(0, 0, 0, 0.12)); }
     .next-nav.next-secondary.next-hoz {
-      line-height: 44px;
-      line-height: var(--nav-hoz-height, 44px);
-      line-height: calc(44px - 0px*2);
-      line-height: calc(var(--nav-hoz-height, 44px) - var(--nav-secondary-border-width, 0px)*2); }
+      line-height: 32px;
+      line-height: var(--nav-hoz-height, 32px);
+      line-height: calc(32px - 0px*2);
+      line-height: calc(var(--nav-hoz-height, 32px) - var(--nav-secondary-border-width, 0px)*2); }
       .next-nav.next-secondary.next-hoz .next-menu-header,
       .next-nav.next-secondary.next-hoz .next-menu-footer,
       .next-nav.next-secondary.next-hoz .next-menu-item-inner {
-        line-height: 44px;
-        line-height: var(--nav-hoz-height, 44px);
-        height: calc(44px - 0px*2);
-        height: calc(var(--nav-hoz-height, 44px) - var(--nav-secondary-border-width, 0px)*2); }
+        line-height: 32px;
+        line-height: var(--nav-hoz-height, 32px);
+        height: calc(32px - 0px*2);
+        height: calc(var(--nav-hoz-height, 32px) - var(--nav-secondary-border-width, 0px)*2); }
       .next-nav.next-secondary.next-hoz.next-top .next-nav-item:before {
         top: 0;
         top: calc(0px - 0px);
@@ -20239,8 +20239,8 @@
   .next-tabs.next-medium .next-tabs-tab-inner {
     font-size: 14px;
     font-size: var(--tab-item-text-size-m, 14px);
-    padding: 20px 16px;
-    padding: var(--tab-item-padding-tb-size-m, 20px) var(--tab-item-padding-lr-size-m, 16px); }
+    padding: 16px 16px;
+    padding: var(--tab-item-padding-tb-size-m, 16px) var(--tab-item-padding-lr-size-m, 16px); }
     .next-tabs.next-medium .next-tabs-tab-inner .next-icon {
       line-height: 1; }
       .next-tabs.next-medium .next-tabs-tab-inner .next-icon:before,
@@ -25072,35 +25072,35 @@ h6.next-typography-title {
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
   position: relative;
-  border-top-left-radius: 6px;
-  border-top-left-radius: var(--table-header-corner-top, 6px);
-  border-top-right-radius: 6px;
-  border-top-right-radius: var(--table-header-corner-top, 6px);
-  border-bottom-left-radius: 6px;
-  border-bottom-left-radius: var(--table-header-corner-bottom, 6px);
-  border-bottom-right-radius: 6px;
-  border-bottom-right-radius: var(--table-header-corner-bottom, 6px);
-  border-top: 1px solid #f0f0f0;
-  border-top: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0);
-  border-left: 1px solid #f0f0f0;
-  border-left: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0); }
+  border-top-left-radius: 8px;
+  border-top-left-radius: var(--table-header-corner-top, 8px);
+  border-top-right-radius: 8px;
+  border-top-right-radius: var(--table-header-corner-top, 8px);
+  border-bottom-left-radius: 0px;
+  border-bottom-left-radius: var(--table-header-corner-bottom, 0px);
+  border-bottom-right-radius: 0px;
+  border-bottom-right-radius: var(--table-header-corner-bottom, 0px);
+  border-top: 1px solid rgba(0, 0, 0, 0.08);
+  border-top: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08));
+  border-left: 1px solid rgba(0, 0, 0, 0.08);
+  border-left: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08)); }
   .next-table *,
   .next-table *:before,
   .next-table *:after {
     -webkit-box-sizing: border-box;
             box-sizing: border-box; }
   .next-table .next-table-header tr:first-child th:first-child {
-    border-top-left-radius: 6px;
-    border-top-left-radius: var(--table-header-corner-top, 6px); }
+    border-top-left-radius: 8px;
+    border-top-left-radius: var(--table-header-corner-top, 8px); }
   .next-table .next-table-header tr:first-child th:last-child {
-    border-top-right-radius: 6px;
-    border-top-right-radius: var(--table-header-corner-top, 6px); }
+    border-top-right-radius: 8px;
+    border-top-right-radius: var(--table-header-corner-top, 8px); }
   .next-table .next-table-header tr:last-child th:first-child {
-    border-bottom-left-radius: 6px;
-    border-bottom-left-radius: var(--table-header-corner-bottom, 6px); }
+    border-bottom-left-radius: 0px;
+    border-bottom-left-radius: var(--table-header-corner-bottom, 0px); }
   .next-table .next-table-header tr:last-child th:last-child {
-    border-bottom-right-radius: 6px;
-    border-bottom-right-radius: var(--table-header-corner-bottom, 6px); }
+    border-bottom-right-radius: 0px;
+    border-bottom-right-radius: var(--table-header-corner-bottom, 0px); }
   .next-table.next-table-layout-fixed {
     overflow: auto; }
     .next-table.next-table-layout-fixed table {
@@ -25121,29 +25121,29 @@ h6.next-typography-title {
     width: 100%;
     background: #FFFFFF;
     background: var(--table-row-bg, #FFFFFF);
-    border-top-left-radius: 6px;
-    border-top-left-radius: var(--table-header-corner-top, 6px);
-    border-top-right-radius: 6px;
-    border-top-right-radius: var(--table-header-corner-top, 6px);
-    border-bottom-left-radius: 6px;
-    border-bottom-left-radius: var(--table-header-corner-bottom, 6px);
-    border-bottom-right-radius: 6px;
-    border-bottom-right-radius: var(--table-header-corner-bottom, 6px); }
+    border-top-left-radius: 8px;
+    border-top-left-radius: var(--table-header-corner-top, 8px);
+    border-top-right-radius: 8px;
+    border-top-right-radius: var(--table-header-corner-top, 8px);
+    border-bottom-left-radius: 0px;
+    border-bottom-left-radius: var(--table-header-corner-bottom, 0px);
+    border-bottom-right-radius: 0px;
+    border-bottom-right-radius: var(--table-header-corner-bottom, 0px); }
     .next-table table tr:first-child td {
       border-top-width: 0; }
   .next-table th {
     padding: 0;
-    background: #fafafa;
-    background: var(--table-th-bg, #fafafa);
+    background: #f8f9fb;
+    background: var(--table-th-bg, #f8f9fb);
     color: #2e3038;
     color: var(--table-th-color, #2e3038);
     text-align: left;
     font-weight: 500;
     font-weight: var(--table-th-font-weight, 500);
-    border-right: 1px solid #f0f0f0;
-    border-right: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0);
-    border-bottom: 1px solid #f0f0f0;
-    border-bottom: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0); }
+    border-right: 1px solid rgba(0, 0, 0, 0.08);
+    border-right: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08));
+    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
+    border-bottom: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08)); }
     .next-table th .next-table-cell-wrapper {
       padding: 12px 16px;
       padding: var(--table-header-padding-top, 12px) var(--table-header-padding-left, 16px);
@@ -25191,10 +25191,10 @@ h6.next-typography-title {
       z-index: -1; }
   .next-table td {
     padding: 0;
-    border-right: 1px solid #f0f0f0;
-    border-right: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0);
-    border-bottom: 1px solid #f0f0f0;
-    border-bottom: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0); }
+    border-right: 1px solid rgba(0, 0, 0, 0.08);
+    border-right: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08));
+    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
+    border-bottom: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08)); }
     .next-table td .next-table-cell-wrapper {
       padding: 16px 16px;
       padding: var(--table-cell-padding-top, 16px) var(--table-cell-padding-left, 16px);
@@ -25292,8 +25292,8 @@ h6.next-typography-title {
     border-top: 0;
     border-left: 0; }
     .next-table-expanded-row .next-table th, .next-table-expanded-row .next-table td {
-      border-right: 1px solid #f0f0f0;
-      border-right: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0); }
+      border-right: 1px solid rgba(0, 0, 0, 0.08);
+      border-right: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08)); }
     .next-table-expanded-row .next-table.only-bottom-border th, .next-table-expanded-row .next-table.only-bottom-border td {
       border-right: 0; }
     .next-table-expanded-row .next-table .last td {
@@ -25359,14 +25359,14 @@ h6.next-typography-title {
 .next-table-header {
   margin-bottom: -20px;
   padding-bottom: 20px;
-  border-top-left-radius: 6px;
-  border-top-left-radius: var(--table-header-corner-top, 6px);
-  border-top-right-radius: 6px;
-  border-top-right-radius: var(--table-header-corner-top, 6px);
-  border-bottom-left-radius: 6px;
-  border-bottom-left-radius: var(--table-header-corner-bottom, 6px);
-  border-bottom-right-radius: 6px;
-  border-bottom-right-radius: var(--table-header-corner-bottom, 6px);
+  border-top-left-radius: 8px;
+  border-top-left-radius: var(--table-header-corner-top, 8px);
+  border-top-right-radius: 8px;
+  border-top-right-radius: var(--table-header-corner-top, 8px);
+  border-bottom-left-radius: 0px;
+  border-bottom-left-radius: var(--table-header-corner-bottom, 0px);
+  border-bottom-right-radius: 0px;
+  border-bottom-right-radius: var(--table-header-corner-bottom, 0px);
   overflow: -moz-scrollbars-none;
   -ms-overflow-style: none;
   scrollbar-width: none; }
@@ -25379,15 +25379,15 @@ h6.next-typography-title {
   position: relative; }
 
 .next-table-fixed {
-  border-right: 1px solid #f0f0f0;
-  border-right: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0);
-  border-bottom: 1px solid #f0f0f0;
-  border-bottom: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0); }
+  border-right: 1px solid rgba(0, 0, 0, 0.08);
+  border-right: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08));
+  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
+  border-bottom: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08)); }
   .next-table-fixed table {
     table-layout: fixed; }
   .next-table-fixed .next-table-header {
-    background: #fafafa;
-    background: var(--table-th-bg, #fafafa); }
+    background: #f8f9fb;
+    background: var(--table-th-bg, #f8f9fb); }
   .next-table-fixed table tr td:first-child,
   .next-table-fixed table tr th:first-child {
     border-left-width: 0; }
@@ -25449,10 +25449,10 @@ h6.next-typography-title {
     margin-top: 8px;
     margin-top: var(--table-group-split, 8px); }
     .next-table-group .next-table-body table {
-      border-top: 1px solid #f0f0f0;
-      border-top: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0);
-      border-left: 1px solid #f0f0f0;
-      border-left: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0);
+      border-top: 1px solid rgba(0, 0, 0, 0.08);
+      border-top: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08));
+      border-left: 1px solid rgba(0, 0, 0, 0.08);
+      border-left: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08));
       margin-bottom: 8px;
       margin-bottom: var(--table-group-split, 8px); }
       .next-table-group .next-table-body table tr:first-child td {
@@ -25460,10 +25460,10 @@ h6.next-typography-title {
       .next-table-group .next-table-body table:last-of-type {
         margin-bottom: 0; }
   .next-table-group .next-table-header table {
-    border-top: 1px solid #f0f0f0;
-    border-top: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0);
-    border-left: 1px solid #f0f0f0;
-    border-left: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, #f0f0f0); }
+    border-top: 1px solid rgba(0, 0, 0, 0.08);
+    border-top: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08));
+    border-left: 1px solid rgba(0, 0, 0, 0.08);
+    border-left: var(--table-normal-border-width, 1px) var(--table-normal-border-style, solid) var(--table-normal-border-color, rgba(0, 0, 0, 0.08)); }
   .next-table-group .next-table-group-header td {
     background: #fafafa;
     background: var(--table-group-th-bg, #fafafa);
@@ -25511,10 +25511,10 @@ h6.next-typography-title {
 
 .next-table-header-fixer {
   content: " ";
-  border-top-right-radius: 6px;
-  border-top-right-radius: var(--table-header-corner-top, 6px);
-  border-bottom-right-radius: 6px;
-  border-bottom-right-radius: var(--table-header-corner-bottom, 6px);
+  border-top-right-radius: 8px;
+  border-top-right-radius: var(--table-header-corner-top, 8px);
+  border-bottom-right-radius: 0px;
+  border-bottom-right-radius: var(--table-header-corner-bottom, 0px);
   width: 15px;
   background: inherit;
   position: absolute;