admin-lte 4.0.0-rc6 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (107) hide show
  1. package/CHANGELOG.md +96 -0
  2. package/README.md +44 -18
  3. package/dist/UI/general.html +311 -92
  4. package/dist/UI/icons.html +311 -92
  5. package/dist/UI/timeline.html +311 -92
  6. package/dist/css/adminlte.css +2814 -1138
  7. package/dist/css/adminlte.css.map +1 -1
  8. package/dist/css/adminlte.min.css +2 -2
  9. package/dist/css/adminlte.min.css.map +1 -1
  10. package/dist/css/adminlte.rtl.css +2814 -1138
  11. package/dist/css/adminlte.rtl.css.map +1 -1
  12. package/dist/css/adminlte.rtl.min.css +2 -2
  13. package/dist/css/adminlte.rtl.min.css.map +1 -1
  14. package/dist/docs/browser-support.html +291 -385
  15. package/dist/docs/color-mode.html +283 -381
  16. package/dist/docs/components/main-header.html +269 -363
  17. package/dist/docs/components/main-sidebar.html +284 -378
  18. package/dist/docs/customization.html +1056 -0
  19. package/dist/docs/deployment.html +1121 -0
  20. package/dist/docs/faq.html +887 -397
  21. package/dist/docs/getting-started.html +967 -0
  22. package/dist/docs/how-to-contribute.html +365 -450
  23. package/dist/docs/index.html +16 -0
  24. package/dist/docs/integrations.html +1207 -0
  25. package/dist/docs/introduction.html +483 -434
  26. package/dist/docs/javascript/accessibility.html +925 -0
  27. package/dist/docs/javascript/card-widget.html +995 -0
  28. package/dist/docs/javascript/direct-chat.html +872 -0
  29. package/dist/docs/javascript/fullscreen.html +881 -0
  30. package/dist/docs/javascript/layout.html +884 -0
  31. package/dist/docs/javascript/plugins-overview.html +1120 -0
  32. package/dist/docs/javascript/pushmenu.html +522 -377
  33. package/dist/docs/javascript/treeview.html +498 -390
  34. package/dist/docs/layout-blueprint.html +1063 -0
  35. package/dist/docs/layout.html +316 -402
  36. package/dist/docs/license.html +282 -375
  37. package/dist/docs/migration.html +1125 -0
  38. package/dist/docs/recipes.html +1161 -0
  39. package/dist/docs/rtl.html +933 -0
  40. package/dist/examples/lockscreen.html +66 -2
  41. package/dist/examples/login-v2.html +65 -1
  42. package/dist/examples/login.html +65 -1
  43. package/dist/examples/register-v2.html +65 -1
  44. package/dist/examples/register.html +65 -1
  45. package/dist/forms/elements.html +1381 -0
  46. package/dist/forms/{general.html → layout.html} +382 -452
  47. package/dist/forms/validation.html +1251 -0
  48. package/dist/forms/wizard.html +1386 -0
  49. package/dist/generate/theme.html +135 -5
  50. package/dist/index.html +311 -92
  51. package/dist/index2.html +314 -92
  52. package/dist/index3.html +311 -92
  53. package/dist/js/adminlte.js +135 -314
  54. package/dist/js/adminlte.js.map +1 -1
  55. package/dist/js/adminlte.min.js +3 -3
  56. package/dist/js/adminlte.min.js.map +1 -1
  57. package/dist/layout/collapsed-sidebar-without-hover.html +1120 -0
  58. package/dist/layout/collapsed-sidebar.html +311 -92
  59. package/dist/layout/fixed-complete.html +311 -92
  60. package/dist/layout/fixed-footer.html +311 -92
  61. package/dist/layout/fixed-header.html +311 -92
  62. package/dist/layout/fixed-sidebar.html +311 -92
  63. package/dist/layout/layout-custom-area.html +311 -92
  64. package/dist/layout/layout-rtl.html +311 -92
  65. package/dist/layout/logo-switch.html +135 -5
  66. package/dist/layout/sidebar-mini.html +311 -92
  67. package/dist/layout/unfixed-sidebar.html +311 -92
  68. package/dist/mailbox/compose.html +1127 -0
  69. package/dist/mailbox/inbox.html +1477 -0
  70. package/dist/mailbox/read.html +1178 -0
  71. package/dist/pages/404.html +213 -0
  72. package/dist/pages/500.html +201 -0
  73. package/dist/pages/calendar.html +1242 -0
  74. package/dist/pages/chat.html +1403 -0
  75. package/dist/pages/faq.html +1359 -0
  76. package/dist/pages/file-manager.html +1811 -0
  77. package/dist/pages/invoice.html +1175 -0
  78. package/dist/pages/kanban.html +1415 -0
  79. package/dist/pages/maintenance.html +204 -0
  80. package/dist/pages/pricing.html +1255 -0
  81. package/dist/pages/profile.html +1358 -0
  82. package/dist/pages/projects.html +1620 -0
  83. package/dist/pages/settings.html +1363 -0
  84. package/dist/tables/data.html +1295 -0
  85. package/dist/tables/simple.html +311 -92
  86. package/dist/widgets/cards.html +311 -92
  87. package/dist/widgets/info-box.html +311 -92
  88. package/dist/widgets/small-box.html +311 -92
  89. package/netlify.toml +16 -0
  90. package/package.json +32 -26
  91. package/src/scss/_accessibility.scss +44 -0
  92. package/src/scss/_app-footer.scss +9 -0
  93. package/src/scss/_app-header.scss +27 -0
  94. package/src/scss/_app-sidebar.scss +73 -74
  95. package/src/scss/_bootstrap-variables.scss +12 -5
  96. package/src/scss/_docs.scss +816 -0
  97. package/src/scss/_table.scss +4 -4
  98. package/src/scss/adminlte.scss +4 -1
  99. package/src/scss/pages/_login_and_register.scss +1 -1
  100. package/src/ts/accessibility.ts +9 -7
  101. package/src/ts/adminlte.ts +2 -14
  102. package/src/ts/fullscreen.ts +8 -4
  103. package/src/ts/layout.ts +34 -16
  104. package/src/ts/push-menu.ts +257 -104
  105. package/src/ts/util/index.ts +10 -0
  106. package/.claude/settings.local.json +0 -33
  107. package/CLAUDE.md +0 -79
@@ -1,6 +1,6 @@
1
1
  @charset "UTF-8";
