@ruixinkeji/prism-ui 1.0.30 → 1.0.32

package/components/PrismAddressInput/PrismAddressInput.vue

@@ -18,7 +18,7 @@
 
     <!-- 模式2: input模式（单行输入） -->
     <view class="address-wrapper input-mode" v-else-if="mode === 'input'">
-      <view class="prism-input-box">
+      <view class="prism-input-wrapper">
         <input
           :placeholder="placeholder"
           v-model="addressValue"
@@ -276,7 +276,7 @@ $color-white: #FFFFFF;
       background: transparent;
       gap: 16rpx;
 
-      .prism-input-box {
+      .prism-input-wrapper {
         flex: 1;
       }
 

package/components/PrismCityCascadeSelect/PrismCityCascadeSelect.vue

@@ -3,7 +3,7 @@
     <!-- 触发器 -->
     <view class="select-trigger" @click="openSelect">
       <slot>
-        <view class="prism-select-box">
+        <view class="prism-select-wrapper">
           <text :class="{ 'placeholder': !displayValue, 'select-text': displayValue }">
             {{ displayValue || placeholder }}
           </text>
@@ -553,7 +553,7 @@ function clearSearch() {
 
 <style lang="scss">
 .prism-city-cascade-select {
-  .prism-select-box {
+  .prism-select-wrapper {
     display: flex;
     align-items: center;
     justify-content: space-between;

package/components/PrismCityPicker/PrismCityPicker.vue

@@ -3,7 +3,7 @@
     <!-- 触发器 -->
     <view class="picker-trigger" @click="openPicker">
       <slot>
-        <view class="prism-select-box">
+        <view class="prism-select-wrapper">
           <text :class="{ 'placeholder': !displayValue, 'select-text': displayValue }">
             {{ displayValue || placeholder }}
           </text>

package/components/PrismCitySelect/PrismCitySelect.vue

@@ -3,7 +3,7 @@
     <!-- 触发器 -->
     <view class="picker-trigger" @click="openPicker">
       <slot>
-        <view class="prism-select-box">
+        <view class="prism-select-wrapper">
           <text :class="{ 'placeholder': !displayValue, 'select-text': displayValue }">
             {{ displayValue || placeholder }}
           </text>
@@ -253,7 +253,7 @@ function clearSearch() {
 
 <style lang="scss">
 .prism-city-select {
-  .prism-select-box {
+  .prism-select-wrapper {
     display: flex;
     align-items: center;
     justify-content: space-between;

package/components/PrismDateTimePicker/PrismDateTimePicker.vue

@@ -3,7 +3,7 @@
     <!-- 触发器 -->
     <view class="picker-trigger" @click="openPicker">
       <slot>
-        <view class="prism-select-box">
+        <view class="prism-select-wrapper">
           <text :class="{ 'placeholder': !displayValue, 'select-text': displayValue }">
             {{ displayValue || placeholder }}
           </text>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ruixinkeji/prism-ui",
-  "version": "1.0.30",
+  "version": "1.0.32",
   "description": "Prism UI - 现代化玻璃态设计 uni-app 组件库",
   "main": "index.js",
   "module": "index.esm.js",

package/styles/prism-ui.css

@@ -2050,14 +2050,14 @@ textarea::placeholder {
 .purple.outline.prism-icon-btn, .purple.outline.prism-text-btn, .purple.outline.prism-icon, .purple.outline.prism-btn, .purple.outline.prism-card {
   background: transparent !important;
   color: #722ED1 !important;
-  border: 2rpx solid #722ED1;
+  border: 2rpx solid #722ED1 !important;
 }
 .purple.outline.prism-icon-btn .fa, .purple.outline.prism-icon-btn .fa-brands, .purple.outline.prism-icon-btn .iconfont, .purple.outline.prism-text-btn .fa, .purple.outline.prism-text-btn .fa-brands, .purple.outline.prism-text-btn .iconfont, .purple.outline.prism-icon .fa, .purple.outline.prism-icon .fa-brands, .purple.outline.prism-icon .iconfont, .purple.outline.prism-btn .fa, .purple.outline.prism-btn .fa-brands, .purple.outline.prism-btn .iconfont, .purple.outline.prism-card .fa, .purple.outline.prism-card .fa-brands, .purple.outline.prism-card .iconfont {
   color: #722ED1 !important;
 }
 .dark-mode .purple.outline.prism-icon-btn, .dark-mode .purple.outline.prism-text-btn, .dark-mode .purple.outline.prism-icon, .dark-mode .purple.outline.prism-btn, .dark-mode .purple.outline.prism-card {
   color: #A855F7 !important;
-  border-color: #A855F7;
+  border-color: #A855F7 !important;
 }
 .dark-mode .purple.outline.prism-icon-btn .fa, .dark-mode .purple.outline.prism-icon-btn .fa-brands, .dark-mode .purple.outline.prism-icon-btn .iconfont, .dark-mode .purple.outline.prism-text-btn .fa, .dark-mode .purple.outline.prism-text-btn .fa-brands, .dark-mode .purple.outline.prism-text-btn .iconfont, .dark-mode .purple.outline.prism-icon .fa, .dark-mode .purple.outline.prism-icon .fa-brands, .dark-mode .purple.outline.prism-icon .iconfont, .dark-mode .purple.outline.prism-btn .fa, .dark-mode .purple.outline.prism-btn .fa-brands, .dark-mode .purple.outline.prism-btn .iconfont, .dark-mode .purple.outline.prism-card .fa, .dark-mode .purple.outline.prism-card .fa-brands, .dark-mode .purple.outline.prism-card .iconfont {
   color: #A855F7 !important;
@@ -2065,14 +2065,14 @@ textarea::placeholder {
 .blue.outline.prism-icon-btn, .blue.outline.prism-text-btn, .blue.outline.prism-icon, .blue.outline.prism-btn, .blue.outline.prism-card {
   background: transparent !important;
   color: #3478F6 !important;
-  border: 2rpx solid #3478F6;
+  border: 2rpx solid #3478F6 !important;
 }
 .blue.outline.prism-icon-btn .fa, .blue.outline.prism-icon-btn .fa-brands, .blue.outline.prism-icon-btn .iconfont, .blue.outline.prism-text-btn .fa, .blue.outline.prism-text-btn .fa-brands, .blue.outline.prism-text-btn .iconfont, .blue.outline.prism-icon .fa, .blue.outline.prism-icon .fa-brands, .blue.outline.prism-icon .iconfont, .blue.outline.prism-btn .fa, .blue.outline.prism-btn .fa-brands, .blue.outline.prism-btn .iconfont, .blue.outline.prism-card .fa, .blue.outline.prism-card .fa-brands, .blue.outline.prism-card .iconfont {
   color: #3478F6 !important;
 }
 .dark-mode .blue.outline.prism-icon-btn, .dark-mode .blue.outline.prism-text-btn, .dark-mode .blue.outline.prism-icon, .dark-mode .blue.outline.prism-btn, .dark-mode .blue.outline.prism-card {
   color: #60A5FA !important;
-  border-color: #60A5FA;
+  border-color: #60A5FA !important;
 }
 .dark-mode .blue.outline.prism-icon-btn .fa, .dark-mode .blue.outline.prism-icon-btn .fa-brands, .dark-mode .blue.outline.prism-icon-btn .iconfont, .dark-mode .blue.outline.prism-text-btn .fa, .dark-mode .blue.outline.prism-text-btn .fa-brands, .dark-mode .blue.outline.prism-text-btn .iconfont, .dark-mode .blue.outline.prism-icon .fa, .dark-mode .blue.outline.prism-icon .fa-brands, .dark-mode .blue.outline.prism-icon .iconfont, .dark-mode .blue.outline.prism-btn .fa, .dark-mode .blue.outline.prism-btn .fa-brands, .dark-mode .blue.outline.prism-btn .iconfont, .dark-mode .blue.outline.prism-card .fa, .dark-mode .blue.outline.prism-card .fa-brands, .dark-mode .blue.outline.prism-card .iconfont {
   color: #60A5FA !important;
@@ -2080,14 +2080,14 @@ textarea::placeholder {
 .green.outline.prism-icon-btn, .outline.prism-icon-btn.success, .green.outline.prism-text-btn, .outline.prism-text-btn.success, .green.outline.prism-icon, .outline.prism-icon.success, .green.outline.prism-btn, .outline.prism-btn.success, .green.outline.prism-card, .outline.prism-card.success {
   background: transparent !important;
   color: #00B42A !important;
-  border: 2rpx solid #00B42A;
+  border: 2rpx solid #00B42A !important;
 }
 .green.outline.prism-icon-btn .fa, .outline.prism-icon-btn.success .fa, .green.outline.prism-icon-btn .fa-brands, .outline.prism-icon-btn.success .fa-brands, .green.outline.prism-icon-btn .iconfont, .outline.prism-icon-btn.success .iconfont, .green.outline.prism-text-btn .fa, .outline.prism-text-btn.success .fa, .green.outline.prism-text-btn .fa-brands, .outline.prism-text-btn.success .fa-brands, .green.outline.prism-text-btn .iconfont, .outline.prism-text-btn.success .iconfont, .green.outline.prism-icon .fa, .outline.prism-icon.success .fa, .green.outline.prism-icon .fa-brands, .outline.prism-icon.success .fa-brands, .green.outline.prism-icon .iconfont, .outline.prism-icon.success .iconfont, .green.outline.prism-btn .fa, .outline.prism-btn.success .fa, .green.outline.prism-btn .fa-brands, .outline.prism-btn.success .fa-brands, .green.outline.prism-btn .iconfont, .outline.prism-btn.success .iconfont, .green.outline.prism-card .fa, .outline.prism-card.success .fa, .green.outline.prism-card .fa-brands, .outline.prism-card.success .fa-brands, .green.outline.prism-card .iconfont, .outline.prism-card.success .iconfont {
   color: #00B42A !important;
 }
 .dark-mode .green.outline.prism-icon-btn, .dark-mode .outline.prism-icon-btn.success, .dark-mode .green.outline.prism-text-btn, .dark-mode .outline.prism-text-btn.success, .dark-mode .green.outline.prism-icon, .dark-mode .outline.prism-icon.success, .dark-mode .green.outline.prism-btn, .dark-mode .outline.prism-btn.success, .dark-mode .green.outline.prism-card, .dark-mode .outline.prism-card.success {
   color: #34D399 !important;
-  border-color: #34D399;
+  border-color: #34D399 !important;
 }
 .dark-mode .green.outline.prism-icon-btn .fa, .dark-mode .outline.prism-icon-btn.success .fa, .dark-mode .green.outline.prism-icon-btn .fa-brands, .dark-mode .outline.prism-icon-btn.success .fa-brands, .dark-mode .green.outline.prism-icon-btn .iconfont, .dark-mode .outline.prism-icon-btn.success .iconfont, .dark-mode .green.outline.prism-text-btn .fa, .dark-mode .outline.prism-text-btn.success .fa, .dark-mode .green.outline.prism-text-btn .fa-brands, .dark-mode .outline.prism-text-btn.success .fa-brands, .dark-mode .green.outline.prism-text-btn .iconfont, .dark-mode .outline.prism-text-btn.success .iconfont, .dark-mode .green.outline.prism-icon .fa, .dark-mode .outline.prism-icon.success .fa, .dark-mode .green.outline.prism-icon .fa-brands, .dark-mode .outline.prism-icon.success .fa-brands, .dark-mode .green.outline.prism-icon .iconfont, .dark-mode .outline.prism-icon.success .iconfont, .dark-mode .green.outline.prism-btn .fa, .dark-mode .outline.prism-btn.success .fa, .dark-mode .green.outline.prism-btn .fa-brands, .dark-mode .outline.prism-btn.success .fa-brands, .dark-mode .green.outline.prism-btn .iconfont, .dark-mode .outline.prism-btn.success .iconfont, .dark-mode .green.outline.prism-card .fa, .dark-mode .outline.prism-card.success .fa, .dark-mode .green.outline.prism-card .fa-brands, .dark-mode .outline.prism-card.success .fa-brands, .dark-mode .green.outline.prism-card .iconfont, .dark-mode .outline.prism-card.success .iconfont {
   color: #34D399 !important;
@@ -2095,14 +2095,14 @@ textarea::placeholder {
 .red.outline.prism-icon-btn, .outline.prism-icon-btn.danger, .red.outline.prism-text-btn, .outline.prism-text-btn.danger, .red.outline.prism-icon, .outline.prism-icon.danger, .red.outline.prism-btn, .outline.prism-btn.danger, .red.outline.prism-card, .outline.prism-card.danger {
   background: transparent !important;
   color: #F53F3F !important;
-  border: 2rpx solid #F53F3F;
+  border: 2rpx solid #F53F3F !important;
 }
 .red.outline.prism-icon-btn .fa, .outline.prism-icon-btn.danger .fa, .red.outline.prism-icon-btn .fa-brands, .outline.prism-icon-btn.danger .fa-brands, .red.outline.prism-icon-btn .iconfont, .outline.prism-icon-btn.danger .iconfont, .red.outline.prism-text-btn .fa, .outline.prism-text-btn.danger .fa, .red.outline.prism-text-btn .fa-brands, .outline.prism-text-btn.danger .fa-brands, .red.outline.prism-text-btn .iconfont, .outline.prism-text-btn.danger .iconfont, .red.outline.prism-icon .fa, .outline.prism-icon.danger .fa, .red.outline.prism-icon .fa-brands, .outline.prism-icon.danger .fa-brands, .red.outline.prism-icon .iconfont, .outline.prism-icon.danger .iconfont, .red.outline.prism-btn .fa, .outline.prism-btn.danger .fa, .red.outline.prism-btn .fa-brands, .outline.prism-btn.danger .fa-brands, .red.outline.prism-btn .iconfont, .outline.prism-btn.danger .iconfont, .red.outline.prism-card .fa, .outline.prism-card.danger .fa, .red.outline.prism-card .fa-brands, .outline.prism-card.danger .fa-brands, .red.outline.prism-card .iconfont, .outline.prism-card.danger .iconfont {
   color: #F53F3F !important;
 }
 .dark-mode .red.outline.prism-icon-btn, .dark-mode .outline.prism-icon-btn.danger, .dark-mode .red.outline.prism-text-btn, .dark-mode .outline.prism-text-btn.danger, .dark-mode .red.outline.prism-icon, .dark-mode .outline.prism-icon.danger, .dark-mode .red.outline.prism-btn, .dark-mode .outline.prism-btn.danger, .dark-mode .red.outline.prism-card, .dark-mode .outline.prism-card.danger {
   color: #F87171 !important;
-  border-color: #F87171;
+  border-color: #F87171 !important;
 }
 .dark-mode .red.outline.prism-icon-btn .fa, .dark-mode .outline.prism-icon-btn.danger .fa, .dark-mode .red.outline.prism-icon-btn .fa-brands, .dark-mode .outline.prism-icon-btn.danger .fa-brands, .dark-mode .red.outline.prism-icon-btn .iconfont, .dark-mode .outline.prism-icon-btn.danger .iconfont, .dark-mode .red.outline.prism-text-btn .fa, .dark-mode .outline.prism-text-btn.danger .fa, .dark-mode .red.outline.prism-text-btn .fa-brands, .dark-mode .outline.prism-text-btn.danger .fa-brands, .dark-mode .red.outline.prism-text-btn .iconfont, .dark-mode .outline.prism-text-btn.danger .iconfont, .dark-mode .red.outline.prism-icon .fa, .dark-mode .outline.prism-icon.danger .fa, .dark-mode .red.outline.prism-icon .fa-brands, .dark-mode .outline.prism-icon.danger .fa-brands, .dark-mode .red.outline.prism-icon .iconfont, .dark-mode .outline.prism-icon.danger .iconfont, .dark-mode .red.outline.prism-btn .fa, .dark-mode .outline.prism-btn.danger .fa, .dark-mode .red.outline.prism-btn .fa-brands, .dark-mode .outline.prism-btn.danger .fa-brands, .dark-mode .red.outline.prism-btn .iconfont, .dark-mode .outline.prism-btn.danger .iconfont, .dark-mode .red.outline.prism-card .fa, .dark-mode .outline.prism-card.danger .fa, .dark-mode .red.outline.prism-card .fa-brands, .dark-mode .outline.prism-card.danger .fa-brands, .dark-mode .red.outline.prism-card .iconfont, .dark-mode .outline.prism-card.danger .iconfont {
   color: #F87171 !important;
@@ -2110,14 +2110,14 @@ textarea::placeholder {
 .orange.outline.prism-icon-btn, .outline.prism-icon-btn.warning, .orange.outline.prism-text-btn, .outline.prism-text-btn.warning, .orange.outline.prism-icon, .outline.prism-icon.warning, .orange.outline.prism-btn, .outline.prism-btn.warning, .orange.outline.prism-card, .outline.prism-card.warning {
   background: transparent !important;
   color: #FF7D00 !important;
-  border: 2rpx solid #FF7D00;
+  border: 2rpx solid #FF7D00 !important;
 }
 .orange.outline.prism-icon-btn .fa, .outline.prism-icon-btn.warning .fa, .orange.outline.prism-icon-btn .fa-brands, .outline.prism-icon-btn.warning .fa-brands, .orange.outline.prism-icon-btn .iconfont, .outline.prism-icon-btn.warning .iconfont, .orange.outline.prism-text-btn .fa, .outline.prism-text-btn.warning .fa, .orange.outline.prism-text-btn .fa-brands, .outline.prism-text-btn.warning .fa-brands, .orange.outline.prism-text-btn .iconfont, .outline.prism-text-btn.warning .iconfont, .orange.outline.prism-icon .fa, .outline.prism-icon.warning .fa, .orange.outline.prism-icon .fa-brands, .outline.prism-icon.warning .fa-brands, .orange.outline.prism-icon .iconfont, .outline.prism-icon.warning .iconfont, .orange.outline.prism-btn .fa, .outline.prism-btn.warning .fa, .orange.outline.prism-btn .fa-brands, .outline.prism-btn.warning .fa-brands, .orange.outline.prism-btn .iconfont, .outline.prism-btn.warning .iconfont, .orange.outline.prism-card .fa, .outline.prism-card.warning .fa, .orange.outline.prism-card .fa-brands, .outline.prism-card.warning .fa-brands, .orange.outline.prism-card .iconfont, .outline.prism-card.warning .iconfont {
   color: #FF7D00 !important;
 }
 .dark-mode .orange.outline.prism-icon-btn, .dark-mode .outline.prism-icon-btn.warning, .dark-mode .orange.outline.prism-text-btn, .dark-mode .outline.prism-text-btn.warning, .dark-mode .orange.outline.prism-icon, .dark-mode .outline.prism-icon.warning, .dark-mode .orange.outline.prism-btn, .dark-mode .outline.prism-btn.warning, .dark-mode .orange.outline.prism-card, .dark-mode .outline.prism-card.warning {
   color: #FB923C !important;
-  border-color: #FB923C;
+  border-color: #FB923C !important;
 }
 .dark-mode .orange.outline.prism-icon-btn .fa, .dark-mode .outline.prism-icon-btn.warning .fa, .dark-mode .orange.outline.prism-icon-btn .fa-brands, .dark-mode .outline.prism-icon-btn.warning .fa-brands, .dark-mode .orange.outline.prism-icon-btn .iconfont, .dark-mode .outline.prism-icon-btn.warning .iconfont, .dark-mode .orange.outline.prism-text-btn .fa, .dark-mode .outline.prism-text-btn.warning .fa, .dark-mode .orange.outline.prism-text-btn .fa-brands, .dark-mode .outline.prism-text-btn.warning .fa-brands, .dark-mode .orange.outline.prism-text-btn .iconfont, .dark-mode .outline.prism-text-btn.warning .iconfont, .dark-mode .orange.outline.prism-icon .fa, .dark-mode .outline.prism-icon.warning .fa, .dark-mode .orange.outline.prism-icon .fa-brands, .dark-mode .outline.prism-icon.warning .fa-brands, .dark-mode .orange.outline.prism-icon .iconfont, .dark-mode .outline.prism-icon.warning .iconfont, .dark-mode .orange.outline.prism-btn .fa, .dark-mode .outline.prism-btn.warning .fa, .dark-mode .orange.outline.prism-btn .fa-brands, .dark-mode .outline.prism-btn.warning .fa-brands, .dark-mode .orange.outline.prism-btn .iconfont, .dark-mode .outline.prism-btn.warning .iconfont, .dark-mode .orange.outline.prism-card .fa, .dark-mode .outline.prism-card.warning .fa, .dark-mode .orange.outline.prism-card .fa-brands, .dark-mode .outline.prism-card.warning .fa-brands, .dark-mode .orange.outline.prism-card .iconfont, .dark-mode .outline.prism-card.warning .iconfont {
   color: #FB923C !important;
@@ -2125,14 +2125,14 @@ textarea::placeholder {
 .cyan.outline.prism-icon-btn, .outline.prism-icon-btn.info, .cyan.outline.prism-text-btn, .outline.prism-text-btn.info, .cyan.outline.prism-icon, .outline.prism-icon.info, .cyan.outline.prism-btn, .outline.prism-btn.info, .cyan.outline.prism-card, .outline.prism-card.info {
   background: transparent !important;
   color: #14C9C9 !important;
-  border: 2rpx solid #14C9C9;
+  border: 2rpx solid #14C9C9 !important;
 }
 .cyan.outline.prism-icon-btn .fa, .outline.prism-icon-btn.info .fa, .cyan.outline.prism-icon-btn .fa-brands, .outline.prism-icon-btn.info .fa-brands, .cyan.outline.prism-icon-btn .iconfont, .outline.prism-icon-btn.info .iconfont, .cyan.outline.prism-text-btn .fa, .outline.prism-text-btn.info .fa, .cyan.outline.prism-text-btn .fa-brands, .outline.prism-text-btn.info .fa-brands, .cyan.outline.prism-text-btn .iconfont, .outline.prism-text-btn.info .iconfont, .cyan.outline.prism-icon .fa, .outline.prism-icon.info .fa, .cyan.outline.prism-icon .fa-brands, .outline.prism-icon.info .fa-brands, .cyan.outline.prism-icon .iconfont, .outline.prism-icon.info .iconfont, .cyan.outline.prism-btn .fa, .outline.prism-btn.info .fa, .cyan.outline.prism-btn .fa-brands, .outline.prism-btn.info .fa-brands, .cyan.outline.prism-btn .iconfont, .outline.prism-btn.info .iconfont, .cyan.outline.prism-card .fa, .outline.prism-card.info .fa, .cyan.outline.prism-card .fa-brands, .outline.prism-card.info .fa-brands, .cyan.outline.prism-card .iconfont, .outline.prism-card.info .iconfont {
   color: #14C9C9 !important;
 }
 .dark-mode .cyan.outline.prism-icon-btn, .dark-mode .outline.prism-icon-btn.info, .dark-mode .cyan.outline.prism-text-btn, .dark-mode .outline.prism-text-btn.info, .dark-mode .cyan.outline.prism-icon, .dark-mode .outline.prism-icon.info, .dark-mode .cyan.outline.prism-btn, .dark-mode .outline.prism-btn.info, .dark-mode .cyan.outline.prism-card, .dark-mode .outline.prism-card.info {
   color: #22D3EE !important;
-  border-color: #22D3EE;
+  border-color: #22D3EE !important;
 }
 .dark-mode .cyan.outline.prism-icon-btn .fa, .dark-mode .outline.prism-icon-btn.info .fa, .dark-mode .cyan.outline.prism-icon-btn .fa-brands, .dark-mode .outline.prism-icon-btn.info .fa-brands, .dark-mode .cyan.outline.prism-icon-btn .iconfont, .dark-mode .outline.prism-icon-btn.info .iconfont, .dark-mode .cyan.outline.prism-text-btn .fa, .dark-mode .outline.prism-text-btn.info .fa, .dark-mode .cyan.outline.prism-text-btn .fa-brands, .dark-mode .outline.prism-text-btn.info .fa-brands, .dark-mode .cyan.outline.prism-text-btn .iconfont, .dark-mode .outline.prism-text-btn.info .iconfont, .dark-mode .cyan.outline.prism-icon .fa, .dark-mode .outline.prism-icon.info .fa, .dark-mode .cyan.outline.prism-icon .fa-brands, .dark-mode .outline.prism-icon.info .fa-brands, .dark-mode .cyan.outline.prism-icon .iconfont, .dark-mode .outline.prism-icon.info .iconfont, .dark-mode .cyan.outline.prism-btn .fa, .dark-mode .outline.prism-btn.info .fa, .dark-mode .cyan.outline.prism-btn .fa-brands, .dark-mode .outline.prism-btn.info .fa-brands, .dark-mode .cyan.outline.prism-btn .iconfont, .dark-mode .outline.prism-btn.info .iconfont, .dark-mode .cyan.outline.prism-card .fa, .dark-mode .outline.prism-card.info .fa, .dark-mode .cyan.outline.prism-card .fa-brands, .dark-mode .outline.prism-card.info .fa-brands, .dark-mode .cyan.outline.prism-card .iconfont, .dark-mode .outline.prism-card.info .iconfont {
   color: #22D3EE !important;
@@ -2140,14 +2140,14 @@ textarea::placeholder {
 .yellow.outline.prism-icon-btn, .yellow.outline.prism-text-btn, .yellow.outline.prism-icon, .yellow.outline.prism-btn, .yellow.outline.prism-card {
   background: transparent !important;
   color: #FFB400 !important;
-  border: 2rpx solid #FFB400;
+  border: 2rpx solid #FFB400 !important;
 }
 .yellow.outline.prism-icon-btn .fa, .yellow.outline.prism-icon-btn .fa-brands, .yellow.outline.prism-icon-btn .iconfont, .yellow.outline.prism-text-btn .fa, .yellow.outline.prism-text-btn .fa-brands, .yellow.outline.prism-text-btn .iconfont, .yellow.outline.prism-icon .fa, .yellow.outline.prism-icon .fa-brands, .yellow.outline.prism-icon .iconfont, .yellow.outline.prism-btn .fa, .yellow.outline.prism-btn .fa-brands, .yellow.outline.prism-btn .iconfont, .yellow.outline.prism-card .fa, .yellow.outline.prism-card .fa-brands, .yellow.outline.prism-card .iconfont {
   color: #FFB400 !important;
 }
 .dark-mode .yellow.outline.prism-icon-btn, .dark-mode .yellow.outline.prism-text-btn, .dark-mode .yellow.outline.prism-icon, .dark-mode .yellow.outline.prism-btn, .dark-mode .yellow.outline.prism-card {
   color: #FCD34D !important;
-  border-color: #FCD34D;
+  border-color: #FCD34D !important;
 }
 .dark-mode .yellow.outline.prism-icon-btn .fa, .dark-mode .yellow.outline.prism-icon-btn .fa-brands, .dark-mode .yellow.outline.prism-icon-btn .iconfont, .dark-mode .yellow.outline.prism-text-btn .fa, .dark-mode .yellow.outline.prism-text-btn .fa-brands, .dark-mode .yellow.outline.prism-text-btn .iconfont, .dark-mode .yellow.outline.prism-icon .fa, .dark-mode .yellow.outline.prism-icon .fa-brands, .dark-mode .yellow.outline.prism-icon .iconfont, .dark-mode .yellow.outline.prism-btn .fa, .dark-mode .yellow.outline.prism-btn .fa-brands, .dark-mode .yellow.outline.prism-btn .iconfont, .dark-mode .yellow.outline.prism-card .fa, .dark-mode .yellow.outline.prism-card .fa-brands, .dark-mode .yellow.outline.prism-card .iconfont {
   color: #FCD34D !important;
@@ -2155,14 +2155,14 @@ textarea::placeholder {
 .pink.outline.prism-icon-btn, .pink.outline.prism-text-btn, .pink.outline.prism-icon, .pink.outline.prism-btn, .pink.outline.prism-card {
   background: transparent !important;
   color: #F53F7F !important;
-  border: 2rpx solid #F53F7F;
+  border: 2rpx solid #F53F7F !important;
 }
 .pink.outline.prism-icon-btn .fa, .pink.outline.prism-icon-btn .fa-brands, .pink.outline.prism-icon-btn .iconfont, .pink.outline.prism-text-btn .fa, .pink.outline.prism-text-btn .fa-brands, .pink.outline.prism-text-btn .iconfont, .pink.outline.prism-icon .fa, .pink.outline.prism-icon .fa-brands, .pink.outline.prism-icon .iconfont, .pink.outline.prism-btn .fa, .pink.outline.prism-btn .fa-brands, .pink.outline.prism-btn .iconfont, .pink.outline.prism-card .fa, .pink.outline.prism-card .fa-brands, .pink.outline.prism-card .iconfont {
   color: #F53F7F !important;
 }
 .dark-mode .pink.outline.prism-icon-btn, .dark-mode .pink.outline.prism-text-btn, .dark-mode .pink.outline.prism-icon, .dark-mode .pink.outline.prism-btn, .dark-mode .pink.outline.prism-card {
   color: #F472B6 !important;
-  border-color: #F472B6;
+  border-color: #F472B6 !important;
 }
 .dark-mode .pink.outline.prism-icon-btn .fa, .dark-mode .pink.outline.prism-icon-btn .fa-brands, .dark-mode .pink.outline.prism-icon-btn .iconfont, .dark-mode .pink.outline.prism-text-btn .fa, .dark-mode .pink.outline.prism-text-btn .fa-brands, .dark-mode .pink.outline.prism-text-btn .iconfont, .dark-mode .pink.outline.prism-icon .fa, .dark-mode .pink.outline.prism-icon .fa-brands, .dark-mode .pink.outline.prism-icon .iconfont, .dark-mode .pink.outline.prism-btn .fa, .dark-mode .pink.outline.prism-btn .fa-brands, .dark-mode .pink.outline.prism-btn .iconfont, .dark-mode .pink.outline.prism-card .fa, .dark-mode .pink.outline.prism-card .fa-brands, .dark-mode .pink.outline.prism-card .iconfont {
   color: #F472B6 !important;
@@ -2170,14 +2170,14 @@ textarea::placeholder {
 .magenta.outline.prism-icon-btn, .magenta.outline.prism-text-btn, .magenta.outline.prism-icon, .magenta.outline.prism-btn, .magenta.outline.prism-card {
   background: transparent !important;
   color: #EB2F96 !important;
-  border: 2rpx solid #EB2F96;
+  border: 2rpx solid #EB2F96 !important;
 }
 .magenta.outline.prism-icon-btn .fa, .magenta.outline.prism-icon-btn .fa-brands, .magenta.outline.prism-icon-btn .iconfont, .magenta.outline.prism-text-btn .fa, .magenta.outline.prism-text-btn .fa-brands, .magenta.outline.prism-text-btn .iconfont, .magenta.outline.prism-icon .fa, .magenta.outline.prism-icon .fa-brands, .magenta.outline.prism-icon .iconfont, .magenta.outline.prism-btn .fa, .magenta.outline.prism-btn .fa-brands, .magenta.outline.prism-btn .iconfont, .magenta.outline.prism-card .fa, .magenta.outline.prism-card .fa-brands, .magenta.outline.prism-card .iconfont {
   color: #EB2F96 !important;
 }
 .dark-mode .magenta.outline.prism-icon-btn, .dark-mode .magenta.outline.prism-text-btn, .dark-mode .magenta.outline.prism-icon, .dark-mode .magenta.outline.prism-btn, .dark-mode .magenta.outline.prism-card {
   color: #EC4899 !important;
-  border-color: #EC4899;
+  border-color: #EC4899 !important;
 }
 .dark-mode .magenta.outline.prism-icon-btn .fa, .dark-mode .magenta.outline.prism-icon-btn .fa-brands, .dark-mode .magenta.outline.prism-icon-btn .iconfont, .dark-mode .magenta.outline.prism-text-btn .fa, .dark-mode .magenta.outline.prism-text-btn .fa-brands, .dark-mode .magenta.outline.prism-text-btn .iconfont, .dark-mode .magenta.outline.prism-icon .fa, .dark-mode .magenta.outline.prism-icon .fa-brands, .dark-mode .magenta.outline.prism-icon .iconfont, .dark-mode .magenta.outline.prism-btn .fa, .dark-mode .magenta.outline.prism-btn .fa-brands, .dark-mode .magenta.outline.prism-btn .iconfont, .dark-mode .magenta.outline.prism-card .fa, .dark-mode .magenta.outline.prism-card .fa-brands, .dark-mode .magenta.outline.prism-card .iconfont {
   color: #EC4899 !important;
@@ -2185,14 +2185,14 @@ textarea::placeholder {
 .indigo.outline.prism-icon-btn, .indigo.outline.prism-text-btn, .indigo.outline.prism-icon, .indigo.outline.prism-btn, .indigo.outline.prism-card {
   background: transparent !important;
   color: #2F54EB !important;
-  border: 2rpx solid #2F54EB;
+  border: 2rpx solid #2F54EB !important;
 }
 .indigo.outline.prism-icon-btn .fa, .indigo.outline.prism-icon-btn .fa-brands, .indigo.outline.prism-icon-btn .iconfont, .indigo.outline.prism-text-btn .fa, .indigo.outline.prism-text-btn .fa-brands, .indigo.outline.prism-text-btn .iconfont, .indigo.outline.prism-icon .fa, .indigo.outline.prism-icon .fa-brands, .indigo.outline.prism-icon .iconfont, .indigo.outline.prism-btn .fa, .indigo.outline.prism-btn .fa-brands, .indigo.outline.prism-btn .iconfont, .indigo.outline.prism-card .fa, .indigo.outline.prism-card .fa-brands, .indigo.outline.prism-card .iconfont {
   color: #2F54EB !important;
 }
 .dark-mode .indigo.outline.prism-icon-btn, .dark-mode .indigo.outline.prism-text-btn, .dark-mode .indigo.outline.prism-icon, .dark-mode .indigo.outline.prism-btn, .dark-mode .indigo.outline.prism-card {
   color: #818CF8 !important;
-  border-color: #818CF8;
+  border-color: #818CF8 !important;
 }
 .dark-mode .indigo.outline.prism-icon-btn .fa, .dark-mode .indigo.outline.prism-icon-btn .fa-brands, .dark-mode .indigo.outline.prism-icon-btn .iconfont, .dark-mode .indigo.outline.prism-text-btn .fa, .dark-mode .indigo.outline.prism-text-btn .fa-brands, .dark-mode .indigo.outline.prism-text-btn .iconfont, .dark-mode .indigo.outline.prism-icon .fa, .dark-mode .indigo.outline.prism-icon .fa-brands, .dark-mode .indigo.outline.prism-icon .iconfont, .dark-mode .indigo.outline.prism-btn .fa, .dark-mode .indigo.outline.prism-btn .fa-brands, .dark-mode .indigo.outline.prism-btn .iconfont, .dark-mode .indigo.outline.prism-card .fa, .dark-mode .indigo.outline.prism-card .fa-brands, .dark-mode .indigo.outline.prism-card .iconfont {
   color: #818CF8 !important;
@@ -2200,14 +2200,14 @@ textarea::placeholder {
 .teal.outline.prism-icon-btn, .teal.outline.prism-text-btn, .teal.outline.prism-icon, .teal.outline.prism-btn, .teal.outline.prism-card {
   background: transparent !important;
   color: #13C2C2 !important;
-  border: 2rpx solid #13C2C2;
+  border: 2rpx solid #13C2C2 !important;
 }
 .teal.outline.prism-icon-btn .fa, .teal.outline.prism-icon-btn .fa-brands, .teal.outline.prism-icon-btn .iconfont, .teal.outline.prism-text-btn .fa, .teal.outline.prism-text-btn .fa-brands, .teal.outline.prism-text-btn .iconfont, .teal.outline.prism-icon .fa, .teal.outline.prism-icon .fa-brands, .teal.outline.prism-icon .iconfont, .teal.outline.prism-btn .fa, .teal.outline.prism-btn .fa-brands, .teal.outline.prism-btn .iconfont, .teal.outline.prism-card .fa, .teal.outline.prism-card .fa-brands, .teal.outline.prism-card .iconfont {
   color: #13C2C2 !important;
 }
 .dark-mode .teal.outline.prism-icon-btn, .dark-mode .teal.outline.prism-text-btn, .dark-mode .teal.outline.prism-icon, .dark-mode .teal.outline.prism-btn, .dark-mode .teal.outline.prism-card {
   color: #2DD4BF !important;
-  border-color: #2DD4BF;
+  border-color: #2DD4BF !important;
 }
 .dark-mode .teal.outline.prism-icon-btn .fa, .dark-mode .teal.outline.prism-icon-btn .fa-brands, .dark-mode .teal.outline.prism-icon-btn .iconfont, .dark-mode .teal.outline.prism-text-btn .fa, .dark-mode .teal.outline.prism-text-btn .fa-brands, .dark-mode .teal.outline.prism-text-btn .iconfont, .dark-mode .teal.outline.prism-icon .fa, .dark-mode .teal.outline.prism-icon .fa-brands, .dark-mode .teal.outline.prism-icon .iconfont, .dark-mode .teal.outline.prism-btn .fa, .dark-mode .teal.outline.prism-btn .fa-brands, .dark-mode .teal.outline.prism-btn .iconfont, .dark-mode .teal.outline.prism-card .fa, .dark-mode .teal.outline.prism-card .fa-brands, .dark-mode .teal.outline.prism-card .iconfont {
   color: #2DD4BF !important;
@@ -2215,14 +2215,14 @@ textarea::placeholder {
 .violet.outline.prism-icon-btn, .violet.outline.prism-text-btn, .violet.outline.prism-icon, .violet.outline.prism-btn, .violet.outline.prism-card {
   background: transparent !important;
   color: #667eea !important;
-  border: 2rpx solid #667eea;
+  border: 2rpx solid #667eea !important;
 }
 .violet.outline.prism-icon-btn .fa, .violet.outline.prism-icon-btn .fa-brands, .violet.outline.prism-icon-btn .iconfont, .violet.outline.prism-text-btn .fa, .violet.outline.prism-text-btn .fa-brands, .violet.outline.prism-text-btn .iconfont, .violet.outline.prism-icon .fa, .violet.outline.prism-icon .fa-brands, .violet.outline.prism-icon .iconfont, .violet.outline.prism-btn .fa, .violet.outline.prism-btn .fa-brands, .violet.outline.prism-btn .iconfont, .violet.outline.prism-card .fa, .violet.outline.prism-card .fa-brands, .violet.outline.prism-card .iconfont {
   color: #667eea !important;
 }
 .dark-mode .violet.outline.prism-icon-btn, .dark-mode .violet.outline.prism-text-btn, .dark-mode .violet.outline.prism-icon, .dark-mode .violet.outline.prism-btn, .dark-mode .violet.outline.prism-card {
   color: #8599ee !important;
-  border-color: #8599ee;
+  border-color: #8599ee !important;
 }
 .dark-mode .violet.outline.prism-icon-btn .fa, .dark-mode .violet.outline.prism-icon-btn .fa-brands, .dark-mode .violet.outline.prism-icon-btn .iconfont, .dark-mode .violet.outline.prism-text-btn .fa, .dark-mode .violet.outline.prism-text-btn .fa-brands, .dark-mode .violet.outline.prism-text-btn .iconfont, .dark-mode .violet.outline.prism-icon .fa, .dark-mode .violet.outline.prism-icon .fa-brands, .dark-mode .violet.outline.prism-icon .iconfont, .dark-mode .violet.outline.prism-btn .fa, .dark-mode .violet.outline.prism-btn .fa-brands, .dark-mode .violet.outline.prism-btn .iconfont, .dark-mode .violet.outline.prism-card .fa, .dark-mode .violet.outline.prism-card .fa-brands, .dark-mode .violet.outline.prism-card .iconfont {
   color: #8599ee !important;
@@ -2230,14 +2230,14 @@ textarea::placeholder {
 .rose.outline.prism-icon-btn, .rose.outline.prism-text-btn, .rose.outline.prism-icon, .rose.outline.prism-btn, .rose.outline.prism-card {
   background: transparent !important;
   color: #f093fb !important;
-  border: 2rpx solid #f093fb;
+  border: 2rpx solid #f093fb !important;
 }
 .rose.outline.prism-icon-btn .fa, .rose.outline.prism-icon-btn .fa-brands, .rose.outline.prism-icon-btn .iconfont, .rose.outline.prism-text-btn .fa, .rose.outline.prism-text-btn .fa-brands, .rose.outline.prism-text-btn .iconfont, .rose.outline.prism-icon .fa, .rose.outline.prism-icon .fa-brands, .rose.outline.prism-icon .iconfont, .rose.outline.prism-btn .fa, .rose.outline.prism-btn .fa-brands, .rose.outline.prism-btn .iconfont, .rose.outline.prism-card .fa, .rose.outline.prism-card .fa-brands, .rose.outline.prism-card .iconfont {
   color: #f093fb !important;
 }
 .dark-mode .rose.outline.prism-icon-btn, .dark-mode .rose.outline.prism-text-btn, .dark-mode .rose.outline.prism-icon, .dark-mode .rose.outline.prism-btn, .dark-mode .rose.outline.prism-card {
   color: #f5576c !important;
-  border-color: #f5576c;
+  border-color: #f5576c !important;
 }
 .dark-mode .rose.outline.prism-icon-btn .fa, .dark-mode .rose.outline.prism-icon-btn .fa-brands, .dark-mode .rose.outline.prism-icon-btn .iconfont, .dark-mode .rose.outline.prism-text-btn .fa, .dark-mode .rose.outline.prism-text-btn .fa-brands, .dark-mode .rose.outline.prism-text-btn .iconfont, .dark-mode .rose.outline.prism-icon .fa, .dark-mode .rose.outline.prism-icon .fa-brands, .dark-mode .rose.outline.prism-icon .iconfont, .dark-mode .rose.outline.prism-btn .fa, .dark-mode .rose.outline.prism-btn .fa-brands, .dark-mode .rose.outline.prism-btn .iconfont, .dark-mode .rose.outline.prism-card .fa, .dark-mode .rose.outline.prism-card .fa-brands, .dark-mode .rose.outline.prism-card .iconfont {
   color: #f5576c !important;
@@ -2245,14 +2245,14 @@ textarea::placeholder {
 .ai.outline.prism-icon-btn, .ai.outline.prism-text-btn, .ai.outline.prism-icon, .ai.outline.prism-btn, .ai.outline.prism-card {
   background: transparent !important;
   color: #c44569 !important;
-  border: 2rpx solid #c44569;
+  border: 2rpx solid #c44569 !important;
 }
 .ai.outline.prism-icon-btn .fa, .ai.outline.prism-icon-btn .fa-brands, .ai.outline.prism-icon-btn .iconfont, .ai.outline.prism-text-btn .fa, .ai.outline.prism-text-btn .fa-brands, .ai.outline.prism-text-btn .iconfont, .ai.outline.prism-icon .fa, .ai.outline.prism-icon .fa-brands, .ai.outline.prism-icon .iconfont, .ai.outline.prism-btn .fa, .ai.outline.prism-btn .fa-brands, .ai.outline.prism-btn .iconfont, .ai.outline.prism-card .fa, .ai.outline.prism-card .fa-brands, .ai.outline.prism-card .iconfont {
   color: #c44569 !important;
 }
 .dark-mode .ai.outline.prism-icon-btn, .dark-mode .ai.outline.prism-text-btn, .dark-mode .ai.outline.prism-icon, .dark-mode .ai.outline.prism-btn, .dark-mode .ai.outline.prism-card {
   color: #ee5a6f !important;
-  border-color: #ee5a6f;
+  border-color: #ee5a6f !important;
 }
 .dark-mode .ai.outline.prism-icon-btn .fa, .dark-mode .ai.outline.prism-icon-btn .fa-brands, .dark-mode .ai.outline.prism-icon-btn .iconfont, .dark-mode .ai.outline.prism-text-btn .fa, .dark-mode .ai.outline.prism-text-btn .fa-brands, .dark-mode .ai.outline.prism-text-btn .iconfont, .dark-mode .ai.outline.prism-icon .fa, .dark-mode .ai.outline.prism-icon .fa-brands, .dark-mode .ai.outline.prism-icon .iconfont, .dark-mode .ai.outline.prism-btn .fa, .dark-mode .ai.outline.prism-btn .fa-brands, .dark-mode .ai.outline.prism-btn .iconfont, .dark-mode .ai.outline.prism-card .fa, .dark-mode .ai.outline.prism-card .fa-brands, .dark-mode .ai.outline.prism-card .iconfont {
   color: #ee5a6f !important;
@@ -2260,14 +2260,14 @@ textarea::placeholder {
 .success.outline.prism-icon-btn, .success.outline.prism-text-btn, .success.outline.prism-icon, .success.outline.prism-btn, .success.outline.prism-card {
   background: transparent !important;
   color: #00B42A !important;
-  border: 2rpx solid #00B42A;
+  border: 2rpx solid #00B42A !important;
 }
 .success.outline.prism-icon-btn .fa, .success.outline.prism-icon-btn .fa-brands, .success.outline.prism-icon-btn .iconfont, .success.outline.prism-text-btn .fa, .success.outline.prism-text-btn .fa-brands, .success.outline.prism-text-btn .iconfont, .success.outline.prism-icon .fa, .success.outline.prism-icon .fa-brands, .success.outline.prism-icon .iconfont, .success.outline.prism-btn .fa, .success.outline.prism-btn .fa-brands, .success.outline.prism-btn .iconfont, .success.outline.prism-card .fa, .success.outline.prism-card .fa-brands, .success.outline.prism-card .iconfont {
   color: #00B42A !important;
 }
 .dark-mode .success.outline.prism-icon-btn, .dark-mode .success.outline.prism-text-btn, .dark-mode .success.outline.prism-icon, .dark-mode .success.outline.prism-btn, .dark-mode .success.outline.prism-card {
   color: #34D399 !important;
-  border-color: #34D399;
+  border-color: #34D399 !important;
 }
 .dark-mode .success.outline.prism-icon-btn .fa, .dark-mode .success.outline.prism-icon-btn .fa-brands, .dark-mode .success.outline.prism-icon-btn .iconfont, .dark-mode .success.outline.prism-text-btn .fa, .dark-mode .success.outline.prism-text-btn .fa-brands, .dark-mode .success.outline.prism-text-btn .iconfont, .dark-mode .success.outline.prism-icon .fa, .dark-mode .success.outline.prism-icon .fa-brands, .dark-mode .success.outline.prism-icon .iconfont, .dark-mode .success.outline.prism-btn .fa, .dark-mode .success.outline.prism-btn .fa-brands, .dark-mode .success.outline.prism-btn .iconfont, .dark-mode .success.outline.prism-card .fa, .dark-mode .success.outline.prism-card .fa-brands, .dark-mode .success.outline.prism-card .iconfont {
   color: #34D399 !important;
@@ -2275,14 +2275,14 @@ textarea::placeholder {
 .warning.outline.prism-icon-btn, .warning.outline.prism-text-btn, .warning.outline.prism-icon, .warning.outline.prism-btn, .warning.outline.prism-card {
   background: transparent !important;
   color: #FF7D00 !important;
-  border: 2rpx solid #FF7D00;
+  border: 2rpx solid #FF7D00 !important;
 }
 .warning.outline.prism-icon-btn .fa, .warning.outline.prism-icon-btn .fa-brands, .warning.outline.prism-icon-btn .iconfont, .warning.outline.prism-text-btn .fa, .warning.outline.prism-text-btn .fa-brands, .warning.outline.prism-text-btn .iconfont, .warning.outline.prism-icon .fa, .warning.outline.prism-icon .fa-brands, .warning.outline.prism-icon .iconfont, .warning.outline.prism-btn .fa, .warning.outline.prism-btn .fa-brands, .warning.outline.prism-btn .iconfont, .warning.outline.prism-card .fa, .warning.outline.prism-card .fa-brands, .warning.outline.prism-card .iconfont {
   color: #FF7D00 !important;
 }
 .dark-mode .warning.outline.prism-icon-btn, .dark-mode .warning.outline.prism-text-btn, .dark-mode .warning.outline.prism-icon, .dark-mode .warning.outline.prism-btn, .dark-mode .warning.outline.prism-card {
   color: #FB923C !important;
-  border-color: #FB923C;
+  border-color: #FB923C !important;
 }
 .dark-mode .warning.outline.prism-icon-btn .fa, .dark-mode .warning.outline.prism-icon-btn .fa-brands, .dark-mode .warning.outline.prism-icon-btn .iconfont, .dark-mode .warning.outline.prism-text-btn .fa, .dark-mode .warning.outline.prism-text-btn .fa-brands, .dark-mode .warning.outline.prism-text-btn .iconfont, .dark-mode .warning.outline.prism-icon .fa, .dark-mode .warning.outline.prism-icon .fa-brands, .dark-mode .warning.outline.prism-icon .iconfont, .dark-mode .warning.outline.prism-btn .fa, .dark-mode .warning.outline.prism-btn .fa-brands, .dark-mode .warning.outline.prism-btn .iconfont, .dark-mode .warning.outline.prism-card .fa, .dark-mode .warning.outline.prism-card .fa-brands, .dark-mode .warning.outline.prism-card .iconfont {
   color: #FB923C !important;
@@ -2290,14 +2290,14 @@ textarea::placeholder {
 .danger.outline.prism-icon-btn, .danger.outline.prism-text-btn, .danger.outline.prism-icon, .danger.outline.prism-btn, .danger.outline.prism-card {
   background: transparent !important;
   color: #F53F3F !important;
-  border: 2rpx solid #F53F3F;
+  border: 2rpx solid #F53F3F !important;
 }
 .danger.outline.prism-icon-btn .fa, .danger.outline.prism-icon-btn .fa-brands, .danger.outline.prism-icon-btn .iconfont, .danger.outline.prism-text-btn .fa, .danger.outline.prism-text-btn .fa-brands, .danger.outline.prism-text-btn .iconfont, .danger.outline.prism-icon .fa, .danger.outline.prism-icon .fa-brands, .danger.outline.prism-icon .iconfont, .danger.outline.prism-btn .fa, .danger.outline.prism-btn .fa-brands, .danger.outline.prism-btn .iconfont, .danger.outline.prism-card .fa, .danger.outline.prism-card .fa-brands, .danger.outline.prism-card .iconfont {
   color: #F53F3F !important;
 }
 .dark-mode .danger.outline.prism-icon-btn, .dark-mode .danger.outline.prism-text-btn, .dark-mode .danger.outline.prism-icon, .dark-mode .danger.outline.prism-btn, .dark-mode .danger.outline.prism-card {
   color: #F87171 !important;
-  border-color: #F87171;
+  border-color: #F87171 !important;
 }
 .dark-mode .danger.outline.prism-icon-btn .fa, .dark-mode .danger.outline.prism-icon-btn .fa-brands, .dark-mode .danger.outline.prism-icon-btn .iconfont, .dark-mode .danger.outline.prism-text-btn .fa, .dark-mode .danger.outline.prism-text-btn .fa-brands, .dark-mode .danger.outline.prism-text-btn .iconfont, .dark-mode .danger.outline.prism-icon .fa, .dark-mode .danger.outline.prism-icon .fa-brands, .dark-mode .danger.outline.prism-icon .iconfont, .dark-mode .danger.outline.prism-btn .fa, .dark-mode .danger.outline.prism-btn .fa-brands, .dark-mode .danger.outline.prism-btn .iconfont, .dark-mode .danger.outline.prism-card .fa, .dark-mode .danger.outline.prism-card .fa-brands, .dark-mode .danger.outline.prism-card .iconfont {
   color: #F87171 !important;
@@ -2305,14 +2305,14 @@ textarea::placeholder {
 .info.outline.prism-icon-btn, .info.outline.prism-text-btn, .info.outline.prism-icon, .info.outline.prism-btn, .info.outline.prism-card {
   background: transparent !important;
   color: #14C9C9 !important;
-  border: 2rpx solid #14C9C9;
+  border: 2rpx solid #14C9C9 !important;
 }
 .info.outline.prism-icon-btn .fa, .info.outline.prism-icon-btn .fa-brands, .info.outline.prism-icon-btn .iconfont, .info.outline.prism-text-btn .fa, .info.outline.prism-text-btn .fa-brands, .info.outline.prism-text-btn .iconfont, .info.outline.prism-icon .fa, .info.outline.prism-icon .fa-brands, .info.outline.prism-icon .iconfont, .info.outline.prism-btn .fa, .info.outline.prism-btn .fa-brands, .info.outline.prism-btn .iconfont, .info.outline.prism-card .fa, .info.outline.prism-card .fa-brands, .info.outline.prism-card .iconfont {
   color: #14C9C9 !important;
 }
 .dark-mode .info.outline.prism-icon-btn, .dark-mode .info.outline.prism-text-btn, .dark-mode .info.outline.prism-icon, .dark-mode .info.outline.prism-btn, .dark-mode .info.outline.prism-card {
   color: #22D3EE !important;
-  border-color: #22D3EE;
+  border-color: #22D3EE !important;
 }
 .dark-mode .info.outline.prism-icon-btn .fa, .dark-mode .info.outline.prism-icon-btn .fa-brands, .dark-mode .info.outline.prism-icon-btn .iconfont, .dark-mode .info.outline.prism-text-btn .fa, .dark-mode .info.outline.prism-text-btn .fa-brands, .dark-mode .info.outline.prism-text-btn .iconfont, .dark-mode .info.outline.prism-icon .fa, .dark-mode .info.outline.prism-icon .fa-brands, .dark-mode .info.outline.prism-icon .iconfont, .dark-mode .info.outline.prism-btn .fa, .dark-mode .info.outline.prism-btn .fa-brands, .dark-mode .info.outline.prism-btn .iconfont, .dark-mode .info.outline.prism-card .fa, .dark-mode .info.outline.prism-card .fa-brands, .dark-mode .info.outline.prism-card .iconfont {
   color: #22D3EE !important;
@@ -2816,7 +2816,7 @@ textarea::placeholder {
   opacity: 0.5;
   pointer-events: none;
 }
-.prism-input-box {
+.prism-input-wrapper {
   display: flex;
   align-items: center;
   background: var(--prism-input-bg, #EBEEF2);
@@ -2825,21 +2825,21 @@ textarea::placeholder {
   min-height: 88rpx;
   transition: all 0.3s ease;
 }
-.prism-input-box:focus-within {
+.prism-input-wrapper:focus-within {
   background: var(--prism-primary-light, #E3EEFF);
 }
-.prism-input-box .prefix-icon {
+.prism-input-wrapper .prefix-icon {
   margin-right: 16rpx;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
 }
-.prism-input-box .prefix-icon .fa, .prism-input-box .prefix-icon .fa-solid {
+.prism-input-wrapper .prefix-icon .fa, .prism-input-wrapper .prefix-icon .fa-solid {
   font-size: 32rpx;
   color: var(--prism-text-secondary, #86909C);
 }
-.prism-input-box .input, .prism-input-box input, .prism-input-box textarea {
+.prism-input-wrapper .input, .prism-input-wrapper input, .prism-input-wrapper textarea {
   flex: 1;
   font-size: 28rpx;
   color: var(--prism-text-primary);
@@ -2847,29 +2847,29 @@ textarea::placeholder {
   border: none;
   outline: none;
 }
-.prism-input-box .clear-icon {
+.prism-input-wrapper .clear-icon {
   padding: 16rpx 0 16rpx 16rpx;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
 }
-.prism-input-box .clear-icon .fa-circle-xmark {
+.prism-input-wrapper .clear-icon .fa-circle-xmark {
   font-size: 32rpx;
   color: var(--prism-text-placeholder, #C9CDD4);
 }
-.prism-input-box .eye-icon {
+.prism-input-wrapper .eye-icon {
   padding: 16rpx 0 16rpx 16rpx;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
 }
-.prism-input-box .eye-icon .fa-solid, .prism-input-box .eye-icon .fa {
+.prism-input-wrapper .eye-icon .fa-solid, .prism-input-wrapper .eye-icon .fa {
   font-size: 32rpx;
   color: var(--prism-text-placeholder, #C9CDD4);
 }
-.prism-input-box .code-btn {
+.prism-input-wrapper .code-btn {
   padding: 18rpx 0 18rpx 28rpx;
   font-size: 28rpx;
   color: var(--prism-primary-color, #3478F6);
@@ -2877,25 +2877,25 @@ textarea::placeholder {
   font-weight: 500;
   flex-shrink: 0;
 }
-.prism-input-box .code-btn.disabled {
+.prism-input-wrapper .code-btn.disabled {
   color: var(--prism-text-placeholder, #C9CDD4);
 }
-.dark-mode .prism-input-box {
+.dark-mode .prism-input-wrapper {
   background: var(--prism-input-bg, #2A2A2A);
 }
-.dark-mode .prism-input-box:focus-within {
+.dark-mode .prism-input-wrapper:focus-within {
   background: rgba(52, 120, 246, 0.12);
   box-shadow: 0 0 0 2rpx rgba(52, 120, 246, 0.4), 0 4rpx 16rpx rgba(52, 120, 246, 0.15);
 }
-.dark-mode .prism-input-box .clear-icon .fa-circle-xmark,
-.dark-mode .prism-input-box .eye-icon .fa-solid,
-.dark-mode .prism-input-box .eye-icon .fa {
+.dark-mode .prism-input-wrapper .clear-icon .fa-circle-xmark,
+.dark-mode .prism-input-wrapper .eye-icon .fa-solid,
+.dark-mode .prism-input-wrapper .eye-icon .fa {
   color: var(--prism-text-placeholder, #6B7785);
 }
-.dark-mode .prism-input-box .code-btn {
+.dark-mode .prism-input-wrapper .code-btn {
   color: var(--prism-primary-color, #60A5FA);
 }
-.dark-mode .prism-input-box .code-btn.disabled {
+.dark-mode .prism-input-wrapper .code-btn.disabled {
   color: var(--prism-text-placeholder, #6B7785);
 }
 .prism-form-item {
@@ -3348,7 +3348,7 @@ textarea::placeholder {
 .dark-mode .prism-voice-icon .fa, .dark-mode .prism-voice-icon .fa-solid {
   color: var(--prism-primary-color, #3478F6);
 }
-.prism-select-box {
+.prism-select-wrapper {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -3358,24 +3358,24 @@ textarea::placeholder {
   min-height: 88rpx;
   transition: all 0.3s ease;
 }
-.prism-select-box .placeholder {
+.prism-select-wrapper .placeholder {
   color: var(--prism-text-placeholder, #C9CDD4);
 }
-.prism-select-box .select-text {
+.prism-select-wrapper .select-text {
   flex: 1;
   font-size: 28rpx;
   color: var(--prism-text-primary, #1D2129);
 }
-.prism-select-box .select-arrow {
+.prism-select-wrapper .select-arrow {
   font-size: 28rpx;
   color: var(--prism-text-placeholder, #C9CDD4);
   flex-shrink: 0;
   margin-left: 16rpx;
 }
-.dark-mode .prism-select-box {
+.dark-mode .prism-select-wrapper {
   background: var(--prism-input-bg, #2A2A2A);
 }
-.dark-mode .prism-select-box .select-text {
+.dark-mode .prism-select-wrapper .select-text {
   color: var(--prism-text-primary, #E5E6EB);
 }
 .prism-address-wrapper {
@@ -3386,7 +3386,7 @@ textarea::placeholder {
   border-radius: 12rpx;
   padding: 0 28rpx;
 }
-.prism-address-wrapper .prism-input-box {
+.prism-address-wrapper .prism-input-wrapper {
   flex: 1;
   background: transparent !important;
   border: none !important;
@@ -3410,7 +3410,7 @@ textarea::placeholder {
 .dark-mode .prism-address-wrapper {
   background: var(--prism-input-bg, #2A2A2A);
 }
-.prism-map-container {
+.prism-map-wrapper {
   margin-top: 16rpx;
   border-radius: 16rpx;
   overflow: hidden;
@@ -3439,7 +3439,7 @@ textarea::placeholder {
   align-items: center;
   gap: 8rpx;
 }
-.dark-mode .prism-map-container {
+.dark-mode .prism-map-wrapper {
   border-color: rgba(255, 255, 255, 0.1);
 }
 .prism-tag-selector {
@@ -6458,18 +6458,18 @@ textarea::placeholder {
   color: var(--prism-text-secondary, #86909C);
 }
 .dark-mode .prism-tabs--chrome .prism-tabs__item::before {
-  background: radial-gradient(circle at 0 0, transparent 16rpx, rgba(255, 255, 255, 0.12) 16rpx);
+  background: radial-gradient(circle at 0 0, transparent 16rpx, #2e2e2e 16rpx);
 }
 .dark-mode .prism-tabs--chrome .prism-tabs__item::after {
-  background: radial-gradient(circle at 100% 0, transparent 16rpx, rgba(255, 255, 255, 0.12) 16rpx);
+  background: radial-gradient(circle at 100% 0, transparent 16rpx, #2e2e2e 16rpx);
 }
 .dark-mode .prism-tabs--chrome .prism-tabs__item.active {
-  background: rgba(255, 255, 255, 0.12);
+  background: #2e2e2e;
   color: #E5E6EB;
   box-shadow: 0 -2rpx 8rpx rgba(0, 0, 0, 0.2);
 }
 .dark-mode .prism-tabs__content {
-  background: rgba(255, 255, 255, 0.12);
+  background: #2e2e2e;
 }
 .prism-tabs--card {
   display: flex;