2
2
  /*!
3
- * AdminLTE v4.0.0-rc5
3
+ * AdminLTE v4.0.0
4
4
  * Author: Colorlib
5
5
  * Website: AdminLTE.io <https://adminlte.io>
6
6
  * License: Open source - MIT <https://opensource.org/licenses/MIT>
@@ -4755,10 +4755,15 @@ textarea.form-control-lg {
4755
4755
  }
4756
4756
 
4757
4757
  .page-item:not(:first-child) .page-link {
4758
- margin-right: calc(var(--bs-border-width) * -1);
4758
+ margin-right: calc(-1 * var(--bs-border-width));
4759
+ }
4760
+ .page-item:first-child .page-link {
4761
+ border-top-right-radius: var(--bs-pagination-border-radius);
4762
+ border-bottom-right-radius: var(--bs-pagination-border-radius);
4759
4763
  }
4760
- .page-item .page-link {
4761
- border-radius: var(--bs-pagination-border-radius);
4764
+ .page-item:last-child .page-link {
4765
+ border-top-left-radius: var(--bs-pagination-border-radius);
4766
+ border-bottom-left-radius: var(--bs-pagination-border-radius);
4762
4767
  }
4763
4768
 
4764
4769
  .pagination-lg {
@@ -12833,6 +12838,76 @@ textarea.form-control-lg {
12833
12838
  top: 0;
12834
12839
  z-index: 1030;
12835
12840
  }
12841
+ @media (min-width: 576px) {
12842
+ .fixed-header.sidebar-expand-sm .app-sidebar {
12843
+ position: sticky;
12844
+ top: 0;
12845
+ max-height: 100vh;
12846
+ }
12847
+ .fixed-header.sidebar-expand-sm .app-sidebar .sidebar-wrapper {
12848
+ height: calc(100vh - (calc(3.5rem + 1px)));
12849
+ overflow-x: hidden;
12850
+ overflow-y: auto;
12851
+ }
12852
+ }
12853
+ @media (min-width: 768px) {
12854
+ .fixed-header.sidebar-expand-md .app-sidebar {
12855
+ position: sticky;
12856
+ top: 0;
12857
+ max-height: 100vh;
12858
+ }
12859
+ .fixed-header.sidebar-expand-md .app-sidebar .sidebar-wrapper {
12860
+ height: calc(100vh - (calc(3.5rem + 1px)));
12861
+ overflow-x: hidden;
12862
+ overflow-y: auto;
12863
+ }
12864
+ }
12865
+ @media (min-width: 992px) {
12866
+ .fixed-header.sidebar-expand-lg .app-sidebar {
12867
+ position: sticky;
12868
+ top: 0;
12869
+ max-height: 100vh;
12870
+ }
12871
+ .fixed-header.sidebar-expand-lg .app-sidebar .sidebar-wrapper {
12872
+ height: calc(100vh - (calc(3.5rem + 1px)));
12873
+ overflow-x: hidden;
12874
+ overflow-y: auto;
12875
+ }
12876
+ }
12877
+ @media (min-width: 1200px) {
12878
+ .fixed-header.sidebar-expand-xl .app-sidebar {
12879
+ position: sticky;
12880
+ top: 0;
12881
+ max-height: 100vh;
12882
+ }
12883
+ .fixed-header.sidebar-expand-xl .app-sidebar .sidebar-wrapper {
12884
+ height: calc(100vh - (calc(3.5rem + 1px)));
12885
+ overflow-x: hidden;
12886
+ overflow-y: auto;
12887
+ }
12888
+ }
12889
+ @media (min-width: 1400px) {
12890
+ .fixed-header.sidebar-expand-xxl .app-sidebar {
12891
+ position: sticky;
12892
+ top: 0;
12893
+ max-height: 100vh;
12894
+ }
12895
+ .fixed-header.sidebar-expand-xxl .app-sidebar .sidebar-wrapper {
12896
+ height: calc(100vh - (calc(3.5rem + 1px)));
12897
+ overflow-x: hidden;
12898
+ overflow-y: auto;
12899
+ }
12900
+ }
12901
+ .fixed-header.sidebar-expand .app-sidebar {
12902
+ position: sticky;
12903
+ top: 0;
12904
+ max-height: 100vh;
12905
+ }
12906
+ .fixed-header.sidebar-expand .app-sidebar .sidebar-wrapper {
12907
+ height: calc(100vh - (calc(3.5rem + 1px)));
12908
+ overflow-x: hidden;
12909
+ overflow-y: auto;
12910
+ }
12836
12911
 
12837
12912
  .app-sidebar {
12838
12913
  --lte-sidebar-hover-bg: rgba(0, 0, 0, 0.1);
@@ -12922,6 +12997,7 @@ textarea.form-control-lg {
12922
12997
  padding-left: 0.5rem;
12923
12998
  padding-bottom: 0.5rem;
12924
12999
  padding-right: 0.5rem;
13000
+ overscroll-behavior: contain;
12925
13001
  scrollbar-color: var(--bs-secondary-bg) transparent;
12926
13002
  }
12927
13003
  .sidebar-wrapper::-webkit-scrollbar-thumb {
@@ -12959,21 +13035,25 @@ textarea.form-control-lg {
12959
13035
  min-width: 1.5rem;
12960
13036
  max-width: 1.5rem;
12961
13037
  }
12962
- .sidebar-wrapper .sidebar-menu > .nav-item.menu-open .nav-link.active:not(:hover) {
12963
- --lte-sidebar-menu-active-bg: transparent;
12964
- }
12965
- .sidebar-wrapper .sidebar-menu > .nav-item > .nav-link:active, .sidebar-wrapper .sidebar-menu > .nav-item > .nav-link:focus {
13038
+ .sidebar-wrapper .sidebar-menu > .nav-item > .nav-link {
12966
13039
  color: var(--lte-sidebar-color);
12967
13040
  }
12968
- .sidebar-wrapper .sidebar-menu > .nav-item > .nav-link.active:not(:hover) {
13041
+ .sidebar-wrapper .sidebar-menu > .nav-item > .nav-link:hover, .sidebar-wrapper .sidebar-menu > .nav-item > .nav-link:focus {
13042
+ color: var(--lte-sidebar-hover-color);
13043
+ background-color: var(--lte-sidebar-hover-bg);
13044
+ }
13045
+ .sidebar-wrapper .sidebar-menu > .nav-item > .nav-link.active {
12969
13046
  color: var(--lte-sidebar-menu-active-color);
12970
13047
  background-color: var(--lte-sidebar-menu-active-bg);
12971
13048
  }
12972
- .sidebar-wrapper .sidebar-menu > .nav-item.menu-open > .nav-link, .sidebar-wrapper .sidebar-menu > .nav-item:hover > .nav-link,
12973
- .sidebar-wrapper .sidebar-menu > .nav-item > .nav-link:focus {
13049
+ .sidebar-wrapper .sidebar-menu > .nav-item.menu-open > .nav-link {
12974
13050
  color: var(--lte-sidebar-hover-color);
12975
13051
  background-color: var(--lte-sidebar-hover-bg);
12976
13052
  }
13053
+ .sidebar-wrapper .sidebar-menu > .nav-item.menu-open > .nav-link.active {
13054
+ color: var(--lte-sidebar-menu-active-color);
13055
+ background-color: var(--lte-sidebar-menu-active-bg);
13056
+ }
12977
13057
  .sidebar-wrapper .sidebar-menu > .nav-item > .nav-treeview {
12978
13058
  background-color: var(--lte-sidebar-submenu-bg);
12979
13059
  }
@@ -12992,14 +13072,12 @@ textarea.form-control-lg {
12992
13072
  }
12993
13073
  .sidebar-wrapper .nav-treeview > .nav-item > .nav-link:hover, .sidebar-wrapper .nav-treeview > .nav-item > .nav-link:focus {
12994
13074
  color: var(--lte-sidebar-submenu-hover-color);
13075
+ background-color: var(--lte-sidebar-submenu-hover-bg);
12995
13076
  }
12996
- .sidebar-wrapper .nav-treeview > .nav-item > .nav-link.active, .sidebar-wrapper .nav-treeview > .nav-item > .nav-link.active:hover, .sidebar-wrapper .nav-treeview > .nav-item > .nav-link.active:focus {
13077
+ .sidebar-wrapper .nav-treeview > .nav-item > .nav-link.active {
12997
13078
  color: var(--lte-sidebar-submenu-active-color);
12998
13079
  background-color: var(--lte-sidebar-submenu-active-bg);
12999
13080
  }
13000
- .sidebar-wrapper .nav-treeview > .nav-item > .nav-link:hover {
13001
- background-color: var(--lte-sidebar-submenu-hover-bg);
13002
- }
13003
13081
 
13004
13082
  .sidebar-menu .nav-item > .nav-link {
13005
13083
  margin-bottom: 0.2rem;
@@ -13066,9 +13144,6 @@ textarea.form-control-lg {
13066
13144
  padding: 0;
13067
13145
  list-style: none;
13068
13146
  }
13069
- .nav-indent .sidebar-menu .nav-treeview {
13070
- padding-right: 0.5rem;
13071
- }
13072
13147
  .sidebar-menu .menu-open > .nav-treeview {
13073
13148
  display: block;
13074
13149
  }
@@ -13083,6 +13158,10 @@ textarea.form-control-lg {
13083
13158
  right: auto !important;
13084
13159
  }
13085
13160
 
13161
+ .nav-indent .nav-treeview {
13162
+ padding-right: 0.5rem;
13163
+ }
13164
+
13086
13165
  .nav-compact.nav-indent .nav-treeview {
13087
13166
  padding-right: 0;
13088
13167
  }
@@ -13185,19 +13264,19 @@ textarea.form-control-lg {
13185
13264
  animation-duration: 0.3s;
13186
13265
  animation-fill-mode: both;
13187
13266
  }
13188
- .sidebar-mini.sidebar-collapse .app-sidebar:hover {
13267
+ .sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover {
13189
13268
  min-width: var(--lte-sidebar-width);
13190
13269
  max-width: var(--lte-sidebar-width);
13191
13270
  }
13192
- .sidebar-mini.sidebar-collapse .app-sidebar:hover .sidebar-menu .nav-header {
13271
+ .sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .sidebar-menu .nav-header {
13193
13272
  display: inline;
13194
13273
  }
13195
- .sidebar-mini.sidebar-collapse .app-sidebar:hover .sidebar-menu .nav-link {
13274
+ .sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .sidebar-menu .nav-link {
13196
13275
  width: auto;
13197
13276
  }
13198
- .sidebar-mini.sidebar-collapse .app-sidebar:hover .sidebar-menu .nav-link p,
13199
- .sidebar-mini.sidebar-collapse .app-sidebar:hover .brand-text,
13200
- .sidebar-mini.sidebar-collapse .app-sidebar:hover .logo-xl {
13277
+ .sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .sidebar-menu .nav-link p,
13278
+ .sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .brand-text,
13279
+ .sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .logo-xl {
13201
13280
  width: auto;
13202
13281
  margin-right: 0;
13203
13282
  visibility: visible;
@@ -13205,7 +13284,7 @@ textarea.form-control-lg {
13205
13284
  animation-duration: 0.3s;
13206
13285
  animation-fill-mode: both;
13207
13286
  }
13208
- .sidebar-mini.sidebar-collapse .app-sidebar:hover .brand-text {
13287
+ .sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .brand-text {
13209
13288
  display: inline;
13210
13289
  max-width: inherit;
13211
13290
  margin-right: 0.5rem;
@@ -13213,8 +13292,8 @@ textarea.form-control-lg {
13213
13292
  animation-duration: 0.3s;
13214
13293
  animation-fill-mode: both;
13215
13294
  }
13216
- .sidebar-mini.sidebar-collapse .app-sidebar:hover .nav-badge,
13217
- .sidebar-mini.sidebar-collapse .app-sidebar:hover .nav-arrow {
13295
+ .sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .nav-badge,
13296
+ .sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .nav-arrow {
13218
13297
  display: inline-block;
13219
13298
  visibility: visible;
13220
13299
  animation-name: fadeIn;
@@ -13222,10 +13301,10 @@ textarea.form-control-lg {
13222
13301
  animation-fill-mode: both;
13223
13302
  animation-delay: 0.3s;
13224
13303
  }
13225
- .sidebar-mini.sidebar-collapse .app-sidebar:hover .nav-link p {
13304
+ .sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .nav-link p {
13226
13305
  padding-right: 0.5rem;
13227
13306
  }
13228
- .sidebar-mini.sidebar-collapse .app-sidebar:hover .logo-xs {
13307
+ .sidebar-mini.sidebar-collapse:not(.sidebar-without-hover) .app-sidebar:hover .logo-xs {
13229
13308
  visibility: hidden;
13230
13309
  animation-name: fadeOut;
13231
13310
  animation-duration: 0.3s;
@@ -13831,6 +13910,9 @@ body:not(.app-loaded) .app-footer {
13831
13910
  bottom: 0;
13832
13911
  z-index: 1030;
13833
13912
  }
13913
+ .fixed-footer.layout-fixed .app-main {
13914
+ min-height: 0;
13915
+ }
13834
13916
 
13835
13917
  .dropdown-menu {
13836
13918
  overflow: hidden;
@@ -14134,1423 +14216,3017 @@ body:not(.app-loaded) .app-footer {
14134
14216
  border-radius: 0.375rem;
14135
14217
  }
14136
14218
 
14137
- .progress {
14138
- border-radius: 1px;
14139
- }
14140
- .progress.vertical {
14141
- position: relative;
14142
- display: inline-block;
14143
- width: 30px;
14144
- height: 200px;
14145
- margin-left: 10px;
14219
+ .docs-page .app-content > .container-fluid, .docs-page .app-content > .container-sm, .docs-page .app-content > .container-md, .docs-page .app-content > .container-lg, .docs-page .app-content > .container-xl, .docs-page .app-content > .container-xxl {
14220
+ max-width: 60rem;
14146
14221
  }
14147
- .progress.vertical > .progress-bar {
14148
- position: absolute;
14149
- bottom: 0;
14150
- width: 100%;
14222
+ @media (min-width: 1400px) {
14223
+ .docs-page .app-content > .container-fluid, .docs-page .app-content > .container-sm, .docs-page .app-content > .container-md, .docs-page .app-content > .container-lg, .docs-page .app-content > .container-xl, .docs-page .app-content > .container-xxl {
14224
+ max-width: 64rem;
14225
+ }
14151
14226
  }
14152
- .progress.vertical.sm, .progress.vertical.progress-sm {
14153
- width: 20px;
14227
+ .docs-page .card > .card-body {
14228
+ padding: 1.5rem;
14229
+ font-size: 1rem;
14230
+ line-height: 1.7;
14231
+ color: var(--bs-body-color);
14154
14232
  }
14155
- .progress.vertical.xs, .progress.vertical.progress-xs {
14156
- width: 10px;
14233
+ @media (min-width: 768px) {
14234
+ .docs-page .card > .card-body {
14235
+ padding: 2.5rem;
14236
+ }
14237
+ }
14238
+ .docs-page .card > .card-body h1,
14239
+ .docs-page .card > .card-body h2,
14240
+ .docs-page .card > .card-body h3,
14241
+ .docs-page .card > .card-body h4,
14242
+ .docs-page .card > .card-body h5,
14243
+ .docs-page .card > .card-body h6,
14244
+ .docs-page .card > .card-body .h1,
14245
+ .docs-page .card > .card-body .h2,
14246
+ .docs-page .card > .card-body .h3,
14247
+ .docs-page .card > .card-body .h4,
14248
+ .docs-page .card > .card-body .h5,
14249
+ .docs-page .card > .card-body .h6 {
14250
+ margin-top: 2em;
14251
+ margin-bottom: 0.5em;
14252
+ font-weight: 600;
14253
+ line-height: 1.3;
14254
+ color: var(--bs-emphasis-color);
14255
+ scroll-margin-top: 4rem;
14256
+ }
14257
+ .docs-page .card > .card-body h1:first-child,
14258
+ .docs-page .card > .card-body h2:first-child,
14259
+ .docs-page .card > .card-body h3:first-child,
14260
+ .docs-page .card > .card-body h4:first-child,
14261
+ .docs-page .card > .card-body h5:first-child,
14262
+ .docs-page .card > .card-body h6:first-child,
14263
+ .docs-page .card > .card-body .h1:first-child,
14264
+ .docs-page .card > .card-body .h2:first-child,
14265
+ .docs-page .card > .card-body .h3:first-child,
14266
+ .docs-page .card > .card-body .h4:first-child,
14267
+ .docs-page .card > .card-body .h5:first-child,
14268
+ .docs-page .card > .card-body .h6:first-child {
14269
+ margin-top: 0;
14157
14270
  }
14158
- .progress.vertical.xxs, .progress.vertical.progress-xxs {
14159
- width: 3px;
14271
+ .docs-page .card > .card-body h2,
14272
+ .docs-page .card > .card-body .h2 {
14273
+ padding-bottom: 0.35em;
14274
+ font-size: 1.75rem;
14275
+ border-bottom: 1px solid var(--bs-border-color);
14160
14276
  }
14161
-
14162
- .progress-group {
14163
- margin-bottom: 0.5rem;
14277
+ .docs-page .card > .card-body h3,
14278
+ .docs-page .card > .card-body .h3 {
14279
+ font-size: 1.4rem;
14164
14280
  }
14165
-
14166
- .progress-sm {
14167
- height: 10px;
14281
+ .docs-page .card > .card-body h4,
14282
+ .docs-page .card > .card-body .h4 {
14283
+ font-size: 1.2rem;
14168
14284
  }
14169
-
14170
- .progress-xs {
14171
- height: 7px;
14285
+ .docs-page .card > .card-body h5,
14286
+ .docs-page .card > .card-body .h5 {
14287
+ padding-top: 1.5em;
14288
+ margin-top: 2.5em;
14289
+ font-size: 1.3rem;
14290
+ border-top: 1px solid var(--bs-border-color);
14172
14291
  }
14173
-
14174
- .progress-xxs {
14175
- height: 3px;
14292
+ .docs-page .card > .card-body h5:first-child,
14293
+ .docs-page .card > .card-body .h5:first-child {
14294
+ padding-top: 0;
14295
+ border-top: 0;
14176
14296
  }
14177
-
14178
- .table tr > td .progress {
14179
- margin: 0;
14297
+ .docs-page .card > .card-body h6,
14298
+ .docs-page .card > .card-body .h6 {
14299
+ margin-top: 1.75em;
14300
+ font-size: 1.08rem;
14301
+ color: var(--bs-emphasis-color);
14180
14302
  }
14181
-
14182
- .card {
14183
- box-shadow: 0 0 1px rgba(var(--bs-body-color-rgb), 0.125), 0 1px 3px rgba(var(--bs-body-color-rgb), 0.2);
14303
+ .docs-page .card > .card-body p,
14304
+ .docs-page .card > .card-body ul,
14305
+ .docs-page .card > .card-body ol,
14306
+ .docs-page .card > .card-body dl,
14307
+ .docs-page .card > .card-body blockquote,
14308
+ .docs-page .card > .card-body table {
14309
+ margin-bottom: 1.1rem;
14184
14310
  }
14185
- .card[class*=card-]:not(.card-outline) > .card-header, .card[class*=text-bg-]:not(.card-outline) > .card-header {
14186
- color: var(--lte-card-variant-color);
14187
- background-color: var(--lte-card-variant-bg);
14311
+ .docs-page .card > .card-body ul,
14312
+ .docs-page .card > .card-body ol {
14313
+ padding-right: 1.5rem;
14188
14314
  }
14189
- .card[class*=card-]:not(.card-outline) > .card-header .btn-tool, .card[class*=text-bg-]:not(.card-outline) > .card-header .btn-tool {
14190
- --bs-btn-color: rgba(var(--lte-card-variant-color-rgb), .8);
14191
- --bs-btn-hover-color: var(--lte-card-variant-color);
14315
+ .docs-page .card > .card-body ul li,
14316
+ .docs-page .card > .card-body ol li {
14317
+ margin-bottom: 0.35rem;
14192
14318
  }
14193
- .card.card-outline {
14194
- border-top: 3px solid var(--lte-card-variant-bg);
14319
+ .docs-page .card > .card-body ul ul,
14320
+ .docs-page .card > .card-body ul ol,
14321
+ .docs-page .card > .card-body ol ul,
14322
+ .docs-page .card > .card-body ol ol {
14323
+ margin-top: 0.35rem;
14324
+ margin-bottom: 0;
14195
14325
  }
14196
- .card.maximized-card {
14197
- position: fixed;
14198
- top: 0;
14199
- right: 0;
14200
- z-index: 1050;
14201
- width: 100% !important;
14202
- max-width: 100% !important;
14203
- height: 100% !important;
14204
- max-height: 100% !important;
14326
+ .docs-page .card > .card-body h2 + p, .docs-page .card > .card-body .h2 + p,
14327
+ .docs-page .card > .card-body h3 + p,
14328
+ .docs-page .card > .card-body .h3 + p,
14329
+ .docs-page .card > .card-body h5 + p,
14330
+ .docs-page .card > .card-body .h5 + p {
14331
+ margin-top: 0;
14205
14332
  }
14206
- .card.maximized-card.was-collapsed .card-body {
14207
- display: block !important;
14333
+ .docs-page .card > .card-body p code,
14334
+ .docs-page .card > .card-body li code,
14335
+ .docs-page .card > .card-body td code,
14336
+ .docs-page .card > .card-body th code,
14337
+ .docs-page .card > .card-body h2 code,
14338
+ .docs-page .card > .card-body .h2 code,
14339
+ .docs-page .card > .card-body h3 code,
14340
+ .docs-page .card > .card-body .h3 code,
14341
+ .docs-page .card > .card-body h4 code,
14342
+ .docs-page .card > .card-body .h4 code,
14343
+ .docs-page .card > .card-body h5 code,
14344
+ .docs-page .card > .card-body .h5 code,
14345
+ .docs-page .card > .card-body h6 code,
14346
+ .docs-page .card > .card-body .h6 code {
14347
+ padding: 0.15em 0.4em;
14348
+ font-size: 0.875em;
14349
+ color: var(--bs-emphasis-color);
14350
+ background: var(--bs-tertiary-bg);
14351
+ border: 1px solid var(--bs-border-color);
14352
+ border-radius: 0.25rem;
14208
14353
  }
14209
- .card.maximized-card .card-body {
14210
- overflow: auto;
14354
+ .docs-page .card > .card-body pre.astro-code,
14355
+ .docs-page .card > .card-body pre {
14356
+ padding: 1rem 1.25rem;
14357
+ margin-top: 1.25rem;
14358
+ margin-bottom: 1.5rem;
14359
+ overflow-x: auto;
14360
+ font-size: 0.875rem;
14361
+ line-height: 1.6;
14362
+ border-radius: 0.375rem;
14211
14363
  }
14212
- .card.maximized-card [data-lte-toggle=card-collapse] {
14213
- display: none;
14364
+ .docs-page .card > .card-body pre.astro-code code,
14365
+ .docs-page .card > .card-body pre code {
14366
+ padding: 0;
14367
+ background: transparent;
14368
+ border: 0;
14214
14369
  }
14215
- .card.maximized-card [data-lte-icon=maximize] {
14216
- display: none;
14370
+ .docs-page .card > .card-body table {
14371
+ width: 100%;
14372
+ margin-top: 1.25rem;
14373
+ margin-bottom: 1.5rem;
14374
+ overflow: hidden;
14375
+ font-size: 0.95rem;
14376
+ border-collapse: collapse;
14377
+ border: 1px solid var(--bs-border-color);
14378
+ border-radius: 0.25rem;
14217
14379
  }
14218
- .card.maximized-card .card-header,
14219
- .card.maximized-card .card-footer {
14220
- border-radius: 0 !important;
14380
+ .docs-page .card > .card-body table th,
14381
+ .docs-page .card > .card-body table td {
14382
+ padding: 0.65rem 0.9rem;
14383
+ text-align: right;
14384
+ vertical-align: top;
14385
+ border-bottom: 1px solid var(--bs-border-color);
14221
14386
  }
14222
- .card:not(.maximized-card) [data-lte-icon=minimize] {
14223
- display: none;
14387
+ .docs-page .card > .card-body table th {
14388
+ font-weight: 600;
14389
+ color: var(--bs-emphasis-color);
14390
+ background: var(--bs-tertiary-bg);
14224
14391
  }
14225
- .card.collapsed-card > .card-header [data-lte-icon=collapse] {
14226
- display: none;
14392
+ .docs-page .card > .card-body table tr:last-child td {
14393
+ border-bottom: 0;
14227
14394
  }
14228
- .card.collapsed-card > .card-body,
14229
- .card.collapsed-card > .card-footer {
14230
- display: none;
14395
+ .docs-page .card > .card-body table code {
14396
+ white-space: nowrap;
14231
14397
  }
14232
- .card:not(.collapsed-card) > .card-header [data-lte-icon=expand] {
14233
- display: none;
14398
+ .docs-page .card > .card-body blockquote {
14399
+ padding: 0.85rem 1.1rem;
14400
+ margin-top: 1.25rem;
14401
+ color: var(--bs-emphasis-color);
14402
+ background: var(--bs-info-bg-subtle);
14403
+ border-right: 4px solid var(--bs-info-border-subtle);
14404
+ border-radius: 0.25rem;
14234
14405
  }
14235
- .card .nav.flex-column > li {
14236
- margin: 0;
14237
- border-bottom: 1px solid var(--bs-border-color-translucent);
14406
+ .docs-page .card > .card-body blockquote p:last-child {
14407
+ margin-bottom: 0;
14238
14408
  }
14239
- .card .nav.flex-column > li:last-of-type {
14240
- border-bottom: 0;
14409
+ .docs-page .card > .card-body blockquote code {
14410
+ background: rgba(0, 0, 0, 0.05);
14241
14411
  }
14242
- .card.height-control .card-body {
14243
- max-height: 300px;
14244
- overflow: auto;
14412
+ .docs-page .card > .card-body a:not(.btn):not(.nav-link) {
14413
+ color: var(--bs-primary);
14414
+ text-decoration: underline;
14415
+ text-decoration-thickness: 1px;
14416
+ text-underline-offset: 3px;
14245
14417
  }
14246
- .card .border-end {
14247
- border-left: 1px solid var(--bs-border-color-translucent);
14418
+ .docs-page .card > .card-body a:not(.btn):not(.nav-link):hover {
14419
+ text-decoration-thickness: 2px;
14248
14420
  }
14249
- .card .border-start {
14250
- border-right: 1px solid var(--bs-border-color-translucent);
14421
+ .docs-page .card > .card-body hr {
14422
+ margin: 2.5rem 0;
14423
+ border: 0;
14424
+ border-top: 1px solid var(--bs-border-color);
14425
+ opacity: 1;
14251
14426
  }
14252
- .card.card-tabs:not(.card-outline) > .card-header {
14253
- border-bottom: 0;
14427
+ .docs-page .card > .card-body > p:first-child,
14428
+ .docs-page .card > .card-body > p:first-of-type {
14429
+ margin-bottom: 2rem;
14430
+ font-size: 1.125rem;
14431
+ line-height: 1.6;
14432
+ color: var(--bs-body-color);
14254
14433
  }
14255
- .card.card-tabs:not(.card-outline) > .card-header .nav-item:first-child .nav-link {
14256
- border-right-color: transparent;
14434
+ .docs-page .card > .card-body details.faq-item {
14435
+ margin-bottom: 0.5rem;
14436
+ overflow: hidden;
14437
+ background: var(--bs-body-bg);
14438
+ border: 1px solid var(--bs-border-color);
14439
+ border-radius: 0.375rem;
14440
+ transition: border-color 0.15s ease, box-shadow 0.15s ease;
14257
14441
  }
14258
- .card.card-tabs.card-outline .nav-item {
14259
- border-bottom: 0;
14442
+ @media (prefers-reduced-motion: reduce) {
14443
+ .docs-page .card > .card-body details.faq-item {
14444
+ transition: none;
14445
+ }
14260
14446
  }
14261
- .card.card-tabs.card-outline .nav-item:first-child .nav-link {
14262
- margin-right: 0;
14263
- border-right: 0;
14447
+ .docs-page .card > .card-body details.faq-item:hover {
14448
+ border-color: var(--bs-primary-border-subtle);
14264
14449
  }
14265
- .card.card-tabs .card-tools {
14266
- margin: 0.3rem 0.5rem;
14450
+ .docs-page .card > .card-body details.faq-item[open] {
14451
+ background: var(--bs-body-bg);
14452
+ border-color: var(--bs-primary-border-subtle);
14453
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
14267
14454
  }
14268
- .card.card-tabs:not(.expanding-card).collapsed-card .card-header {
14269
- border-bottom: 0;
14455
+ .docs-page .card > .card-body details.faq-item summary {
14456
+ position: relative;
14457
+ padding: 0.9rem 1.1rem 0.9rem 3rem;
14458
+ font-size: 1rem;
14459
+ font-weight: 600;
14460
+ color: var(--bs-emphasis-color);
14461
+ list-style: none;
14462
+ cursor: pointer;
14463
+ -webkit-user-select: none;
14464
+ user-select: none;
14465
+ transition: color 0.15s ease;
14270
14466
  }
14271
- .card.card-tabs:not(.expanding-card).collapsed-card .card-header .nav-tabs {
14272
- border-bottom: 0;
14467
+ @media (prefers-reduced-motion: reduce) {
14468
+ .docs-page .card > .card-body details.faq-item summary {
14469
+ transition: none;
14470
+ }
14273
14471
  }
14274
- .card.card-tabs:not(.expanding-card).collapsed-card .card-header .nav-tabs .nav-item {
14275
- margin-bottom: 0;
14472
+ .docs-page .card > .card-body details.faq-item summary::-webkit-details-marker {
14473
+ display: none;
14276
14474
  }
14277
- .card.card-tabs.expanding-card .card-header .nav-tabs .nav-item {
14278
- margin-bottom: -1px;
14475
+ .docs-page .card > .card-body details.faq-item summary::marker {
14476
+ content: "";
14279
14477
  }
14280
- .card.card-outline-tabs {
14281
- border-top: 0;
14478
+ .docs-page .card > .card-body details.faq-item summary:hover {
14479
+ color: var(--bs-primary);
14282
14480
  }
14283
- .card.card-outline-tabs .card-header .nav-item:first-child .nav-link {
14284
- margin-right: 0;
14285
- border-right: 0;
14481
+ .docs-page .card > .card-body details.faq-item summary::after {
14482
+ position: absolute;
14483
+ top: 50%;
14484
+ left: 1.1rem;
14485
+ display: inline-block;
14486
+ width: 0.55rem;
14487
+ height: 0.55rem;
14488
+ margin-top: -0.4rem;
14489
+ content: "";
14490
+ border-left: 2px solid currentcolor;
14491
+ border-bottom: 2px solid currentcolor;
14492
+ opacity: 0.55;
14493
+ transform: rotate(-45deg);
14494
+ transition: transform 0.2s ease;
14286
14495
  }
14287
- .card.card-outline-tabs .card-header a {
14288
- text-decoration: none;
14289
- border-top: 3px solid transparent;
14496
+ @media (prefers-reduced-motion: reduce) {
14497
+ .docs-page .card > .card-body details.faq-item summary::after {
14498
+ transition: none;
14499
+ }
14290
14500
  }
14291
- .card.card-outline-tabs .card-header a:hover {
14292
- border-top: 3px solid var(--bs-border-color);
14501
+ .docs-page .card > .card-body details.faq-item[open] > summary {
14502
+ color: var(--bs-primary);
14503
+ border-bottom: 1px solid var(--bs-border-color);
14293
14504
  }
14294
- .card.card-outline-tabs .card-header a.active:hover {
14295
- margin-top: 0;
14505
+ .docs-page .card > .card-body details.faq-item[open] > summary::after {
14506
+ margin-top: -0.15rem;
14507
+ opacity: 1;
14508
+ transform: rotate(135deg);
14296
14509
  }
14297
- .card.card-outline-tabs .card-tools {
14298
- margin: 0.5rem 0.5rem 0.3rem;
14510
+ .docs-page .card > .card-body details.faq-item > *:not(summary) {
14511
+ padding-left: 1.1rem;
14512
+ padding-right: 1.1rem;
14299
14513
  }
14300
- .card.card-outline-tabs:not(.expanding-card).collapsed-card .card-header {
14301
- border-bottom: 0;
14514
+ .docs-page .card > .card-body details.faq-item > *:not(summary):first-of-type {
14515
+ padding-top: 1rem;
14302
14516
  }
14303
- .card.card-outline-tabs:not(.expanding-card).collapsed-card .card-header .nav-tabs {
14304
- border-bottom: 0;
14517
+ .docs-page .card > .card-body details.faq-item > *:not(summary):last-child {
14518
+ padding-bottom: 1rem;
14305
14519
  }
14306
- .card.card-outline-tabs:not(.expanding-card).collapsed-card .card-header .nav-tabs .nav-item {
14520
+ .docs-page .card > .card-body details.faq-item p,
14521
+ .docs-page .card > .card-body details.faq-item ul,
14522
+ .docs-page .card > .card-body details.faq-item ol {
14523
+ margin-bottom: 0.65rem;
14524
+ }
14525
+ .docs-page .card > .card-body details.faq-item > *:last-child p:last-child,
14526
+ .docs-page .card > .card-body details.faq-item > p:last-child,
14527
+ .docs-page .card > .card-body details.faq-item > ul:last-child,
14528
+ .docs-page .card > .card-body details.faq-item > ol:last-child {
14307
14529
  margin-bottom: 0;
14308
14530
  }
14309
- .card.card-outline-tabs.expanding-card .card-header .nav-tabs .nav-item {
14310
- margin-bottom: -1px;
14531
+ .docs-page .card > .card-body details.faq-item pre.astro-code,
14532
+ .docs-page .card > .card-body details.faq-item pre {
14533
+ margin-left: 0;
14534
+ margin-right: 0;
14311
14535
  }
14312
-
14313
- html.maximized-card {
14314
- overflow: hidden;
14536
+ .docs-page[data-bs-theme=dark] .card > .card-body blockquote code, [data-bs-theme=dark] .docs-page .card > .card-body blockquote code {
14537
+ background: rgba(255, 255, 255, 0.08);
14315
14538
  }
14316
14539
 
14317
- .card-header::after,
14318
- .card-body::after,
14319
- .card-footer::after {
14320
- display: block;
14321
- clear: both;
14322
- content: "";
14540
+ .faq-page .app-content > .container-fluid, .faq-page .app-content > .container-sm, .faq-page .app-content > .container-md, .faq-page .app-content > .container-lg, .faq-page .app-content > .container-xl, .faq-page .app-content > .container-xxl {
14541
+ max-width: 64rem;
14323
14542
  }
14324
-
14325
- .card-header {
14543
+ @media (min-width: 1400px) {
14544
+ .faq-page .app-content > .container-fluid, .faq-page .app-content > .container-sm, .faq-page .app-content > .container-md, .faq-page .app-content > .container-lg, .faq-page .app-content > .container-xl, .faq-page .app-content > .container-xxl {
14545
+ max-width: 72rem;
14546
+ }
14547
+ }
14548
+ .faq-page .faq-hero {
14326
14549
  position: relative;
14327
- padding: 1rem 1rem;
14328
- background-color: transparent;
14329
- border-bottom: 1px solid var(--bs-border-color-translucent);
14330
- border-top-right-radius: 0.375rem;
14331
- border-top-left-radius: 0.375rem;
14550
+ padding: 3rem 1.5rem 2.5rem;
14551
+ margin-top: 1rem;
14552
+ overflow: hidden;
14553
+ background: radial-gradient(ellipse at top right, rgba(var(--bs-primary-rgb), 0.12), transparent 60%), radial-gradient(ellipse at bottom left, rgba(var(--bs-info-rgb), 0.1), transparent 65%), var(--bs-body-bg);
14554
+ border: 1px solid var(--bs-border-color);
14555
+ border-radius: 1rem;
14332
14556
  }
14333
- .collapsed-card .card-header {
14334
- border-bottom: 0;
14557
+ .faq-page .faq-hero-eyebrow {
14558
+ display: inline-flex;
14559
+ gap: 0.4rem;
14560
+ align-items: center;
14561
+ padding: 0.35rem 0.85rem;
14562
+ margin-bottom: 1rem;
14563
+ font-size: 0.75rem;
14564
+ font-weight: 600;
14565
+ color: var(--bs-primary);
14566
+ text-transform: uppercase;
14567
+ letter-spacing: 0.08em;
14568
+ background: var(--bs-primary-bg-subtle);
14569
+ border: 1px solid var(--bs-primary-border-subtle);
14570
+ border-radius: 50rem;
14335
14571
  }
14336
- .card-header > .card-tools {
14337
- float: left;
14338
- margin-left: -0.5rem;
14572
+ .faq-page .faq-hero-eyebrow .bi {
14573
+ font-size: 0.9rem;
14339
14574
  }
14340
- .card-header > .card-tools .input-group,
14341
- .card-header > .card-tools .nav,
14342
- .card-header > .card-tools .pagination {
14343
- margin-top: -0.4rem;
14344
- margin-bottom: -0.4rem;
14575
+ .faq-page .faq-hero-title {
14576
+ margin: 0 0 0.5rem;
14577
+ font-size: 2.25rem;
14578
+ font-weight: 700;
14579
+ line-height: 1.15;
14580
+ color: var(--bs-emphasis-color);
14345
14581
  }
14346
- .card-header > .card-tools [data-bs-toggle=tooltip] {
14582
+ @media (min-width: 768px) {
14583
+ .faq-page .faq-hero-title {
14584
+ font-size: 2.75rem;
14585
+ }
14586
+ }
14587
+ .faq-page .faq-hero-lead {
14588
+ max-width: 36rem;
14589
+ margin: 0 auto 1.75rem;
14590
+ font-size: 1.05rem;
14591
+ line-height: 1.55;
14592
+ color: var(--bs-secondary-color);
14593
+ }
14594
+ .faq-page .faq-search {
14347
14595
  position: relative;
14596
+ max-width: 32rem;
14597
+ margin: 0 auto;
14348
14598
  }
14349
-
14350
- .card-title {
14351
- float: right;
14352
- margin: 0;
14353
- font-size: 1.1rem;
14354
- font-weight: 400;
14599
+ .faq-page .faq-search .form-control {
14600
+ height: 3rem;
14601
+ padding-left: 3rem;
14602
+ padding-right: 3rem;
14603
+ font-size: 1rem;
14604
+ background: var(--bs-body-bg);
14605
+ border-radius: 50rem;
14606
+ transition: box-shadow 0.15s ease, border-color 0.15s ease;
14355
14607
  }
14356
-
14357
- .btn-tool {
14358
- --bs-btn-padding-x: .5rem;
14359
- --bs-btn-padding-y: .25rem;
14608
+ @media (prefers-reduced-motion: reduce) {
14609
+ .faq-page .faq-search .form-control {
14610
+ transition: none;
14611
+ }
14360
14612
  }
14361
- .btn-tool:not(.btn-tool-custom) {
14362
- --bs-btn-color: var(--bs-tertiary-color);
14363
- --bs-btn-bg: transparent;
14364
- --bs-btn-box-shadow: none;
14365
- --bs-btn-hover-color: var(--bs-secondary-color);
14366
- --bs-btn-active-border-color: transparent;
14613
+ .faq-page .faq-search .form-control:focus {
14614
+ box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.15);
14367
14615
  }
14368
- .btn-tool {
14369
- margin: -1rem 0;
14370
- font-size: 0.875rem;
14616
+ .faq-page .faq-search-icon {
14617
+ position: absolute;
14618
+ top: 50%;
14619
+ right: 1.2rem;
14620
+ color: var(--bs-secondary-color);
14621
+ pointer-events: none;
14622
+ transform: translateY(-50%);
14371
14623
  }
14372
-
14373
- .card-primary,
14374
- .bg-primary,
14375
- .text-bg-primary {
14376
- --lte-card-variant-bg: #0d6efd;
14377
- --lte-card-variant-bg-rgb: 13, 110, 253;
14378
- --lte-card-variant-color: #fff;
14379
- --lte-card-variant-color-rgb: 255, 255, 255;
14624
+ .faq-page .faq-search-clear {
14625
+ position: absolute;
14626
+ top: 50%;
14627
+ left: 0.65rem;
14628
+ display: inline-flex;
14629
+ align-items: center;
14630
+ justify-content: center;
14631
+ width: 2rem;
14632
+ height: 2rem;
14633
+ padding: 0;
14634
+ color: var(--bs-secondary-color);
14635
+ background: var(--bs-tertiary-bg);
14636
+ border: 0;
14637
+ transform: translateY(-50%);
14638
+ border-radius: 50%;
14639
+ transition: background 0.15s ease, color 0.15s ease;
14380
14640
  }
14381
-
14382
- .card-secondary,
14383
- .bg-secondary,
14384
- .text-bg-secondary {
14385
- --lte-card-variant-bg: #6c757d;
14386
- --lte-card-variant-bg-rgb: 108, 117, 125;
14387
- --lte-card-variant-color: #fff;
14388
- --lte-card-variant-color-rgb: 255, 255, 255;
14641
+ @media (prefers-reduced-motion: reduce) {
14642
+ .faq-page .faq-search-clear {
14643
+ transition: none;
14644
+ }
14389
14645
  }
14390
-
14391
- .card-success,
14392
- .bg-success,
14393
- .text-bg-success {
14394
- --lte-card-variant-bg: #198754;
14395
- --lte-card-variant-bg-rgb: 25, 135, 84;
14396
- --lte-card-variant-color: #fff;
14397
- --lte-card-variant-color-rgb: 255, 255, 255;
14646
+ .faq-page .faq-search-clear:hover {
14647
+ color: var(--bs-body-color);
14648
+ background: var(--bs-secondary-bg);
14398
14649
  }
14399
-
14400
- .card-info,
14401
- .bg-info,
14402
- .text-bg-info {
14403
- --lte-card-variant-bg: #0dcaf0;
14404
- --lte-card-variant-bg-rgb: 13, 202, 240;
14405
- --lte-card-variant-color: #000;
14406
- --lte-card-variant-color-rgb: 0, 0, 0;
14650
+ .faq-page .faq-empty-state {
14651
+ max-width: 32rem;
14652
+ padding: 1rem;
14653
+ margin: 1.5rem auto 0;
14654
+ font-size: 0.95rem;
14655
+ color: var(--bs-secondary-color);
14656
+ background: var(--bs-tertiary-bg);
14657
+ border-radius: 0.375rem;
14407
14658
  }
14408
-
14409
- .card-warning,
14410
- .bg-warning,
14411
- .text-bg-warning {
14412
- --lte-card-variant-bg: #ffc107;
14413
- --lte-card-variant-bg-rgb: 255, 193, 7;
14414
- --lte-card-variant-color: #000;
14415
- --lte-card-variant-color-rgb: 0, 0, 0;
14659
+ .faq-page .faq-empty-state .bi {
14660
+ margin-left: 0.35rem;
14416
14661
  }
14417
-
14418
- .card-danger,
14419
- .bg-danger,
14420
- .text-bg-danger {
14421
- --lte-card-variant-bg: #dc3545;
14422
- --lte-card-variant-bg-rgb: 220, 53, 69;
14423
- --lte-card-variant-color: #fff;
14424
- --lte-card-variant-color-rgb: 255, 255, 255;
14662
+ .faq-page .faq-chips {
14663
+ display: flex;
14664
+ flex-wrap: wrap;
14665
+ gap: 0.5rem;
14666
+ justify-content: center;
14425
14667
  }
14426
-
14427
- .card-light,
14428
- .bg-light,
14429
- .text-bg-light {
14430
- --lte-card-variant-bg: #f8f9fa;
14431
- --lte-card-variant-bg-rgb: 248, 249, 250;
14432
- --lte-card-variant-color: #000;
14433
- --lte-card-variant-color-rgb: 0, 0, 0;
14668
+ .faq-page .faq-chip {
14669
+ display: inline-flex;
14670
+ gap: 0.45rem;
14671
+ align-items: center;
14672
+ padding: 0.45rem 0.85rem;
14673
+ font-size: 0.875rem;
14674
+ font-weight: 500;
14675
+ color: var(--bs-body-color);
14676
+ text-decoration: none;
14677
+ background: var(--bs-body-bg);
14678
+ border: 1px solid var(--bs-border-color);
14679
+ border-radius: 50rem;
14680
+ transition: transform 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
14434
14681
  }
14435
-
14436
- .card-dark,
14437
- .bg-dark,
14438
- .text-bg-dark {
14439
- --lte-card-variant-bg: #212529;
14440
- --lte-card-variant-bg-rgb: 33, 37, 41;
14441
- --lte-card-variant-color: #fff;
14442
- --lte-card-variant-color-rgb: 255, 255, 255;
14682
+ @media (prefers-reduced-motion: reduce) {
14683
+ .faq-page .faq-chip {
14684
+ transition: none;
14685
+ }
14443
14686
  }
14444
-
14445
- .card-body > .table {
14446
- margin-bottom: 0;
14687
+ .faq-page .faq-chip:hover {
14688
+ color: var(--bs-emphasis-color);
14689
+ background: var(--bs-tertiary-bg);
14690
+ transform: translateY(-1px);
14447
14691
  }
14448
- .card-body > .table > thead > tr > th,
14449
- .card-body > .table > thead > tr > td {
14450
- border-top-width: 0;
14692
+ .faq-page .faq-chip .bi {
14693
+ font-size: 1rem;
14451
14694
  }
14452
-
14453
- .table:not(.table-dark) {
14454
- color: inherit;
14695
+ .faq-page .faq-chip-count {
14696
+ padding: 0 0.45rem;
14697
+ font-size: 0.7rem;
14698
+ font-weight: 600;
14699
+ color: var(--bs-secondary-color);
14700
+ background: var(--bs-tertiary-bg);
14701
+ border-radius: 50rem;
14702
+ }
14703
+ .faq-page .faq-chip-primary:hover {
14704
+ color: var(--bs-primary-text-emphasis);
14705
+ background: var(--bs-primary-bg-subtle);
14706
+ border-color: var(--bs-primary-border-subtle);
14707
+ }
14708
+ .faq-page .faq-chip-primary:hover .faq-chip-count {
14709
+ color: var(--bs-primary-text-emphasis);
14710
+ background: rgba(0, 0, 0, 0.06);
14711
+ }
14712
+ .faq-page .faq-chip-info:hover {
14713
+ color: var(--bs-info-text-emphasis);
14714
+ background: var(--bs-info-bg-subtle);
14715
+ border-color: var(--bs-info-border-subtle);
14716
+ }
14717
+ .faq-page .faq-chip-info:hover .faq-chip-count {
14718
+ color: var(--bs-info-text-emphasis);
14719
+ background: rgba(0, 0, 0, 0.06);
14720
+ }
14721
+ .faq-page .faq-chip-warning:hover {
14722
+ color: var(--bs-warning-text-emphasis);
14723
+ background: var(--bs-warning-bg-subtle);
14724
+ border-color: var(--bs-warning-border-subtle);
14725
+ }
14726
+ .faq-page .faq-chip-warning:hover .faq-chip-count {
14727
+ color: var(--bs-warning-text-emphasis);
14728
+ background: rgba(0, 0, 0, 0.06);
14729
+ }
14730
+ .faq-page .faq-chip-success:hover {
14731
+ color: var(--bs-success-text-emphasis);
14732
+ background: var(--bs-success-bg-subtle);
14733
+ border-color: var(--bs-success-border-subtle);
14734
+ }
14735
+ .faq-page .faq-chip-success:hover .faq-chip-count {
14736
+ color: var(--bs-success-text-emphasis);
14737
+ background: rgba(0, 0, 0, 0.06);
14738
+ }
14739
+ .faq-page .faq-chip-danger:hover {
14740
+ color: var(--bs-danger-text-emphasis);
14741
+ background: var(--bs-danger-bg-subtle);
14742
+ border-color: var(--bs-danger-border-subtle);
14743
+ }
14744
+ .faq-page .faq-chip-danger:hover .faq-chip-count {
14745
+ color: var(--bs-danger-text-emphasis);
14746
+ background: rgba(0, 0, 0, 0.06);
14747
+ }
14748
+ .faq-page .faq-chip-secondary:hover {
14749
+ color: var(--bs-secondary-text-emphasis);
14750
+ background: var(--bs-secondary-bg-subtle);
14751
+ border-color: var(--bs-secondary-border-subtle);
14752
+ }
14753
+ .faq-page .faq-chip-secondary:hover .faq-chip-count {
14754
+ color: var(--bs-secondary-text-emphasis);
14755
+ background: rgba(0, 0, 0, 0.06);
14756
+ }
14757
+ .faq-page .faq-section {
14758
+ margin-bottom: 2.5rem;
14759
+ scroll-margin-top: 5rem;
14760
+ }
14761
+ .faq-page .faq-section-header {
14762
+ display: flex;
14763
+ gap: 1rem;
14764
+ align-items: center;
14765
+ padding: 1rem 1.25rem;
14766
+ margin-bottom: 1rem;
14767
+ background: var(--bs-body-bg);
14768
+ border: 1px solid var(--bs-border-color);
14769
+ border-right: 4px solid var(--bs-primary);
14770
+ border-radius: 0.375rem;
14455
14771
  }
14456
- .table.table-head-fixed thead tr:nth-child(1) th {
14457
- position: sticky;
14458
- top: 0;
14459
- z-index: 10;
14460
- background-color: #fff;
14461
- border-bottom: 0;
14462
- box-shadow: inset 0 1px 0 var(--bs-border-color), inset 0 -1px 0 var(--bs-border-color);
14772
+ .faq-page .faq-section-icon {
14773
+ display: inline-flex;
14774
+ flex-shrink: 0;
14775
+ align-items: center;
14776
+ justify-content: center;
14777
+ width: 2.75rem;
14778
+ height: 2.75rem;
14779
+ font-size: 1.35rem;
14780
+ color: var(--bs-primary);
14781
+ background: var(--bs-primary-bg-subtle);
14782
+ border-radius: 0.375rem;
14463
14783
  }
14464
- .table.no-border,
14465
- .table.no-border td,
14466
- .table.no-border th {
14467
- border: 0;
14784
+ .faq-page .faq-section-title {
14785
+ margin: 0;
14786
+ font-size: 1.4rem;
14787
+ font-weight: 600;
14788
+ line-height: 1.2;
14789
+ color: var(--bs-emphasis-color);
14468
14790
  }
14469
- .table.text-center,
14470
- .table.text-center td,
14471
- .table.text-center th {
14472
- text-align: center;
14791
+ .faq-page .faq-section-count {
14792
+ margin: 0.1rem 0 0;
14793
+ font-size: 0.8rem;
14794
+ color: var(--bs-secondary-color);
14473
14795
  }
14474
- .table.table-valign-middle thead > tr > th,
14475
- .table.table-valign-middle thead > tr > td,
14476
- .table.table-valign-middle tbody > tr > th,
14477
- .table.table-valign-middle tbody > tr > td {
14478
- vertical-align: middle;
14796
+ .faq-page .faq-section-primary {
14797
+ border-right-color: var(--bs-primary);
14479
14798
  }
14480
- .card-body.p-0 .table thead > tr > th:first-of-type,
14481
- .card-body.p-0 .table thead > tr > td:first-of-type,
14482
- .card-body.p-0 .table tfoot > tr > th:first-of-type,
14483
- .card-body.p-0 .table tfoot > tr > td:first-of-type,
14484
- .card-body.p-0 .table tbody > tr > th:first-of-type,
14485
- .card-body.p-0 .table tbody > tr > td:first-of-type {
14486
- padding-right: 1.5rem;
14799
+ .faq-page .faq-section-primary .faq-section-icon {
14800
+ color: var(--bs-primary-text-emphasis);
14801
+ background: var(--bs-primary-bg-subtle);
14487
14802
  }
14488
- .card-body.p-0 .table thead > tr > th:last-of-type,
14489
- .card-body.p-0 .table thead > tr > td:last-of-type,
14490
- .card-body.p-0 .table tfoot > tr > th:last-of-type,
14491
- .card-body.p-0 .table tfoot > tr > td:last-of-type,
14492
- .card-body.p-0 .table tbody > tr > th:last-of-type,
14493
- .card-body.p-0 .table tbody > tr > td:last-of-type {
14494
- padding-left: 1.5rem;
14803
+ .faq-page .faq-section-info {
14804
+ border-right-color: var(--bs-info);
14495
14805
  }
14496
-
14497
- .small-box {
14498
- border-radius: 0.375rem;
14499
- box-shadow: 0 0 1px rgba(var(--bs-body-color-rgb), 0.125), 0 1px 3px rgba(var(--bs-body-color-rgb), 0.2);
14500
- position: relative;
14501
- display: block;
14502
- margin-bottom: 1.25rem;
14503
- --bs-link-color-rgb: none;
14504
- --bs-link-hover-color-rgb: none;
14505
- --bs-heading-color: none;
14806
+ .faq-page .faq-section-info .faq-section-icon {
14807
+ color: var(--bs-info-text-emphasis);
14808
+ background: var(--bs-info-bg-subtle);
14506
14809
  }
14507
- .small-box > .inner {
14508
- padding: 10px;
14810
+ .faq-page .faq-section-warning {
14811
+ border-right-color: var(--bs-warning);
14509
14812
  }
14510
- .small-box > .small-box-footer {
14511
- position: relative;
14512
- z-index: 10;
14513
- display: block;
14514
- padding: 3px 0;
14515
- text-align: center;
14516
- background-color: rgba(0, 0, 0, 0.07);
14813
+ .faq-page .faq-section-warning .faq-section-icon {
14814
+ color: var(--bs-warning-text-emphasis);
14815
+ background: var(--bs-warning-bg-subtle);
14517
14816
  }
14518
- .small-box > .small-box-footer:hover {
14519
- background-color: rgba(0, 0, 0, 0.1);
14817
+ .faq-page .faq-section-success {
14818
+ border-right-color: var(--bs-success);
14520
14819
  }
14521
- .small-box h3, .small-box .h3 {
14522
- font-size: calc(1.345rem + 1.14vw);
14820
+ .faq-page .faq-section-success .faq-section-icon {
14821
+ color: var(--bs-success-text-emphasis);
14822
+ background: var(--bs-success-bg-subtle);
14523
14823
  }
14524
- @media (min-width: 1200px) {
14525
- .small-box h3, .small-box .h3 {
14526
- font-size: 2.2rem;
14527
- }
14824
+ .faq-page .faq-section-danger {
14825
+ border-right-color: var(--bs-danger);
14528
14826
  }
14529
- .small-box h3, .small-box .h3 {
14530
- padding: 0;
14531
- margin: 0 0 10px;
14532
- font-weight: 700;
14533
- white-space: nowrap;
14827
+ .faq-page .faq-section-danger .faq-section-icon {
14828
+ color: var(--bs-danger-text-emphasis);
14829
+ background: var(--bs-danger-bg-subtle);
14534
14830
  }
14535
- @media (min-width: 992px) {
14536
- .col-xl-2 .small-box h3, .col-xl-2 .small-box .h3, .col-lg-2 .small-box h3, .col-lg-2 .small-box .h3, .col-md-2 .small-box h3, .col-md-2 .small-box .h3 {
14537
- font-size: calc(1.285rem + 0.42vw);
14538
- }
14831
+ .faq-page .faq-section-secondary {
14832
+ border-right-color: var(--bs-secondary);
14539
14833
  }
14540
- @media (min-width: 992px) and (min-width: 1200px) {
14541
- .col-xl-2 .small-box h3, .col-xl-2 .small-box .h3, .col-lg-2 .small-box h3, .col-lg-2 .small-box .h3, .col-md-2 .small-box h3, .col-md-2 .small-box .h3 {
14542
- font-size: 1.6rem;
14543
- }
14834
+ .faq-page .faq-section-secondary .faq-section-icon {
14835
+ color: var(--bs-secondary-text-emphasis);
14836
+ background: var(--bs-secondary-bg-subtle);
14544
14837
  }
14545
- @media (min-width: 992px) {
14546
- .col-xl-3 .small-box h3, .col-xl-3 .small-box .h3, .col-lg-3 .small-box h3, .col-lg-3 .small-box .h3, .col-md-3 .small-box h3, .col-md-3 .small-box .h3 {
14547
- font-size: calc(1.285rem + 0.42vw);
14548
- }
14838
+ .faq-page .faq-section-items .faq-item {
14839
+ margin-bottom: 0.5rem;
14840
+ overflow: hidden;
14841
+ background: var(--bs-body-bg);
14842
+ border: 1px solid var(--bs-border-color);
14843
+ border-radius: 0.375rem;
14844
+ transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
14549
14845
  }
14550
- @media (min-width: 992px) and (min-width: 1200px) {
14551
- .col-xl-3 .small-box h3, .col-xl-3 .small-box .h3, .col-lg-3 .small-box h3, .col-lg-3 .small-box .h3, .col-md-3 .small-box h3, .col-md-3 .small-box .h3 {
14552
- font-size: 1.6rem;
14846
+ @media (prefers-reduced-motion: reduce) {
14847
+ .faq-page .faq-section-items .faq-item {
14848
+ transition: none;
14553
14849
  }
14554
14850
  }
14555
- @media (min-width: 1200px) {
14556
- .col-xl-2 .small-box h3, .col-xl-2 .small-box .h3, .col-lg-2 .small-box h3, .col-lg-2 .small-box .h3, .col-md-2 .small-box h3, .col-md-2 .small-box .h3 {
14557
- font-size: calc(1.345rem + 1.14vw);
14558
- }
14851
+ .faq-page .faq-section-items .faq-item:hover {
14852
+ border-color: var(--bs-primary-border-subtle);
14853
+ transform: translateX(-2px);
14559
14854
  }
14560
- @media (min-width: 1200px) and (min-width: 1200px) {
14561
- .col-xl-2 .small-box h3, .col-xl-2 .small-box .h3, .col-lg-2 .small-box h3, .col-lg-2 .small-box .h3, .col-md-2 .small-box h3, .col-md-2 .small-box .h3 {
14562
- font-size: 2.2rem;
14563
- }
14855
+ .faq-page .faq-section-items .faq-item[open] {
14856
+ border-color: var(--bs-primary-border-subtle);
14857
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
14858
+ transform: none;
14564
14859
  }
14565
- @media (min-width: 1200px) {
14566
- .col-xl-3 .small-box h3, .col-xl-3 .small-box .h3, .col-lg-3 .small-box h3, .col-lg-3 .small-box .h3, .col-md-3 .small-box h3, .col-md-3 .small-box .h3 {
14567
- font-size: calc(1.345rem + 1.14vw);
14568
- }
14860
+ .faq-page .faq-section-items .faq-item summary {
14861
+ display: flex;
14862
+ gap: 0.85rem;
14863
+ align-items: center;
14864
+ padding: 1rem 1.25rem;
14865
+ font-size: 1rem;
14866
+ font-weight: 500;
14867
+ color: var(--bs-emphasis-color);
14868
+ list-style: none;
14869
+ cursor: pointer;
14870
+ -webkit-user-select: none;
14871
+ user-select: none;
14569
14872
  }
14570
- @media (min-width: 1200px) and (min-width: 1200px) {
14571
- .col-xl-3 .small-box h3, .col-xl-3 .small-box .h3, .col-lg-3 .small-box h3, .col-lg-3 .small-box .h3, .col-md-3 .small-box h3, .col-md-3 .small-box .h3 {
14572
- font-size: 2.2rem;
14573
- }
14873
+ .faq-page .faq-section-items .faq-item summary::-webkit-details-marker {
14874
+ display: none;
14574
14875
  }
14575
- .small-box p {
14576
- font-size: 1rem;
14876
+ .faq-page .faq-section-items .faq-item summary::marker {
14877
+ content: "";
14577
14878
  }
14578
- .small-box p > small, .small-box p > .small {
14579
- display: block;
14580
- margin-top: 5px;
14581
- font-size: 0.9rem;
14582
- color: #f8f9fa;
14879
+ .faq-page .faq-section-items .faq-item summary::after {
14880
+ content: none;
14583
14881
  }
14584
- .small-box h3, .small-box .h3,
14585
- .small-box p {
14586
- z-index: 5;
14882
+ .faq-page .faq-section-items .faq-item .faq-q-icon {
14883
+ display: inline-flex;
14884
+ flex-shrink: 0;
14885
+ align-items: center;
14886
+ justify-content: center;
14887
+ width: 1.75rem;
14888
+ height: 1.75rem;
14889
+ font-size: 0.85rem;
14890
+ color: var(--bs-primary);
14891
+ background: var(--bs-primary-bg-subtle);
14892
+ border-radius: 50%;
14587
14893
  }
14588
- .small-box .small-box-icon {
14589
- position: absolute;
14590
- top: 15px;
14591
- left: 15px;
14592
- z-index: 0;
14593
- height: 70px;
14594
- font-size: 70px;
14595
- color: rgba(0, 0, 0, 0.15);
14596
- transition: transform 0.3s linear;
14894
+ .faq-page .faq-section-items .faq-item .faq-q-text {
14895
+ flex-grow: 1;
14896
+ }
14897
+ .faq-page .faq-section-items .faq-item .faq-q-chevron {
14898
+ flex-shrink: 0;
14899
+ color: var(--bs-secondary-color);
14900
+ transition: transform 0.2s ease, color 0.2s ease;
14597
14901
  }
14598
14902
  @media (prefers-reduced-motion: reduce) {
14599
- .small-box .small-box-icon {
14903
+ .faq-page .faq-section-items .faq-item .faq-q-chevron {
14600
14904
  transition: none;
14601
14905
  }
14602
14906
  }
14603
- .small-box:hover .small-box-icon {
14604
- transform: scale(1.1);
14907
+ .faq-page .faq-section-items .faq-item[open] .faq-q-chevron {
14908
+ color: var(--bs-primary);
14909
+ transform: rotate(-180deg);
14605
14910
  }
14606
-
14607
- @media (max-width: 575.98px) {
14608
- .small-box {
14609
- text-align: center;
14610
- }
14611
- .small-box .small-box-icon {
14612
- display: none;
14613
- }
14614
- .small-box p {
14615
- font-size: 12px;
14616
- }
14911
+ .faq-page .faq-section-items .faq-item[open] summary {
14912
+ color: var(--bs-primary);
14913
+ border-bottom: 1px solid var(--bs-border-color);
14617
14914
  }
14618
- .info-box {
14619
- box-shadow: 0 0 1px rgba(var(--bs-body-color-rgb), 0.125), 0 1px 3px rgba(var(--bs-body-color-rgb), 0.2);
14620
- border-radius: 0.375rem;
14621
- position: relative;
14622
- display: flex;
14623
- width: 100%;
14624
- min-height: 80px;
14625
- padding: 0.5rem;
14626
- margin-bottom: 1rem;
14915
+ .faq-page .faq-section-items .faq-item .faq-answer {
14916
+ padding: 1.1rem 3.85rem 1.1rem 1.25rem;
14917
+ font-size: 0.95rem;
14918
+ line-height: 1.65;
14627
14919
  color: var(--bs-body-color);
14628
- background-color: var(--bs-body-bg);
14629
- }
14630
- .info-box .progress {
14631
- height: 2px;
14632
- margin: 5px 0;
14633
- background-color: rgba(var(--lte-card-variant-color-rgb), 0.125);
14634
14920
  }
14635
- .info-box .progress .progress-bar {
14636
- background-color: var(--lte-card-variant-color);
14921
+ .faq-page .faq-section-items .faq-item .faq-answer p:last-child,
14922
+ .faq-page .faq-section-items .faq-item .faq-answer ul:last-child,
14923
+ .faq-page .faq-section-items .faq-item .faq-answer ol:last-child,
14924
+ .faq-page .faq-section-items .faq-item .faq-answer pre:last-child {
14925
+ margin-bottom: 0;
14637
14926
  }
14638
- .info-box .info-box-icon {
14639
- display: flex;
14640
- align-items: center;
14641
- justify-content: center;
14642
- width: 70px;
14643
- font-size: 1.875rem;
14644
- text-align: center;
14645
- border-radius: 0.375rem;
14927
+ .faq-page .faq-section-items .faq-item .faq-answer a {
14928
+ color: var(--bs-primary);
14929
+ text-decoration: underline;
14930
+ text-underline-offset: 2px;
14646
14931
  }
14647
- .info-box .info-box-icon > img {
14648
- max-width: 100%;
14932
+ .faq-page .faq-section-items .faq-item .faq-answer a:hover {
14933
+ text-decoration-thickness: 2px;
14649
14934
  }
14650
- .info-box .info-box-content {
14651
- display: flex;
14652
- flex: 1;
14653
- flex-direction: column;
14654
- justify-content: center;
14655
- padding: 0 10px;
14656
- line-height: 1.8;
14935
+ .faq-page .faq-section-items .faq-item .faq-answer code {
14936
+ padding: 0.12em 0.35em;
14937
+ font-size: 0.875em;
14938
+ color: var(--bs-emphasis-color);
14939
+ background: var(--bs-tertiary-bg);
14940
+ border: 1px solid var(--bs-border-color);
14941
+ border-radius: 0.25rem;
14657
14942
  }
14658
- .info-box .info-box-number {
14659
- display: block;
14660
- margin-top: 0.25rem;
14661
- font-weight: 700;
14943
+ .faq-page .faq-section-items .faq-item .faq-answer pre.astro-code,
14944
+ .faq-page .faq-section-items .faq-item .faq-answer pre {
14945
+ padding: 0.85rem 1rem;
14946
+ margin-top: 0.75rem;
14947
+ margin-bottom: 0.75rem;
14948
+ overflow-x: auto;
14949
+ font-size: 0.85rem;
14950
+ line-height: 1.55;
14951
+ border-radius: 0.25rem;
14662
14952
  }
14663
- .info-box .progress-description,
14664
- .info-box .info-box-text {
14665
- display: block;
14666
- overflow: hidden;
14667
- text-overflow: ellipsis;
14668
- white-space: nowrap;
14953
+ .faq-page .faq-section-items .faq-item .faq-answer pre.astro-code code,
14954
+ .faq-page .faq-section-items .faq-item .faq-answer pre code {
14955
+ padding: 0;
14956
+ background: transparent;
14957
+ border: 0;
14669
14958
  }
14670
- .info-box .info-box-more {
14671
- display: block;
14959
+ .faq-page .faq-cta {
14960
+ padding: 2.5rem 1.5rem;
14961
+ text-align: center;
14962
+ background: radial-gradient(ellipse at top, rgba(var(--bs-primary-rgb), 0.08), transparent 60%), var(--bs-body-bg);
14963
+ border: 1px solid var(--bs-border-color);
14964
+ border-radius: 1rem;
14672
14965
  }
14673
- .info-box .progress-description {
14674
- margin: 0;
14966
+ .faq-page .faq-cta-icon {
14967
+ display: inline-flex;
14968
+ align-items: center;
14969
+ justify-content: center;
14970
+ width: 3.5rem;
14971
+ height: 3.5rem;
14972
+ margin-bottom: 1rem;
14973
+ font-size: 1.6rem;
14974
+ color: var(--bs-primary);
14975
+ background: var(--bs-primary-bg-subtle);
14976
+ border-radius: 50%;
14675
14977
  }
14676
- @media (min-width: 768px) {
14677
- .col-xl-2 .info-box .progress-description, .col-lg-2 .info-box .progress-description, .col-md-2 .info-box .progress-description {
14678
- display: none;
14679
- }
14680
- .col-xl-3 .info-box .progress-description, .col-lg-3 .info-box .progress-description, .col-md-3 .info-box .progress-description {
14681
- display: none;
14682
- }
14978
+ .faq-page .faq-cta h2, .faq-page .faq-cta .h2 {
14979
+ margin: 0 0 0.5rem;
14980
+ font-size: 1.5rem;
14981
+ font-weight: 600;
14982
+ color: var(--bs-emphasis-color);
14683
14983
  }
14684
- @media (min-width: 992px) {
14685
- .col-xl-2 .info-box .progress-description, .col-lg-2 .info-box .progress-description, .col-md-2 .info-box .progress-description {
14686
- font-size: 0.75rem;
14687
- display: block;
14688
- }
14689
- .col-xl-3 .info-box .progress-description, .col-lg-3 .info-box .progress-description, .col-md-3 .info-box .progress-description {
14690
- font-size: 0.75rem;
14691
- display: block;
14692
- }
14984
+ .faq-page .faq-cta p {
14985
+ max-width: 32rem;
14986
+ margin: 0 auto 1.5rem;
14987
+ color: var(--bs-secondary-color);
14693
14988
  }
14694
- @media (min-width: 1200px) {
14695
- .col-xl-2 .info-box .progress-description, .col-lg-2 .info-box .progress-description, .col-md-2 .info-box .progress-description {
14696
- font-size: 1rem;
14697
- display: block;
14698
- }
14699
- .col-xl-3 .info-box .progress-description, .col-lg-3 .info-box .progress-description, .col-md-3 .info-box .progress-description {
14700
- font-size: 1rem;
14701
- display: block;
14702
- }
14989
+ .faq-page .faq-cta-actions {
14990
+ display: inline-flex;
14991
+ flex-wrap: wrap;
14992
+ gap: 0.5rem;
14993
+ justify-content: center;
14703
14994
  }
14704
14995
 
14705
- .timeline {
14996
+ .progress {
14997
+ border-radius: 1px;
14998
+ }
14999
+ .progress.vertical {
14706
15000
  position: relative;
14707
- padding: 0;
14708
- margin: 0 0 45px;
15001
+ display: inline-block;
15002
+ width: 30px;
15003
+ height: 200px;
15004
+ margin-left: 10px;
14709
15005
  }
14710
- .timeline::before {
14711
- border-radius: 0.375rem;
15006
+ .progress.vertical > .progress-bar {
14712
15007
  position: absolute;
14713
- top: 0;
14714
15008
  bottom: 0;
14715
- right: 31px;
14716
- width: 4px;
14717
- margin: 0;
14718
- content: "";
14719
- background-color: var(--bs-border-color);
14720
- }
14721
- .timeline > div::before, .timeline > div::after {
14722
- display: table;
14723
- content: "";
15009
+ width: 100%;
14724
15010
  }
14725
- .timeline > div {
14726
- position: relative;
14727
- margin-left: 10px;
14728
- margin-bottom: 15px;
15011
+ .progress.vertical.sm, .progress.vertical.progress-sm {
15012
+ width: 20px;
14729
15013
  }
14730
- .timeline > div > .timeline-item {
14731
- box-shadow: 0 0 1px rgba(var(--bs-body-color-rgb), 0.125), 0 1px 3px rgba(var(--bs-body-color-rgb), 0.2);
14732
- border-radius: 0.375rem;
14733
- position: relative;
14734
- padding: 0;
14735
- margin-top: 0;
14736
- margin-left: 15px;
14737
- margin-right: 60px;
14738
- color: var(--bs-body-color);
14739
- background-color: var(--bs-body-bg);
15014
+ .progress.vertical.xs, .progress.vertical.progress-xs {
15015
+ width: 10px;
14740
15016
  }
14741
- .timeline > div > .timeline-item > .time {
14742
- float: left;
14743
- padding: 10px;
14744
- font-size: 12px;
14745
- color: var(--bs-secondary-color);
15017
+ .progress.vertical.xxs, .progress.vertical.progress-xxs {
15018
+ width: 3px;
14746
15019
  }
14747
- .timeline > div > .timeline-item > .timeline-header {
14748
- padding: 10px;
14749
- margin: 0;
14750
- font-size: 16px;
14751
- line-height: 1.1;
14752
- color: var(--bs-secondary-color);
14753
- border-bottom: 1px solid var(--bs-border-color);
15020
+
15021
+ .progress-group {
15022
+ margin-bottom: 0.5rem;
14754
15023
  }
14755
- .timeline > div > .timeline-item > .timeline-header > a {
14756
- font-weight: 600;
14757
- text-decoration: none;
15024
+
15025
+ .progress-sm {
15026
+ height: 10px;
14758
15027
  }
14759
- .timeline > div > .timeline-item > .timeline-body,
14760
- .timeline > div > .timeline-item > .timeline-footer {
14761
- padding: 10px;
15028
+
15029
+ .progress-xs {
15030
+ height: 7px;
14762
15031
  }
14763
- .timeline > div > .timeline-item > .timeline-body > img {
14764
- margin: 10px;
15032
+
15033
+ .progress-xxs {
15034
+ height: 3px;
14765
15035
  }
14766
- .timeline > div > .timeline-item > .timeline-body > dl,
14767
- .timeline > div > .timeline-item > .timeline-body ol,
14768
- .timeline > div > .timeline-item > .timeline-body ul {
15036
+
15037
+ .table tr > td .progress {
14769
15038
  margin: 0;
14770
15039
  }
14771
- .timeline > div .timeline-icon {
14772
- position: absolute;
14773
- top: 0;
14774
- right: 18px;
14775
- width: 30px;
14776
- height: 30px;
14777
- font-size: 16px;
14778
- line-height: 30px;
14779
- text-align: center;
14780
- background-color: var(--bs-secondary-bg);
14781
- border-radius: 50%;
14782
- }
14783
- .timeline > .time-label > span {
14784
- border-radius: 4px;
14785
- display: inline-block;
14786
- padding: 5px;
14787
- font-weight: 600;
14788
- background-color: var(--bs-body-bg);
14789
- }
14790
15040
 
14791
- .timeline-inverse > div > .timeline-item {
14792
- box-shadow: none;
14793
- background-color: var(--bs-tertiary-bg);
14794
- border: 1px solid var(--bs-border-color);
15041
+ .card {
15042
+ box-shadow: 0 0 1px rgba(var(--bs-body-color-rgb), 0.125), 0 1px 3px rgba(var(--bs-body-color-rgb), 0.2);
14795
15043
  }
14796
- .timeline-inverse > div > .timeline-item > .timeline-header {
14797
- border-bottom-color: var(--bs-border-color);
15044
+ .card[class*=card-]:not(.card-outline) > .card-header, .card[class*=text-bg-]:not(.card-outline) > .card-header {
15045
+ color: var(--lte-card-variant-color);
15046
+ background-color: var(--lte-card-variant-bg);
14798
15047
  }
14799
-
14800
- .direct-chat .card-body {
14801
- position: relative;
14802
- padding: 0;
14803
- overflow-x: hidden;
15048
+ .card[class*=card-]:not(.card-outline) > .card-header .btn-tool, .card[class*=text-bg-]:not(.card-outline) > .card-header .btn-tool {
15049
+ --bs-btn-color: rgba(var(--lte-card-variant-color-rgb), .8);
15050
+ --bs-btn-hover-color: var(--lte-card-variant-color);
14804
15051
  }
14805
- .direct-chat.chat-pane-open .direct-chat-contacts {
14806
- transform: translate(0, 0);
15052
+ .card.card-outline {
15053
+ border-top: 3px solid var(--lte-card-variant-bg);
14807
15054
  }
14808
- .direct-chat.timestamp-light .direct-chat-timestamp {
14809
- color: rgba(var(--bs-body-color-rgb), 0.65);
15055
+ .card.maximized-card {
15056
+ position: fixed;
15057
+ top: 0;
15058
+ right: 0;
15059
+ z-index: 1050;
15060
+ width: 100% !important;
15061
+ max-width: 100% !important;
15062
+ height: 100% !important;
15063
+ max-height: 100% !important;
14810
15064
  }
14811
- .direct-chat.timestamp-dark .direct-chat-timestamp {
14812
- color: rgba(var(--bs-body-color-rgb), 0.9);
15065
+ .card.maximized-card.was-collapsed .card-body {
15066
+ display: block !important;
14813
15067
  }
14814
-
14815
- .direct-chat-messages {
14816
- height: 250px;
14817
- padding: 10px;
15068
+ .card.maximized-card .card-body {
14818
15069
  overflow: auto;
14819
- transform: translate(0, 0);
14820
15070
  }
14821
-
14822
- .direct-chat-msg,
14823
- .direct-chat-text {
14824
- display: block;
15071
+ .card.maximized-card [data-lte-toggle=card-collapse] {
15072
+ display: none;
14825
15073
  }
14826
-
14827
- .direct-chat-msg::after {
14828
- display: block;
14829
- clear: both;
14830
- content: "";
15074
+ .card.maximized-card [data-lte-icon=maximize] {
15075
+ display: none;
14831
15076
  }
14832
- .direct-chat-msg {
14833
- margin-bottom: 10px;
15077
+ .card.maximized-card .card-header,
15078
+ .card.maximized-card .card-footer {
15079
+ border-radius: 0 !important;
14834
15080
  }
14835
-
14836
- .direct-chat-messages,
14837
- .direct-chat-contacts {
14838
- transition: transform 0.5s ease-in-out;
15081
+ .card:not(.maximized-card) [data-lte-icon=minimize] {
15082
+ display: none;
14839
15083
  }
14840
- @media (prefers-reduced-motion: reduce) {
14841
- .direct-chat-messages,
14842
- .direct-chat-contacts {
14843
- transition: none;
14844
- }
15084
+ .card.collapsed-card > .card-header [data-lte-icon=collapse] {
15085
+ display: none;
14845
15086
  }
14846
-
14847
- .direct-chat-text {
14848
- border-radius: 0.5rem;
14849
- position: relative;
14850
- padding: 5px 10px;
14851
- margin: 5px 50px 0 0;
14852
- color: var(--bs-emphasis-color);
14853
- background-color: var(--bs-secondary-bg);
14854
- border: 1px solid var(--bs-border-color);
15087
+ .card.collapsed-card > .card-body,
15088
+ .card.collapsed-card > .card-footer {
15089
+ display: none;
14855
15090
  }
14856
- .direct-chat-text::after, .direct-chat-text::before {
14857
- position: absolute;
14858
- top: 15px;
14859
- left: 100%;
14860
- width: 0;
14861
- height: 0;
14862
- pointer-events: none;
14863
- content: " ";
14864
- border: solid transparent;
14865
- border-left-color: var(--bs-border-color);
15091
+ .card:not(.collapsed-card) > .card-header [data-lte-icon=expand] {
15092
+ display: none;
14866
15093
  }
14867
- .direct-chat-text::after {
14868
- margin-top: -5px;
14869
- border-width: 5px;
15094
+ .card .nav.flex-column > li {
15095
+ margin: 0;
15096
+ border-bottom: 1px solid var(--bs-border-color-translucent);
14870
15097
  }
14871
- .direct-chat-text::before {
14872
- margin-top: -6px;
14873
- border-width: 6px;
15098
+ .card .nav.flex-column > li:last-of-type {
15099
+ border-bottom: 0;
14874
15100
  }
14875
- .end .direct-chat-text {
14876
- margin-left: 50px;
14877
- margin-right: 0;
15101
+ .card.height-control .card-body {
15102
+ max-height: 300px;
15103
+ overflow: auto;
14878
15104
  }
14879
- .end .direct-chat-text::after, .end .direct-chat-text::before {
14880
- left: auto;
14881
- right: 100%;
14882
- border-left-color: transparent;
14883
- border-right-color: var(--bs-border-color);
15105
+ .card .border-end {
15106
+ border-left: 1px solid var(--bs-border-color-translucent);
14884
15107
  }
14885
-
14886
- .direct-chat-img {
14887
- border-radius: 50%;
14888
- float: right;
14889
- width: 40px;
14890
- height: 40px;
15108
+ .card .border-start {
15109
+ border-right: 1px solid var(--bs-border-color-translucent);
14891
15110
  }
14892
- .end .direct-chat-img {
14893
- float: left;
15111
+ .card.card-tabs:not(.card-outline) > .card-header {
15112
+ border-bottom: 0;
14894
15113
  }
14895
-
14896
- .direct-chat-infos {
14897
- display: block;
14898
- margin-bottom: 2px;
14899
- font-size: 0.875rem;
15114
+ .card.card-tabs:not(.card-outline) > .card-header .nav-item:first-child .nav-link {
15115
+ border-right-color: transparent;
14900
15116
  }
14901
-
14902
- .direct-chat-name {
14903
- font-weight: 600;
15117
+ .card.card-tabs.card-outline .nav-item {
15118
+ border-bottom: 0;
14904
15119
  }
14905
-
14906
- .direct-chat-timestamp {
14907
- color: rgba(var(--bs-body-color-rgb), 0.75);
15120
+ .card.card-tabs.card-outline .nav-item:first-child .nav-link {
15121
+ margin-right: 0;
15122
+ border-right: 0;
14908
15123
  }
14909
-
14910
- .direct-chat-contacts-open .direct-chat-contacts {
14911
- transform: translate(0, 0);
15124
+ .card.card-tabs .card-tools {
15125
+ margin: 0.3rem 0.5rem;
14912
15126
  }
14913
-
14914
- .direct-chat-contacts {
14915
- position: absolute;
14916
- top: 0;
14917
- bottom: 0;
14918
- width: 100%;
14919
- height: 250px;
14920
- overflow: auto;
14921
- color: var(--bs-body-bg);
14922
- background-color: var(--bs-body-color);
14923
- transform: translate(-101%, 0);
15127
+ .card.card-tabs:not(.expanding-card).collapsed-card .card-header {
15128
+ border-bottom: 0;
14924
15129
  }
14925
-
14926
- .direct-chat-contacts-light {
14927
- background-color: var(--bs-light-bg-subtle);
15130
+ .card.card-tabs:not(.expanding-card).collapsed-card .card-header .nav-tabs {
15131
+ border-bottom: 0;
14928
15132
  }
14929
- .direct-chat-contacts-light .contacts-list-name {
14930
- color: var(--bs-body-color);
15133
+ .card.card-tabs:not(.expanding-card).collapsed-card .card-header .nav-tabs .nav-item {
15134
+ margin-bottom: 0;
14931
15135
  }
14932
- .direct-chat-contacts-light .contacts-list-date {
14933
- color: var(--bs-secondary-color);
15136
+ .card.card-tabs.expanding-card .card-header .nav-tabs .nav-item {
15137
+ margin-bottom: -1px;
14934
15138
  }
14935
- .direct-chat-contacts-light .contacts-list-msg {
14936
- color: var(--bs-secondary-color);
14937
- }
14938
-
14939
- .contacts-list {
14940
- padding-right: 0;
14941
- list-style: none;
15139
+ .card.card-outline-tabs {
15140
+ border-top: 0;
14942
15141
  }
14943
- .contacts-list > li::after {
14944
- display: block;
14945
- clear: both;
14946
- content: "";
15142
+ .card.card-outline-tabs .card-header .nav-item:first-child .nav-link {
15143
+ margin-right: 0;
15144
+ border-right: 0;
14947
15145
  }
14948
- .contacts-list > li {
14949
- padding: 10px;
14950
- margin: 0;
15146
+ .card.card-outline-tabs .card-header a {
14951
15147
  text-decoration: none;
14952
- border-bottom: 1px solid rgba(0, 0, 0, 0.2);
15148
+ border-top: 3px solid transparent;
14953
15149
  }
14954
- .contacts-list > li:last-of-type {
15150
+ .card.card-outline-tabs .card-header a:hover {
15151
+ border-top: 3px solid var(--bs-border-color);
15152
+ }
15153
+ .card.card-outline-tabs .card-header a.active:hover {
15154
+ margin-top: 0;
15155
+ }
15156
+ .card.card-outline-tabs .card-tools {
15157
+ margin: 0.5rem 0.5rem 0.3rem;
15158
+ }
15159
+ .card.card-outline-tabs:not(.expanding-card).collapsed-card .card-header {
14955
15160
  border-bottom: 0;
14956
15161
  }
14957
- .contacts-list > li a {
14958
- text-decoration: none;
15162
+ .card.card-outline-tabs:not(.expanding-card).collapsed-card .card-header .nav-tabs {
15163
+ border-bottom: 0;
14959
15164
  }
14960
-
14961
- .contacts-list-img {
14962
- border-radius: 50%;
14963
- float: right;
14964
- width: 40px;
15165
+ .card.card-outline-tabs:not(.expanding-card).collapsed-card .card-header .nav-tabs .nav-item {
15166
+ margin-bottom: 0;
15167
+ }
15168
+ .card.card-outline-tabs.expanding-card .card-header .nav-tabs .nav-item {
15169
+ margin-bottom: -1px;
14965
15170
  }
14966
15171
 
14967
- .contacts-list-info {
14968
- margin-right: 45px;
14969
- color: var(--bs-body-bg);
15172
+ html.maximized-card {
15173
+ overflow: hidden;
14970
15174
  }
14971
15175
 
14972
- .contacts-list-name,
14973
- .contacts-list-status {
15176
+ .card-header::after,
15177
+ .card-body::after,
15178
+ .card-footer::after {
14974
15179
  display: block;
15180
+ clear: both;
15181
+ content: "";
14975
15182
  }
14976
15183
 
14977
- .contacts-list-name {
14978
- font-weight: 600;
15184
+ .card-header {
15185
+ position: relative;
15186
+ padding: 1rem 1rem;
15187
+ background-color: transparent;
15188
+ border-bottom: 1px solid var(--bs-border-color-translucent);
15189
+ border-top-right-radius: 0.375rem;
15190
+ border-top-left-radius: 0.375rem;
14979
15191
  }
14980
-
14981
- .contacts-list-status {
14982
- font-size: 0.875rem;
15192
+ .collapsed-card .card-header {
15193
+ border-bottom: 0;
15194
+ }
15195
+ .card-header > .card-tools {
15196
+ float: left;
15197
+ margin-left: -0.5rem;
15198
+ }
15199
+ .card-header > .card-tools .input-group,
15200
+ .card-header > .card-tools .nav,
15201
+ .card-header > .card-tools .pagination {
15202
+ margin-top: -0.4rem;
15203
+ margin-bottom: -0.4rem;
15204
+ }
15205
+ .card-header > .card-tools [data-bs-toggle=tooltip] {
15206
+ position: relative;
14983
15207
  }
14984
15208
 
14985
- .contacts-list-date {
15209
+ .card-title {
15210
+ float: right;
15211
+ margin: 0;
15212
+ font-size: 1.1rem;
14986
15213
  font-weight: 400;
14987
- color: var(--bs-secondary-bg);
14988
15214
  }
14989
15215
 
14990
- .contacts-list-msg {
14991
- color: var(--bs-secondary-bg);
15216
+ .btn-tool {
15217
+ --bs-btn-padding-x: .5rem;
15218
+ --bs-btn-padding-y: .25rem;
14992
15219
  }
14993
-
14994
- .end > .direct-chat-text {
14995
- color: var(--lte-direct-chat-color);
14996
- background-color: var(--lte-direct-chat-bg);
14997
- border-color: var(--lte-direct-chat-bg);
15220
+ .btn-tool:not(.btn-tool-custom) {
15221
+ --bs-btn-color: var(--bs-tertiary-color);
15222
+ --bs-btn-bg: transparent;
15223
+ --bs-btn-box-shadow: none;
15224
+ --bs-btn-hover-color: var(--bs-secondary-color);
15225
+ --bs-btn-active-border-color: transparent;
14998
15226
  }
14999
- .end > .direct-chat-text::after, .end > .direct-chat-text::before {
15000
- border-right-color: var(--lte-direct-chat-bg);
15227
+ .btn-tool {
15228
+ margin: -1rem 0;
15229
+ font-size: 0.875rem;
15001
15230
  }
15002
15231
 
15003
- .direct-chat-primary {
15004
- --lte-direct-chat-color: #fff;
15005
- --lte-direct-chat-bg: #0d6efd;
15232
+ .card-primary,
15233
+ .bg-primary,
15234
+ .text-bg-primary {
15235
+ --lte-card-variant-bg: #0d6efd;
15236
+ --lte-card-variant-bg-rgb: 13, 110, 253;
15237
+ --lte-card-variant-color: #fff;
15238
+ --lte-card-variant-color-rgb: 255, 255, 255;
15006
15239
  }
15007
15240
 
15008
- .direct-chat-secondary {
15009
- --lte-direct-chat-color: #fff;
15010
- --lte-direct-chat-bg: #6c757d;
15241
+ .card-secondary,
15242
+ .bg-secondary,
15243
+ .text-bg-secondary {
15244
+ --lte-card-variant-bg: #6c757d;
15245
+ --lte-card-variant-bg-rgb: 108, 117, 125;
15246
+ --lte-card-variant-color: #fff;
15247
+ --lte-card-variant-color-rgb: 255, 255, 255;
15011
15248
  }
15012
15249
 
15013
- .direct-chat-success {
15014
- --lte-direct-chat-color: #fff;
15015
- --lte-direct-chat-bg: #198754;
15250
+ .card-success,
15251
+ .bg-success,
15252
+ .text-bg-success {
15253
+ --lte-card-variant-bg: #198754;
15254
+ --lte-card-variant-bg-rgb: 25, 135, 84;
15255
+ --lte-card-variant-color: #fff;
15256
+ --lte-card-variant-color-rgb: 255, 255, 255;
15016
15257
  }
15017
15258
 
15018
- .direct-chat-info {
15019
- --lte-direct-chat-color: #000;
15020
- --lte-direct-chat-bg: #0dcaf0;
15259
+ .card-info,
15260
+ .bg-info,
15261
+ .text-bg-info {
15262
+ --lte-card-variant-bg: #0dcaf0;
15263
+ --lte-card-variant-bg-rgb: 13, 202, 240;
15264
+ --lte-card-variant-color: #000;
15265
+ --lte-card-variant-color-rgb: 0, 0, 0;
15021
15266
  }
15022
15267
 
15023
- .direct-chat-warning {
15024
- --lte-direct-chat-color: #000;
15025
- --lte-direct-chat-bg: #ffc107;
15268
+ .card-warning,
15269
+ .bg-warning,
15270
+ .text-bg-warning {
15271
+ --lte-card-variant-bg: #ffc107;
15272
+ --lte-card-variant-bg-rgb: 255, 193, 7;
15273
+ --lte-card-variant-color: #000;
15274
+ --lte-card-variant-color-rgb: 0, 0, 0;
15026
15275
  }
15027
15276
 
15028
- .direct-chat-danger {
15029
- --lte-direct-chat-color: #fff;
15030
- --lte-direct-chat-bg: #dc3545;
15277
+ .card-danger,
15278
+ .bg-danger,
15279
+ .text-bg-danger {
15280
+ --lte-card-variant-bg: #dc3545;
15281
+ --lte-card-variant-bg-rgb: 220, 53, 69;
15282
+ --lte-card-variant-color: #fff;
15283
+ --lte-card-variant-color-rgb: 255, 255, 255;
15031
15284
  }
15032
15285
 
15033
- .direct-chat-light {
15034
- --lte-direct-chat-color: #000;
15035
- --lte-direct-chat-bg: #f8f9fa;
15286
+ .card-light,
15287
+ .bg-light,
15288
+ .text-bg-light {
15289
+ --lte-card-variant-bg: #f8f9fa;
15290
+ --lte-card-variant-bg-rgb: 248, 249, 250;
15291
+ --lte-card-variant-color: #000;
15292
+ --lte-card-variant-color-rgb: 0, 0, 0;
15036
15293
  }
15037
15294
 
15038
- .direct-chat-dark {
15039
- --lte-direct-chat-color: #fff;
15040
- --lte-direct-chat-bg: #212529;
15295
+ .card-dark,
15296
+ .bg-dark,
15297
+ .text-bg-dark {
15298
+ --lte-card-variant-bg: #212529;
15299
+ --lte-card-variant-bg-rgb: 33, 37, 41;
15300
+ --lte-card-variant-color: #fff;
15301
+ --lte-card-variant-color-rgb: 255, 255, 255;
15041
15302
  }
15042
15303
 
15043
- .toast-primary {
15044
- --bs-toast-header-color: #fff;
15045
- --bs-toast-header-bg: #0d6efd;
15046
- --bs-toast-header-border-color: #0d6efd;
15047
- --bs-toast-border-color: #0d6efd;
15048
- --bs-toast-bg: var(--bs-primary-bg-subtle);
15304
+ .card-body > .table {
15305
+ margin-bottom: 0;
15049
15306
  }
15050
- .toast-primary .btn-close {
15051
- --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%);
15307
+ .card-body > .table > thead > tr > th,
15308
+ .card-body > .table > thead > tr > td {
15309
+ border-top-width: 0;
15052
15310
  }
15053
15311
 
15054
- .toast-secondary {
15055
- --bs-toast-header-color: #fff;
15056
- --bs-toast-header-bg: #6c757d;
15057
- --bs-toast-header-border-color: #6c757d;
15058
- --bs-toast-border-color: #6c757d;
15059
- --bs-toast-bg: var(--bs-secondary-bg-subtle);
15060
- }
15061
- .toast-secondary .btn-close {
15062
- --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%);
15312
+ .table:not(.table-dark) {
15313
+ color: inherit;
15063
15314
  }
15064
-
15065
- .toast-success {
15066
- --bs-toast-header-color: #fff;
15067
- --bs-toast-header-bg: #198754;
15068
- --bs-toast-header-border-color: #198754;
15069
- --bs-toast-border-color: #198754;
15070
- --bs-toast-bg: var(--bs-success-bg-subtle);
15315
+ .table.table-head-fixed thead tr:nth-child(1) th {
15316
+ position: sticky;
15317
+ top: 0;
15318
+ z-index: 10;
15319
+ background-color: var(--bs-body-bg, #fff);
15320
+ border-bottom: 0;
15321
+ box-shadow: inset 0 1px 0 var(--bs-border-color, var(--bs-border-color)), inset 0 -1px 0 var(--bs-border-color, var(--bs-border-color));
15071
15322
  }
15072
- .toast-success .btn-close {
15073
- --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%);
15323
+ .table.no-border,
15324
+ .table.no-border td,
15325
+ .table.no-border th {
15326
+ border: 0;
15074
15327
  }
15075
-
15076
- .toast-info {
15077
- --bs-toast-header-color: #000;
15078
- --bs-toast-header-bg: #0dcaf0;
15079
- --bs-toast-header-border-color: #0dcaf0;
15080
- --bs-toast-border-color: #0dcaf0;
15081
- --bs-toast-bg: var(--bs-info-bg-subtle);
15328
+ .table.text-center,
15329
+ .table.text-center td,
15330
+ .table.text-center th {
15331
+ text-align: center;
15082
15332
  }
15083
-
15084
- .toast-warning {
15085
- --bs-toast-header-color: #000;
15086
- --bs-toast-header-bg: #ffc107;
15087
- --bs-toast-header-border-color: #ffc107;
15088
- --bs-toast-border-color: #ffc107;
15089
- --bs-toast-bg: var(--bs-warning-bg-subtle);
15333
+ .table.table-valign-middle thead > tr > th,
15334
+ .table.table-valign-middle thead > tr > td,
15335
+ .table.table-valign-middle tbody > tr > th,
15336
+ .table.table-valign-middle tbody > tr > td {
15337
+ vertical-align: middle;
15338
+ }
15339
+ .card-body.p-0 .table thead > tr > th:first-of-type,
15340
+ .card-body.p-0 .table thead > tr > td:first-of-type,
15341
+ .card-body.p-0 .table tfoot > tr > th:first-of-type,
15342
+ .card-body.p-0 .table tfoot > tr > td:first-of-type,
15343
+ .card-body.p-0 .table tbody > tr > th:first-of-type,
15344
+ .card-body.p-0 .table tbody > tr > td:first-of-type {
15345
+ padding-right: 1.5rem;
15346
+ }
15347
+ .card-body.p-0 .table thead > tr > th:last-of-type,
15348
+ .card-body.p-0 .table thead > tr > td:last-of-type,
15349
+ .card-body.p-0 .table tfoot > tr > th:last-of-type,
15350
+ .card-body.p-0 .table tfoot > tr > td:last-of-type,
15351
+ .card-body.p-0 .table tbody > tr > th:last-of-type,
15352
+ .card-body.p-0 .table tbody > tr > td:last-of-type {
15353
+ padding-left: 1.5rem;
15354
+ }
15355
+
15356
+ .small-box {
15357
+ border-radius: 0.375rem;
15358
+ box-shadow: 0 0 1px rgba(var(--bs-body-color-rgb), 0.125), 0 1px 3px rgba(var(--bs-body-color-rgb), 0.2);
15359
+ position: relative;
15360
+ display: block;
15361
+ margin-bottom: 1.25rem;
15362
+ --bs-link-color-rgb: none;
15363
+ --bs-link-hover-color-rgb: none;
15364
+ --bs-heading-color: none;
15365
+ }
15366
+ .small-box > .inner {
15367
+ padding: 10px;
15368
+ }
15369
+ .small-box > .small-box-footer {
15370
+ position: relative;
15371
+ z-index: 10;
15372
+ display: block;
15373
+ padding: 3px 0;
15374
+ text-align: center;
15375
+ background-color: rgba(0, 0, 0, 0.07);
15376
+ }
15377
+ .small-box > .small-box-footer:hover {
15378
+ background-color: rgba(0, 0, 0, 0.1);
15379
+ }
15380
+ .small-box h3, .small-box .h3 {
15381
+ font-size: calc(1.345rem + 1.14vw);
15382
+ }
15383
+ @media (min-width: 1200px) {
15384
+ .small-box h3, .small-box .h3 {
15385
+ font-size: 2.2rem;
15386
+ }
15387
+ }
15388
+ .small-box h3, .small-box .h3 {
15389
+ padding: 0;
15390
+ margin: 0 0 10px;
15391
+ font-weight: 700;
15392
+ white-space: nowrap;
15393
+ }
15394
+ @media (min-width: 992px) {
15395
+ .col-xl-2 .small-box h3, .col-xl-2 .small-box .h3, .col-lg-2 .small-box h3, .col-lg-2 .small-box .h3, .col-md-2 .small-box h3, .col-md-2 .small-box .h3 {
15396
+ font-size: calc(1.285rem + 0.42vw);
15397
+ }
15398
+ }
15399
+ @media (min-width: 992px) and (min-width: 1200px) {
15400
+ .col-xl-2 .small-box h3, .col-xl-2 .small-box .h3, .col-lg-2 .small-box h3, .col-lg-2 .small-box .h3, .col-md-2 .small-box h3, .col-md-2 .small-box .h3 {
15401
+ font-size: 1.6rem;
15402
+ }
15403
+ }
15404
+ @media (min-width: 992px) {
15405
+ .col-xl-3 .small-box h3, .col-xl-3 .small-box .h3, .col-lg-3 .small-box h3, .col-lg-3 .small-box .h3, .col-md-3 .small-box h3, .col-md-3 .small-box .h3 {
15406
+ font-size: calc(1.285rem + 0.42vw);
15407
+ }
15408
+ }
15409
+ @media (min-width: 992px) and (min-width: 1200px) {
15410
+ .col-xl-3 .small-box h3, .col-xl-3 .small-box .h3, .col-lg-3 .small-box h3, .col-lg-3 .small-box .h3, .col-md-3 .small-box h3, .col-md-3 .small-box .h3 {
15411
+ font-size: 1.6rem;
15412
+ }
15413
+ }
15414
+ @media (min-width: 1200px) {
15415
+ .col-xl-2 .small-box h3, .col-xl-2 .small-box .h3, .col-lg-2 .small-box h3, .col-lg-2 .small-box .h3, .col-md-2 .small-box h3, .col-md-2 .small-box .h3 {
15416
+ font-size: calc(1.345rem + 1.14vw);
15417
+ }
15418
+ }
15419
+ @media (min-width: 1200px) and (min-width: 1200px) {
15420
+ .col-xl-2 .small-box h3, .col-xl-2 .small-box .h3, .col-lg-2 .small-box h3, .col-lg-2 .small-box .h3, .col-md-2 .small-box h3, .col-md-2 .small-box .h3 {
15421
+ font-size: 2.2rem;
15422
+ }
15423
+ }
15424
+ @media (min-width: 1200px) {
15425
+ .col-xl-3 .small-box h3, .col-xl-3 .small-box .h3, .col-lg-3 .small-box h3, .col-lg-3 .small-box .h3, .col-md-3 .small-box h3, .col-md-3 .small-box .h3 {
15426
+ font-size: calc(1.345rem + 1.14vw);
15427
+ }
15428
+ }
15429
+ @media (min-width: 1200px) and (min-width: 1200px) {
15430
+ .col-xl-3 .small-box h3, .col-xl-3 .small-box .h3, .col-lg-3 .small-box h3, .col-lg-3 .small-box .h3, .col-md-3 .small-box h3, .col-md-3 .small-box .h3 {
15431
+ font-size: 2.2rem;
15432
+ }
15433
+ }
15434
+ .small-box p {
15435
+ font-size: 1rem;
15436
+ }
15437
+ .small-box p > small, .small-box p > .small {
15438
+ display: block;
15439
+ margin-top: 5px;
15440
+ font-size: 0.9rem;
15441
+ color: #f8f9fa;
15442
+ }
15443
+ .small-box h3, .small-box .h3,
15444
+ .small-box p {
15445
+ z-index: 5;
15446
+ }
15447
+ .small-box .small-box-icon {
15448
+ position: absolute;
15449
+ top: 15px;
15450
+ left: 15px;
15451
+ z-index: 0;
15452
+ height: 70px;
15453
+ font-size: 70px;
15454
+ color: rgba(0, 0, 0, 0.15);
15455
+ transition: transform 0.3s linear;
15456
+ }
15457
+ @media (prefers-reduced-motion: reduce) {
15458
+ .small-box .small-box-icon {
15459
+ transition: none;
15460
+ }
15461
+ }
15462
+ .small-box:hover .small-box-icon {
15463
+ transform: scale(1.1);
15464
+ }
15465
+
15466
+ @media (max-width: 575.98px) {
15467
+ .small-box {
15468
+ text-align: center;
15469
+ }
15470
+ .small-box .small-box-icon {
15471
+ display: none;
15472
+ }
15473
+ .small-box p {
15474
+ font-size: 12px;
15475
+ }
15476
+ }
15477
+ .info-box {
15478
+ box-shadow: 0 0 1px rgba(var(--bs-body-color-rgb), 0.125), 0 1px 3px rgba(var(--bs-body-color-rgb), 0.2);
15479
+ border-radius: 0.375rem;
15480
+ position: relative;
15481
+ display: flex;
15482
+ width: 100%;
15483
+ min-height: 80px;
15484
+ padding: 0.5rem;
15485
+ margin-bottom: 1rem;
15486
+ color: var(--bs-body-color);
15487
+ background-color: var(--bs-body-bg);
15488
+ }
15489
+ .info-box .progress {
15490
+ height: 2px;
15491
+ margin: 5px 0;
15492
+ background-color: rgba(var(--lte-card-variant-color-rgb), 0.125);
15493
+ }
15494
+ .info-box .progress .progress-bar {
15495
+ background-color: var(--lte-card-variant-color);
15496
+ }
15497
+ .info-box .info-box-icon {
15498
+ display: flex;
15499
+ align-items: center;
15500
+ justify-content: center;
15501
+ width: 70px;
15502
+ font-size: 1.875rem;
15503
+ text-align: center;
15504
+ border-radius: 0.375rem;
15505
+ }
15506
+ .info-box .info-box-icon > img {
15507
+ max-width: 100%;
15508
+ }
15509
+ .info-box .info-box-content {
15510
+ display: flex;
15511
+ flex: 1;
15512
+ flex-direction: column;
15513
+ justify-content: center;
15514
+ padding: 0 10px;
15515
+ line-height: 1.8;
15516
+ }
15517
+ .info-box .info-box-number {
15518
+ display: block;
15519
+ margin-top: 0.25rem;
15520
+ font-weight: 700;
15521
+ }
15522
+ .info-box .progress-description,
15523
+ .info-box .info-box-text {
15524
+ display: block;
15525
+ overflow: hidden;
15526
+ text-overflow: ellipsis;
15527
+ white-space: nowrap;
15528
+ }
15529
+ .info-box .info-box-more {
15530
+ display: block;
15531
+ }
15532
+ .info-box .progress-description {
15533
+ margin: 0;
15534
+ }
15535
+ @media (min-width: 768px) {
15536
+ .col-xl-2 .info-box .progress-description, .col-lg-2 .info-box .progress-description, .col-md-2 .info-box .progress-description {
15537
+ display: none;
15538
+ }
15539
+ .col-xl-3 .info-box .progress-description, .col-lg-3 .info-box .progress-description, .col-md-3 .info-box .progress-description {
15540
+ display: none;
15541
+ }
15542
+ }
15543
+ @media (min-width: 992px) {
15544
+ .col-xl-2 .info-box .progress-description, .col-lg-2 .info-box .progress-description, .col-md-2 .info-box .progress-description {
15545
+ font-size: 0.75rem;
15546
+ display: block;
15547
+ }
15548
+ .col-xl-3 .info-box .progress-description, .col-lg-3 .info-box .progress-description, .col-md-3 .info-box .progress-description {
15549
+ font-size: 0.75rem;
15550
+ display: block;
15551
+ }
15552
+ }
15553
+ @media (min-width: 1200px) {
15554
+ .col-xl-2 .info-box .progress-description, .col-lg-2 .info-box .progress-description, .col-md-2 .info-box .progress-description {
15555
+ font-size: 1rem;
15556
+ display: block;
15557
+ }
15558
+ .col-xl-3 .info-box .progress-description, .col-lg-3 .info-box .progress-description, .col-md-3 .info-box .progress-description {
15559
+ font-size: 1rem;
15560
+ display: block;
15561
+ }
15562
+ }
15563
+
15564
+ .timeline {
15565
+ position: relative;
15566
+ padding: 0;
15567
+ margin: 0 0 45px;
15568
+ }
15569
+ .timeline::before {
15570
+ border-radius: 0.375rem;
15571
+ position: absolute;
15572
+ top: 0;
15573
+ bottom: 0;
15574
+ right: 31px;
15575
+ width: 4px;
15576
+ margin: 0;
15577
+ content: "";
15578
+ background-color: var(--bs-border-color);
15579
+ }
15580
+ .timeline > div::before, .timeline > div::after {
15581
+ display: table;
15582
+ content: "";
15583
+ }
15584
+ .timeline > div {
15585
+ position: relative;
15586
+ margin-left: 10px;
15587
+ margin-bottom: 15px;
15588
+ }
15589
+ .timeline > div > .timeline-item {
15590
+ box-shadow: 0 0 1px rgba(var(--bs-body-color-rgb), 0.125), 0 1px 3px rgba(var(--bs-body-color-rgb), 0.2);
15591
+ border-radius: 0.375rem;
15592
+ position: relative;
15593
+ padding: 0;
15594
+ margin-top: 0;
15595
+ margin-left: 15px;
15596
+ margin-right: 60px;
15597
+ color: var(--bs-body-color);
15598
+ background-color: var(--bs-body-bg);
15599
+ }
15600
+ .timeline > div > .timeline-item > .time {
15601
+ float: left;
15602
+ padding: 10px;
15603
+ font-size: 12px;
15604
+ color: var(--bs-secondary-color);
15605
+ }
15606
+ .timeline > div > .timeline-item > .timeline-header {
15607
+ padding: 10px;
15608
+ margin: 0;
15609
+ font-size: 16px;
15610
+ line-height: 1.1;
15611
+ color: var(--bs-secondary-color);
15612
+ border-bottom: 1px solid var(--bs-border-color);
15613
+ }
15614
+ .timeline > div > .timeline-item > .timeline-header > a {
15615
+ font-weight: 600;
15616
+ text-decoration: none;
15617
+ }
15618
+ .timeline > div > .timeline-item > .timeline-body,
15619
+ .timeline > div > .timeline-item > .timeline-footer {
15620
+ padding: 10px;
15621
+ }
15622
+ .timeline > div > .timeline-item > .timeline-body > img {
15623
+ margin: 10px;
15624
+ }
15625
+ .timeline > div > .timeline-item > .timeline-body > dl,
15626
+ .timeline > div > .timeline-item > .timeline-body ol,
15627
+ .timeline > div > .timeline-item > .timeline-body ul {
15628
+ margin: 0;
15629
+ }
15630
+ .timeline > div .timeline-icon {
15631
+ position: absolute;
15632
+ top: 0;
15633
+ right: 18px;
15634
+ width: 30px;
15635
+ height: 30px;
15636
+ font-size: 16px;
15637
+ line-height: 30px;
15638
+ text-align: center;
15639
+ background-color: var(--bs-secondary-bg);
15640
+ border-radius: 50%;
15641
+ }
15642
+ .timeline > .time-label > span {
15643
+ border-radius: 4px;
15644
+ display: inline-block;
15645
+ padding: 5px;
15646
+ font-weight: 600;
15647
+ background-color: var(--bs-body-bg);
15648
+ }
15649
+
15650
+ .timeline-inverse > div > .timeline-item {
15651
+ box-shadow: none;
15652
+ background-color: var(--bs-tertiary-bg);
15653
+ border: 1px solid var(--bs-border-color);
15654
+ }
15655
+ .timeline-inverse > div > .timeline-item > .timeline-header {
15656
+ border-bottom-color: var(--bs-border-color);
15657
+ }
15658
+
15659
+ .direct-chat .card-body {
15660
+ position: relative;
15661
+ padding: 0;
15662
+ overflow-x: hidden;
15663
+ }
15664
+ .direct-chat.chat-pane-open .direct-chat-contacts {
15665
+ transform: translate(0, 0);
15666
+ }
15667
+ .direct-chat.timestamp-light .direct-chat-timestamp {
15668
+ color: rgba(var(--bs-body-color-rgb), 0.65);
15669
+ }
15670
+ .direct-chat.timestamp-dark .direct-chat-timestamp {
15671
+ color: rgba(var(--bs-body-color-rgb), 0.9);
15672
+ }
15673
+
15674
+ .direct-chat-messages {
15675
+ height: 250px;
15676
+ padding: 10px;
15677
+ overflow: auto;
15678
+ transform: translate(0, 0);
15679
+ }
15680
+
15681
+ .direct-chat-msg,
15682
+ .direct-chat-text {
15683
+ display: block;
15684
+ }
15685
+
15686
+ .direct-chat-msg::after {
15687
+ display: block;
15688
+ clear: both;
15689
+ content: "";
15690
+ }
15691
+ .direct-chat-msg {
15692
+ margin-bottom: 10px;
15693
+ }
15694
+
15695
+ .direct-chat-messages,
15696
+ .direct-chat-contacts {
15697
+ transition: transform 0.5s ease-in-out;
15698
+ }
15699
+ @media (prefers-reduced-motion: reduce) {
15700
+ .direct-chat-messages,
15701
+ .direct-chat-contacts {
15702
+ transition: none;
15703
+ }
15704
+ }
15705
+
15706
+ .direct-chat-text {
15707
+ border-radius: 0.5rem;
15708
+ position: relative;
15709
+ padding: 5px 10px;
15710
+ margin: 5px 50px 0 0;
15711
+ color: var(--bs-emphasis-color);
15712
+ background-color: var(--bs-secondary-bg);
15713
+ border: 1px solid var(--bs-border-color);
15714
+ }
15715
+ .direct-chat-text::after, .direct-chat-text::before {
15716
+ position: absolute;
15717
+ top: 15px;
15718
+ left: 100%;
15719
+ width: 0;
15720
+ height: 0;
15721
+ pointer-events: none;
15722
+ content: " ";
15723
+ border: solid transparent;
15724
+ border-left-color: var(--bs-border-color);
15725
+ }
15726
+ .direct-chat-text::after {
15727
+ margin-top: -5px;
15728
+ border-width: 5px;
15729
+ }
15730
+ .direct-chat-text::before {
15731
+ margin-top: -6px;
15732
+ border-width: 6px;
15733
+ }
15734
+ .end .direct-chat-text {
15735
+ margin-left: 50px;
15736
+ margin-right: 0;
15737
+ }
15738
+ .end .direct-chat-text::after, .end .direct-chat-text::before {
15739
+ left: auto;
15740
+ right: 100%;
15741
+ border-left-color: transparent;
15742
+ border-right-color: var(--bs-border-color);
15743
+ }
15744
+
15745
+ .direct-chat-img {
15746
+ border-radius: 50%;
15747
+ float: right;
15748
+ width: 40px;
15749
+ height: 40px;
15750
+ }
15751
+ .end .direct-chat-img {
15752
+ float: left;
15753
+ }
15754
+
15755
+ .direct-chat-infos {
15756
+ display: block;
15757
+ margin-bottom: 2px;
15758
+ font-size: 0.875rem;
15759
+ }
15760
+
15761
+ .direct-chat-name {
15762
+ font-weight: 600;
15763
+ }
15764
+
15765
+ .direct-chat-timestamp {
15766
+ color: rgba(var(--bs-body-color-rgb), 0.75);
15767
+ }
15768
+
15769
+ .direct-chat-contacts-open .direct-chat-contacts {
15770
+ transform: translate(0, 0);
15771
+ }
15772
+
15773
+ .direct-chat-contacts {
15774
+ position: absolute;
15775
+ top: 0;
15776
+ bottom: 0;
15777
+ width: 100%;
15778
+ height: 250px;
15779
+ overflow: auto;
15780
+ color: var(--bs-body-bg);
15781
+ background-color: var(--bs-body-color);
15782
+ transform: translate(-101%, 0);
15783
+ }
15784
+
15785
+ .direct-chat-contacts-light {
15786
+ background-color: var(--bs-light-bg-subtle);
15787
+ }
15788
+ .direct-chat-contacts-light .contacts-list-name {
15789
+ color: var(--bs-body-color);
15790
+ }
15791
+ .direct-chat-contacts-light .contacts-list-date {
15792
+ color: var(--bs-secondary-color);
15793
+ }
15794
+ .direct-chat-contacts-light .contacts-list-msg {
15795
+ color: var(--bs-secondary-color);
15796
+ }
15797
+
15798
+ .contacts-list {
15799
+ padding-right: 0;
15800
+ list-style: none;
15801
+ }
15802
+ .contacts-list > li::after {
15803
+ display: block;
15804
+ clear: both;
15805
+ content: "";
15806
+ }
15807
+ .contacts-list > li {
15808
+ padding: 10px;
15809
+ margin: 0;
15810
+ text-decoration: none;
15811
+ border-bottom: 1px solid rgba(0, 0, 0, 0.2);
15812
+ }
15813
+ .contacts-list > li:last-of-type {
15814
+ border-bottom: 0;
15815
+ }
15816
+ .contacts-list > li a {
15817
+ text-decoration: none;
15818
+ }
15819
+
15820
+ .contacts-list-img {
15821
+ border-radius: 50%;
15822
+ float: right;
15823
+ width: 40px;
15824
+ }
15825
+
15826
+ .contacts-list-info {
15827
+ margin-right: 45px;
15828
+ color: var(--bs-body-bg);
15829
+ }
15830
+
15831
+ .contacts-list-name,
15832
+ .contacts-list-status {
15833
+ display: block;
15834
+ }
15835
+
15836
+ .contacts-list-name {
15837
+ font-weight: 600;
15838
+ }
15839
+
15840
+ .contacts-list-status {
15841
+ font-size: 0.875rem;
15842
+ }
15843
+
15844
+ .contacts-list-date {
15845
+ font-weight: 400;
15846
+ color: var(--bs-secondary-bg);
15847
+ }
15848
+
15849
+ .contacts-list-msg {
15850
+ color: var(--bs-secondary-bg);
15851
+ }
15852
+
15853
+ .end > .direct-chat-text {
15854
+ color: var(--lte-direct-chat-color);
15855
+ background-color: var(--lte-direct-chat-bg);
15856
+ border-color: var(--lte-direct-chat-bg);
15857
+ }
15858
+ .end > .direct-chat-text::after, .end > .direct-chat-text::before {
15859
+ border-right-color: var(--lte-direct-chat-bg);
15860
+ }
15861
+
15862
+ .direct-chat-primary {
15863
+ --lte-direct-chat-color: #fff;
15864
+ --lte-direct-chat-bg: #0d6efd;
15865
+ }
15866
+
15867
+ .direct-chat-secondary {
15868
+ --lte-direct-chat-color: #fff;
15869
+ --lte-direct-chat-bg: #6c757d;
15870
+ }
15871
+
15872
+ .direct-chat-success {
15873
+ --lte-direct-chat-color: #fff;
15874
+ --lte-direct-chat-bg: #198754;
15875
+ }
15876
+
15877
+ .direct-chat-info {
15878
+ --lte-direct-chat-color: #000;
15879
+ --lte-direct-chat-bg: #0dcaf0;
15880
+ }
15881
+
15882
+ .direct-chat-warning {
15883
+ --lte-direct-chat-color: #000;
15884
+ --lte-direct-chat-bg: #ffc107;
15885
+ }
15886
+
15887
+ .direct-chat-danger {
15888
+ --lte-direct-chat-color: #fff;
15889
+ --lte-direct-chat-bg: #dc3545;
15890
+ }
15891
+
15892
+ .direct-chat-light {
15893
+ --lte-direct-chat-color: #000;
15894
+ --lte-direct-chat-bg: #f8f9fa;
15895
+ }
15896
+
15897
+ .direct-chat-dark {
15898
+ --lte-direct-chat-color: #fff;
15899
+ --lte-direct-chat-bg: #212529;
15900
+ }
15901
+
15902
+ .toast-primary {
15903
+ --bs-toast-header-color: #fff;
15904
+ --bs-toast-header-bg: #0d6efd;
15905
+ --bs-toast-header-border-color: #0d6efd;
15906
+ --bs-toast-border-color: #0d6efd;
15907
+ --bs-toast-bg: var(--bs-primary-bg-subtle);
15908
+ }
15909
+ .toast-primary .btn-close {
15910
+ --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%);
15911
+ }
15912
+
15913
+ .toast-secondary {
15914
+ --bs-toast-header-color: #fff;
15915
+ --bs-toast-header-bg: #6c757d;
15916
+ --bs-toast-header-border-color: #6c757d;
15917
+ --bs-toast-border-color: #6c757d;
15918
+ --bs-toast-bg: var(--bs-secondary-bg-subtle);
15919
+ }
15920
+ .toast-secondary .btn-close {
15921
+ --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%);
15922
+ }
15923
+
15924
+ .toast-success {
15925
+ --bs-toast-header-color: #fff;
15926
+ --bs-toast-header-bg: #198754;
15927
+ --bs-toast-header-border-color: #198754;
15928
+ --bs-toast-border-color: #198754;
15929
+ --bs-toast-bg: var(--bs-success-bg-subtle);
15930
+ }
15931
+ .toast-success .btn-close {
15932
+ --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%);
15933
+ }
15934
+
15935
+ .toast-info {
15936
+ --bs-toast-header-color: #000;
15937
+ --bs-toast-header-bg: #0dcaf0;
15938
+ --bs-toast-header-border-color: #0dcaf0;
15939
+ --bs-toast-border-color: #0dcaf0;
15940
+ --bs-toast-bg: var(--bs-info-bg-subtle);
15941
+ }
15942
+
15943
+ .toast-warning {
15944
+ --bs-toast-header-color: #000;
15945
+ --bs-toast-header-bg: #ffc107;
15946
+ --bs-toast-header-border-color: #ffc107;
15947
+ --bs-toast-border-color: #ffc107;
15948
+ --bs-toast-bg: var(--bs-warning-bg-subtle);
15949
+ }
15950
+
15951
+ .toast-danger {
15952
+ --bs-toast-header-color: #fff;
15953
+ --bs-toast-header-bg: #dc3545;
15954
+ --bs-toast-header-border-color: #dc3545;
15955
+ --bs-toast-border-color: #dc3545;
15956
+ --bs-toast-bg: var(--bs-danger-bg-subtle);
15957
+ }
15958
+ .toast-danger .btn-close {
15959
+ --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%);
15960
+ }
15961
+
15962
+ .toast-light {
15963
+ --bs-toast-header-color: #000;
15964
+ --bs-toast-header-bg: #f8f9fa;
15965
+ --bs-toast-header-border-color: #f8f9fa;
15966
+ --bs-toast-border-color: #f8f9fa;
15967
+ --bs-toast-bg: var(--bs-light-bg-subtle);
15968
+ }
15969
+
15970
+ .toast-dark {
15971
+ --bs-toast-header-color: #fff;
15972
+ --bs-toast-header-bg: #212529;
15973
+ --bs-toast-header-border-color: #212529;
15974
+ --bs-toast-border-color: #212529;
15975
+ --bs-toast-bg: var(--bs-dark-bg-subtle);
15976
+ }
15977
+ .toast-dark .btn-close {
15978
+ --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%);
15979
+ }
15980
+
15981
+ [data-bs-theme=dark] .toast-info .btn-close {
15982
+ --bs-btn-close-white-filter: none;
15983
+ }
15984
+ [data-bs-theme=dark] .toast-warning .btn-close {
15985
+ --bs-btn-close-white-filter: none;
15986
+ }
15987
+ [data-bs-theme=dark] .toast-light .btn-close {
15988
+ --bs-btn-close-white-filter: none;
15989
+ }
15990
+ .login-logo,
15991
+ .register-logo {
15992
+ margin-bottom: 0.9rem;
15993
+ font-size: 2.1rem;
15994
+ font-weight: 300;
15995
+ text-align: center;
15996
+ }
15997
+ .login-logo a,
15998
+ .register-logo a {
15999
+ color: var(--bs-secondary-color);
16000
+ text-decoration: none;
16001
+ }
16002
+
16003
+ .login-page,
16004
+ .register-page {
16005
+ display: flex;
16006
+ flex-direction: column;
16007
+ align-items: center;
16008
+ justify-content: center;
16009
+ min-height: 100vh;
16010
+ }
16011
+
16012
+ .login-box,
16013
+ .register-box {
16014
+ width: 400px;
16015
+ }
16016
+ @media (max-width: 576px) {
16017
+ .login-box,
16018
+ .register-box {
16019
+ width: 90%;
16020
+ margin-top: 0.5rem;
16021
+ }
16022
+ }
16023
+ .login-box .card,
16024
+ .register-box .card {
16025
+ margin-bottom: 0;
16026
+ }
16027
+
16028
+ .login-card-body,
16029
+ .register-card-body {
16030
+ padding: 20px;
16031
+ color: var(--bs-secondary-color);
16032
+ background-color: var(--bs-body-bg);
16033
+ border-top: 0;
16034
+ }
16035
+ .login-card-body .input-group .form-control:focus,
16036
+ .register-card-body .input-group .form-control:focus {
16037
+ box-shadow: none;
16038
+ }
16039
+ .login-card-body .input-group .form-control:focus ~ .input-group-prepend .input-group-text,
16040
+ .login-card-body .input-group .form-control:focus ~ .input-group-append .input-group-text,
16041
+ .register-card-body .input-group .form-control:focus ~ .input-group-prepend .input-group-text,
16042
+ .register-card-body .input-group .form-control:focus ~ .input-group-append .input-group-text {
16043
+ border-color: rgb(134, 182.5, 254);
16044
+ }
16045
+ .login-card-body .input-group .form-control.is-valid:focus,
16046
+ .register-card-body .input-group .form-control.is-valid:focus {
16047
+ box-shadow: none;
16048
+ }
16049
+ .login-card-body .input-group .form-control.is-valid ~ .input-group-prepend .input-group-text,
16050
+ .login-card-body .input-group .form-control.is-valid ~ .input-group-append .input-group-text,
16051
+ .register-card-body .input-group .form-control.is-valid ~ .input-group-prepend .input-group-text,
16052
+ .register-card-body .input-group .form-control.is-valid ~ .input-group-append .input-group-text {
16053
+ border-color: #198754;
16054
+ }
16055
+ .login-card-body .input-group .form-control.is-invalid:focus,
16056
+ .register-card-body .input-group .form-control.is-invalid:focus {
16057
+ box-shadow: none;
16058
+ }
16059
+ .login-card-body .input-group .form-control.is-invalid ~ .input-group-append .input-group-text,
16060
+ .register-card-body .input-group .form-control.is-invalid ~ .input-group-append .input-group-text {
16061
+ border-color: #dc3545;
16062
+ }
16063
+ .login-card-body .input-group .input-group-text,
16064
+ .register-card-body .input-group .input-group-text {
16065
+ color: var(--bs-secondary-color);
16066
+ background-color: transparent;
16067
+ border-top-left-radius: 0.375rem;
16068
+ border-bottom-left-radius: 0.375rem;
16069
+ transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
16070
+ }
16071
+ @media (prefers-reduced-motion: reduce) {
16072
+ .login-card-body .input-group .input-group-text,
16073
+ .register-card-body .input-group .input-group-text {
16074
+ transition: none;
16075
+ }
16076
+ }
16077
+
16078
+ .login-box-msg,
16079
+ .register-box-msg {
16080
+ padding: 0 20px 20px;
16081
+ margin: 0;
16082
+ text-align: center;
16083
+ }
16084
+
16085
+ .social-auth-links {
16086
+ margin: 10px 0;
16087
+ }
16088
+
16089
+ .lockscreen .lockscreen-name {
16090
+ font-weight: 600;
16091
+ text-align: center;
16092
+ }
16093
+ .lockscreen .lockscreen-logo {
16094
+ margin-bottom: 25px;
16095
+ font-size: 35px;
16096
+ font-weight: 300;
16097
+ text-align: center;
16098
+ }
16099
+ .lockscreen .lockscreen-logo a {
16100
+ color: var(--bs-emphasis-color);
16101
+ text-decoration: none;
16102
+ }
16103
+ .lockscreen .lockscreen-wrapper {
16104
+ max-width: 400px;
16105
+ margin: 0 auto;
16106
+ margin-top: 10%;
16107
+ }
16108
+ .lockscreen .lockscreen-item {
16109
+ position: relative;
16110
+ width: 290px;
16111
+ padding: 0;
16112
+ margin: 10px auto 30px;
16113
+ background-color: var(--bs-body-bg);
16114
+ border-radius: 4px;
16115
+ }
16116
+ .lockscreen .lockscreen-image {
16117
+ position: absolute;
16118
+ top: -25px;
16119
+ right: -10px;
16120
+ z-index: 10;
16121
+ padding: 5px;
16122
+ background-color: var(--bs-body-bg);
16123
+ border-radius: 50%;
16124
+ }
16125
+ .lockscreen .lockscreen-image > img {
16126
+ border-radius: 50%;
16127
+ width: 70px;
16128
+ height: 70px;
16129
+ }
16130
+ .lockscreen .lockscreen-credentials {
16131
+ margin-right: 70px;
16132
+ }
16133
+ .lockscreen .lockscreen-credentials .form-control {
16134
+ border: 0;
16135
+ }
16136
+ .lockscreen .lockscreen-credentials .btn {
16137
+ padding: 0 10px;
16138
+ border: 0;
16139
+ }
16140
+ .lockscreen .lockscreen-footer {
16141
+ margin-top: 10px;
16142
+ }
16143
+
16144
+ .img-size-64,
16145
+ .img-size-50,
16146
+ .img-size-32 {
16147
+ height: auto;
16148
+ }
16149
+
16150
+ .img-size-64 {
16151
+ width: 64px;
16152
+ }
16153
+
16154
+ .img-size-50 {
16155
+ width: 50px;
16156
+ }
16157
+
16158
+ .img-size-32 {
16159
+ width: 32px;
16160
+ }
16161
+
16162
+ /* ==========================================================================
16163
+ AdminLTE Accessibility Styles - WCAG 2.1 AA Compliance
16164
+ ========================================================================== */
16165
+ /* Skip Links - WCAG 2.4.1: Bypass Blocks */
16166
+ .skip-link {
16167
+ position: absolute;
16168
+ top: -40px;
16169
+ right: 6px;
16170
+ z-index: 999999;
16171
+ padding: 8px 16px;
16172
+ font-weight: 600;
16173
+ color: var(--bs-white);
16174
+ text-decoration: none;
16175
+ background: var(--bs-primary);
16176
+ }
16177
+ .skip-link:focus {
16178
+ top: 0;
16179
+ outline: 3px solid var(--bs-warning);
16180
+ outline-offset: 2px;
16181
+ }
16182
+ .skip-link:hover {
16183
+ color: var(--bs-white);
16184
+ text-decoration: none;
16185
+ background: var(--bs-primary-emphasis);
16186
+ }
16187
+
16188
+ /* Enhanced Focus Indicators - WCAG 2.4.7: Focus Visible */
16189
+ .focus-enhanced:focus {
16190
+ outline: 3px solid var(--bs-focus-ring-color, #0d6efd);
16191
+ outline-offset: 2px;
16192
+ box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
16193
+ }
16194
+
16195
+ /* High Contrast Mode Support */
16196
+ @media (prefers-contrast: high) {
16197
+ .card {
16198
+ border: 2px solid;
16199
+ }
16200
+ .btn {
16201
+ border-width: 2px;
16202
+ }
16203
+ .nav-link {
16204
+ border: 1px solid transparent;
16205
+ }
16206
+ .nav-link:hover, .nav-link:focus {
16207
+ border-color: currentcolor;
16208
+ }
16209
+ }
16210
+ /* Reduced Motion Support - WCAG 2.3.3: Animation from Interactions */
16211
+ @media (prefers-reduced-motion: reduce) {
16212
+ *,
16213
+ *::before,
16214
+ *::after {
16215
+ transition-duration: 0.01ms !important;
16216
+ animation-duration: 0.01ms !important;
16217
+ animation-iteration-count: 1 !important;
16218
+ scroll-behavior: auto !important;
16219
+ }
16220
+ .fade {
16221
+ opacity: 1 !important;
16222
+ /* stylelint-disable-next-line property-disallowed-list */
16223
+ transition: none !important;
16224
+ }
16225
+ .collapse {
16226
+ /* stylelint-disable-next-line property-disallowed-list */
16227
+ transition: none !important;
16228
+ }
16229
+ .modal.fade .modal-dialog {
16230
+ transform: none !important;
16231
+ }
16232
+ }
16233
+ /* Screen Reader Only Content */
16234
+ .sr-only {
16235
+ position: absolute !important;
16236
+ width: 1px !important;
16237
+ height: 1px !important;
16238
+ padding: 0 !important;
16239
+ margin: -1px !important;
16240
+ overflow: hidden !important;
16241
+ clip: rect(0, 0, 0, 0) !important;
16242
+ white-space: nowrap !important;
16243
+ border: 0 !important;
16244
+ }
16245
+
16246
+ .sr-only-focusable:focus {
16247
+ position: static !important;
16248
+ width: auto !important;
16249
+ height: auto !important;
16250
+ padding: inherit !important;
16251
+ margin: inherit !important;
16252
+ overflow: visible !important;
16253
+ clip: auto !important;
16254
+ white-space: normal !important;
16255
+ }
16256
+
16257
+ /* Focus Trap Utilities */
16258
+ .focus-trap:focus {
16259
+ box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
16260
+ }
16261
+
16262
+ /* Accessible Color Combinations - WCAG 1.4.3: Contrast (Minimum) */
16263
+ .text-accessible-primary {
16264
+ color: #003d82; /* 4.5:1 contrast on white */
16265
+ }
16266
+
16267
+ .text-accessible-success {
16268
+ color: #0f5132; /* 4.5:1 contrast on white */
16269
+ }
16270
+
16271
+ .text-accessible-danger {
16272
+ color: #842029; /* 4.5:1 contrast on white */
15090
16273
  }
15091
16274
 
15092
- .toast-danger {
15093
- --bs-toast-header-color: #fff;
15094
- --bs-toast-header-bg: #dc3545;
15095
- --bs-toast-header-border-color: #dc3545;
15096
- --bs-toast-border-color: #dc3545;
15097
- --bs-toast-bg: var(--bs-danger-bg-subtle);
16275
+ .text-accessible-warning {
16276
+ color: #664d03; /* 4.5:1 contrast on white */
15098
16277
  }
15099
- .toast-danger .btn-close {
15100
- --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%);
16278
+
16279
+ /* ARIA Live Regions */
16280
+ .live-region {
16281
+ position: absolute;
16282
+ right: -10000px;
16283
+ width: 1px;
16284
+ height: 1px;
16285
+ overflow: hidden;
16286
+ }
16287
+ .live-region.live-region-visible {
16288
+ position: static;
16289
+ right: auto;
16290
+ width: auto;
16291
+ height: auto;
16292
+ overflow: visible;
15101
16293
  }
15102
16294
 
15103
- .toast-light {
15104
- --bs-toast-header-color: #000;
15105
- --bs-toast-header-bg: #f8f9fa;
15106
- --bs-toast-header-border-color: #f8f9fa;
15107
- --bs-toast-border-color: #f8f9fa;
15108
- --bs-toast-bg: var(--bs-light-bg-subtle);
16295
+ /* Enhanced Error States - WCAG 3.3.1: Error Identification */
16296
+ .form-control.is-invalid {
16297
+ border-color: var(--bs-danger);
16298
+ }
16299
+ .form-control.is-invalid:focus {
16300
+ border-color: var(--bs-danger);
16301
+ box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
15109
16302
  }
15110
16303
 
15111
- .toast-dark {
15112
- --bs-toast-header-color: #fff;
15113
- --bs-toast-header-bg: #212529;
15114
- --bs-toast-header-border-color: #212529;
15115
- --bs-toast-border-color: #212529;
15116
- --bs-toast-bg: var(--bs-dark-bg-subtle);
16304
+ .invalid-feedback[role=alert] {
16305
+ font-weight: 600;
15117
16306
  }
15118
- .toast-dark .btn-close {
15119
- --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%);
16307
+
16308
+ /* Target Size - WCAG 2.5.8: Target Size (Minimum) */
16309
+ .touch-target {
16310
+ min-width: 44px;
16311
+ min-height: 44px;
16312
+ }
16313
+ .touch-target.touch-target-small {
16314
+ min-width: 24px;
16315
+ min-height: 24px;
15120
16316
  }
15121
16317
 
15122
- [data-bs-theme=dark] .toast-info .btn-close {
15123
- --bs-btn-close-white-filter: none;
16318
+ /* Table Accessibility */
16319
+ .table-accessible th {
16320
+ font-weight: 600;
16321
+ background-color: var(--bs-secondary-bg);
15124
16322
  }
15125
- [data-bs-theme=dark] .toast-warning .btn-close {
15126
- --bs-btn-close-white-filter: none;
16323
+ .table-accessible th[scope=col] {
16324
+ border-bottom: 2px solid var(--bs-border-color);
15127
16325
  }
15128
- [data-bs-theme=dark] .toast-light .btn-close {
15129
- --bs-btn-close-white-filter: none;
16326
+ .table-accessible th[scope=row] {
16327
+ border-left: 2px solid var(--bs-border-color);
15130
16328
  }
15131
- .login-logo,
15132
- .register-logo {
15133
- margin-bottom: 0.9rem;
15134
- font-size: 2.1rem;
15135
- font-weight: 300;
15136
- text-align: center;
16329
+ .table-accessible caption {
16330
+ padding: 0.75rem;
16331
+ font-weight: 600;
16332
+ color: var(--bs-secondary);
16333
+ text-align: right;
16334
+ caption-side: top;
15137
16335
  }
15138
- .login-logo a,
15139
- .register-logo a {
15140
- color: var(--bs-secondary-color);
15141
- text-decoration: none;
16336
+
16337
+ /* Navigation Landmarks */
16338
+ nav[role=navigation]:not([aria-label]):not([aria-labelledby])::before {
16339
+ position: absolute;
16340
+ right: -10000px;
16341
+ content: "Navigation";
15142
16342
  }
15143
16343
 
15144
- .login-page,
15145
- .register-page {
15146
- display: flex;
15147
- flex-direction: column;
15148
- align-items: center;
15149
- justify-content: center;
15150
- min-height: 100vh;
16344
+ /* Form Fieldset Styling */
16345
+ fieldset {
16346
+ padding: 1rem;
16347
+ margin-bottom: 1rem;
16348
+ border: 1px solid var(--bs-border-color);
16349
+ }
16350
+ fieldset legend {
16351
+ padding: 0 0.5rem;
16352
+ margin-bottom: 0.5rem;
16353
+ font-size: 1.1em;
16354
+ font-weight: 600;
15151
16355
  }
15152
16356
 
15153
- .login-box,
15154
- .register-box {
15155
- width: 360px;
16357
+ /* Loading States */
16358
+ .loading[aria-busy=true] {
16359
+ position: relative;
16360
+ pointer-events: none;
15156
16361
  }
15157
- @media (max-width: 576px) {
15158
- .login-box,
15159
- .register-box {
15160
- width: 90%;
15161
- margin-top: 0.5rem;
16362
+ .loading[aria-busy=true]::after {
16363
+ position: absolute;
16364
+ top: 50%;
16365
+ right: 50%;
16366
+ width: 20px;
16367
+ height: 20px;
16368
+ margin-top: -10px;
16369
+ margin-right: -10px;
16370
+ content: "";
16371
+ border: 2px solid var(--bs-primary);
16372
+ border-top-color: transparent;
16373
+ animation: spin 1s linear infinite;
16374
+ }
16375
+ @media (prefers-reduced-motion: reduce) {
16376
+ .loading[aria-busy=true]::after {
16377
+ border-top-color: var(--bs-primary);
16378
+ animation: none;
15162
16379
  }
15163
16380
  }
15164
- .login-box .card,
15165
- .register-box .card {
16381
+
16382
+ @keyframes spin {
16383
+ to {
16384
+ transform: rotate(-360deg);
16385
+ }
16386
+ }
16387
+ /* Dark Mode Accessibility */
16388
+ [data-bs-theme=dark] .text-accessible-primary {
16389
+ color: #6ea8fe;
16390
+ }
16391
+ [data-bs-theme=dark] .text-accessible-success {
16392
+ color: #75b798;
16393
+ }
16394
+ [data-bs-theme=dark] .text-accessible-danger {
16395
+ color: #f1aeb5;
16396
+ }
16397
+ [data-bs-theme=dark] .text-accessible-warning {
16398
+ color: #ffda6a;
16399
+ }
16400
+
16401
+ /* Print Accessibility */
16402
+ @media print {
16403
+ .skip-link,
16404
+ .btn,
16405
+ .nav-link {
16406
+ color: #000 !important;
16407
+ background: transparent !important;
16408
+ border: 1px solid #000 !important;
16409
+ }
16410
+ a[href^=http]::after {
16411
+ font-size: 0.8em;
16412
+ content: " (" attr(href) ")";
16413
+ }
16414
+ /* Print Layout Fix - Ensure sidebar and main content are both visible */
16415
+ .app-wrapper {
16416
+ display: grid !important;
16417
+ grid-template-rows: auto 1fr auto !important;
16418
+ grid-template-columns: auto 1fr !important;
16419
+ }
16420
+ .sidebar-overlay {
16421
+ display: none !important;
16422
+ }
16423
+ .app-sidebar {
16424
+ position: static !important;
16425
+ display: block !important;
16426
+ min-width: 200px !important;
16427
+ max-width: 200px !important;
16428
+ max-height: none !important;
16429
+ margin-right: 0 !important;
16430
+ overflow: visible !important;
16431
+ }
16432
+ .sidebar-wrapper {
16433
+ height: auto !important;
16434
+ overflow: visible !important;
16435
+ }
16436
+ .app-header {
16437
+ position: static !important;
16438
+ }
16439
+ .app-main {
16440
+ width: auto !important;
16441
+ max-width: 100% !important;
16442
+ overflow: visible !important;
16443
+ }
16444
+ .app-content {
16445
+ overflow: visible !important;
16446
+ }
16447
+ .app-footer {
16448
+ position: static !important;
16449
+ }
16450
+ }
16451
+ .astro-code {
16452
+ padding: 0.75rem;
16453
+ border-radius: 0.375rem;
16454
+ }
16455
+
16456
+ .docs-page .app-content > .container-fluid, .docs-page .app-content > .container-sm, .docs-page .app-content > .container-md, .docs-page .app-content > .container-lg, .docs-page .app-content > .container-xl, .docs-page .app-content > .container-xxl {
16457
+ max-width: 60rem;
16458
+ }
16459
+ @media (min-width: 1400px) {
16460
+ .docs-page .app-content > .container-fluid, .docs-page .app-content > .container-sm, .docs-page .app-content > .container-md, .docs-page .app-content > .container-lg, .docs-page .app-content > .container-xl, .docs-page .app-content > .container-xxl {
16461
+ max-width: 64rem;
16462
+ }
16463
+ }
16464
+ .docs-page .card > .card-body {
16465
+ padding: 1.5rem;
16466
+ font-size: 1rem;
16467
+ line-height: 1.7;
16468
+ color: var(--bs-body-color);
16469
+ }
16470
+ @media (min-width: 768px) {
16471
+ .docs-page .card > .card-body {
16472
+ padding: 2.5rem;
16473
+ }
16474
+ }
16475
+ .docs-page .card > .card-body h1,
16476
+ .docs-page .card > .card-body h2,
16477
+ .docs-page .card > .card-body h3,
16478
+ .docs-page .card > .card-body h4,
16479
+ .docs-page .card > .card-body h5,
16480
+ .docs-page .card > .card-body h6,
16481
+ .docs-page .card > .card-body .h1,
16482
+ .docs-page .card > .card-body .h2,
16483
+ .docs-page .card > .card-body .h3,
16484
+ .docs-page .card > .card-body .h4,
16485
+ .docs-page .card > .card-body .h5,
16486
+ .docs-page .card > .card-body .h6 {
16487
+ margin-top: 2em;
16488
+ margin-bottom: 0.5em;
16489
+ font-weight: 600;
16490
+ line-height: 1.3;
16491
+ color: var(--bs-emphasis-color);
16492
+ scroll-margin-top: 4rem;
16493
+ }
16494
+ .docs-page .card > .card-body h1:first-child,
16495
+ .docs-page .card > .card-body h2:first-child,
16496
+ .docs-page .card > .card-body h3:first-child,
16497
+ .docs-page .card > .card-body h4:first-child,
16498
+ .docs-page .card > .card-body h5:first-child,
16499
+ .docs-page .card > .card-body h6:first-child,
16500
+ .docs-page .card > .card-body .h1:first-child,
16501
+ .docs-page .card > .card-body .h2:first-child,
16502
+ .docs-page .card > .card-body .h3:first-child,
16503
+ .docs-page .card > .card-body .h4:first-child,
16504
+ .docs-page .card > .card-body .h5:first-child,
16505
+ .docs-page .card > .card-body .h6:first-child {
16506
+ margin-top: 0;
16507
+ }
16508
+ .docs-page .card > .card-body h2,
16509
+ .docs-page .card > .card-body .h2 {
16510
+ padding-bottom: 0.35em;
16511
+ font-size: 1.75rem;
16512
+ border-bottom: 1px solid var(--bs-border-color);
16513
+ }
16514
+ .docs-page .card > .card-body h3,
16515
+ .docs-page .card > .card-body .h3 {
16516
+ font-size: 1.4rem;
16517
+ }
16518
+ .docs-page .card > .card-body h4,
16519
+ .docs-page .card > .card-body .h4 {
16520
+ font-size: 1.2rem;
16521
+ }
16522
+ .docs-page .card > .card-body h5,
16523
+ .docs-page .card > .card-body .h5 {
16524
+ padding-top: 1.5em;
16525
+ margin-top: 2.5em;
16526
+ font-size: 1.3rem;
16527
+ border-top: 1px solid var(--bs-border-color);
16528
+ }
16529
+ .docs-page .card > .card-body h5:first-child,
16530
+ .docs-page .card > .card-body .h5:first-child {
16531
+ padding-top: 0;
16532
+ border-top: 0;
16533
+ }
16534
+ .docs-page .card > .card-body h6,
16535
+ .docs-page .card > .card-body .h6 {
16536
+ margin-top: 1.75em;
16537
+ font-size: 1.08rem;
16538
+ color: var(--bs-emphasis-color);
16539
+ }
16540
+ .docs-page .card > .card-body p,
16541
+ .docs-page .card > .card-body ul,
16542
+ .docs-page .card > .card-body ol,
16543
+ .docs-page .card > .card-body dl,
16544
+ .docs-page .card > .card-body blockquote,
16545
+ .docs-page .card > .card-body table {
16546
+ margin-bottom: 1.1rem;
16547
+ }
16548
+ .docs-page .card > .card-body ul,
16549
+ .docs-page .card > .card-body ol {
16550
+ padding-right: 1.5rem;
16551
+ }
16552
+ .docs-page .card > .card-body ul li,
16553
+ .docs-page .card > .card-body ol li {
16554
+ margin-bottom: 0.35rem;
16555
+ }
16556
+ .docs-page .card > .card-body ul ul,
16557
+ .docs-page .card > .card-body ul ol,
16558
+ .docs-page .card > .card-body ol ul,
16559
+ .docs-page .card > .card-body ol ol {
16560
+ margin-top: 0.35rem;
15166
16561
  margin-bottom: 0;
15167
16562
  }
15168
-
15169
- .login-card-body,
15170
- .register-card-body {
15171
- padding: 20px;
15172
- color: var(--bs-secondary-color);
15173
- background-color: var(--bs-body-bg);
15174
- border-top: 0;
16563
+ .docs-page .card > .card-body h2 + p, .docs-page .card > .card-body .h2 + p,
16564
+ .docs-page .card > .card-body h3 + p,
16565
+ .docs-page .card > .card-body .h3 + p,
16566
+ .docs-page .card > .card-body h5 + p,
16567
+ .docs-page .card > .card-body .h5 + p {
16568
+ margin-top: 0;
16569
+ }
16570
+ .docs-page .card > .card-body p code,
16571
+ .docs-page .card > .card-body li code,
16572
+ .docs-page .card > .card-body td code,
16573
+ .docs-page .card > .card-body th code,
16574
+ .docs-page .card > .card-body h2 code,
16575
+ .docs-page .card > .card-body .h2 code,
16576
+ .docs-page .card > .card-body h3 code,
16577
+ .docs-page .card > .card-body .h3 code,
16578
+ .docs-page .card > .card-body h4 code,
16579
+ .docs-page .card > .card-body .h4 code,
16580
+ .docs-page .card > .card-body h5 code,
16581
+ .docs-page .card > .card-body .h5 code,
16582
+ .docs-page .card > .card-body h6 code,
16583
+ .docs-page .card > .card-body .h6 code {
16584
+ padding: 0.15em 0.4em;
16585
+ font-size: 0.875em;
16586
+ color: var(--bs-emphasis-color);
16587
+ background: var(--bs-tertiary-bg);
16588
+ border: 1px solid var(--bs-border-color);
16589
+ border-radius: 0.25rem;
16590
+ }
16591
+ .docs-page .card > .card-body pre.astro-code,
16592
+ .docs-page .card > .card-body pre {
16593
+ padding: 1rem 1.25rem;
16594
+ margin-top: 1.25rem;
16595
+ margin-bottom: 1.5rem;
16596
+ overflow-x: auto;
16597
+ font-size: 0.875rem;
16598
+ line-height: 1.6;
16599
+ border-radius: 0.375rem;
16600
+ }
16601
+ .docs-page .card > .card-body pre.astro-code code,
16602
+ .docs-page .card > .card-body pre code {
16603
+ padding: 0;
16604
+ background: transparent;
16605
+ border: 0;
16606
+ }
16607
+ .docs-page .card > .card-body table {
16608
+ width: 100%;
16609
+ margin-top: 1.25rem;
16610
+ margin-bottom: 1.5rem;
16611
+ overflow: hidden;
16612
+ font-size: 0.95rem;
16613
+ border-collapse: collapse;
16614
+ border: 1px solid var(--bs-border-color);
16615
+ border-radius: 0.25rem;
16616
+ }
16617
+ .docs-page .card > .card-body table th,
16618
+ .docs-page .card > .card-body table td {
16619
+ padding: 0.65rem 0.9rem;
16620
+ text-align: right;
16621
+ vertical-align: top;
16622
+ border-bottom: 1px solid var(--bs-border-color);
16623
+ }
16624
+ .docs-page .card > .card-body table th {
16625
+ font-weight: 600;
16626
+ color: var(--bs-emphasis-color);
16627
+ background: var(--bs-tertiary-bg);
16628
+ }
16629
+ .docs-page .card > .card-body table tr:last-child td {
16630
+ border-bottom: 0;
16631
+ }
16632
+ .docs-page .card > .card-body table code {
16633
+ white-space: nowrap;
16634
+ }
16635
+ .docs-page .card > .card-body blockquote {
16636
+ padding: 0.85rem 1.1rem;
16637
+ margin-top: 1.25rem;
16638
+ color: var(--bs-emphasis-color);
16639
+ background: var(--bs-info-bg-subtle);
16640
+ border-right: 4px solid var(--bs-info-border-subtle);
16641
+ border-radius: 0.25rem;
15175
16642
  }
15176
- .login-card-body .input-group .form-control:focus,
15177
- .register-card-body .input-group .form-control:focus {
15178
- box-shadow: none;
16643
+ .docs-page .card > .card-body blockquote p:last-child {
16644
+ margin-bottom: 0;
15179
16645
  }
15180
- .login-card-body .input-group .form-control:focus ~ .input-group-prepend .input-group-text,
15181
- .login-card-body .input-group .form-control:focus ~ .input-group-append .input-group-text,
15182
- .register-card-body .input-group .form-control:focus ~ .input-group-prepend .input-group-text,
15183
- .register-card-body .input-group .form-control:focus ~ .input-group-append .input-group-text {
15184
- border-color: rgb(134, 182.5, 254);
16646
+ .docs-page .card > .card-body blockquote code {
16647
+ background: rgba(0, 0, 0, 0.05);
15185
16648
  }
15186
- .login-card-body .input-group .form-control.is-valid:focus,
15187
- .register-card-body .input-group .form-control.is-valid:focus {
15188
- box-shadow: none;
16649
+ .docs-page .card > .card-body a:not(.btn):not(.nav-link) {
16650
+ color: var(--bs-primary);
16651
+ text-decoration: underline;
16652
+ text-decoration-thickness: 1px;
16653
+ text-underline-offset: 3px;
15189
16654
  }
15190
- .login-card-body .input-group .form-control.is-valid ~ .input-group-prepend .input-group-text,
15191
- .login-card-body .input-group .form-control.is-valid ~ .input-group-append .input-group-text,
15192
- .register-card-body .input-group .form-control.is-valid ~ .input-group-prepend .input-group-text,
15193
- .register-card-body .input-group .form-control.is-valid ~ .input-group-append .input-group-text {
15194
- border-color: #198754;
16655
+ .docs-page .card > .card-body a:not(.btn):not(.nav-link):hover {
16656
+ text-decoration-thickness: 2px;
15195
16657
  }
15196
- .login-card-body .input-group .form-control.is-invalid:focus,
15197
- .register-card-body .input-group .form-control.is-invalid:focus {
15198
- box-shadow: none;
16658
+ .docs-page .card > .card-body hr {
16659
+ margin: 2.5rem 0;
16660
+ border: 0;
16661
+ border-top: 1px solid var(--bs-border-color);
16662
+ opacity: 1;
15199
16663
  }
15200
- .login-card-body .input-group .form-control.is-invalid ~ .input-group-append .input-group-text,
15201
- .register-card-body .input-group .form-control.is-invalid ~ .input-group-append .input-group-text {
15202
- border-color: #dc3545;
16664
+ .docs-page .card > .card-body > p:first-child,
16665
+ .docs-page .card > .card-body > p:first-of-type {
16666
+ margin-bottom: 2rem;
16667
+ font-size: 1.125rem;
16668
+ line-height: 1.6;
16669
+ color: var(--bs-body-color);
15203
16670
  }
15204
- .login-card-body .input-group .input-group-text,
15205
- .register-card-body .input-group .input-group-text {
15206
- color: var(--bs-secondary-color);
15207
- background-color: transparent;
15208
- border-top-left-radius: 0.375rem;
15209
- border-bottom-left-radius: 0.375rem;
15210
- transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
16671
+ .docs-page .card > .card-body details.faq-item {
16672
+ margin-bottom: 0.5rem;
16673
+ overflow: hidden;
16674
+ background: var(--bs-body-bg);
16675
+ border: 1px solid var(--bs-border-color);
16676
+ border-radius: 0.375rem;
16677
+ transition: border-color 0.15s ease, box-shadow 0.15s ease;
15211
16678
  }
15212
16679
  @media (prefers-reduced-motion: reduce) {
15213
- .login-card-body .input-group .input-group-text,
15214
- .register-card-body .input-group .input-group-text {
16680
+ .docs-page .card > .card-body details.faq-item {
15215
16681
  transition: none;
15216
16682
  }
15217
16683
  }
15218
-
15219
- .login-box-msg,
15220
- .register-box-msg {
15221
- padding: 0 20px 20px;
15222
- margin: 0;
15223
- text-align: center;
16684
+ .docs-page .card > .card-body details.faq-item:hover {
16685
+ border-color: var(--bs-primary-border-subtle);
15224
16686
  }
15225
-
15226
- .social-auth-links {
15227
- margin: 10px 0;
16687
+ .docs-page .card > .card-body details.faq-item[open] {
16688
+ background: var(--bs-body-bg);
16689
+ border-color: var(--bs-primary-border-subtle);
16690
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
15228
16691
  }
15229
-
15230
- .lockscreen .lockscreen-name {
16692
+ .docs-page .card > .card-body details.faq-item summary {
16693
+ position: relative;
16694
+ padding: 0.9rem 1.1rem 0.9rem 3rem;
16695
+ font-size: 1rem;
15231
16696
  font-weight: 600;
15232
- text-align: center;
16697
+ color: var(--bs-emphasis-color);
16698
+ list-style: none;
16699
+ cursor: pointer;
16700
+ -webkit-user-select: none;
16701
+ user-select: none;
16702
+ transition: color 0.15s ease;
15233
16703
  }
15234
- .lockscreen .lockscreen-logo {
15235
- margin-bottom: 25px;
15236
- font-size: 35px;
15237
- font-weight: 300;
15238
- text-align: center;
16704
+ @media (prefers-reduced-motion: reduce) {
16705
+ .docs-page .card > .card-body details.faq-item summary {
16706
+ transition: none;
16707
+ }
15239
16708
  }
15240
- .lockscreen .lockscreen-logo a {
15241
- color: var(--bs-emphasis-color);
15242
- text-decoration: none;
16709
+ .docs-page .card > .card-body details.faq-item summary::-webkit-details-marker {
16710
+ display: none;
15243
16711
  }
15244
- .lockscreen .lockscreen-wrapper {
15245
- max-width: 400px;
15246
- margin: 0 auto;
15247
- margin-top: 10%;
16712
+ .docs-page .card > .card-body details.faq-item summary::marker {
16713
+ content: "";
15248
16714
  }
15249
- .lockscreen .lockscreen-item {
15250
- position: relative;
15251
- width: 290px;
15252
- padding: 0;
15253
- margin: 10px auto 30px;
15254
- background-color: var(--bs-body-bg);
15255
- border-radius: 4px;
16715
+ .docs-page .card > .card-body details.faq-item summary:hover {
16716
+ color: var(--bs-primary);
15256
16717
  }
15257
- .lockscreen .lockscreen-image {
16718
+ .docs-page .card > .card-body details.faq-item summary::after {
15258
16719
  position: absolute;
15259
- top: -25px;
15260
- right: -10px;
15261
- z-index: 10;
15262
- padding: 5px;
15263
- background-color: var(--bs-body-bg);
15264
- border-radius: 50%;
16720
+ top: 50%;
16721
+ left: 1.1rem;
16722
+ display: inline-block;
16723
+ width: 0.55rem;
16724
+ height: 0.55rem;
16725
+ margin-top: -0.4rem;
16726
+ content: "";
16727
+ border-left: 2px solid currentcolor;
16728
+ border-bottom: 2px solid currentcolor;
16729
+ opacity: 0.55;
16730
+ transform: rotate(-45deg);
16731
+ transition: transform 0.2s ease;
15265
16732
  }
15266
- .lockscreen .lockscreen-image > img {
15267
- border-radius: 50%;
15268
- width: 70px;
15269
- height: 70px;
16733
+ @media (prefers-reduced-motion: reduce) {
16734
+ .docs-page .card > .card-body details.faq-item summary::after {
16735
+ transition: none;
16736
+ }
15270
16737
  }
15271
- .lockscreen .lockscreen-credentials {
15272
- margin-right: 70px;
16738
+ .docs-page .card > .card-body details.faq-item[open] > summary {
16739
+ color: var(--bs-primary);
16740
+ border-bottom: 1px solid var(--bs-border-color);
15273
16741
  }
15274
- .lockscreen .lockscreen-credentials .form-control {
15275
- border: 0;
16742
+ .docs-page .card > .card-body details.faq-item[open] > summary::after {
16743
+ margin-top: -0.15rem;
16744
+ opacity: 1;
16745
+ transform: rotate(135deg);
15276
16746
  }
15277
- .lockscreen .lockscreen-credentials .btn {
15278
- padding: 0 10px;
15279
- border: 0;
16747
+ .docs-page .card > .card-body details.faq-item > *:not(summary) {
16748
+ padding-left: 1.1rem;
16749
+ padding-right: 1.1rem;
15280
16750
  }
15281
- .lockscreen .lockscreen-footer {
15282
- margin-top: 10px;
16751
+ .docs-page .card > .card-body details.faq-item > *:not(summary):first-of-type {
16752
+ padding-top: 1rem;
15283
16753
  }
15284
-
15285
- .img-size-64,
15286
- .img-size-50,
15287
- .img-size-32 {
15288
- height: auto;
16754
+ .docs-page .card > .card-body details.faq-item > *:not(summary):last-child {
16755
+ padding-bottom: 1rem;
15289
16756
  }
15290
-
15291
- .img-size-64 {
15292
- width: 64px;
16757
+ .docs-page .card > .card-body details.faq-item p,
16758
+ .docs-page .card > .card-body details.faq-item ul,
16759
+ .docs-page .card > .card-body details.faq-item ol {
16760
+ margin-bottom: 0.65rem;
15293
16761
  }
15294
-
15295
- .img-size-50 {
15296
- width: 50px;
16762
+ .docs-page .card > .card-body details.faq-item > *:last-child p:last-child,
16763
+ .docs-page .card > .card-body details.faq-item > p:last-child,
16764
+ .docs-page .card > .card-body details.faq-item > ul:last-child,
16765
+ .docs-page .card > .card-body details.faq-item > ol:last-child {
16766
+ margin-bottom: 0;
15297
16767
  }
15298
-
15299
- .img-size-32 {
15300
- width: 32px;
16768
+ .docs-page .card > .card-body details.faq-item pre.astro-code,
16769
+ .docs-page .card > .card-body details.faq-item pre {
16770
+ margin-left: 0;
16771
+ margin-right: 0;
16772
+ }
16773
+ .docs-page[data-bs-theme=dark] .card > .card-body blockquote code, [data-bs-theme=dark] .docs-page .card > .card-body blockquote code {
16774
+ background: rgba(255, 255, 255, 0.08);
15301
16775
  }
15302
16776
 
15303
- /* ==========================================================================
15304
- AdminLTE Accessibility Styles - WCAG 2.1 AA Compliance
15305
- ========================================================================== */
15306
- /* Skip Links - WCAG 2.4.1: Bypass Blocks */
15307
- .skip-link {
15308
- position: absolute;
15309
- top: -40px;
15310
- right: 6px;
15311
- z-index: 999999;
15312
- padding: 8px 16px;
15313
- font-weight: 600;
15314
- color: var(--bs-white);
15315
- text-decoration: none;
15316
- background: var(--bs-primary);
16777
+ .faq-page .app-content > .container-fluid, .faq-page .app-content > .container-sm, .faq-page .app-content > .container-md, .faq-page .app-content > .container-lg, .faq-page .app-content > .container-xl, .faq-page .app-content > .container-xxl {
16778
+ max-width: 64rem;
15317
16779
  }
15318
- .skip-link:focus {
15319
- top: 0;
15320
- outline: 3px solid var(--bs-warning);
15321
- outline-offset: 2px;
16780
+ @media (min-width: 1400px) {
16781
+ .faq-page .app-content > .container-fluid, .faq-page .app-content > .container-sm, .faq-page .app-content > .container-md, .faq-page .app-content > .container-lg, .faq-page .app-content > .container-xl, .faq-page .app-content > .container-xxl {
16782
+ max-width: 72rem;
16783
+ }
15322
16784
  }
15323
- .skip-link:hover {
15324
- color: var(--bs-white);
15325
- text-decoration: none;
15326
- background: var(--bs-primary-emphasis);
16785
+ .faq-page .faq-hero {
16786
+ position: relative;
16787
+ padding: 3rem 1.5rem 2.5rem;
16788
+ margin-top: 1rem;
16789
+ overflow: hidden;
16790
+ background: radial-gradient(ellipse at top right, rgba(var(--bs-primary-rgb), 0.12), transparent 60%), radial-gradient(ellipse at bottom left, rgba(var(--bs-info-rgb), 0.1), transparent 65%), var(--bs-body-bg);
16791
+ border: 1px solid var(--bs-border-color);
16792
+ border-radius: 1rem;
15327
16793
  }
15328
-
15329
- /* Enhanced Focus Indicators - WCAG 2.4.7: Focus Visible */
15330
- .focus-enhanced:focus {
15331
- outline: 3px solid var(--bs-focus-ring-color, #0d6efd);
15332
- outline-offset: 2px;
15333
- box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
16794
+ .faq-page .faq-hero-eyebrow {
16795
+ display: inline-flex;
16796
+ gap: 0.4rem;
16797
+ align-items: center;
16798
+ padding: 0.35rem 0.85rem;
16799
+ margin-bottom: 1rem;
16800
+ font-size: 0.75rem;
16801
+ font-weight: 600;
16802
+ color: var(--bs-primary);
16803
+ text-transform: uppercase;
16804
+ letter-spacing: 0.08em;
16805
+ background: var(--bs-primary-bg-subtle);
16806
+ border: 1px solid var(--bs-primary-border-subtle);
16807
+ border-radius: 50rem;
15334
16808
  }
15335
-
15336
- /* High Contrast Mode Support */
15337
- @media (prefers-contrast: high) {
15338
- .card {
15339
- border: 2px solid;
15340
- }
15341
- .btn {
15342
- border-width: 2px;
15343
- }
15344
- .nav-link {
15345
- border: 1px solid transparent;
15346
- }
15347
- .nav-link:hover, .nav-link:focus {
15348
- border-color: currentcolor;
16809
+ .faq-page .faq-hero-eyebrow .bi {
16810
+ font-size: 0.9rem;
16811
+ }
16812
+ .faq-page .faq-hero-title {
16813
+ margin: 0 0 0.5rem;
16814
+ font-size: 2.25rem;
16815
+ font-weight: 700;
16816
+ line-height: 1.15;
16817
+ color: var(--bs-emphasis-color);
16818
+ }
16819
+ @media (min-width: 768px) {
16820
+ .faq-page .faq-hero-title {
16821
+ font-size: 2.75rem;
15349
16822
  }
15350
16823
  }
15351
- /* Reduced Motion Support - WCAG 2.3.3: Animation from Interactions */
16824
+ .faq-page .faq-hero-lead {
16825
+ max-width: 36rem;
16826
+ margin: 0 auto 1.75rem;
16827
+ font-size: 1.05rem;
16828
+ line-height: 1.55;
16829
+ color: var(--bs-secondary-color);
16830
+ }
16831
+ .faq-page .faq-search {
16832
+ position: relative;
16833
+ max-width: 32rem;
16834
+ margin: 0 auto;
16835
+ }
16836
+ .faq-page .faq-search .form-control {
16837
+ height: 3rem;
16838
+ padding-left: 3rem;
16839
+ padding-right: 3rem;
16840
+ font-size: 1rem;
16841
+ background: var(--bs-body-bg);
16842
+ border-radius: 50rem;
16843
+ transition: box-shadow 0.15s ease, border-color 0.15s ease;
16844
+ }
15352
16845
  @media (prefers-reduced-motion: reduce) {
15353
- *,
15354
- *::before,
15355
- *::after {
15356
- transition-duration: 0.01ms !important;
15357
- animation-duration: 0.01ms !important;
15358
- animation-iteration-count: 1 !important;
15359
- scroll-behavior: auto !important;
15360
- }
15361
- .fade {
15362
- opacity: 1 !important;
15363
- /* stylelint-disable-next-line property-disallowed-list */
15364
- transition: none !important;
15365
- }
15366
- .collapse {
15367
- /* stylelint-disable-next-line property-disallowed-list */
15368
- transition: none !important;
15369
- }
15370
- .modal.fade .modal-dialog {
15371
- transform: none !important;
16846
+ .faq-page .faq-search .form-control {
16847
+ transition: none;
15372
16848
  }
15373
16849
  }
15374
- /* Screen Reader Only Content */
15375
- .sr-only {
15376
- position: absolute !important;
15377
- width: 1px !important;
15378
- height: 1px !important;
15379
- padding: 0 !important;
15380
- margin: -1px !important;
15381
- overflow: hidden !important;
15382
- clip: rect(0, 0, 0, 0) !important;
15383
- white-space: nowrap !important;
15384
- border: 0 !important;
16850
+ .faq-page .faq-search .form-control:focus {
16851
+ box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.15);
16852
+ }
16853
+ .faq-page .faq-search-icon {
16854
+ position: absolute;
16855
+ top: 50%;
16856
+ right: 1.2rem;
16857
+ color: var(--bs-secondary-color);
16858
+ pointer-events: none;
16859
+ transform: translateY(-50%);
16860
+ }
16861
+ .faq-page .faq-search-clear {
16862
+ position: absolute;
16863
+ top: 50%;
16864
+ left: 0.65rem;
16865
+ display: inline-flex;
16866
+ align-items: center;
16867
+ justify-content: center;
16868
+ width: 2rem;
16869
+ height: 2rem;
16870
+ padding: 0;
16871
+ color: var(--bs-secondary-color);
16872
+ background: var(--bs-tertiary-bg);
16873
+ border: 0;
16874
+ transform: translateY(-50%);
16875
+ border-radius: 50%;
16876
+ transition: background 0.15s ease, color 0.15s ease;
15385
16877
  }
15386
-
15387
- .sr-only-focusable:focus {
15388
- position: static !important;
15389
- width: auto !important;
15390
- height: auto !important;
15391
- padding: inherit !important;
15392
- margin: inherit !important;
15393
- overflow: visible !important;
15394
- clip: auto !important;
15395
- white-space: normal !important;
16878
+ @media (prefers-reduced-motion: reduce) {
16879
+ .faq-page .faq-search-clear {
16880
+ transition: none;
16881
+ }
15396
16882
  }
15397
-
15398
- /* Focus Trap Utilities */
15399
- .focus-trap:focus {
15400
- box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
16883
+ .faq-page .faq-search-clear:hover {
16884
+ color: var(--bs-body-color);
16885
+ background: var(--bs-secondary-bg);
15401
16886
  }
15402
-
15403
- /* Accessible Color Combinations - WCAG 1.4.3: Contrast (Minimum) */
15404
- .text-accessible-primary {
15405
- color: #003d82; /* 4.5:1 contrast on white */
16887
+ .faq-page .faq-empty-state {
16888
+ max-width: 32rem;
16889
+ padding: 1rem;
16890
+ margin: 1.5rem auto 0;
16891
+ font-size: 0.95rem;
16892
+ color: var(--bs-secondary-color);
16893
+ background: var(--bs-tertiary-bg);
16894
+ border-radius: 0.375rem;
15406
16895
  }
15407
-
15408
- .text-accessible-success {
15409
- color: #0f5132; /* 4.5:1 contrast on white */
16896
+ .faq-page .faq-empty-state .bi {
16897
+ margin-left: 0.35rem;
15410
16898
  }
15411
-
15412
- .text-accessible-danger {
15413
- color: #842029; /* 4.5:1 contrast on white */
16899
+ .faq-page .faq-chips {
16900
+ display: flex;
16901
+ flex-wrap: wrap;
16902
+ gap: 0.5rem;
16903
+ justify-content: center;
15414
16904
  }
15415
-
15416
- .text-accessible-warning {
15417
- color: #664d03; /* 4.5:1 contrast on white */
16905
+ .faq-page .faq-chip {
16906
+ display: inline-flex;
16907
+ gap: 0.45rem;
16908
+ align-items: center;
16909
+ padding: 0.45rem 0.85rem;
16910
+ font-size: 0.875rem;
16911
+ font-weight: 500;
16912
+ color: var(--bs-body-color);
16913
+ text-decoration: none;
16914
+ background: var(--bs-body-bg);
16915
+ border: 1px solid var(--bs-border-color);
16916
+ border-radius: 50rem;
16917
+ transition: transform 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
15418
16918
  }
15419
-
15420
- /* ARIA Live Regions */
15421
- .live-region {
15422
- position: absolute;
15423
- right: -10000px;
15424
- width: 1px;
15425
- height: 1px;
15426
- overflow: hidden;
16919
+ @media (prefers-reduced-motion: reduce) {
16920
+ .faq-page .faq-chip {
16921
+ transition: none;
16922
+ }
15427
16923
  }
15428
- .live-region.live-region-visible {
15429
- position: static;
15430
- right: auto;
15431
- width: auto;
15432
- height: auto;
15433
- overflow: visible;
16924
+ .faq-page .faq-chip:hover {
16925
+ color: var(--bs-emphasis-color);
16926
+ background: var(--bs-tertiary-bg);
16927
+ transform: translateY(-1px);
15434
16928
  }
15435
-
15436
- /* Enhanced Error States - WCAG 3.3.1: Error Identification */
15437
- .form-control.is-invalid {
15438
- border-color: var(--bs-danger);
16929
+ .faq-page .faq-chip .bi {
16930
+ font-size: 1rem;
15439
16931
  }
15440
- .form-control.is-invalid:focus {
15441
- border-color: var(--bs-danger);
15442
- box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
16932
+ .faq-page .faq-chip-count {
16933
+ padding: 0 0.45rem;
16934
+ font-size: 0.7rem;
16935
+ font-weight: 600;
16936
+ color: var(--bs-secondary-color);
16937
+ background: var(--bs-tertiary-bg);
16938
+ border-radius: 50rem;
16939
+ }
16940
+ .faq-page .faq-chip-primary:hover {
16941
+ color: var(--bs-primary-text-emphasis);
16942
+ background: var(--bs-primary-bg-subtle);
16943
+ border-color: var(--bs-primary-border-subtle);
16944
+ }
16945
+ .faq-page .faq-chip-primary:hover .faq-chip-count {
16946
+ color: var(--bs-primary-text-emphasis);
16947
+ background: rgba(0, 0, 0, 0.06);
16948
+ }
16949
+ .faq-page .faq-chip-info:hover {
16950
+ color: var(--bs-info-text-emphasis);
16951
+ background: var(--bs-info-bg-subtle);
16952
+ border-color: var(--bs-info-border-subtle);
16953
+ }
16954
+ .faq-page .faq-chip-info:hover .faq-chip-count {
16955
+ color: var(--bs-info-text-emphasis);
16956
+ background: rgba(0, 0, 0, 0.06);
16957
+ }
16958
+ .faq-page .faq-chip-warning:hover {
16959
+ color: var(--bs-warning-text-emphasis);
16960
+ background: var(--bs-warning-bg-subtle);
16961
+ border-color: var(--bs-warning-border-subtle);
16962
+ }
16963
+ .faq-page .faq-chip-warning:hover .faq-chip-count {
16964
+ color: var(--bs-warning-text-emphasis);
16965
+ background: rgba(0, 0, 0, 0.06);
16966
+ }
16967
+ .faq-page .faq-chip-success:hover {
16968
+ color: var(--bs-success-text-emphasis);
16969
+ background: var(--bs-success-bg-subtle);
16970
+ border-color: var(--bs-success-border-subtle);
16971
+ }
16972
+ .faq-page .faq-chip-success:hover .faq-chip-count {
16973
+ color: var(--bs-success-text-emphasis);
16974
+ background: rgba(0, 0, 0, 0.06);
16975
+ }
16976
+ .faq-page .faq-chip-danger:hover {
16977
+ color: var(--bs-danger-text-emphasis);
16978
+ background: var(--bs-danger-bg-subtle);
16979
+ border-color: var(--bs-danger-border-subtle);
16980
+ }
16981
+ .faq-page .faq-chip-danger:hover .faq-chip-count {
16982
+ color: var(--bs-danger-text-emphasis);
16983
+ background: rgba(0, 0, 0, 0.06);
16984
+ }
16985
+ .faq-page .faq-chip-secondary:hover {
16986
+ color: var(--bs-secondary-text-emphasis);
16987
+ background: var(--bs-secondary-bg-subtle);
16988
+ border-color: var(--bs-secondary-border-subtle);
16989
+ }
16990
+ .faq-page .faq-chip-secondary:hover .faq-chip-count {
16991
+ color: var(--bs-secondary-text-emphasis);
16992
+ background: rgba(0, 0, 0, 0.06);
16993
+ }
16994
+ .faq-page .faq-section {
16995
+ margin-bottom: 2.5rem;
16996
+ scroll-margin-top: 5rem;
16997
+ }
16998
+ .faq-page .faq-section-header {
16999
+ display: flex;
17000
+ gap: 1rem;
17001
+ align-items: center;
17002
+ padding: 1rem 1.25rem;
17003
+ margin-bottom: 1rem;
17004
+ background: var(--bs-body-bg);
17005
+ border: 1px solid var(--bs-border-color);
17006
+ border-right: 4px solid var(--bs-primary);
17007
+ border-radius: 0.375rem;
15443
17008
  }
15444
-
15445
- .invalid-feedback[role=alert] {
17009
+ .faq-page .faq-section-icon {
17010
+ display: inline-flex;
17011
+ flex-shrink: 0;
17012
+ align-items: center;
17013
+ justify-content: center;
17014
+ width: 2.75rem;
17015
+ height: 2.75rem;
17016
+ font-size: 1.35rem;
17017
+ color: var(--bs-primary);
17018
+ background: var(--bs-primary-bg-subtle);
17019
+ border-radius: 0.375rem;
17020
+ }
17021
+ .faq-page .faq-section-title {
17022
+ margin: 0;
17023
+ font-size: 1.4rem;
15446
17024
  font-weight: 600;
17025
+ line-height: 1.2;
17026
+ color: var(--bs-emphasis-color);
15447
17027
  }
15448
-
15449
- /* Target Size - WCAG 2.5.8: Target Size (Minimum) */
15450
- .touch-target {
15451
- min-width: 44px;
15452
- min-height: 44px;
17028
+ .faq-page .faq-section-count {
17029
+ margin: 0.1rem 0 0;
17030
+ font-size: 0.8rem;
17031
+ color: var(--bs-secondary-color);
15453
17032
  }
15454
- .touch-target.touch-target-small {
15455
- min-width: 24px;
15456
- min-height: 24px;
17033
+ .faq-page .faq-section-primary {
17034
+ border-right-color: var(--bs-primary);
15457
17035
  }
15458
-
15459
- /* Table Accessibility */
15460
- .table-accessible th {
15461
- font-weight: 600;
15462
- background-color: var(--bs-secondary-bg);
17036
+ .faq-page .faq-section-primary .faq-section-icon {
17037
+ color: var(--bs-primary-text-emphasis);
17038
+ background: var(--bs-primary-bg-subtle);
15463
17039
  }
15464
- .table-accessible th[scope=col] {
15465
- border-bottom: 2px solid var(--bs-border-color);
17040
+ .faq-page .faq-section-info {
17041
+ border-right-color: var(--bs-info);
15466
17042
  }
15467
- .table-accessible th[scope=row] {
15468
- border-left: 2px solid var(--bs-border-color);
17043
+ .faq-page .faq-section-info .faq-section-icon {
17044
+ color: var(--bs-info-text-emphasis);
17045
+ background: var(--bs-info-bg-subtle);
15469
17046
  }
15470
- .table-accessible caption {
15471
- padding: 0.75rem;
15472
- font-weight: 600;
15473
- color: var(--bs-secondary);
15474
- text-align: right;
15475
- caption-side: top;
17047
+ .faq-page .faq-section-warning {
17048
+ border-right-color: var(--bs-warning);
15476
17049
  }
15477
-
15478
- /* Navigation Landmarks */
15479
- nav[role=navigation]:not([aria-label]):not([aria-labelledby])::before {
15480
- position: absolute;
15481
- right: -10000px;
15482
- content: "Navigation";
17050
+ .faq-page .faq-section-warning .faq-section-icon {
17051
+ color: var(--bs-warning-text-emphasis);
17052
+ background: var(--bs-warning-bg-subtle);
15483
17053
  }
15484
-
15485
- /* Form Fieldset Styling */
15486
- fieldset {
15487
- padding: 1rem;
15488
- margin-bottom: 1rem;
15489
- border: 1px solid var(--bs-border-color);
17054
+ .faq-page .faq-section-success {
17055
+ border-right-color: var(--bs-success);
15490
17056
  }
15491
- fieldset legend {
15492
- padding: 0 0.5rem;
17057
+ .faq-page .faq-section-success .faq-section-icon {
17058
+ color: var(--bs-success-text-emphasis);
17059
+ background: var(--bs-success-bg-subtle);
17060
+ }
17061
+ .faq-page .faq-section-danger {
17062
+ border-right-color: var(--bs-danger);
17063
+ }
17064
+ .faq-page .faq-section-danger .faq-section-icon {
17065
+ color: var(--bs-danger-text-emphasis);
17066
+ background: var(--bs-danger-bg-subtle);
17067
+ }
17068
+ .faq-page .faq-section-secondary {
17069
+ border-right-color: var(--bs-secondary);
17070
+ }
17071
+ .faq-page .faq-section-secondary .faq-section-icon {
17072
+ color: var(--bs-secondary-text-emphasis);
17073
+ background: var(--bs-secondary-bg-subtle);
17074
+ }
17075
+ .faq-page .faq-section-items .faq-item {
15493
17076
  margin-bottom: 0.5rem;
15494
- font-size: 1.1em;
15495
- font-weight: 600;
17077
+ overflow: hidden;
17078
+ background: var(--bs-body-bg);
17079
+ border: 1px solid var(--bs-border-color);
17080
+ border-radius: 0.375rem;
17081
+ transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
15496
17082
  }
15497
-
15498
- /* Loading States */
15499
- .loading[aria-busy=true] {
15500
- position: relative;
15501
- pointer-events: none;
17083
+ @media (prefers-reduced-motion: reduce) {
17084
+ .faq-page .faq-section-items .faq-item {
17085
+ transition: none;
17086
+ }
15502
17087
  }
15503
- .loading[aria-busy=true]::after {
15504
- position: absolute;
15505
- top: 50%;
15506
- right: 50%;
15507
- width: 20px;
15508
- height: 20px;
15509
- margin-top: -10px;
15510
- margin-right: -10px;
17088
+ .faq-page .faq-section-items .faq-item:hover {
17089
+ border-color: var(--bs-primary-border-subtle);
17090
+ transform: translateX(-2px);
17091
+ }
17092
+ .faq-page .faq-section-items .faq-item[open] {
17093
+ border-color: var(--bs-primary-border-subtle);
17094
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
17095
+ transform: none;
17096
+ }
17097
+ .faq-page .faq-section-items .faq-item summary {
17098
+ display: flex;
17099
+ gap: 0.85rem;
17100
+ align-items: center;
17101
+ padding: 1rem 1.25rem;
17102
+ font-size: 1rem;
17103
+ font-weight: 500;
17104
+ color: var(--bs-emphasis-color);
17105
+ list-style: none;
17106
+ cursor: pointer;
17107
+ -webkit-user-select: none;
17108
+ user-select: none;
17109
+ }
17110
+ .faq-page .faq-section-items .faq-item summary::-webkit-details-marker {
17111
+ display: none;
17112
+ }
17113
+ .faq-page .faq-section-items .faq-item summary::marker {
15511
17114
  content: "";
15512
- border: 2px solid var(--bs-primary);
15513
- border-top-color: transparent;
15514
- animation: spin 1s linear infinite;
17115
+ }
17116
+ .faq-page .faq-section-items .faq-item summary::after {
17117
+ content: none;
17118
+ }
17119
+ .faq-page .faq-section-items .faq-item .faq-q-icon {
17120
+ display: inline-flex;
17121
+ flex-shrink: 0;
17122
+ align-items: center;
17123
+ justify-content: center;
17124
+ width: 1.75rem;
17125
+ height: 1.75rem;
17126
+ font-size: 0.85rem;
17127
+ color: var(--bs-primary);
17128
+ background: var(--bs-primary-bg-subtle);
17129
+ border-radius: 50%;
17130
+ }
17131
+ .faq-page .faq-section-items .faq-item .faq-q-text {
17132
+ flex-grow: 1;
17133
+ }
17134
+ .faq-page .faq-section-items .faq-item .faq-q-chevron {
17135
+ flex-shrink: 0;
17136
+ color: var(--bs-secondary-color);
17137
+ transition: transform 0.2s ease, color 0.2s ease;
15515
17138
  }
15516
17139
  @media (prefers-reduced-motion: reduce) {
15517
- .loading[aria-busy=true]::after {
15518
- border-top-color: var(--bs-primary);
15519
- animation: none;
17140
+ .faq-page .faq-section-items .faq-item .faq-q-chevron {
17141
+ transition: none;
15520
17142
  }
15521
17143
  }
15522
-
15523
- @keyframes spin {
15524
- to {
15525
- transform: rotate(-360deg);
15526
- }
17144
+ .faq-page .faq-section-items .faq-item[open] .faq-q-chevron {
17145
+ color: var(--bs-primary);
17146
+ transform: rotate(-180deg);
15527
17147
  }
15528
- /* Dark Mode Accessibility */
15529
- [data-bs-theme=dark] .text-accessible-primary {
15530
- color: #6ea8fe;
17148
+ .faq-page .faq-section-items .faq-item[open] summary {
17149
+ color: var(--bs-primary);
17150
+ border-bottom: 1px solid var(--bs-border-color);
15531
17151
  }
15532
- [data-bs-theme=dark] .text-accessible-success {
15533
- color: #75b798;
17152
+ .faq-page .faq-section-items .faq-item .faq-answer {
17153
+ padding: 1.1rem 3.85rem 1.1rem 1.25rem;
17154
+ font-size: 0.95rem;
17155
+ line-height: 1.65;
17156
+ color: var(--bs-body-color);
15534
17157
  }
15535
- [data-bs-theme=dark] .text-accessible-danger {
15536
- color: #f1aeb5;
17158
+ .faq-page .faq-section-items .faq-item .faq-answer p:last-child,
17159
+ .faq-page .faq-section-items .faq-item .faq-answer ul:last-child,
17160
+ .faq-page .faq-section-items .faq-item .faq-answer ol:last-child,
17161
+ .faq-page .faq-section-items .faq-item .faq-answer pre:last-child {
17162
+ margin-bottom: 0;
15537
17163
  }
15538
- [data-bs-theme=dark] .text-accessible-warning {
15539
- color: #ffda6a;
17164
+ .faq-page .faq-section-items .faq-item .faq-answer a {
17165
+ color: var(--bs-primary);
17166
+ text-decoration: underline;
17167
+ text-underline-offset: 2px;
15540
17168
  }
15541
-
15542
- /* Print Accessibility */
15543
- @media print {
15544
- .skip-link,
15545
- .btn,
15546
- .nav-link {
15547
- color: #000 !important;
15548
- background: transparent !important;
15549
- border: 1px solid #000 !important;
15550
- }
15551
- a[href^=http]::after {
15552
- font-size: 0.8em;
15553
- content: " (" attr(href) ")";
15554
- }
17169
+ .faq-page .faq-section-items .faq-item .faq-answer a:hover {
17170
+ text-decoration-thickness: 2px;
17171
+ }
17172
+ .faq-page .faq-section-items .faq-item .faq-answer code {
17173
+ padding: 0.12em 0.35em;
17174
+ font-size: 0.875em;
17175
+ color: var(--bs-emphasis-color);
17176
+ background: var(--bs-tertiary-bg);
17177
+ border: 1px solid var(--bs-border-color);
17178
+ border-radius: 0.25rem;
17179
+ }
17180
+ .faq-page .faq-section-items .faq-item .faq-answer pre.astro-code,
17181
+ .faq-page .faq-section-items .faq-item .faq-answer pre {
17182
+ padding: 0.85rem 1rem;
17183
+ margin-top: 0.75rem;
17184
+ margin-bottom: 0.75rem;
17185
+ overflow-x: auto;
17186
+ font-size: 0.85rem;
17187
+ line-height: 1.55;
17188
+ border-radius: 0.25rem;
17189
+ }
17190
+ .faq-page .faq-section-items .faq-item .faq-answer pre.astro-code code,
17191
+ .faq-page .faq-section-items .faq-item .faq-answer pre code {
17192
+ padding: 0;
17193
+ background: transparent;
17194
+ border: 0;
17195
+ }
17196
+ .faq-page .faq-cta {
17197
+ padding: 2.5rem 1.5rem;
17198
+ text-align: center;
17199
+ background: radial-gradient(ellipse at top, rgba(var(--bs-primary-rgb), 0.08), transparent 60%), var(--bs-body-bg);
17200
+ border: 1px solid var(--bs-border-color);
17201
+ border-radius: 1rem;
17202
+ }
17203
+ .faq-page .faq-cta-icon {
17204
+ display: inline-flex;
17205
+ align-items: center;
17206
+ justify-content: center;
17207
+ width: 3.5rem;
17208
+ height: 3.5rem;
17209
+ margin-bottom: 1rem;
17210
+ font-size: 1.6rem;
17211
+ color: var(--bs-primary);
17212
+ background: var(--bs-primary-bg-subtle);
17213
+ border-radius: 50%;
17214
+ }
17215
+ .faq-page .faq-cta h2, .faq-page .faq-cta .h2 {
17216
+ margin: 0 0 0.5rem;
17217
+ font-size: 1.5rem;
17218
+ font-weight: 600;
17219
+ color: var(--bs-emphasis-color);
17220
+ }
17221
+ .faq-page .faq-cta p {
17222
+ max-width: 32rem;
17223
+ margin: 0 auto 1.5rem;
17224
+ color: var(--bs-secondary-color);
17225
+ }
17226
+ .faq-page .faq-cta-actions {
17227
+ display: inline-flex;
17228
+ flex-wrap: wrap;
17229
+ gap: 0.5rem;
17230
+ justify-content: center;
15555
17231
  }
15556
17232
  /*# sourceMappingURL=adminlte.rtl.css.map */