All user data for FoundryVTT. Includes worlds, systems, modules, and any asset in the "foundryuserdata" directory. Does NOT include the FoundryVTT installation itself.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

12163 lines
588 KiB

1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
  1. @charset "UTF-8";
  2. /* --------------------------------------------------------- */
  3. /* The original styling has been overruled by system changes */
  4. /* --------------------------------------------------------- */
  5. .pf2e-av .journal-page-content a.inline-check > i.icon,
  6. .pf2e-av .journal-page-content span[data-pf2-check] > i.icon,
  7. .pf2e-av .journal-page-content [data-pf2-repost] .label,
  8. .pf2e-av .journal-page-content [data-pf2-check] .label,
  9. .pf2e-av .journal-page-content [data-pf2-check]:not([data-pf2-show-dc=gm]) .label {
  10. color: var(--av-green-light);
  11. }
  12. #hand-mini-bar-hands-container .hand-mini-bar-hand {
  13. border: none;
  14. border-radius: var(--border-radius);
  15. background: none;
  16. background-color: var(--glass-bg);
  17. box-shadow: var(--glassy);
  18. border-radius: 5px;
  19. }
  20. #hand-mini-bar-hands-container .hand-mini-bar-settings-hand {
  21. background-position-x: 2px;
  22. }
  23. #hand-mini-bar-hands-container .hand-mini-bar-card-container {
  24. background-color: unset;
  25. border: unset;
  26. min-width: 152px;
  27. max-width: 152px;
  28. }
  29. #hand-mini-bar-hands-container .hand-mini-bar-settings > div,
  30. #hand-mini-bar-hands-container .hand-mini-bar-actions > div {
  31. box-shadow: 0px 0px 3px 0px rgba(255, 255, 255, 0.4) inset;
  32. text-align: center;
  33. border: none;
  34. text-shadow: 0px 0px 3px black;
  35. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  36. }
  37. #hand-mini-bar-hands-container .hand-mini-bar-settings > div:hover,
  38. #hand-mini-bar-hands-container .hand-mini-bar-actions > div:hover {
  39. background-color: var(--primary);
  40. }
  41. #hand-mini-bar-hands-container .hand-mini-bar-settings {
  42. border-top-left-radius: 3px;
  43. border-bottom-left-radius: 3px;
  44. border-right: 1px solid black;
  45. }
  46. #hand-mini-bar-hands-container .hand-mini-bar-settings div:first-child {
  47. border-bottom: 1px solid black;
  48. }
  49. #hand-mini-bar-hands-container .hand-mini-bar-actions {
  50. border-top-right-radius: 3px;
  51. border-bottom-right-radius: 3px;
  52. border-left: 1px solid black;
  53. }
  54. #hand-mini-bar-hands-container .hand-mini-bar-actions div:first-child {
  55. border-bottom: 1px solid black;
  56. }
  57. #hand-mini-bar-hands-container .hand-mini-bar-pass:before {
  58. font-size: 18px;
  59. line-height: 32px;
  60. }
  61. /* ----------------------------------------- */
  62. /* Cautious Gamemaster's Pack (CGMP) */
  63. /* ----------------------------------------- */
  64. /* ----------------------------------------- */
  65. /* Combat Carousel */
  66. /* ----------------------------------------- */
  67. #controls ol li.scene-control[data-control=combat-carousel] {
  68. position: relative;
  69. }
  70. /* ----------------------------------------- */
  71. /* Custom Hotbar */
  72. /* ----------------------------------------- */
  73. :root {
  74. --custom-hotbar-chb-macro-size: calc(var(--macro-size) + 2px);
  75. }
  76. #ui-bottom #hotbars {
  77. display: flex;
  78. flex-direction: column;
  79. gap: 5px;
  80. }
  81. #ui-bottom #hotbars #hotbar {
  82. position: unset;
  83. }
  84. @media (max-width: 1120px) {
  85. #custom-hotbar {
  86. width: 354px;
  87. }
  88. }
  89. /* ----------------------------------------- */
  90. /* Damage Log */
  91. /* ----------------------------------------- */
  92. nav.damage-log-nav.tabs {
  93. flex: 0;
  94. margin: 0px 2px;
  95. box-shadow: none;
  96. border: none;
  97. }
  98. nav.damage-log-nav.tabs .item {
  99. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  100. margin: 2px;
  101. color: white;
  102. border-radius: 3px;
  103. margin: 2px;
  104. border: none;
  105. }
  106. nav.damage-log-nav.tabs .item:hover {
  107. box-shadow: var(--gold-and-glow);
  108. background-color: var(--secondary);
  109. text-shadow: 0px 0px 3px black;
  110. border: none;
  111. border-radius: 3px;
  112. }
  113. nav.damage-log-nav.tabs .item.active {
  114. box-shadow: var(--gold-and-glow);
  115. background-color: var(--secondary-light);
  116. text-shadow: 0px 0px 3px black;
  117. border: none;
  118. border-radius: 3px;
  119. }
  120. #damage-log {
  121. margin-left: 4px;
  122. }
  123. .dorako-ui {
  124. /* Styling for damage messages */
  125. /* Styling for healing messages */
  126. /* Dim reverted damage */
  127. /* Dim reverted healing */
  128. }
  129. .dorako-ui.message.damage-log.damage {
  130. background-color: #ffd9d9;
  131. background-blend-mode: luminosity;
  132. }
  133. .dorako-ui.message.damage-log.healing {
  134. background-color: #d9ffd9;
  135. background-blend-mode: luminosity;
  136. }
  137. .dorako-ui.message.damage-log.reverted.damage {
  138. background-color: #ffeaea;
  139. background-blend-mode: luminosity;
  140. }
  141. .dorako-ui.message.damage-log.reverted.healing {
  142. background-color: #eaffea;
  143. background-blend-mode: luminosity;
  144. }
  145. [data-theme][data-color-scheme=dark] .dalvyn-journal:not(.premium) {
  146. --red: var(--primary-light);
  147. --blue: var(--secondary-light);
  148. --brown: #ad6f59;
  149. }
  150. [data-theme][data-color-scheme=dark].sheet.journal-entry .journal-entry-page :is(h1, h2, h3, h4, h5) {
  151. text-shadow: 0px 1px 1px black;
  152. }
  153. /* ----------------------------------------- */
  154. /* DFCE Rolltype Buttons */
  155. /* ----------------------------------------- */
  156. #chat-controls {
  157. padding: 0px;
  158. gap: var(--sidebar-gap);
  159. align-items: center;
  160. }
  161. #chat-controls .buttons {
  162. gap: var(--sidebar-gap);
  163. flex-wrap: nowrap;
  164. }
  165. #dorako-rt-buttons {
  166. flex: 1 0 170px;
  167. }
  168. #dorako-nonrt-buttons {
  169. flex: 1 1 30px !important;
  170. }
  171. #dorako-nonrt-buttons:empty {
  172. display: none;
  173. }
  174. #dorako-nonrt-buttons > button {
  175. flex: 1 1 32px;
  176. }
  177. [data-theme] #dorako-rt-buttons button {
  178. background: var(--app-background);
  179. border: var(--app-border-width) solid var(--app-border-color);
  180. text-shadow: var(--app-text-shadow);
  181. border-radius: var(--border-radius);
  182. box-shadow: var(--box-shadow);
  183. color: var(--text-color-3);
  184. background: var(--button-background);
  185. border: var(--app-border-width) solid var(--button-border-color);
  186. color: var(--button-text-color);
  187. box-shadow: var(--box-shadow);
  188. text-decoration: none;
  189. cursor: pointer;
  190. text-shadow: var(--app-text-shadow);
  191. }
  192. [data-theme] #dorako-rt-buttons button:not(.disabled, :disabled):hover {
  193. background: var(--button-hover-background);
  194. color: var(--button-hover-text-color);
  195. border: var(--app-border-width) solid var(--button-hover-border-color);
  196. box-shadow: var(--box-shadow);
  197. }
  198. [data-theme] #dorako-rt-buttons button.view, [data-theme] #dorako-rt-buttons button.selected, [data-theme] #dorako-rt-buttons button.active {
  199. background: var(--button-hover-background);
  200. outline: 1px solid var(--button-focus-outline-color);
  201. border-color: var(--button-hover-border-color);
  202. color: var(--button-hover-text-color);
  203. text-decoration: none !important;
  204. font-weight: unset !important;
  205. }
  206. [data-theme] #dorako-rt-buttons button.empty, [data-theme] #dorako-rt-buttons button.disabled, [data-theme] #dorako-rt-buttons button:disabled {
  207. --button-background: var(--button-disabled-background);
  208. --button-hover-background: var(--button-disabled-background);
  209. --button-border-color: var(--button-disabled-border-color);
  210. --button-text-color: var(--text-color-5);
  211. }
  212. [data-theme] #dorako-rt-buttons button.active {
  213. background-color: var(--color-primary-2);
  214. border: var(--app-border-width) solid;
  215. border-color: var(--app-border-color);
  216. }
  217. [data-theme] #dorako-nonrt-buttons button {
  218. background: var(--app-background);
  219. border: var(--app-border-width) solid var(--app-border-color);
  220. text-shadow: var(--app-text-shadow);
  221. border-radius: var(--border-radius);
  222. box-shadow: var(--box-shadow);
  223. color: var(--text-color-3);
  224. background: var(--button-background);
  225. border: var(--app-border-width) solid var(--button-border-color);
  226. color: var(--button-text-color);
  227. box-shadow: var(--box-shadow);
  228. text-decoration: none;
  229. cursor: pointer;
  230. text-shadow: var(--app-text-shadow);
  231. }
  232. [data-theme] #dorako-nonrt-buttons button:not(.disabled, :disabled):hover {
  233. background: var(--button-hover-background);
  234. color: var(--button-hover-text-color);
  235. border: var(--app-border-width) solid var(--button-hover-border-color);
  236. box-shadow: var(--box-shadow);
  237. }
  238. [data-theme] #dorako-nonrt-buttons button.view, [data-theme] #dorako-nonrt-buttons button.selected, [data-theme] #dorako-nonrt-buttons button.active {
  239. background: var(--button-hover-background);
  240. outline: 1px solid var(--button-focus-outline-color);
  241. border-color: var(--button-hover-border-color);
  242. color: var(--button-hover-text-color);
  243. text-decoration: none !important;
  244. font-weight: unset !important;
  245. }
  246. [data-theme] #dorako-nonrt-buttons button.empty, [data-theme] #dorako-nonrt-buttons button.disabled, [data-theme] #dorako-nonrt-buttons button:disabled {
  247. --button-background: var(--button-disabled-background);
  248. --button-hover-background: var(--button-disabled-background);
  249. --button-border-color: var(--button-disabled-border-color);
  250. --button-text-color: var(--text-color-5);
  251. }
  252. /* ----------------------------------------- */
  253. /* DFCE Chat Merge */
  254. /* ----------------------------------------- */
  255. .message.chat-message .message-delete {
  256. z-index: 1;
  257. }
  258. .message.chat-message.dfce-cm-top {
  259. border-bottom-style: none;
  260. border-bottom-left-radius: 0px;
  261. border-bottom-right-radius: 0px;
  262. margin-bottom: 0px;
  263. padding-bottom: 5px;
  264. }
  265. .message.chat-message.dfce-cm-middle, .message.chat-message.dfce-cm-bottom {
  266. position: relative;
  267. border-radius: 0px;
  268. margin-top: 0px !important;
  269. }
  270. .message.chat-message.dfce-cm-middle .message-content, .message.chat-message.dfce-cm-bottom .message-content {
  271. padding-right: 0px;
  272. }
  273. .message.chat-message.dfce-cm-middle .sender-wrapper,
  274. .message.chat-message.dfce-cm-middle .portrait-and-name, .message.chat-message.dfce-cm-bottom .sender-wrapper,
  275. .message.chat-message.dfce-cm-bottom .portrait-and-name {
  276. display: none;
  277. }
  278. .message.chat-message.dfce-cm-middle .message-header, .message.chat-message.dfce-cm-bottom .message-header {
  279. background: transparent !important;
  280. box-shadow: none;
  281. margin: 0px;
  282. padding: 0px;
  283. }
  284. .message.chat-message.dfce-cm-middle:not(:hover).header-meta, .message.chat-message.dfce-cm-bottom:not(:hover).header-meta {
  285. display: none;
  286. }
  287. .message.chat-message.dfce-cm-middle {
  288. margin-top: 0px;
  289. margin-bottom: 0px;
  290. padding-top: 0px;
  291. padding-bottom: 5px;
  292. }
  293. .message.chat-message.dfce-cm-bottom {
  294. margin-top: 0px;
  295. padding-top: 0px;
  296. border-radius: 0px 0px 5px 5px;
  297. }
  298. .dfce-cm-middle .dorako-header,
  299. .dfce-cm-bottom .dorako-header {
  300. display: none;
  301. }
  302. .dfce-cm-middle:hover .dorako-header,
  303. .dfce-cm-bottom:hover .dorako-header {
  304. display: block;
  305. position: absolute;
  306. right: 0px;
  307. top: 3px;
  308. width: fit-content;
  309. background: none !important;
  310. box-shadow: none !important;
  311. z-index: 1;
  312. }
  313. .dfce-cm-middle:hover .dorako-header .portrait-and-name,
  314. .dfce-cm-bottom:hover .dorako-header .portrait-and-name {
  315. display: none !important;
  316. }
  317. /* ----------------------------------------- */
  318. /* Dice Tray */
  319. /* ----------------------------------------- */
  320. [data-theme] .dice-tray {
  321. display: flex;
  322. flex-direction: column;
  323. gap: var(--sidebar-gap);
  324. }
  325. [data-theme] .dice-tray > * {
  326. margin: 0 var(--sidebar-margin);
  327. }
  328. [data-theme] .dice-tray .flexrow {
  329. gap: var(--sidebar-gap);
  330. }
  331. [data-theme] .dice-tray .dice-tray__stacked button:first-child {
  332. border-bottom-left-radius: 0px;
  333. border-bottom-right-radius: 0px;
  334. }
  335. [data-theme] .dice-tray .dice-tray__stacked button:last-child {
  336. border-top-left-radius: 0px;
  337. border-top-right-radius: 0px;
  338. }
  339. [data-theme] .dice-tray button {
  340. background: var(--app-background);
  341. border: var(--app-border-width) solid var(--app-border-color);
  342. text-shadow: var(--app-text-shadow);
  343. border-radius: var(--border-radius);
  344. box-shadow: var(--box-shadow);
  345. color: var(--text-color-3);
  346. background: var(--button-background);
  347. border: var(--app-border-width) solid var(--button-border-color);
  348. color: var(--button-text-color);
  349. box-shadow: var(--box-shadow);
  350. text-decoration: none;
  351. cursor: pointer;
  352. text-shadow: var(--app-text-shadow);
  353. }
  354. [data-theme] .dice-tray button:not(.disabled, :disabled):hover {
  355. background: var(--button-hover-background);
  356. color: var(--button-hover-text-color);
  357. border: var(--app-border-width) solid var(--button-hover-border-color);
  358. box-shadow: var(--box-shadow);
  359. }
  360. [data-theme] .dice-tray button.view, [data-theme] .dice-tray button.selected, [data-theme] .dice-tray button.active {
  361. background: var(--button-hover-background);
  362. outline: 1px solid var(--button-focus-outline-color);
  363. border-color: var(--button-hover-border-color);
  364. color: var(--button-hover-text-color);
  365. text-decoration: none !important;
  366. font-weight: unset !important;
  367. }
  368. [data-theme] .dice-tray button.empty, [data-theme] .dice-tray button.disabled, [data-theme] .dice-tray button:disabled {
  369. --button-background: var(--button-disabled-background);
  370. --button-hover-background: var(--button-disabled-background);
  371. --button-border-color: var(--button-disabled-border-color);
  372. --button-text-color: var(--text-color-5);
  373. }
  374. [data-theme] .dice-tray button div.dice {
  375. background-color: var(--text-color-3);
  376. }
  377. [data-theme] .dice-tray button:hover div.dice {
  378. background-color: var(--text-color-1);
  379. }
  380. [data-theme] .dice-tray .dice-tray__buttons {
  381. height: 32px;
  382. }
  383. [data-theme] .dice-tray .dice-tray__buttons button {
  384. width: auto;
  385. }
  386. [data-theme] .dice-tray .dice-tray__buttons button > svg {
  387. margin: 0px -10px;
  388. filter: drop-shadow(0px 1px 2px black);
  389. }
  390. [data-theme] .dice-tray .dice-tray__buttons button > svg * {
  391. fill: var(--text-color-3);
  392. }
  393. [data-theme] .dice-tray .dice-tray__buttons button.dice-tray__advantage:hover svg, [data-theme] .dice-tray .dice-tray__buttons button.dice-tray__disadvantage:hover svg, [data-theme] .dice-tray .dice-tray__buttons button.dice-tray__roll:hover svg, [data-theme] .dice-tray .dice-tray__buttons button.dice-tray__math--add:hover svg, [data-theme] .dice-tray .dice-tray__buttons button.dice-tray__math--sub:hover svg, [data-theme] .dice-tray .dice-tray__buttons button:hover svg {
  394. filter: drop-shadow(0px 1px 2px black);
  395. }
  396. [data-theme] .dice-tray .dice-tray__buttons button.dice-tray__advantage:hover svg *, [data-theme] .dice-tray .dice-tray__buttons button.dice-tray__disadvantage:hover svg *, [data-theme] .dice-tray .dice-tray__buttons button.dice-tray__roll:hover svg *, [data-theme] .dice-tray .dice-tray__buttons button.dice-tray__math--add:hover svg *, [data-theme] .dice-tray .dice-tray__buttons button.dice-tray__math--sub:hover svg *, [data-theme] .dice-tray .dice-tray__buttons button:hover svg * {
  397. fill: var(--text-color-1);
  398. }
  399. [data-theme] .dice-tray input[type=text] {
  400. background: var(--input-background);
  401. border: var(--app-border-width) solid;
  402. border-color: var(--input-border-color) !important;
  403. color: var(--input-text-color);
  404. box-shadow: var(--input-box-shadow) !important;
  405. align-items: center;
  406. border-radius: 4px;
  407. outline: 1px solid transparent;
  408. user-select: text;
  409. transition: outline-color 0.5s;
  410. height: auto !important;
  411. border-radius: var(--border-radius);
  412. }
  413. [data-theme] .dice-tray input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme] .dice-tray input[type=text]:focus {
  414. outline: 1px solid var(--input-focus-outline-color);
  415. border: var(--app-border-width) solid;
  416. border-color: var(--input-border-color);
  417. color: var(--input-focus-text-color);
  418. box-shadow: var(--box-shadow);
  419. }
  420. [data-theme] .dice-tray input[type=text].disabled, [data-theme] .dice-tray input[type=text]:disabled {
  421. --input-text-color: var(--text-color-disabled);
  422. --input-background: var(--input-disabled-background);
  423. --input-border-color: var(--input-disabled-border-color);
  424. }
  425. [data-theme] .dice-tray input[type=text].disabled::placeholder, [data-theme] .dice-tray input[type=text]:disabled::placeholder {
  426. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  427. }
  428. [data-theme] .dice-tray input[type=text]::placeholder {
  429. color: var(--input-placeholder-color);
  430. }
  431. [data-theme] .dice-tray input[type=text][type=checkbox] {
  432. outline: unset !important;
  433. border: unset !important;
  434. box-shadow: unset !important;
  435. }
  436. /* ----------------------------------------- */
  437. /* Enhanced Terrain Layer */
  438. /* ----------------------------------------- */
  439. #controls ol.control-tools.sub-controls {
  440. margin-right: 0px;
  441. }
  442. #controls ol.control-tools#terrainlayer-tools {
  443. margin-top: 44px;
  444. }
  445. #controls ol.control-tools#terrainlayer-tools .control-tool {
  446. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  447. border: none;
  448. border-radius: var(--border-radius);
  449. background: none;
  450. background-color: var(--glass-bg);
  451. box-shadow: var(--glassy);
  452. }
  453. #controls ol.control-tools#terrainlayer-tools .control-tool:not(#tl-defaultcost):hover {
  454. background-color: rgba(177, 177, 177, 0.5);
  455. color: black;
  456. }
  457. #controls ol.control-tools#terrainlayer-tools .control-tool:not(#tl-defaultcost):hover button.control-btn:hover {
  458. border-radius: 3px;
  459. color: black;
  460. text-shadow: 0 0 3px var(--color-text-light-highlight);
  461. box-shadow: none;
  462. }
  463. [data-theme] .implement-button-region {
  464. gap: 5px;
  465. margin-top: 5px;
  466. }
  467. [data-theme] .implement-button-region button {
  468. background: var(--app-background);
  469. border: var(--app-border-width) solid var(--app-border-color);
  470. text-shadow: var(--app-text-shadow);
  471. border-radius: var(--border-radius);
  472. box-shadow: var(--box-shadow);
  473. color: var(--text-color-3);
  474. background: var(--button-background);
  475. border: var(--app-border-width) solid var(--button-border-color);
  476. color: var(--button-text-color);
  477. box-shadow: var(--box-shadow);
  478. text-decoration: none;
  479. cursor: pointer;
  480. text-shadow: var(--app-text-shadow);
  481. }
  482. [data-theme] .implement-button-region button:not(.disabled, :disabled):hover {
  483. background: var(--button-hover-background);
  484. color: var(--button-hover-text-color);
  485. border: var(--app-border-width) solid var(--button-hover-border-color);
  486. box-shadow: var(--box-shadow);
  487. }
  488. [data-theme] .implement-button-region button.view, [data-theme] .implement-button-region button.selected, [data-theme] .implement-button-region button.active {
  489. background: var(--button-hover-background);
  490. outline: 1px solid var(--button-focus-outline-color);
  491. border-color: var(--button-hover-border-color);
  492. color: var(--button-hover-text-color);
  493. text-decoration: none !important;
  494. font-weight: unset !important;
  495. }
  496. [data-theme] .implement-button-region button.empty, [data-theme] .implement-button-region button.disabled, [data-theme] .implement-button-region button:disabled {
  497. --button-background: var(--button-disabled-background);
  498. --button-hover-background: var(--button-disabled-background);
  499. --button-border-color: var(--button-disabled-border-color);
  500. --button-text-color: var(--text-color-5);
  501. }
  502. [data-theme] .actions-panel > fieldset {
  503. border: 1px solid var(--fieldset-border-color) !important;
  504. background-color: var(--fieldset-background-color);
  505. font-family: var(--font-primary);
  506. }
  507. [data-theme] .actions-panel > fieldset > legend {
  508. color: var(--fieldset-legend-color);
  509. }
  510. [data-theme] .actions-panel > fieldset button {
  511. background: var(--app-background);
  512. border: var(--app-border-width) solid var(--app-border-color);
  513. text-shadow: var(--app-text-shadow);
  514. border-radius: var(--border-radius);
  515. box-shadow: var(--box-shadow);
  516. color: var(--text-color-3);
  517. background: var(--button-background);
  518. border: var(--app-border-width) solid var(--button-border-color);
  519. color: var(--button-text-color);
  520. box-shadow: var(--box-shadow);
  521. text-decoration: none;
  522. cursor: pointer;
  523. text-shadow: var(--app-text-shadow);
  524. }
  525. [data-theme] .actions-panel > fieldset button:not(.disabled, :disabled):hover {
  526. background: var(--button-hover-background);
  527. color: var(--button-hover-text-color);
  528. border: var(--app-border-width) solid var(--button-hover-border-color);
  529. box-shadow: var(--box-shadow);
  530. }
  531. [data-theme] .actions-panel > fieldset button.view, [data-theme] .actions-panel > fieldset button.selected, [data-theme] .actions-panel > fieldset button.active {
  532. background: var(--button-hover-background);
  533. outline: 1px solid var(--button-focus-outline-color);
  534. border-color: var(--button-hover-border-color);
  535. color: var(--button-hover-text-color);
  536. text-decoration: none !important;
  537. font-weight: unset !important;
  538. }
  539. [data-theme] .actions-panel > fieldset button.empty, [data-theme] .actions-panel > fieldset button.disabled, [data-theme] .actions-panel > fieldset button:disabled {
  540. --button-background: var(--button-disabled-background);
  541. --button-hover-background: var(--button-disabled-background);
  542. --button-border-color: var(--button-disabled-border-color);
  543. --button-text-color: var(--text-color-5);
  544. }
  545. [data-theme] .dropboxes > .dropbox > span {
  546. border: unset !important;
  547. }
  548. [data-theme] .dropboxes > .dropbox > span > img {
  549. background: var(--app-background);
  550. border: var(--app-border-width) solid var(--app-border-color);
  551. text-shadow: var(--app-text-shadow);
  552. border-radius: var(--border-radius);
  553. box-shadow: var(--box-shadow);
  554. color: var(--text-color-3);
  555. border: 1px solid var(--icon-border-color);
  556. }
  557. [data-theme] img[src$="chosen-implement.webp"] {
  558. background: none !important;
  559. box-shadow: none !important;
  560. }
  561. [data-theme][data-color-scheme=dark] img[src$="chosen-implement.webp"] {
  562. filter: invert(1);
  563. }
  564. /* ----------------------------------------- */
  565. /* Ripper's Filepicker+ */
  566. /* ----------------------------------------- */
  567. .filepicker-plus-tooltip {
  568. border: none;
  569. border-radius: var(--border-radius);
  570. background: none;
  571. background-color: var(--glass-bg);
  572. box-shadow: var(--glassy);
  573. border: none;
  574. backdrop-filter: blur(5px);
  575. }
  576. #sidebar .app.window-app.filepicker {
  577. margin: 0px;
  578. }
  579. #sidebar .filepicker .window-content {
  580. border: none;
  581. margin: 2px;
  582. /* prettier-ignore */
  583. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px var(--gold-brown);
  584. background-image: var(--sheet);
  585. background-size: cover;
  586. background-image: var(--sheet-dark);
  587. height: calc(100% - 5px);
  588. }
  589. [data-theme]#forien-quest-log nav.tabs, [data-theme].window-app.forien-quest-preview nav.tabs {
  590. background: unset;
  591. }
  592. [data-theme]#forien-quest-log nav.tabs .item.active, [data-theme]#forien-quest-log nav.tabs .item.active:hover, [data-theme].window-app.forien-quest-preview nav.tabs .item.active, [data-theme].window-app.forien-quest-preview nav.tabs .item.active:hover {
  593. font-weight: unset;
  594. color: var(--text-color-1);
  595. text-shadow: 0px 1px 2px black;
  596. }
  597. [data-theme]#forien-quest-log nav.tabs .item:hover, [data-theme].window-app.forien-quest-preview nav.tabs .item:hover {
  598. text-shadow: 0px 1px 2px black;
  599. }
  600. [data-theme]#forien-quest-log .quest-log.bookmarks nav.log-tabs .item {
  601. background: var(--app-background);
  602. border: var(--app-border-width) solid var(--app-border-color);
  603. text-shadow: var(--app-text-shadow);
  604. border-radius: var(--border-radius);
  605. box-shadow: var(--box-shadow);
  606. color: var(--text-color-3);
  607. background: var(--app-background) !important;
  608. border-radius: var(--border-radius) 0 0 var(--border-radius);
  609. border-right: 1px solid transparent;
  610. margin: 0 6px 8px;
  611. }
  612. [data-theme]#forien-quest-log .quest-log.bookmarks nav.log-tabs .item:hover, [data-theme]#forien-quest-log .quest-log.bookmarks nav.log-tabs .item.active {
  613. font-weight: unset;
  614. border-right: 1px solid transparent;
  615. border-color: var(--color-primary-1);
  616. background: var(--color-primary-2) !important;
  617. color: var(--text-color-1);
  618. }
  619. [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .delete-splash, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .change-splash-pos, [data-theme].window-app.forien-quest-preview .quest-body .details-header .quest-giver-gc .deleteQuestGiver {
  620. background: var(--app-background);
  621. border: var(--app-border-width) solid var(--app-border-color);
  622. text-shadow: var(--app-text-shadow);
  623. border-radius: var(--border-radius);
  624. box-shadow: var(--box-shadow);
  625. color: var(--text-color-3);
  626. background: var(--button-background);
  627. border: var(--app-border-width) solid var(--button-border-color);
  628. color: var(--button-text-color);
  629. box-shadow: var(--box-shadow);
  630. text-decoration: none;
  631. cursor: pointer;
  632. text-shadow: var(--app-text-shadow);
  633. }
  634. [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .delete-splash:not(.disabled, :disabled):hover, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .change-splash-pos:not(.disabled, :disabled):hover, [data-theme].window-app.forien-quest-preview .quest-body .details-header .quest-giver-gc .deleteQuestGiver:not(.disabled, :disabled):hover {
  635. background: var(--button-hover-background);
  636. color: var(--button-hover-text-color);
  637. border: var(--app-border-width) solid var(--button-hover-border-color);
  638. box-shadow: var(--box-shadow);
  639. }
  640. [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .delete-splash.view, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .delete-splash.selected, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .delete-splash.active, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .change-splash-pos.view, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .change-splash-pos.selected, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .change-splash-pos.active, [data-theme].window-app.forien-quest-preview .quest-body .details-header .quest-giver-gc .deleteQuestGiver.view, [data-theme].window-app.forien-quest-preview .quest-body .details-header .quest-giver-gc .deleteQuestGiver.selected, [data-theme].window-app.forien-quest-preview .quest-body .details-header .quest-giver-gc .deleteQuestGiver.active {
  641. background: var(--button-hover-background);
  642. outline: 1px solid var(--button-focus-outline-color);
  643. border-color: var(--button-hover-border-color);
  644. color: var(--button-hover-text-color);
  645. text-decoration: none !important;
  646. font-weight: unset !important;
  647. }
  648. [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .delete-splash.empty, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .delete-splash.disabled, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .delete-splash:disabled, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .change-splash-pos.empty, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .change-splash-pos.disabled, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .change-splash-pos:disabled, [data-theme].window-app.forien-quest-preview .quest-body .details-header .quest-giver-gc .deleteQuestGiver.empty, [data-theme].window-app.forien-quest-preview .quest-body .details-header .quest-giver-gc .deleteQuestGiver.disabled, [data-theme].window-app.forien-quest-preview .quest-body .details-header .quest-giver-gc .deleteQuestGiver:disabled {
  649. --button-background: var(--button-disabled-background);
  650. --button-hover-background: var(--button-disabled-background);
  651. --button-border-color: var(--button-disabled-border-color);
  652. --button-text-color: var(--text-color-5);
  653. }
  654. [data-theme]#forien-quest-log .editor, [data-theme].window-app.forien-quest-preview .editor {
  655. background: var(--color-secondary-4);
  656. border: 1px solid var(--color-secondary-3);
  657. }
  658. [data-theme]#forien-quest-log .editor .editor-content, [data-theme].window-app.forien-quest-preview .editor .editor-content {
  659. color: var(--text-color-3);
  660. }
  661. [data-theme]#forien-quest-log .editor .tox.tox-tinymce, [data-theme].window-app.forien-quest-preview .editor .tox.tox-tinymce {
  662. background: white;
  663. }
  664. [data-theme]#forien-quest-log .quest-log .table ul li.drag-quest, [data-theme].window-app.forien-quest-preview .quest-body .details-header .quest-giver-gc .drop-info, [data-theme].window-app.forien-quest-preview .quest-body .management .quest-splash .drop-info, [data-theme].window-app.forien-quest-preview .quest-body .details-header .quest-setup section, [data-theme].window-app.forien-quest-preview .quest-body .management .subquests .subquests-box li, [data-theme].window-app.forien-quest-preview .quest-body .quest-info .quest-col-right .quest-rewards ul li, [data-theme].window-app.forien-quest-preview .quest-body .quest-info .quest-col-right .quest-tasks ul li {
  665. background: var(--app-background);
  666. border: var(--app-border-width) solid var(--app-border-color);
  667. text-shadow: var(--app-text-shadow);
  668. border-radius: var(--border-radius);
  669. box-shadow: var(--box-shadow);
  670. color: var(--text-color-3);
  671. border-color: var(--scrollbar-thumb-border-color);
  672. background: var(--color-primary-3);
  673. }
  674. [data-theme]#forien-quest-log .actions i, [data-theme].window-app.forien-quest-preview .actions i {
  675. color: var(--text-color-2);
  676. }
  677. [data-theme]#forien-quest-log .actions i:hover, [data-theme].window-app.forien-quest-preview .actions i:hover {
  678. color: var(--color-primary-1);
  679. }
  680. .clock-panel {
  681. z-index: 1;
  682. right: 5px;
  683. }
  684. .clock-panel .clock-entry {
  685. border: none;
  686. border-radius: var(--border-radius);
  687. background: none;
  688. background-color: var(--glass-bg);
  689. box-shadow: var(--glassy);
  690. }
  691. .clock-panel .clock-entry .clock {
  692. background: conic-gradient(var(--secondary-light) var(--filled-ratio), white var(--filled-ratio) 1turn);
  693. }
  694. .clock-panel [data-action=add-clock] {
  695. border: none;
  696. border-radius: var(--border-radius);
  697. background: none;
  698. background-color: var(--glass-bg);
  699. box-shadow: var(--glassy);
  700. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  701. margin: unset;
  702. }
  703. .clock-panel [data-action=add-clock]:hover {
  704. background-color: var(--primary);
  705. }
  706. .clock-panel.bottom {
  707. bottom: 5px;
  708. }
  709. .item-piles-player-list-trade-button {
  710. border: none;
  711. border-radius: var(--border-radius);
  712. background: none;
  713. background-color: var(--glass-bg);
  714. box-shadow: var(--glassy);
  715. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  716. background-color: var(--glass-bg-light);
  717. }
  718. .item-piles-player-list-trade-button:hover {
  719. border: none;
  720. border-radius: var(--border-radius);
  721. background: none;
  722. background-color: var(--glass-bg);
  723. box-shadow: var(--glassy);
  724. }
  725. .item-piles-img-container {
  726. border: none;
  727. margin: 2px;
  728. /* prettier-ignore */
  729. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px var(--gold-brown);
  730. border-radius: 3px;
  731. margin: 3px;
  732. }
  733. .item-piles-app {
  734. --item-piles-even-color: #7a79717a;
  735. --item-piles-shadow-primary: var(--color-shadow-primary);
  736. }
  737. .dorako-ui.dark-theme {
  738. --color-text-dark-secondary: #a9a798;
  739. --item-piles-minor-inactive: rgb(15, 15, 15);
  740. --item-piles-text-light-highlight: rgb(70, 70, 70);
  741. }
  742. .dorako-ui.dark-theme .item.active.underscore.item-piles-flexrow.item-piles-clickable-link {
  743. border-bottom: 2px solid var(--tertiary-dark);
  744. }
  745. [data-theme] {
  746. --item-piles-minor-inactive: var(--color-primary-3);
  747. --item-piles-even-color: color-mix(in srgb, var(--color-secondary-3) 20%, transparent);
  748. --item-piles-border-light-primary: var(--color-secondary-3);
  749. }
  750. [data-theme] .item-piles-chat-card li img,
  751. [data-theme] .item-piles-img-container {
  752. background: var(--app-background);
  753. border: var(--app-border-width) solid var(--app-border-color);
  754. text-shadow: var(--app-text-shadow);
  755. border-radius: var(--border-radius);
  756. box-shadow: var(--box-shadow);
  757. color: var(--text-color-3);
  758. border: 1px solid;
  759. border-color: var(--icon-border-color);
  760. }
  761. [data-theme] .item-piles-player-list-trade-button {
  762. background: var(--app-background);
  763. border: var(--app-border-width) solid var(--app-border-color);
  764. text-shadow: var(--app-text-shadow);
  765. border-radius: var(--border-radius);
  766. box-shadow: var(--box-shadow);
  767. color: var(--text-color-3);
  768. background: var(--button-background);
  769. border: var(--app-border-width) solid var(--button-border-color);
  770. color: var(--button-text-color);
  771. box-shadow: var(--box-shadow);
  772. text-decoration: none;
  773. cursor: pointer;
  774. text-shadow: var(--app-text-shadow);
  775. }
  776. [data-theme] .item-piles-player-list-trade-button:not(.disabled, :disabled):hover {
  777. background: var(--button-hover-background);
  778. color: var(--button-hover-text-color);
  779. border: var(--app-border-width) solid var(--button-hover-border-color);
  780. box-shadow: var(--box-shadow);
  781. }
  782. [data-theme] .item-piles-player-list-trade-button.view, [data-theme] .item-piles-player-list-trade-button.selected, [data-theme] .item-piles-player-list-trade-button.active {
  783. background: var(--button-hover-background);
  784. outline: 1px solid var(--button-focus-outline-color);
  785. border-color: var(--button-hover-border-color);
  786. color: var(--button-hover-text-color);
  787. text-decoration: none !important;
  788. font-weight: unset !important;
  789. }
  790. [data-theme] .item-piles-player-list-trade-button.empty, [data-theme] .item-piles-player-list-trade-button.disabled, [data-theme] .item-piles-player-list-trade-button:disabled {
  791. --button-background: var(--button-disabled-background);
  792. --button-hover-background: var(--button-disabled-background);
  793. --button-border-color: var(--button-disabled-border-color);
  794. --button-text-color: var(--text-color-5);
  795. }
  796. [data-theme] .item-piles-config-container nav {
  797. margin-top: 2px;
  798. }
  799. [data-theme][data-color-scheme=dark] {
  800. --item-piles-border-light-primary: rgba(255, 255, 255, 0.2);
  801. --item-piles-text-light-highlight: rgba(255, 255, 255, 0.3);
  802. }
  803. /* ----------------------------------------- */
  804. /* Koboldworks turn announcer */
  805. /* ----------------------------------------- */
  806. .chat-message[data-message-id].koboldworks.round-cycling h3.round-message {
  807. margin-left: 17px;
  808. gap: 20px;
  809. }
  810. .chat-message[data-message-id].koboldworks.turn-announcer.obfuscated {
  811. border: none;
  812. margin: 2px;
  813. /* prettier-ignore */
  814. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px var(--gold-brown);
  815. background-image: var(--sheet);
  816. background-size: cover;
  817. background-size: cover;
  818. background-blend-mode: luminosity;
  819. background-color: var(--blind-bg);
  820. }
  821. .chat-message[data-message-id].koboldworks.turn-announcer.obfuscated.dorako-ui.dark-theme {
  822. background: var(--sheet-dark);
  823. background-size: cover;
  824. background-blend-mode: luminosity;
  825. background-color: var(--blind-bg);
  826. }
  827. /* ----------------------------------------- */
  828. /* Condition Manager */
  829. /* ----------------------------------------- */
  830. .window-app[data-theme] .window-content .dialog-content .cond-cont {
  831. background: none;
  832. }
  833. .window-app[data-theme] .window-content .dialog-content .cond-cont .cond-butt-set {
  834. display: flex;
  835. }
  836. .window-app[data-theme] .window-content .dialog-content .cond-cont button {
  837. box-shadow: unset;
  838. }
  839. .window-app[data-theme] .window-content .dialog-content .cond-cont .cond-buttons,
  840. .window-app[data-theme] .window-content .dialog-content .cond-cont .cond-buttons:focus {
  841. width: 100%;
  842. }
  843. .window-app[data-theme] .window-content .dialog-content .cond-cont .cond-buttons-small,
  844. .window-app[data-theme] .window-content .dialog-content .cond-cont .cond-buttons-small:focus {
  845. width: 13%;
  846. }
  847. /* ----------------------------------------- */
  848. /* Basic Action Macros (BAM) */
  849. /* ----------------------------------------- */
  850. [data-theme] .action-list button {
  851. --button-text-color: white !important;
  852. }
  853. [data-theme] .action-list button img {
  854. border: 1px solid var(--icon-border-color);
  855. border-radius: var(--border-radius);
  856. }
  857. [data-theme] .action-list button:hover {
  858. text-shadow: 0px 1px 2px black;
  859. }
  860. [data-theme] .action-list button.glow {
  861. filter: brightness(1.1);
  862. }
  863. /* ----------------------------------------- */
  864. /* Dice Stats */
  865. /* ----------------------------------------- */
  866. /* ----------------------------------------- */
  867. /* Pin Cushion */
  868. /* ----------------------------------------- */
  869. .pin-cushion-hud-tooltip-default {
  870. border: none;
  871. border-radius: var(--border-radius);
  872. background: none;
  873. background-color: var(--glass-bg);
  874. box-shadow: var(--glassy);
  875. backdrop-filter: blur(5px);
  876. text-shadow: 0px 0px 3px black;
  877. }
  878. #powerTip:before {
  879. color: var(--glass-bg);
  880. }
  881. /* ----------------------------------------- */
  882. /* Illandril's Token Tooltips */
  883. /* ----------------------------------------- */
  884. .illandril-token-tooltips--tooltip {
  885. border: none;
  886. border-radius: var(--border-radius);
  887. background: none;
  888. background-color: var(--glass-bg);
  889. box-shadow: var(--glassy);
  890. backdrop-filter: blur(5px);
  891. text-shadow: 0px 0px 3px black;
  892. color: var(--color-text-light-highlight);
  893. font-size: 1rem;
  894. }
  895. .illandril-token-tooltips--tooltip .illandril-token-tooltips--name {
  896. color: var(--color-text-light-highlight);
  897. font-family: var(--font-primary);
  898. font-size: 1.25rem;
  899. padding: 4px 8px;
  900. }
  901. /* ----------------------------------------- */
  902. /* Heartbeat */
  903. /* ----------------------------------------- */
  904. button#heartbeat-button {
  905. box-shadow: unset;
  906. }
  907. #module-credits-copy-export {
  908. background: none !important;
  909. }
  910. [data-theme]#module-management .package-list .package .package-overview .tag.expand {
  911. background: var(--app-background);
  912. border: var(--app-border-width) solid var(--app-border-color);
  913. text-shadow: var(--app-text-shadow);
  914. border-radius: var(--border-radius);
  915. box-shadow: var(--box-shadow);
  916. color: var(--text-color-3);
  917. background: var(--button-background);
  918. border: var(--app-border-width) solid var(--button-border-color);
  919. color: var(--button-text-color);
  920. box-shadow: var(--box-shadow);
  921. text-decoration: none;
  922. cursor: pointer;
  923. text-shadow: var(--app-text-shadow);
  924. }
  925. [data-theme]#module-management .package-list .package .package-overview .tag.expand:not(.disabled, :disabled):hover {
  926. background: var(--button-hover-background);
  927. color: var(--button-hover-text-color);
  928. border: var(--app-border-width) solid var(--button-hover-border-color);
  929. box-shadow: var(--box-shadow);
  930. }
  931. [data-theme]#module-management .package-list .package .package-overview .tag.expand.view, [data-theme]#module-management .package-list .package .package-overview .tag.expand.selected, [data-theme]#module-management .package-list .package .package-overview .tag.expand.active {
  932. background: var(--button-hover-background);
  933. outline: 1px solid var(--button-focus-outline-color);
  934. border-color: var(--button-hover-border-color);
  935. color: var(--button-hover-text-color);
  936. text-decoration: none !important;
  937. font-weight: unset !important;
  938. }
  939. [data-theme]#module-management .package-list .package .package-overview .tag.expand.empty, [data-theme]#module-management .package-list .package .package-overview .tag.expand.disabled, [data-theme]#module-management .package-list .package .package-overview .tag.expand:disabled {
  940. --button-background: var(--button-disabled-background);
  941. --button-hover-background: var(--button-disabled-background);
  942. --button-border-color: var(--button-disabled-border-color);
  943. --button-text-color: var(--text-color-5);
  944. }
  945. [data-theme] .package-list .package .tag {
  946. background: var(--color-secondary-4);
  947. border: 1px solid var(--color-secondary-3);
  948. color: var(--text-color-2);
  949. }
  950. /* ----------------------------------------- */
  951. /* Monarch */
  952. /* ----------------------------------------- */
  953. .window-app.monarch .window-content {
  954. box-shadow: none;
  955. background: none;
  956. }
  957. .window-app.monarch-hand:not(.minimized).no-fade.trans,
  958. .window-app.monarch-hand:not(.minimized):hover.trans {
  959. border: none;
  960. border-radius: var(--border-radius);
  961. background: none;
  962. background-color: var(--glass-bg);
  963. box-shadow: var(--glassy);
  964. backdrop-filter: blur(5px);
  965. }
  966. .window-app.monarch-hand .window-header,
  967. .monarch-hand footer.sheet-footer {
  968. border: none;
  969. border-radius: var(--border-radius);
  970. background: none;
  971. background-color: var(--glass-bg);
  972. box-shadow: var(--glassy);
  973. }
  974. .monarch .card-hud .controls a i {
  975. color: var(--color-text-light-heading);
  976. }
  977. .monarch input[type=text],
  978. .monarch input[type=number],
  979. .monarch input[type=password],
  980. .monarch input[type=date],
  981. .monarch input[type=time] {
  982. border: none;
  983. outline: 1px solid rgba(255, 255, 255, 0.1);
  984. border-radius: 2px;
  985. color: var(--color-text-light-heading);
  986. }
  987. .monarch-hand footer.sheet-footer {
  988. margin: 2px 10px;
  989. }
  990. .monarch-hand footer.sheet-footer button {
  991. border: none;
  992. border-radius: var(--border-radius);
  993. background: none;
  994. background-color: var(--glass-bg);
  995. box-shadow: var(--glassy);
  996. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  997. color: var(--color-text-light-heading);
  998. text-shadow: 0px 0px 3px black;
  999. }
  1000. .monarch-hand footer.sheet-footer button:hover {
  1001. color: var(--color-text-light-highlight);
  1002. background-color: var(--primary);
  1003. }
  1004. .monarch .card-hud .badge,
  1005. .monarch .card-hud .card-controls {
  1006. border: none;
  1007. border-radius: var(--border-radius);
  1008. background: none;
  1009. background-color: var(--glass-bg);
  1010. box-shadow: var(--glassy);
  1011. }
  1012. .monarch-hand .tooltip {
  1013. border: none;
  1014. border-radius: var(--border-radius);
  1015. background: none;
  1016. background-color: var(--glass-bg);
  1017. box-shadow: var(--glassy);
  1018. backdrop-filter: blur(5px);
  1019. }
  1020. .window-app.monarch.trans {
  1021. box-shadow: unset;
  1022. backdrop-filter: unset;
  1023. }
  1024. [data-theme].window-app.monarch-hand .window-header, [data-theme].monarch-hand footer.sheet-footer, [data-theme].monarch-hand footer.sheet-footer button, [data-theme].monarch .card-hud .badge, [data-theme].monarch .card-hud .card-controls, [data-theme].monarch-hand .tooltip {
  1025. background: var(--app-background);
  1026. border: var(--app-border-width) solid var(--app-border-color);
  1027. text-shadow: var(--app-text-shadow);
  1028. border-radius: var(--border-radius);
  1029. box-shadow: var(--box-shadow);
  1030. color: var(--text-color-3);
  1031. }
  1032. /* ----------------------------------------- */
  1033. /* General?? */
  1034. /* ----------------------------------------- */
  1035. [data-theme].monks-active-tiles.sheet .items-list .item-header {
  1036. border: none;
  1037. background: none;
  1038. }
  1039. /* ----------------------------------------- */
  1040. /* Monk's Common Display */
  1041. /* ----------------------------------------- */
  1042. #common-display-toolbar.dorako-ui {
  1043. border: none;
  1044. border-radius: var(--border-radius);
  1045. background: none;
  1046. background-color: var(--glass-bg);
  1047. box-shadow: var(--glassy);
  1048. }
  1049. #common-display-toolbar.dorako-ui .move-handle {
  1050. border: none;
  1051. border-radius: var(--border-radius);
  1052. background: none;
  1053. background-color: var(--glass-bg);
  1054. box-shadow: var(--glassy);
  1055. border-radius: 5px 0px 0px 5px;
  1056. }
  1057. #common-display-toolbar.dorako-ui .common-display-button.small {
  1058. border: none;
  1059. border-radius: var(--border-radius);
  1060. background: none;
  1061. background-color: var(--glass-bg);
  1062. box-shadow: var(--glassy);
  1063. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  1064. text-shadow: 0px 0px 3px black;
  1065. }
  1066. #common-display-toolbar.dorako-ui .common-display-button.small:hover {
  1067. background-color: var(--primary);
  1068. }
  1069. #common-display-toolbar.dorako-ui .common-display-button.toggle {
  1070. border: none;
  1071. border-radius: var(--border-radius);
  1072. background: none;
  1073. background-color: var(--glass-bg);
  1074. box-shadow: var(--glassy);
  1075. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  1076. background-color: var(--secondary-dark);
  1077. text-shadow: 0px 0px 3px black;
  1078. }
  1079. #common-display-toolbar.dorako-ui .common-display-button.toggle:hover, #common-display-toolbar.dorako-ui .common-display-button.toggle.active {
  1080. border: none;
  1081. border-radius: var(--border-radius);
  1082. background: none;
  1083. background-color: var(--glass-bg);
  1084. box-shadow: var(--glassy);
  1085. background-color: var(--secondary-light);
  1086. }
  1087. /* ----------------------------------------- */
  1088. /* Monk's Player Settings */
  1089. /* ----------------------------------------- */
  1090. #client-settings.dorako-ui.dark-theme #mps-view-group {
  1091. border-bottom: 1px solid var(--tertiary);
  1092. }
  1093. /* ----------------------------------------- */
  1094. /* Monk's tokenbar */
  1095. /* ----------------------------------------- */
  1096. #tokenbar[data-theme=dorako-ui] {
  1097. gap: 3px;
  1098. }
  1099. #tokenbar[data-theme=dorako-ui] .token-list {
  1100. gap: 5px;
  1101. border: none;
  1102. }
  1103. #tokenbar[data-theme=dorako-ui] .bar-controls {
  1104. border: none;
  1105. border-radius: var(--border-radius);
  1106. background: none;
  1107. background-color: var(--glass-bg);
  1108. box-shadow: var(--glassy);
  1109. }
  1110. #tokenbar[data-theme=dorako-ui] .bar-controls div#tokenbar-move-handle {
  1111. border: none;
  1112. border-radius: var(--border-radius);
  1113. background: none;
  1114. background-color: var(--glass-bg);
  1115. box-shadow: var(--glassy);
  1116. border-radius: 5px 0px 0px 5px;
  1117. margin-right: 2px;
  1118. }
  1119. #tokenbar[data-theme=dorako-ui] .token {
  1120. border: none;
  1121. border-radius: var(--border-radius);
  1122. background: none;
  1123. background-color: var(--glass-bg);
  1124. box-shadow: var(--glassy);
  1125. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  1126. flex: 0 0 52px;
  1127. }
  1128. #tokenbar[data-theme=dorako-ui] .token .token-stats {
  1129. background: none;
  1130. text-shadow: 0px 0px 3px black;
  1131. }
  1132. #tokenbar[data-theme=dorako-ui] .token:hover {
  1133. background-color: var(--primary);
  1134. }
  1135. #tokenbar[data-theme=dorako-ui] .token:hover .token-icon {
  1136. box-shadow: none;
  1137. filter: drop-shadow(0px 0px 5px var(--tertiary));
  1138. }
  1139. #tokenbar[data-theme=dorako-ui] .token .token-icon {
  1140. box-shadow: none;
  1141. border-radius: 3px;
  1142. }
  1143. #tokenbar[data-theme=dorako-ui] .token .tooltip {
  1144. border: none;
  1145. border-radius: var(--border-radius);
  1146. background: none;
  1147. background-color: var(--glass-bg);
  1148. box-shadow: var(--glassy);
  1149. backdrop-filter: blur(5px);
  1150. -webkit-backdrop-filter: blur(5px);
  1151. }
  1152. #tokenbar[data-theme=dorako-ui] .monks-tokenbar.chat-card .card-header h3:hover {
  1153. text-shadow: unset;
  1154. }
  1155. #tokenbar[data-theme=dorako-ui] .monks-tokenbar .sheet .items-list .items-header {
  1156. border: none;
  1157. }
  1158. #tokenbar[data-theme=dorako-ui] .bar-controls .tokenbar-buttons div.active:not(.disabled) i, #tokenbar[data-theme=dorako-ui][movement=free] #movement-free:not(.disabled) i, #tokenbar[data-theme=dorako-ui][movement=none] #movement-none:not(.disabled) i, #tokenbar[data-theme=dorako-ui][movement=combat] #movement-combat:not(.disabled) i {
  1159. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  1160. border: none;
  1161. margin: 2px;
  1162. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px var(--gold-brown);
  1163. border-radius: 3px;
  1164. text-shadow: 0px 0px 3px black;
  1165. background-color: var(--primary-light);
  1166. color: var(--color-text-light-highlight);
  1167. }
  1168. #tokenbar[data-theme=dorako-ui]:not(.hidectrl) .bar-controls .tokenbar-buttons div.active:not(.disabled):hover i, #tokenbar[data-theme=dorako-ui][movement=free]:not(.hidectrl) #movement-free:not(.disabled):hover i, #tokenbar[data-theme=dorako-ui][movement=none]:not(.hidectrl) #movement-none:not(.disabled):hover i, #tokenbar[data-theme=dorako-ui][movement=combat]:not(.hidectrl) #movement-combat:not(.disabled):hover i {
  1169. color: var(--color-text-light-highlight);
  1170. }
  1171. .dorako-ui.dark-theme .monks-tokenbar .sheet .items-list .item .item-name,
  1172. .dorako-ui.dark-theme .monks-tokenbar .sheet .items-list,
  1173. .dorako-ui.dark-theme .monks-tokenbar.chat-card .card-header h3,
  1174. .dorako-ui.dark-theme .monks-tokenbar .sheet .items-list .items-header h3 {
  1175. color: var(--color-text-light-1);
  1176. font-family: unset;
  1177. }
  1178. .dorako-ui.dark-theme#requestsavingthrow .request-grid.dice-group div::first-letter {
  1179. font-size: 0rem;
  1180. }
  1181. .dorako-ui.dark-theme#requestsavingthrow .request-grid {
  1182. gap: 5px;
  1183. margin: 5px 10px;
  1184. text-align: center;
  1185. }
  1186. .dorako-ui.dark-theme#requestsavingthrow .request-grid.dice-group {
  1187. display: flex;
  1188. justify-content: space-between;
  1189. }
  1190. .dorako-ui.dark-theme#requestsavingthrow .request-grid > div {
  1191. border: none;
  1192. border-radius: var(--border-radius);
  1193. background: none;
  1194. background-color: var(--glass-bg);
  1195. box-shadow: var(--glassy);
  1196. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  1197. color: var(--color-text-light-heading);
  1198. text-shadow: 0px 0px 3px black;
  1199. padding: 2px 6px;
  1200. background-color: var(--secondary-dark);
  1201. }
  1202. .dorako-ui.dark-theme#requestsavingthrow .request-grid > div:hover {
  1203. background-color: var(--secondary-light);
  1204. color: white;
  1205. }
  1206. .dorako-ui.dark-theme#requestsavingthrow .request-grid > div.selected {
  1207. background-color: var(--secondary-light);
  1208. color: white;
  1209. }
  1210. .dorako-ui.dark-theme .monks-tokenbar .sheet .items-list .item {
  1211. border: none;
  1212. margin-bottom: 2px;
  1213. }
  1214. .dorako-ui.dark-theme .monks-tokenbar .dialog-buttons {
  1215. gap: 5px;
  1216. }
  1217. .dorako-ui.dark-theme .monks-tokenbar.chat-card .card-header {
  1218. border: none;
  1219. }
  1220. .dorako-ui.dark-theme .monks-tokenbar.chat-card .card-footer {
  1221. border: none;
  1222. }
  1223. .dorako-ui.dark-theme .monks-tokenbar.chat-card .card-footer .flexrow {
  1224. gap: 5px;
  1225. }
  1226. .dorako-ui.dark-theme .monks-tokenbar.chat-card .card-footer .flexrow .footer-button {
  1227. border: none;
  1228. border-radius: var(--border-radius);
  1229. background: none;
  1230. background-color: var(--glass-bg);
  1231. box-shadow: var(--glassy);
  1232. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  1233. color: var(--color-text-light-heading);
  1234. text-shadow: 0px 0px 3px black;
  1235. }
  1236. .dorako-ui.dark-theme .monks-tokenbar.chat-card .card-footer .flexrow .footer-button:hover {
  1237. color: var(--color-text-light-highlight);
  1238. background-color: var(--primary);
  1239. }
  1240. #tokenbar[data-theme] .bar-controls {
  1241. background: var(--app-background);
  1242. border: var(--app-border-width) solid var(--app-border-color);
  1243. text-shadow: var(--app-text-shadow);
  1244. border-radius: var(--border-radius);
  1245. box-shadow: var(--box-shadow);
  1246. color: var(--text-color-3);
  1247. }
  1248. #tokenbar[data-theme] .bar-controls div#tokenbar-move-handle {
  1249. background: unset;
  1250. }
  1251. #tokenbar[data-theme] .token-list {
  1252. border: unset;
  1253. gap: 5px;
  1254. }
  1255. #tokenbar[data-theme] .token-list .token {
  1256. background: var(--app-background);
  1257. border: var(--app-border-width) solid var(--app-border-color);
  1258. text-shadow: var(--app-text-shadow);
  1259. border-radius: var(--border-radius);
  1260. box-shadow: var(--box-shadow);
  1261. color: var(--text-color-3);
  1262. }
  1263. #tokenbar[data-theme] .token-list .token .tooltip {
  1264. background: var(--app-background);
  1265. border: 1px solid var(--color-primary-1);
  1266. box-shadow: 0px 0px 6px var(--color-primary-2), 0px 2px 8px 1px var(--color-primary-3);
  1267. backdrop-filter: blur(5px);
  1268. border-radius: var(--border-radius);
  1269. -webkit-backdrop-filter: blur(5px);
  1270. font-size: var(--font-size-16);
  1271. line-height: var(--font-size-16);
  1272. text-shadow: 0px 1px 2px black;
  1273. padding: 0.3em 0.6em;
  1274. }
  1275. #tokenbar[data-theme] .token-list .token .token-stats {
  1276. background: unset;
  1277. }
  1278. #tokenbar[data-theme] .token-list .token .token-icon {
  1279. box-shadow: unset;
  1280. }
  1281. [data-theme]#requestsavingthrow .request-grid > div {
  1282. background: var(--app-background);
  1283. border: var(--app-border-width) solid var(--app-border-color);
  1284. text-shadow: var(--app-text-shadow);
  1285. border-radius: var(--border-radius);
  1286. box-shadow: var(--box-shadow);
  1287. color: var(--text-color-3);
  1288. background: var(--button-background);
  1289. border: var(--app-border-width) solid var(--button-border-color);
  1290. color: var(--button-text-color);
  1291. box-shadow: var(--box-shadow);
  1292. text-decoration: none;
  1293. cursor: pointer;
  1294. text-shadow: var(--app-text-shadow);
  1295. text-align: center;
  1296. }
  1297. [data-theme]#requestsavingthrow .request-grid > div:not(.disabled, :disabled):hover {
  1298. background: var(--button-hover-background);
  1299. color: var(--button-hover-text-color);
  1300. border: var(--app-border-width) solid var(--button-hover-border-color);
  1301. box-shadow: var(--box-shadow);
  1302. }
  1303. [data-theme]#requestsavingthrow .request-grid > div.view, [data-theme]#requestsavingthrow .request-grid > div.selected, [data-theme]#requestsavingthrow .request-grid > div.active {
  1304. background: var(--button-hover-background);
  1305. outline: 1px solid var(--button-focus-outline-color);
  1306. border-color: var(--button-hover-border-color);
  1307. color: var(--button-hover-text-color);
  1308. text-decoration: none !important;
  1309. font-weight: unset !important;
  1310. }
  1311. [data-theme]#requestsavingthrow .request-grid > div.empty, [data-theme]#requestsavingthrow .request-grid > div.disabled, [data-theme]#requestsavingthrow .request-grid > div:disabled {
  1312. --button-background: var(--button-disabled-background);
  1313. --button-hover-background: var(--button-disabled-background);
  1314. --button-border-color: var(--button-disabled-border-color);
  1315. --button-text-color: var(--text-color-5);
  1316. }
  1317. [data-theme]#requestsavingthrow .request-grid {
  1318. gap: 6px;
  1319. grid-template-columns: 31% 31% 31%;
  1320. }
  1321. [data-theme] .monks-tokenbar .sheet .items-list .items-header {
  1322. background: unset;
  1323. border: unset;
  1324. }
  1325. [data-theme] .monks-tokenbar .sheet .items-list .item {
  1326. border: unset;
  1327. }
  1328. [data-theme] .monks-tokenbar:not(.editstats) .sheet input[type=text],
  1329. [data-theme] .monks-tokenbar .sheet input[type=number] {
  1330. background: var(--input-background);
  1331. border: var(--app-border-width) solid;
  1332. border-color: var(--input-border-color) !important;
  1333. color: var(--input-text-color);
  1334. box-shadow: var(--input-box-shadow) !important;
  1335. align-items: center;
  1336. border-radius: 4px;
  1337. outline: 1px solid transparent;
  1338. user-select: text;
  1339. transition: outline-color 0.5s;
  1340. }
  1341. [data-theme] .monks-tokenbar:not(.editstats) .sheet input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme] .monks-tokenbar:not(.editstats) .sheet input[type=text]:focus,
  1342. [data-theme] .monks-tokenbar .sheet input[type=number]:not(:disabled, .disabled, [type=checkbox]):hover,
  1343. [data-theme] .monks-tokenbar .sheet input[type=number]:focus {
  1344. outline: 1px solid var(--input-focus-outline-color);
  1345. border: var(--app-border-width) solid;
  1346. border-color: var(--input-border-color);
  1347. color: var(--input-focus-text-color);
  1348. box-shadow: var(--box-shadow);
  1349. }
  1350. [data-theme] .monks-tokenbar:not(.editstats) .sheet input[type=text].disabled, [data-theme] .monks-tokenbar:not(.editstats) .sheet input[type=text]:disabled,
  1351. [data-theme] .monks-tokenbar .sheet input[type=number].disabled,
  1352. [data-theme] .monks-tokenbar .sheet input[type=number]:disabled {
  1353. --input-text-color: var(--text-color-disabled);
  1354. --input-background: var(--input-disabled-background);
  1355. --input-border-color: var(--input-disabled-border-color);
  1356. }
  1357. [data-theme] .monks-tokenbar:not(.editstats) .sheet input[type=text].disabled::placeholder, [data-theme] .monks-tokenbar:not(.editstats) .sheet input[type=text]:disabled::placeholder,
  1358. [data-theme] .monks-tokenbar .sheet input[type=number].disabled::placeholder,
  1359. [data-theme] .monks-tokenbar .sheet input[type=number]:disabled::placeholder {
  1360. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  1361. }
  1362. [data-theme] .monks-tokenbar:not(.editstats) .sheet input[type=text]::placeholder,
  1363. [data-theme] .monks-tokenbar .sheet input[type=number]::placeholder {
  1364. color: var(--input-placeholder-color);
  1365. }
  1366. [data-theme] .monks-tokenbar:not(.editstats) .sheet input[type=text][type=checkbox],
  1367. [data-theme] .monks-tokenbar .sheet input[type=number][type=checkbox] {
  1368. outline: unset !important;
  1369. border: unset !important;
  1370. box-shadow: unset !important;
  1371. }
  1372. [data-theme]#assignexperience .sheet .sheet-navigation {
  1373. margin: unset;
  1374. font-family: var(--sans-serif);
  1375. font-weight: unset;
  1376. }
  1377. [data-theme] .request-roll {
  1378. padding-left: 2px;
  1379. }
  1380. /* ----------------------------------------- */
  1381. /* Monk's little details */
  1382. /* ----------------------------------------- */
  1383. #chat-log .message.round-marker {
  1384. border-bottom: 1px solid var(--tertiary) !important;
  1385. }
  1386. #darkness-progress > div > div {
  1387. background-color: var(--primary-light);
  1388. }
  1389. .dorako-ui#token-hud.monks-little-details .status-effects .effect-control, .dorako-ui#token-hud.monks-little-details .status-effects .pf2e-effect-control {
  1390. border-radius: unset;
  1391. }
  1392. .dorako-ui #token-hud.placeable-hud.monks-little-details .status-effects {
  1393. grid-template-columns: 90px 90px 90px 90px !important;
  1394. background: none;
  1395. }
  1396. .dorako-ui #token-hud.placeable-hud.monks-little-details .status-effects .effect-control {
  1397. border: none;
  1398. opacity: unset;
  1399. }
  1400. .dorako-ui #token-hud.placeable-hud.monks-little-details .status-effects .effect-control.active {
  1401. border: none;
  1402. opacity: 1;
  1403. background-color: var(--secondary-light);
  1404. }
  1405. .dorako-ui #token-hud.placeable-hud.monks-little-details .status-effects .effect-control.active .effect-name {
  1406. color: white;
  1407. opacity: unset;
  1408. }
  1409. .dorako-ui #token-hud.placeable-hud.monks-little-details .status-effects .effect-control img {
  1410. border-radius: 4px 0px 0px 4px;
  1411. }
  1412. .dorako-ui #token-hud.placeable-hud.monks-little-details .status-effects .effect-control img::before {
  1413. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  1414. content: "";
  1415. position: absolute;
  1416. top: 0;
  1417. left: 0;
  1418. width: 100%;
  1419. height: 100%;
  1420. box-shadow: 0px 0px 1px var(--tertiary);
  1421. border-radius: 4px 0px 0px 4px;
  1422. overflow: hidden;
  1423. pointer-events: none;
  1424. }
  1425. .dorako-ui #token-hud.placeable-hud.monks-little-details .status-effects .effect-name {
  1426. opacity: unset;
  1427. padding-right: 4px;
  1428. color: var(--color-text-light-heading);
  1429. font-size: var(--font-size-12);
  1430. }
  1431. [data-theme]#token-hud.monks-little-details .status-effects {
  1432. gap: 5px;
  1433. }
  1434. [data-theme]#token-hud.monks-little-details .status-effects .effect-control.active, [data-theme]#token-hud.monks-little-details .status-effects .pf2e-effect-control.active {
  1435. border: unset;
  1436. }
  1437. [data-theme] picture {
  1438. opacity: 1 !important;
  1439. left: -1px;
  1440. top: -1px;
  1441. position: relative;
  1442. }
  1443. [data-theme] #token-hud .status-effects .effect-control .badge {
  1444. border-top: unset;
  1445. border-right: unset;
  1446. width: 18px;
  1447. right: 0px;
  1448. }
  1449. body.system-pf2e #token-hud.monks-little-details[data-theme] .status-effects .effect-control {
  1450. background: var(--app-background);
  1451. border: var(--app-border-width) solid var(--app-border-color);
  1452. text-shadow: var(--app-text-shadow);
  1453. border-radius: var(--border-radius);
  1454. box-shadow: var(--box-shadow);
  1455. color: var(--text-color-3);
  1456. background: var(--button-background);
  1457. border: var(--app-border-width) solid var(--button-border-color);
  1458. color: var(--button-text-color);
  1459. box-shadow: var(--box-shadow);
  1460. text-decoration: none;
  1461. cursor: pointer;
  1462. text-shadow: var(--app-text-shadow);
  1463. }
  1464. body.system-pf2e #token-hud.monks-little-details[data-theme] .status-effects .effect-control:not(.disabled, :disabled):hover {
  1465. background: var(--button-hover-background);
  1466. color: var(--button-hover-text-color);
  1467. border: var(--app-border-width) solid var(--button-hover-border-color);
  1468. box-shadow: var(--box-shadow);
  1469. }
  1470. body.system-pf2e #token-hud.monks-little-details[data-theme] .status-effects .effect-control.view, body.system-pf2e #token-hud.monks-little-details[data-theme] .status-effects .effect-control.selected, body.system-pf2e #token-hud.monks-little-details[data-theme] .status-effects .effect-control.active {
  1471. background: var(--button-hover-background);
  1472. outline: 1px solid var(--button-focus-outline-color);
  1473. border-color: var(--button-hover-border-color);
  1474. color: var(--button-hover-text-color);
  1475. text-decoration: none !important;
  1476. font-weight: unset !important;
  1477. }
  1478. body.system-pf2e #token-hud.monks-little-details[data-theme] .status-effects .effect-control.empty, body.system-pf2e #token-hud.monks-little-details[data-theme] .status-effects .effect-control.disabled, body.system-pf2e #token-hud.monks-little-details[data-theme] .status-effects .effect-control:disabled {
  1479. --button-background: var(--button-disabled-background);
  1480. --button-hover-background: var(--button-disabled-background);
  1481. --button-border-color: var(--button-disabled-border-color);
  1482. --button-text-color: var(--text-color-5);
  1483. }
  1484. /* ----------------------------------------- */
  1485. /* Monk's hotbar expansion */
  1486. /* ----------------------------------------- */
  1487. #hotbar .action-bar.no-arrows + .bar-controls span.page-number,
  1488. #hotbar .hotbar-page .hotbar-page-row .bar-controls span.page-number,
  1489. #hotbar .hotbar-page .hotbar-page-row .bar-controls i {
  1490. line-height: 52px;
  1491. }
  1492. #hotbar .hotbar-page .hotbar-page-row.selected .bar-controls .page-number {
  1493. color: var(--tertiary-dark);
  1494. }
  1495. [data-tooltip="MonksHotbarExpansion.clear-row"] {
  1496. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  1497. }
  1498. [data-tooltip="MonksHotbarExpansion.clear-row"]:hover i {
  1499. text-shadow: 0 0 8px var(--color-shadow-primary);
  1500. }
  1501. .hotbar-page .page-number {
  1502. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  1503. }
  1504. .hotbar-page .page-number:hover {
  1505. text-shadow: 0 0 8px var(--color-shadow-primary);
  1506. }
  1507. #hotbar[data-theme] .hotbar-page {
  1508. overflow: visible;
  1509. gap: 4px;
  1510. bottom: 56px;
  1511. }
  1512. #hotbar[data-theme] .hotbar-page .macro-list {
  1513. gap: 7px;
  1514. border: none;
  1515. }
  1516. #hotbar[data-theme] .hotbar-page .action-bar {
  1517. margin: 0px 5px 0px 3px;
  1518. }
  1519. /* ----------------------------------------- */
  1520. /* Monk's Sound Enhancements */
  1521. /* ----------------------------------------- */
  1522. [data-theme].sheet .sound-sheet .items-list .items-header {
  1523. border: unset;
  1524. }
  1525. [data-theme].sheet .sound-sheet .items-list .item {
  1526. border-bottom: 1px solid var(--color-secondary-4);
  1527. }
  1528. [data-theme].sheet .sound-sheet .items-list .item .item-name {
  1529. color: var(--text-color-3);
  1530. }
  1531. /* ----------------------------------------- */
  1532. /* Monk's Enhanced Journal */
  1533. /* ----------------------------------------- */
  1534. /* ----------------------------------------- */
  1535. /* Monk's Scene Navigation */
  1536. /* ----------------------------------------- */
  1537. body.compact-ui #navigation[data-theme] .monks-scene-navigation #nav-toggle {
  1538. display: unset;
  1539. }
  1540. [data-theme]#navigation .nav-item-container {
  1541. background: var(--app-background);
  1542. border: var(--app-border-width) solid var(--app-border-color);
  1543. text-shadow: var(--app-text-shadow);
  1544. border-radius: var(--border-radius);
  1545. box-shadow: var(--box-shadow);
  1546. color: var(--text-color-3);
  1547. }
  1548. [data-theme]#navigation .nav-item-container #nav-toggle {
  1549. box-shadow: unset;
  1550. border: unset;
  1551. background: unset;
  1552. height: unset;
  1553. flex: unset;
  1554. }
  1555. [data-theme]#navigation .monks-scene-navigation .scene-list > li a {
  1556. background: var(--app-background);
  1557. border: var(--app-border-width) solid var(--app-border-color);
  1558. text-shadow: var(--app-text-shadow);
  1559. border-radius: var(--border-radius);
  1560. box-shadow: var(--box-shadow);
  1561. color: var(--text-color-3);
  1562. background: var(--button-background);
  1563. border: var(--app-border-width) solid var(--button-border-color);
  1564. color: var(--button-text-color);
  1565. box-shadow: var(--box-shadow);
  1566. text-decoration: none;
  1567. cursor: pointer;
  1568. text-shadow: var(--app-text-shadow);
  1569. }
  1570. [data-theme]#navigation .monks-scene-navigation .scene-list > li a:not(.disabled, :disabled):hover {
  1571. background: var(--button-hover-background);
  1572. color: var(--button-hover-text-color);
  1573. border: var(--app-border-width) solid var(--button-hover-border-color);
  1574. box-shadow: var(--box-shadow);
  1575. }
  1576. [data-theme]#navigation .monks-scene-navigation .scene-list > li a.view, [data-theme]#navigation .monks-scene-navigation .scene-list > li a.selected, [data-theme]#navigation .monks-scene-navigation .scene-list > li a.active {
  1577. background: var(--button-hover-background);
  1578. outline: 1px solid var(--button-focus-outline-color);
  1579. border-color: var(--button-hover-border-color);
  1580. color: var(--button-hover-text-color);
  1581. text-decoration: none !important;
  1582. font-weight: unset !important;
  1583. }
  1584. [data-theme]#navigation .monks-scene-navigation .scene-list > li a.empty, [data-theme]#navigation .monks-scene-navigation .scene-list > li a.disabled, [data-theme]#navigation .monks-scene-navigation .scene-list > li a:disabled {
  1585. --button-background: var(--button-disabled-background);
  1586. --button-hover-background: var(--button-disabled-background);
  1587. --button-border-color: var(--button-disabled-border-color);
  1588. --button-text-color: var(--text-color-5);
  1589. }
  1590. [data-theme]#navigation .monks-scene-navigation .scene-list > li.gm a {
  1591. background: var(--app-background);
  1592. border: var(--app-border-width) solid var(--app-border-color);
  1593. text-shadow: var(--app-text-shadow);
  1594. border-radius: var(--border-radius);
  1595. box-shadow: var(--box-shadow);
  1596. color: var(--text-color-3);
  1597. background: var(--button-background);
  1598. border: var(--app-border-width) solid var(--button-border-color);
  1599. color: var(--button-text-color);
  1600. box-shadow: var(--box-shadow);
  1601. text-decoration: none;
  1602. cursor: pointer;
  1603. text-shadow: var(--app-text-shadow);
  1604. transition: background 0.1s ease-in-out;
  1605. --button-background: var(--button-toggle-background);
  1606. --button-border-color: var(--button-toggle-border-color);
  1607. --button-focus-outline-color: var(--button-toggle-focus-outline-color);
  1608. --button-hover-background: var(--button-toggle-hover-background);
  1609. --button-hover-border-color: var(--button-toggle-hover-border-color);
  1610. }
  1611. [data-theme]#navigation .monks-scene-navigation .scene-list > li.gm a:not(.disabled, :disabled):hover {
  1612. background: var(--button-hover-background);
  1613. color: var(--button-hover-text-color);
  1614. border: var(--app-border-width) solid var(--button-hover-border-color);
  1615. box-shadow: var(--box-shadow);
  1616. }
  1617. [data-theme]#navigation .monks-scene-navigation .scene-list > li.gm a.view, [data-theme]#navigation .monks-scene-navigation .scene-list > li.gm a.selected, [data-theme]#navigation .monks-scene-navigation .scene-list > li.gm a.active {
  1618. background: var(--button-hover-background);
  1619. outline: 1px solid var(--button-focus-outline-color);
  1620. border-color: var(--button-hover-border-color);
  1621. color: var(--button-hover-text-color);
  1622. text-decoration: none !important;
  1623. font-weight: unset !important;
  1624. }
  1625. [data-theme]#navigation .monks-scene-navigation .scene-list > li.gm a.empty, [data-theme]#navigation .monks-scene-navigation .scene-list > li.gm a.disabled, [data-theme]#navigation .monks-scene-navigation .scene-list > li.gm a:disabled {
  1626. --button-background: var(--button-disabled-background);
  1627. --button-hover-background: var(--button-disabled-background);
  1628. --button-border-color: var(--button-disabled-border-color);
  1629. --button-text-color: var(--text-color-5);
  1630. }
  1631. [data-theme]#navigation .monks-scene-navigation .scene-list > li.gm a:disabled {
  1632. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  1633. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  1634. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  1635. }
  1636. [data-theme]#navigation .monks-scene-navigation .scene-list > li a.folder-name {
  1637. --app-border-width: 2px;
  1638. }
  1639. [data-theme]#navigation .monks-scene-navigation .scene-list > li.view a {
  1640. --button-background: var(--color-primary-2);
  1641. --button-border-color: var(--color-primary-1);
  1642. }
  1643. [data-theme]#navigation .monks-scene-navigation .scene-list > li.active a {
  1644. outline: 1px solid var(--tertiary);
  1645. }
  1646. [data-theme]#navigation.background .monks-scene-navigation .scene-list {
  1647. background: var(--app-background);
  1648. border: var(--app-border-width) solid var(--app-border-color);
  1649. text-shadow: var(--app-text-shadow);
  1650. border-radius: var(--border-radius);
  1651. box-shadow: var(--box-shadow);
  1652. color: var(--text-color-3);
  1653. --app-border-width: 2px;
  1654. gap: 5px;
  1655. }
  1656. /* ----------------------------------------- */
  1657. /* Monk's Active Tile Triggers */
  1658. /* ----------------------------------------- */
  1659. [data-theme] .monks-active-tiles.sheet .items-list .items-header, [data-theme].monks-active-tiles.sheet .items-list .items-header {
  1660. background: unset;
  1661. border: unset;
  1662. }
  1663. [data-theme] .monks-active-tiles.sheet .items-list .items-header .item-controls, [data-theme].monks-active-tiles.sheet .items-list .items-header .item-controls {
  1664. color: var(--text-color-3);
  1665. }
  1666. [data-theme] .monks-active-tiles.sheet .items-list .items-header h3, [data-theme].monks-active-tiles.sheet .items-list .items-header h3 {
  1667. font-family: Signika, sans-serif;
  1668. }
  1669. [data-theme]#trigger-action .files-list .items-header .item-controls, [data-theme]#trigger-action .buttons-list .items-header .item-controls, [data-theme].monks-active-tiles .files-list .items-header .item-controls {
  1670. color: var(--text-color-2);
  1671. }
  1672. [data-theme].monks-active-tiles .file-list {
  1673. color: var(--text-color-3);
  1674. }
  1675. [data-theme].monks-active-tiles.sheet .items-list, [data-theme]#trigger-action .items-list li a, [data-theme].monks-active-tiles .file-list li a {
  1676. color: var(--text-color-3);
  1677. }
  1678. [data-theme]#trigger-action .file-list li, [data-theme].monks-active-tiles.sheet .file-list li.item {
  1679. border-color: var(--color-secondary-3);
  1680. }
  1681. [data-theme].action-sheet .display-value {
  1682. background: var(--input-background);
  1683. border: var(--app-border-width) solid;
  1684. border-color: var(--input-border-color) !important;
  1685. color: var(--input-text-color);
  1686. box-shadow: var(--input-box-shadow) !important;
  1687. align-items: center;
  1688. border-radius: 4px;
  1689. outline: 1px solid transparent;
  1690. user-select: text;
  1691. transition: outline-color 0.5s;
  1692. }
  1693. [data-theme].action-sheet .display-value:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].action-sheet .display-value:focus {
  1694. outline: 1px solid var(--input-focus-outline-color);
  1695. border: var(--app-border-width) solid;
  1696. border-color: var(--input-border-color);
  1697. color: var(--input-focus-text-color);
  1698. box-shadow: var(--box-shadow);
  1699. }
  1700. [data-theme].action-sheet .display-value.disabled, [data-theme].action-sheet .display-value:disabled {
  1701. --input-text-color: var(--text-color-disabled);
  1702. --input-background: var(--input-disabled-background);
  1703. --input-border-color: var(--input-disabled-border-color);
  1704. }
  1705. [data-theme].action-sheet .display-value.disabled::placeholder, [data-theme].action-sheet .display-value:disabled::placeholder {
  1706. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  1707. }
  1708. [data-theme].action-sheet .display-value::placeholder {
  1709. color: var(--input-placeholder-color);
  1710. }
  1711. [data-theme].action-sheet .display-value[type=checkbox] {
  1712. outline: unset !important;
  1713. border: unset !important;
  1714. box-shadow: unset !important;
  1715. }
  1716. [data-theme].monks-active-tiles.sheet .items-list .item-controls a {
  1717. background: var(--app-background);
  1718. border: var(--app-border-width) solid var(--app-border-color);
  1719. text-shadow: var(--app-text-shadow);
  1720. border-radius: var(--border-radius);
  1721. box-shadow: var(--box-shadow);
  1722. color: var(--text-color-3);
  1723. background: var(--button-background);
  1724. border: var(--app-border-width) solid var(--button-border-color);
  1725. color: var(--button-text-color);
  1726. box-shadow: var(--box-shadow);
  1727. text-decoration: none;
  1728. cursor: pointer;
  1729. text-shadow: var(--app-text-shadow);
  1730. }
  1731. [data-theme].monks-active-tiles.sheet .items-list .item-controls a:not(.disabled, :disabled):hover {
  1732. background: var(--button-hover-background);
  1733. color: var(--button-hover-text-color);
  1734. border: var(--app-border-width) solid var(--button-hover-border-color);
  1735. box-shadow: var(--box-shadow);
  1736. }
  1737. [data-theme].monks-active-tiles.sheet .items-list .item-controls a.view, [data-theme].monks-active-tiles.sheet .items-list .item-controls a.selected, [data-theme].monks-active-tiles.sheet .items-list .item-controls a.active {
  1738. background: var(--button-hover-background);
  1739. outline: 1px solid var(--button-focus-outline-color);
  1740. border-color: var(--button-hover-border-color);
  1741. color: var(--button-hover-text-color);
  1742. text-decoration: none !important;
  1743. font-weight: unset !important;
  1744. }
  1745. [data-theme].monks-active-tiles.sheet .items-list .item-controls a.empty, [data-theme].monks-active-tiles.sheet .items-list .item-controls a.disabled, [data-theme].monks-active-tiles.sheet .items-list .item-controls a:disabled {
  1746. --button-background: var(--button-disabled-background);
  1747. --button-hover-background: var(--button-disabled-background);
  1748. --button-border-color: var(--button-disabled-border-color);
  1749. --button-text-color: var(--text-color-5);
  1750. }
  1751. [data-theme].monks-active-tiles.sheet .items-list .item .item-name {
  1752. color: var(--text-color-3);
  1753. }
  1754. [data-theme]:not([data-theme^=crb][data-color-scheme=light]).monks-active-tiles div[data-tab=triggers] .action-items .action-style {
  1755. color: #fafafa;
  1756. }
  1757. [data-theme]:not([data-theme^=crb][data-color-scheme=light]).monks-active-tiles div[data-tab=triggers] .action-items .filter-style {
  1758. color: #f73458;
  1759. }
  1760. [data-theme]:not([data-theme^=crb][data-color-scheme=light]).monks-active-tiles div[data-tab=triggers] .action-items .logic-style {
  1761. color: #2b40f8;
  1762. }
  1763. [data-theme]:not([data-theme^=crb][data-color-scheme=light]).monks-active-tiles div[data-tab=triggers] .action-items .entity-style {
  1764. color: #a9a9a9;
  1765. }
  1766. [data-theme]:not([data-theme^=crb][data-color-scheme=light]).monks-active-tiles div[data-tab=triggers] .action-items .details-style {
  1767. color: #a326fc;
  1768. }
  1769. [data-theme]:not([data-theme^=crb][data-color-scheme=light]).monks-active-tiles div[data-tab=triggers] .action-items .value-style {
  1770. color: #515151;
  1771. }
  1772. [data-theme]:not([data-theme^=crb][data-color-scheme=light]).monks-active-tiles div[data-tab=triggers] .action-items .tag-style {
  1773. color: #063d68;
  1774. }
  1775. .dorako-ui.dark-theme.party-overview-window .table-row:nth-child(2n) {
  1776. background-color: rgba(228, 228, 228, 0.2);
  1777. }
  1778. .dorako-ui.dark-theme.party-overview-window nav .item.active {
  1779. color: white;
  1780. border-bottom: 2px solid var(--tertiary);
  1781. }
  1782. .dorako-ui.dark-theme.party-overview-window .table-row {
  1783. border-bottom: 1px solid var(--tertiary);
  1784. }
  1785. .dorako-ui.dark-theme.party-overview-window .proficiencies .table-row .num:not(.party-overview-ellipsis-no-border) {
  1786. border-radius: 3px;
  1787. margin-right: 3px;
  1788. box-shadow: 0px 0px 1px 1px inset rgba(255, 255, 255, 0.2);
  1789. }
  1790. [data-theme].chat-message.message .pf2e-token-hud .rk-skills, [data-theme].chat-message.message .pf2e-token-hud .rk {
  1791. --rarity-uncommon: #c45500;
  1792. --rarity-rare: #5362ff;
  1793. --rarity-unique: #e127e1;
  1794. --color-rarity-uncommon: #c45500;
  1795. --color-rarity-rare: #5362ff;
  1796. --color-rarity-unique: #e127e1;
  1797. --color-rank-1: dodgerblue;
  1798. --color-rank-2: #bf4fdb;
  1799. --color-rank-3: #cf931d;
  1800. --color-rank-4: red;
  1801. font-size: unset;
  1802. background: repeating-linear-gradient(color-mix(in srgb, var(--color-secondary-3) 20%, transparent) 0 var(--row-height), transparent var(--row-height) calc(var(--row-height) * 2));
  1803. }
  1804. [data-theme][data-color-scheme=dark].chat-message.message .pf2e-token-hud .rk-skills, [data-theme][data-color-scheme=dark].chat-message.message .pf2e-token-hud .rk {
  1805. --text-dark: var(--text-color-2);
  1806. --rarity-common: #e1d8cf;
  1807. --color-rarity-common: #e1d8cf;
  1808. --color-rank-0: #a6a6a6;
  1809. background: repeating-linear-gradient(color-mix(in srgb, var(--color-secondary-3) 20%, transparent) 0 var(--row-height), transparent var(--row-height) calc(var(--row-height) * 2));
  1810. }
  1811. [data-theme]#pf2e-token-hud {
  1812. --rarity-common: #e1d8cf;
  1813. --rarity-uncommon: #c45500;
  1814. --rarity-rare: #5362ff;
  1815. --rarity-unique: #e127e1;
  1816. --color-rarity-common: #e1d8cf;
  1817. --color-rarity-uncommon: #c45500;
  1818. --color-rarity-rare: #5362ff;
  1819. --color-rarity-unique: #e127e1;
  1820. --color-rank-0: #a6a6a6;
  1821. --color-rank-1: dodgerblue;
  1822. --color-rank-2: #bf4fdb;
  1823. --color-rank-3: #cf931d;
  1824. --color-rank-4: red;
  1825. --color-disabled: var(--text-color-disabled);
  1826. padding-bottom: 0px;
  1827. }
  1828. [data-theme]#pf2e-token-hud .sidebar .sidebar-header input {
  1829. background: var(--input-background);
  1830. border: var(--app-border-width) solid;
  1831. border-color: var(--input-border-color) !important;
  1832. color: var(--input-text-color);
  1833. box-shadow: var(--input-box-shadow) !important;
  1834. align-items: center;
  1835. border-radius: 4px;
  1836. outline: 1px solid transparent;
  1837. user-select: text;
  1838. transition: outline-color 0.5s;
  1839. }
  1840. [data-theme]#pf2e-token-hud .sidebar .sidebar-header input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme]#pf2e-token-hud .sidebar .sidebar-header input:focus {
  1841. outline: 1px solid var(--input-focus-outline-color);
  1842. border: var(--app-border-width) solid;
  1843. border-color: var(--input-border-color);
  1844. color: var(--input-focus-text-color);
  1845. box-shadow: var(--box-shadow);
  1846. }
  1847. [data-theme]#pf2e-token-hud .sidebar .sidebar-header input.disabled, [data-theme]#pf2e-token-hud .sidebar .sidebar-header input:disabled {
  1848. --input-text-color: var(--text-color-disabled);
  1849. --input-background: var(--input-disabled-background);
  1850. --input-border-color: var(--input-disabled-border-color);
  1851. }
  1852. [data-theme]#pf2e-token-hud .sidebar .sidebar-header input.disabled::placeholder, [data-theme]#pf2e-token-hud .sidebar .sidebar-header input:disabled::placeholder {
  1853. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  1854. }
  1855. [data-theme]#pf2e-token-hud .sidebar .sidebar-header input::placeholder {
  1856. color: var(--input-placeholder-color);
  1857. }
  1858. [data-theme]#pf2e-token-hud .sidebar .sidebar-header input[type=checkbox] {
  1859. outline: unset !important;
  1860. border: unset !important;
  1861. box-shadow: unset !important;
  1862. }
  1863. [data-theme]#pf2e-token-hud .sidebar .sidebar-content .item-img img {
  1864. border: 1px solid;
  1865. border-color: var(--icon-border-color);
  1866. border-radius: var(--border-radius);
  1867. }
  1868. [data-theme]#pf2e-token-hud .sidebar .sidebar-content .details input {
  1869. background: var(--input-background);
  1870. border: var(--app-border-width) solid;
  1871. border-color: var(--input-border-color) !important;
  1872. color: var(--input-text-color);
  1873. box-shadow: var(--input-box-shadow) !important;
  1874. align-items: center;
  1875. border-radius: 4px;
  1876. outline: 1px solid transparent;
  1877. user-select: text;
  1878. transition: outline-color 0.5s;
  1879. }
  1880. [data-theme]#pf2e-token-hud .sidebar .sidebar-content .details input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme]#pf2e-token-hud .sidebar .sidebar-content .details input:focus {
  1881. outline: 1px solid var(--input-focus-outline-color);
  1882. border: var(--app-border-width) solid;
  1883. border-color: var(--input-border-color);
  1884. color: var(--input-focus-text-color);
  1885. box-shadow: var(--box-shadow);
  1886. }
  1887. [data-theme]#pf2e-token-hud .sidebar .sidebar-content .details input.disabled, [data-theme]#pf2e-token-hud .sidebar .sidebar-content .details input:disabled {
  1888. --input-text-color: var(--text-color-disabled);
  1889. --input-background: var(--input-disabled-background);
  1890. --input-border-color: var(--input-disabled-border-color);
  1891. }
  1892. [data-theme]#pf2e-token-hud .sidebar .sidebar-content .details input.disabled::placeholder, [data-theme]#pf2e-token-hud .sidebar .sidebar-content .details input:disabled::placeholder {
  1893. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  1894. }
  1895. [data-theme]#pf2e-token-hud .sidebar .sidebar-content .details input::placeholder {
  1896. color: var(--input-placeholder-color);
  1897. }
  1898. [data-theme]#pf2e-token-hud .sidebar .sidebar-content .details input[type=checkbox] {
  1899. outline: unset !important;
  1900. border: unset !important;
  1901. box-shadow: unset !important;
  1902. }
  1903. [data-theme]#pf2e-token-hud .sidebar.spells .sidebar-content .entry .spell .details .extras .actions .uses input:last-child {
  1904. --input-background: transparent;
  1905. --input-border-color: transparent;
  1906. --box-shadow: transparent;
  1907. }
  1908. [data-theme]#pf2e-token-hud .sidebar.extras .sidebar-content .row select {
  1909. background: var(--input-background);
  1910. border: var(--app-border-width) solid;
  1911. border-color: var(--input-border-color) !important;
  1912. color: var(--input-text-color);
  1913. box-shadow: var(--input-box-shadow) !important;
  1914. align-items: center;
  1915. border-radius: 4px;
  1916. outline: 1px solid transparent;
  1917. user-select: text;
  1918. transition: outline-color 0.5s;
  1919. }
  1920. [data-theme]#pf2e-token-hud .sidebar.extras .sidebar-content .row select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme]#pf2e-token-hud .sidebar.extras .sidebar-content .row select:focus {
  1921. outline: 1px solid var(--input-focus-outline-color);
  1922. border: var(--app-border-width) solid;
  1923. border-color: var(--input-border-color);
  1924. color: var(--input-focus-text-color);
  1925. box-shadow: var(--box-shadow);
  1926. }
  1927. [data-theme]#pf2e-token-hud .sidebar.extras .sidebar-content .row select.disabled, [data-theme]#pf2e-token-hud .sidebar.extras .sidebar-content .row select:disabled {
  1928. --input-text-color: var(--text-color-disabled);
  1929. --input-background: var(--input-disabled-background);
  1930. --input-border-color: var(--input-disabled-border-color);
  1931. }
  1932. [data-theme]#pf2e-token-hud .sidebar.extras .sidebar-content .row select.disabled::placeholder, [data-theme]#pf2e-token-hud .sidebar.extras .sidebar-content .row select:disabled::placeholder {
  1933. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  1934. }
  1935. [data-theme]#pf2e-token-hud .sidebar.extras .sidebar-content .row select::placeholder {
  1936. color: var(--input-placeholder-color);
  1937. }
  1938. [data-theme]#pf2e-token-hud .sidebar.extras .sidebar-content .row select[type=checkbox] {
  1939. outline: unset !important;
  1940. border: unset !important;
  1941. box-shadow: unset !important;
  1942. }
  1943. [data-theme]#pf2e-token-hud .sidebar.items .sidebar-content .hud-bulk .over-max {
  1944. color: var(--color-level-red-border);
  1945. }
  1946. [data-theme]#pf2e-token-hud a:hover {
  1947. color: var(--color-primary-2);
  1948. }
  1949. [data-theme]#pf2e-token-hud .sidebar .sidebar-content .item-img.hover i {
  1950. background: var(--color-primary-2);
  1951. border-color: var(--color-primary-1);
  1952. color: var(--text-color-1);
  1953. text-shadow: 0px 1px 2px black;
  1954. }
  1955. [data-theme]#pf2e-token-hud .sidebar .sidebar-content .details .extras .actions a i.greyed {
  1956. color: var(--text-color-disabled);
  1957. }
  1958. [data-theme]#pf2e-token-hud .sidebar .sidebar-content .header {
  1959. background: var(--color-secondary-4);
  1960. border-color: var(--color-secondary-5);
  1961. margin: 0px -5px;
  1962. }
  1963. [data-theme]#pf2e-token-hud .sidebar.doubled .sidebar-content .header {
  1964. margin: 0px 0px;
  1965. }
  1966. [data-theme].pf2e-token-hud .no-macro, [data-theme]#pf2e-token-hud .no-macro {
  1967. background: var(--app-background);
  1968. border: var(--app-border-width) solid var(--app-border-color);
  1969. text-shadow: var(--app-text-shadow);
  1970. border-radius: var(--border-radius);
  1971. box-shadow: var(--box-shadow);
  1972. color: var(--text-color-3);
  1973. background: var(--color-primary-3);
  1974. border: 1px solid var(--scrollbar-thumb-border-color);
  1975. }
  1976. [data-theme]#pf2e-token-hud .sidebar.spells .expended img {
  1977. filter: saturate(0);
  1978. }
  1979. [data-theme]#pf2e-token-hud .sidebar.spells .sidebar-content .entry .spell .details .extras .actions a:not(.disabled) {
  1980. color: var(--text-color-3);
  1981. }
  1982. [data-theme]#pf2e-token-hud .sidebar.spells .sidebar-content .entry .spell .details .extras .actions a:not(.disabled) :hover {
  1983. color: var(--color-primary-2);
  1984. }
  1985. [data-theme]#pf2e-token-hud .sidebar.spells .sidebar-content .entry .spell .details .extras .actions span {
  1986. color: var(--text-color-4);
  1987. }
  1988. [data-theme]#pf2e-token-hud .sidebar, [data-theme]#pf2e-token-hud .inner, [data-theme]#pf2e-token-hud .popup {
  1989. background: unset;
  1990. background: var(--app-background);
  1991. border: var(--app-border-width) solid var(--app-border-color);
  1992. text-shadow: var(--app-text-shadow);
  1993. border-radius: var(--border-radius);
  1994. box-shadow: var(--box-shadow);
  1995. color: var(--text-color-3);
  1996. backdrop-filter: blur(4px);
  1997. }
  1998. [data-theme]#pf2e-token-hud .popup .item-buttons {
  1999. display: flex;
  2000. flex-direction: column;
  2001. gap: 5px;
  2002. }
  2003. [data-theme]#pf2e-token-hud .popup .item-buttons button {
  2004. background: var(--app-background);
  2005. border: var(--app-border-width) solid var(--app-border-color);
  2006. text-shadow: var(--app-text-shadow);
  2007. border-radius: var(--border-radius);
  2008. box-shadow: var(--box-shadow);
  2009. color: var(--text-color-3);
  2010. background: var(--button-background);
  2011. border: var(--app-border-width) solid var(--button-border-color);
  2012. color: var(--button-text-color);
  2013. box-shadow: var(--box-shadow);
  2014. text-decoration: none;
  2015. cursor: pointer;
  2016. text-shadow: var(--app-text-shadow);
  2017. }
  2018. [data-theme]#pf2e-token-hud .popup .item-buttons button:not(.disabled, :disabled):hover {
  2019. background: var(--button-hover-background);
  2020. color: var(--button-hover-text-color);
  2021. border: var(--app-border-width) solid var(--button-hover-border-color);
  2022. box-shadow: var(--box-shadow);
  2023. }
  2024. [data-theme]#pf2e-token-hud .popup .item-buttons button.view, [data-theme]#pf2e-token-hud .popup .item-buttons button.selected, [data-theme]#pf2e-token-hud .popup .item-buttons button.active {
  2025. background: var(--button-hover-background);
  2026. outline: 1px solid var(--button-focus-outline-color);
  2027. border-color: var(--button-hover-border-color);
  2028. color: var(--button-hover-text-color);
  2029. text-decoration: none !important;
  2030. font-weight: unset !important;
  2031. }
  2032. [data-theme]#pf2e-token-hud .popup .item-buttons button.empty, [data-theme]#pf2e-token-hud .popup .item-buttons button.disabled, [data-theme]#pf2e-token-hud .popup .item-buttons button:disabled {
  2033. --button-background: var(--button-disabled-background);
  2034. --button-hover-background: var(--button-disabled-background);
  2035. --button-border-color: var(--button-disabled-border-color);
  2036. --button-text-color: var(--text-color-5);
  2037. }
  2038. [data-theme]#pf2e-token-hud .inner .group .section input[type=number] {
  2039. background: var(--input-background);
  2040. border: var(--app-border-width) solid;
  2041. border-color: var(--input-border-color) !important;
  2042. color: var(--input-text-color);
  2043. box-shadow: var(--input-box-shadow) !important;
  2044. align-items: center;
  2045. border-radius: 4px;
  2046. outline: 1px solid transparent;
  2047. user-select: text;
  2048. transition: outline-color 0.5s;
  2049. border-radius: 3px;
  2050. }
  2051. [data-theme]#pf2e-token-hud .inner .group .section input[type=number]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme]#pf2e-token-hud .inner .group .section input[type=number]:focus {
  2052. outline: 1px solid var(--input-focus-outline-color);
  2053. border: var(--app-border-width) solid;
  2054. border-color: var(--input-border-color);
  2055. color: var(--input-focus-text-color);
  2056. box-shadow: var(--box-shadow);
  2057. }
  2058. [data-theme]#pf2e-token-hud .inner .group .section input[type=number].disabled, [data-theme]#pf2e-token-hud .inner .group .section input[type=number]:disabled {
  2059. --input-text-color: var(--text-color-disabled);
  2060. --input-background: var(--input-disabled-background);
  2061. --input-border-color: var(--input-disabled-border-color);
  2062. }
  2063. [data-theme]#pf2e-token-hud .inner .group .section input[type=number].disabled::placeholder, [data-theme]#pf2e-token-hud .inner .group .section input[type=number]:disabled::placeholder {
  2064. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  2065. }
  2066. [data-theme]#pf2e-token-hud .inner .group .section input[type=number]::placeholder {
  2067. color: var(--input-placeholder-color);
  2068. }
  2069. [data-theme]#pf2e-token-hud .inner .group .section input[type=number][type=checkbox] {
  2070. outline: unset !important;
  2071. border: unset !important;
  2072. box-shadow: unset !important;
  2073. }
  2074. [data-theme]#pf2e-token-hud .sidebar .sidebar-content .action-icon img {
  2075. filter: invert(1);
  2076. mix-blend-mode: plus-lighter;
  2077. }
  2078. [data-theme]#pf2e-token-hud .free {
  2079. background: unset;
  2080. background: var(--app-background);
  2081. border: var(--app-border-width) solid var(--app-border-color);
  2082. text-shadow: var(--app-text-shadow);
  2083. border-radius: var(--border-radius);
  2084. box-shadow: var(--box-shadow);
  2085. color: var(--text-color-3);
  2086. backdrop-filter: blur(4px);
  2087. }
  2088. [data-theme]#pf2e-token-hud .free.status {
  2089. bottom: 0px;
  2090. border-top-left-radius: unset;
  2091. border-top-right-radius: unset;
  2092. border-top: unset;
  2093. }
  2094. [data-theme]#pf2e-token-hud .free.distance {
  2095. border-bottom-left-radius: unset;
  2096. border-bottom-right-radius: unset;
  2097. border-bottom: unset;
  2098. }
  2099. [data-theme]#pf2e-token-hud .popup .header:before {
  2100. background: unset;
  2101. color: var(--text-color-2);
  2102. }
  2103. [data-theme]#pf2e-token-hud .sidebar.actions .sidebar-content .toggles .toggle select {
  2104. background: var(--input-background);
  2105. border: var(--app-border-width) solid;
  2106. border-color: var(--input-border-color) !important;
  2107. color: var(--input-text-color);
  2108. box-shadow: var(--input-box-shadow) !important;
  2109. align-items: center;
  2110. border-radius: 4px;
  2111. outline: 1px solid transparent;
  2112. user-select: text;
  2113. transition: outline-color 0.5s;
  2114. margin: unset;
  2115. }
  2116. [data-theme]#pf2e-token-hud .sidebar.actions .sidebar-content .toggles .toggle select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme]#pf2e-token-hud .sidebar.actions .sidebar-content .toggles .toggle select:focus {
  2117. outline: 1px solid var(--input-focus-outline-color);
  2118. border: var(--app-border-width) solid;
  2119. border-color: var(--input-border-color);
  2120. color: var(--input-focus-text-color);
  2121. box-shadow: var(--box-shadow);
  2122. }
  2123. [data-theme]#pf2e-token-hud .sidebar.actions .sidebar-content .toggles .toggle select.disabled, [data-theme]#pf2e-token-hud .sidebar.actions .sidebar-content .toggles .toggle select:disabled {
  2124. --input-text-color: var(--text-color-disabled);
  2125. --input-background: var(--input-disabled-background);
  2126. --input-border-color: var(--input-disabled-border-color);
  2127. }
  2128. [data-theme]#pf2e-token-hud .sidebar.actions .sidebar-content .toggles .toggle select.disabled::placeholder, [data-theme]#pf2e-token-hud .sidebar.actions .sidebar-content .toggles .toggle select:disabled::placeholder {
  2129. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  2130. }
  2131. [data-theme]#pf2e-token-hud .sidebar.actions .sidebar-content .toggles .toggle select::placeholder {
  2132. color: var(--input-placeholder-color);
  2133. }
  2134. [data-theme]#pf2e-token-hud .sidebar.actions .sidebar-content .toggles .toggle select[type=checkbox] {
  2135. outline: unset !important;
  2136. border: unset !important;
  2137. box-shadow: unset !important;
  2138. }
  2139. [data-theme]#pf2e-token-hud .sidebar.skills .sidebar-content .skill .header .modifier, [data-theme]#pf2e-token-hud .sidebar.skills .sidebar-content .lore .modifier {
  2140. color: var(--color-primary-1);
  2141. }
  2142. [data-theme][id^=pf2e-perception-] {
  2143. height: auto !important;
  2144. }
  2145. [data-theme][id^=pf2e-perception-] .window-content {
  2146. max-height: 100%;
  2147. }
  2148. [data-theme][id^=pf2e-perception-] .window-content .tokens section .token[data-token-id]:is(:hover, .hover) {
  2149. background: color-mix(in srgb, var(--color-primary-2) 80%, transparent);
  2150. }
  2151. [data-theme][id^=pf2e-perception-] .window-content .buttons button {
  2152. background: var(--app-background);
  2153. border: var(--app-border-width) solid var(--app-border-color);
  2154. text-shadow: var(--app-text-shadow);
  2155. border-radius: var(--border-radius);
  2156. box-shadow: var(--box-shadow);
  2157. color: var(--text-color-3);
  2158. background: var(--button-background);
  2159. border: var(--app-border-width) solid var(--button-border-color);
  2160. color: var(--button-text-color);
  2161. box-shadow: var(--box-shadow);
  2162. text-decoration: none;
  2163. cursor: pointer;
  2164. text-shadow: var(--app-text-shadow);
  2165. box-shadow: unset;
  2166. }
  2167. [data-theme][id^=pf2e-perception-] .window-content .buttons button:not(.disabled, :disabled):hover {
  2168. background: var(--button-hover-background);
  2169. color: var(--button-hover-text-color);
  2170. border: var(--app-border-width) solid var(--button-hover-border-color);
  2171. box-shadow: var(--box-shadow);
  2172. }
  2173. [data-theme][id^=pf2e-perception-] .window-content .buttons button.view, [data-theme][id^=pf2e-perception-] .window-content .buttons button.selected, [data-theme][id^=pf2e-perception-] .window-content .buttons button.active {
  2174. background: var(--button-hover-background);
  2175. outline: 1px solid var(--button-focus-outline-color);
  2176. border-color: var(--button-hover-border-color);
  2177. color: var(--button-hover-text-color);
  2178. text-decoration: none !important;
  2179. font-weight: unset !important;
  2180. }
  2181. [data-theme][id^=pf2e-perception-] .window-content .buttons button.empty, [data-theme][id^=pf2e-perception-] .window-content .buttons button.disabled, [data-theme][id^=pf2e-perception-] .window-content .buttons button:disabled {
  2182. --button-background: var(--button-disabled-background);
  2183. --button-hover-background: var(--button-disabled-background);
  2184. --button-border-color: var(--button-disabled-border-color);
  2185. --button-text-color: var(--text-color-5);
  2186. }
  2187. [data-theme][id^=pf2e-perception-] .window-content .tokens section .token.ui-selected .name, [data-theme][id^=pf2e-perception-] .window-content .tokens section .token.ui-selecting .name {
  2188. color: var(--color-primary-1);
  2189. text-shadow: 0px 0px 5px var(--color-primary-2);
  2190. }
  2191. /* ----------------------------------------- */
  2192. /* Symon Custom CSS */
  2193. /* ----------------------------------------- */
  2194. #pf2e-token-hud.colorized .inner i.fa-solid.fa-circle-h {
  2195. color: darkgoldenrod;
  2196. }
  2197. #pf2e-token-hud.colorized .inner i.fa-solid.fa-user-graduate {
  2198. color: rgb(141, 69, 212);
  2199. }
  2200. #pf2e-token-hud.colorized .inner i.fa-solid.fa-heart-half-stroke {
  2201. color: orangered;
  2202. }
  2203. #pf2e-token-hud.colorized .inner i.fa-solid.fa-heart {
  2204. color: rgb(192, 1, 1);
  2205. }
  2206. #pf2e-token-hud.colorized .inner i.fa-regular.fa-helmet-battle {
  2207. color: #cdcdcd;
  2208. }
  2209. #pf2e-token-hud.colorized .inner i.fa-light.fa-block-brick {
  2210. color: deepskyblue;
  2211. }
  2212. #pf2e-token-hud.colorized .inner i.fa-solid.fa-shield,
  2213. #pf2e-token-hud.colorized .inner i.fa-regular.fa-shield {
  2214. color: rgb(103, 235, 213);
  2215. }
  2216. #pf2e-token-hud.colorized .inner i.fa-solid.fa-hand-fist {
  2217. color: rgb(201, 4, 201);
  2218. }
  2219. #pf2e-token-hud.colorized .inner i.fa-solid.fa-person-running {
  2220. color: blue;
  2221. }
  2222. #pf2e-token-hud.colorized .inner i.fa-solid.fa-brain {
  2223. color: deeppink;
  2224. }
  2225. #pf2e-token-hud.colorized .inner i.fa-solid.fa-tombstone {
  2226. color: brown;
  2227. }
  2228. #pf2e-token-hud.colorized .inner i.fa-solid.fa-shoe-prints {
  2229. color: green;
  2230. }
  2231. #pf2e-token-hud.colorized .inner i.fa-solid.fa-chevrons-down::before {
  2232. content: "\f713";
  2233. font: --fa-font-solid;
  2234. color: rgb(175, 87, 24);
  2235. }
  2236. #pf2e-token-hud.colorized .inner i.fa-solid.fa-feather {
  2237. color: white;
  2238. }
  2239. #pf2e-token-hud.colorized .inner i.fa-solid.fa-person-swimming {
  2240. color: dodgerblue;
  2241. }
  2242. #pf2e-token-hud.colorized .inner i.fa-solid.fa-spider {
  2243. color: #b7346f;
  2244. }
  2245. #pf2e-token-hud.colorized .inner i.fa-solid.fa-eye {
  2246. color: cadetblue;
  2247. }
  2248. #pf2e-token-hud.colorized .inner i.fa-solid.fa-chess-rook {
  2249. color: rgb(110, 143, 54);
  2250. }
  2251. #pf2e-token-hud.dorako-ui .sidebar.actions .section .action-icon {
  2252. background-color: rgba(255, 255, 255, 0.7098039216);
  2253. }
  2254. #pf2e-token-hud.dorako-ui .sidebar.hazard .section .action-icon {
  2255. background-color: rgba(255, 255, 255, 0.7098039216);
  2256. }
  2257. #pf2e-token-hud.dorako-ui .sidebar .sidebar-content .action-icon {
  2258. background-color: rgba(255, 255, 255, 0.7098039216);
  2259. }
  2260. [data-theme=bg3].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Extreme-color-primary,
  2261. [data-theme=foundry2].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Extreme-color-primary,
  2262. [data-theme][data-color-scheme=dark].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Extreme-color-primary {
  2263. color: #6cd8ff !important;
  2264. }
  2265. [data-theme=bg3].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-High-color-primary,
  2266. [data-theme=foundry2].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-High-color-primary,
  2267. [data-theme][data-color-scheme=dark].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-High-color-primary {
  2268. color: #3cff00 !important;
  2269. }
  2270. [data-theme=bg3].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Moderate-color-primary,
  2271. [data-theme=foundry2].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Moderate-color-primary,
  2272. [data-theme][data-color-scheme=dark].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Moderate-color-primary {
  2273. color: #ffff54 !important;
  2274. }
  2275. [data-theme=bg3].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Low-color-primary,
  2276. [data-theme=foundry2].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Low-color-primary,
  2277. [data-theme][data-color-scheme=dark].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Low-color-primary {
  2278. color: #ff8000 !important;
  2279. }
  2280. [data-theme=bg3].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Terrible-color-primary,
  2281. [data-theme=foundry2].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Terrible-color-primary,
  2282. [data-theme][data-color-scheme=dark].dorako-ux.sheet.pf2e.actor.npc .pf2e-see-simple-scale-statistics-Terrible-color-primary {
  2283. color: #ff0000 !important;
  2284. }
  2285. [data-dorako-ui-scope=limited].sheet.actor.character .sheet-body .sheet-content [data-tab=actions] .tab-content .actions-panels [data-tab=encounter] ol.actions-list.heroActions-list .action .item-controls > button {
  2286. color: black;
  2287. }
  2288. [data-dorako-ui-scope=limited].sheet.actor.character .sheet-body .sheet-content [data-tab=actions] .tab-content .actions-panels [data-tab=encounter] ol.actions-list.heroActions-list .action .item-controls > button:hover {
  2289. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), inset 0 0 0 2px rgba(0, 0, 0, 0.4);
  2290. }
  2291. [data-dorako-ui-scope=limited] button[data-action=hero-actions-trade],
  2292. [data-dorako-ui-scope=limited] .heroActions-list > button {
  2293. background: var(--app-background);
  2294. border: var(--app-border-width) solid var(--app-border-color);
  2295. text-shadow: var(--app-text-shadow);
  2296. border-radius: var(--border-radius);
  2297. box-shadow: var(--box-shadow);
  2298. color: var(--text-color-3);
  2299. background: var(--button-background);
  2300. border: var(--app-border-width) solid var(--button-border-color);
  2301. color: var(--button-text-color);
  2302. box-shadow: var(--box-shadow);
  2303. text-decoration: none;
  2304. cursor: pointer;
  2305. text-shadow: var(--app-text-shadow);
  2306. margin-top: 5px;
  2307. }
  2308. [data-dorako-ui-scope=limited] button[data-action=hero-actions-trade]:not(.disabled, :disabled):hover,
  2309. [data-dorako-ui-scope=limited] .heroActions-list > button:not(.disabled, :disabled):hover {
  2310. background: var(--button-hover-background);
  2311. color: var(--button-hover-text-color);
  2312. border: var(--app-border-width) solid var(--button-hover-border-color);
  2313. box-shadow: var(--box-shadow);
  2314. }
  2315. [data-dorako-ui-scope=limited] button[data-action=hero-actions-trade].view, [data-dorako-ui-scope=limited] button[data-action=hero-actions-trade].selected, [data-dorako-ui-scope=limited] button[data-action=hero-actions-trade].active,
  2316. [data-dorako-ui-scope=limited] .heroActions-list > button.view,
  2317. [data-dorako-ui-scope=limited] .heroActions-list > button.selected,
  2318. [data-dorako-ui-scope=limited] .heroActions-list > button.active {
  2319. background: var(--button-hover-background);
  2320. outline: 1px solid var(--button-focus-outline-color);
  2321. border-color: var(--button-hover-border-color);
  2322. color: var(--button-hover-text-color);
  2323. text-decoration: none !important;
  2324. font-weight: unset !important;
  2325. }
  2326. [data-dorako-ui-scope=limited] button[data-action=hero-actions-trade].empty, [data-dorako-ui-scope=limited] button[data-action=hero-actions-trade].disabled, [data-dorako-ui-scope=limited] button[data-action=hero-actions-trade]:disabled,
  2327. [data-dorako-ui-scope=limited] .heroActions-list > button.empty,
  2328. [data-dorako-ui-scope=limited] .heroActions-list > button.disabled,
  2329. [data-dorako-ui-scope=limited] .heroActions-list > button:disabled {
  2330. --button-background: var(--button-disabled-background);
  2331. --button-hover-background: var(--button-disabled-background);
  2332. --button-border-color: var(--button-disabled-border-color);
  2333. --button-text-color: var(--text-color-5);
  2334. }
  2335. [data-theme].chat-message [data-action=spell-template-clear] {
  2336. background: var(--app-background);
  2337. border: var(--app-border-width) solid var(--app-border-color);
  2338. text-shadow: var(--app-text-shadow);
  2339. border-radius: var(--border-radius);
  2340. box-shadow: var(--box-shadow);
  2341. color: var(--text-color-3);
  2342. background: var(--button-background);
  2343. border: var(--app-border-width) solid var(--button-border-color);
  2344. color: var(--button-text-color);
  2345. box-shadow: var(--box-shadow);
  2346. text-decoration: none;
  2347. cursor: pointer;
  2348. text-shadow: var(--app-text-shadow);
  2349. transition: background 0.1s ease-in-out;
  2350. --button-background: var(--accent-color);
  2351. --button-border-color: var(--accent-color-dark);
  2352. --button-text-color: var(--accent-text-color);
  2353. --app-text-shadow: none;
  2354. --button-hover-background: var(--accent-color-light);
  2355. --button-hover-border-color: var(--accent-color);
  2356. --button-hover-text-color: var(--accent-text-color);
  2357. }
  2358. [data-theme].chat-message [data-action=spell-template-clear]:not(.disabled, :disabled):hover {
  2359. background: var(--button-hover-background);
  2360. color: var(--button-hover-text-color);
  2361. border: var(--app-border-width) solid var(--button-hover-border-color);
  2362. box-shadow: var(--box-shadow);
  2363. }
  2364. [data-theme].chat-message [data-action=spell-template-clear].view, [data-theme].chat-message [data-action=spell-template-clear].selected, [data-theme].chat-message [data-action=spell-template-clear].active {
  2365. background: var(--button-hover-background);
  2366. outline: 1px solid var(--button-focus-outline-color);
  2367. border-color: var(--button-hover-border-color);
  2368. color: var(--button-hover-text-color);
  2369. text-decoration: none !important;
  2370. font-weight: unset !important;
  2371. }
  2372. [data-theme].chat-message [data-action=spell-template-clear].empty, [data-theme].chat-message [data-action=spell-template-clear].disabled, [data-theme].chat-message [data-action=spell-template-clear]:disabled {
  2373. --button-background: var(--button-disabled-background);
  2374. --button-hover-background: var(--button-disabled-background);
  2375. --button-border-color: var(--button-disabled-border-color);
  2376. --button-text-color: var(--text-color-5);
  2377. }
  2378. [data-theme].chat-message [data-action=spell-template-clear]:disabled {
  2379. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  2380. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  2381. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  2382. }
  2383. [data-theme].chat-message .message-content + .pf2e-toolbelt-target-damage .target-damage-application button::after {
  2384. border-radius: var(--border-radius);
  2385. }
  2386. [data-theme].chat-message .message-content + .pf2e-toolbelt-target-damage .target-damage-application button[data-action=target-shield-block]:hover {
  2387. background-color: var(--color-secondary-2);
  2388. border: var(--app-border-width) solid;
  2389. border-color: var(--color-secondary-1);
  2390. }
  2391. [data-theme].chat-message .message-content + .pf2e-toolbelt-target-damage .target-damage-application button[data-action=target-shield-block].shield-activated {
  2392. background-color: var(--color-secondary-1);
  2393. border: var(--app-border-width) solid;
  2394. border-color: var(--color-secondary-2);
  2395. }
  2396. [data-theme].chat-message .message-content + .pf2e-toolbelt-target-damage .target-damage-application button[data-action=target-shield-block].shield-activated:hover {
  2397. background-color: var(--color-secondary-2);
  2398. border: var(--app-border-width) solid;
  2399. border-color: var(--color-secondary-1);
  2400. }
  2401. [data-theme].chat-message .message-content + .pf2e-toolbelt-target-damage .target-damage-application button[data-action=target-apply-healing] .fa-stack i.fa-plus {
  2402. color: var(--color-secondary-5);
  2403. text-shadow: none;
  2404. }
  2405. [data-theme].chat-message .message-content + .pf2e-toolbelt-target-damage .target-damage-application button[data-action=target-apply-healing]:hover {
  2406. background-color: var(--color-level-success);
  2407. border-color: var(--color-level-success-border);
  2408. }
  2409. [data-theme].chat-message .message-content + .pf2e-toolbelt-target-damage .target-damage-application button[data-action=target-apply-healing]:hover .fa-stack i.fa-plus {
  2410. color: var(--color-level-success);
  2411. text-shadow: none;
  2412. }
  2413. [data-theme] #fc-container {
  2414. margin: 0px var(--sidebar-margin);
  2415. }
  2416. [data-theme] #fc-container button {
  2417. background: var(--app-background);
  2418. border: var(--app-border-width) solid var(--app-border-color);
  2419. text-shadow: var(--app-text-shadow);
  2420. border-radius: var(--border-radius);
  2421. box-shadow: var(--box-shadow);
  2422. color: var(--text-color-3);
  2423. background: var(--button-background);
  2424. border: var(--app-border-width) solid var(--button-border-color);
  2425. color: var(--button-text-color);
  2426. box-shadow: var(--box-shadow);
  2427. text-decoration: none;
  2428. cursor: pointer;
  2429. text-shadow: var(--app-text-shadow);
  2430. }
  2431. [data-theme] #fc-container button:not(.disabled, :disabled):hover {
  2432. background: var(--button-hover-background);
  2433. color: var(--button-hover-text-color);
  2434. border: var(--app-border-width) solid var(--button-hover-border-color);
  2435. box-shadow: var(--box-shadow);
  2436. }
  2437. [data-theme] #fc-container button.view, [data-theme] #fc-container button.selected, [data-theme] #fc-container button.active {
  2438. background: var(--button-hover-background);
  2439. outline: 1px solid var(--button-focus-outline-color);
  2440. border-color: var(--button-hover-border-color);
  2441. color: var(--button-hover-text-color);
  2442. text-decoration: none !important;
  2443. font-weight: unset !important;
  2444. }
  2445. [data-theme] #fc-container button.empty, [data-theme] #fc-container button.disabled, [data-theme] #fc-container button:disabled {
  2446. --button-background: var(--button-disabled-background);
  2447. --button-hover-background: var(--button-disabled-background);
  2448. --button-border-color: var(--button-disabled-border-color);
  2449. --button-text-color: var(--text-color-5);
  2450. }
  2451. [data-theme] #initiative-delay,
  2452. [data-theme] #initiative-return {
  2453. background: var(--app-background);
  2454. border: var(--app-border-width) solid var(--app-border-color);
  2455. text-shadow: var(--app-text-shadow);
  2456. border-radius: var(--border-radius);
  2457. box-shadow: var(--box-shadow);
  2458. color: var(--text-color-3);
  2459. background: var(--button-background);
  2460. border: var(--app-border-width) solid var(--button-border-color);
  2461. color: var(--button-text-color);
  2462. box-shadow: var(--box-shadow);
  2463. text-decoration: none;
  2464. cursor: pointer;
  2465. text-shadow: var(--app-text-shadow);
  2466. }
  2467. [data-theme] #initiative-delay:not(.disabled, :disabled):hover,
  2468. [data-theme] #initiative-return:not(.disabled, :disabled):hover {
  2469. background: var(--button-hover-background);
  2470. color: var(--button-hover-text-color);
  2471. border: var(--app-border-width) solid var(--button-hover-border-color);
  2472. box-shadow: var(--box-shadow);
  2473. }
  2474. [data-theme] #initiative-delay.view, [data-theme] #initiative-delay.selected, [data-theme] #initiative-delay.active,
  2475. [data-theme] #initiative-return.view,
  2476. [data-theme] #initiative-return.selected,
  2477. [data-theme] #initiative-return.active {
  2478. background: var(--button-hover-background);
  2479. outline: 1px solid var(--button-focus-outline-color);
  2480. border-color: var(--button-hover-border-color);
  2481. color: var(--button-hover-text-color);
  2482. text-decoration: none !important;
  2483. font-weight: unset !important;
  2484. }
  2485. [data-theme] #initiative-delay.empty, [data-theme] #initiative-delay.disabled, [data-theme] #initiative-delay:disabled,
  2486. [data-theme] #initiative-return.empty,
  2487. [data-theme] #initiative-return.disabled,
  2488. [data-theme] #initiative-return:disabled {
  2489. --button-background: var(--button-disabled-background);
  2490. --button-hover-background: var(--button-disabled-background);
  2491. --button-border-color: var(--button-disabled-border-color);
  2492. --button-text-color: var(--text-color-5);
  2493. }
  2494. .pinnedchatlog.tabs {
  2495. border: unset;
  2496. box-shadow: unset;
  2497. margin: 0px 2px;
  2498. }
  2499. .pinnedchatlog.tabs .item {
  2500. text-shadow: 0px 0px 3px black;
  2501. }
  2502. .pinnedchatlog.tabs .item.active {
  2503. border: none;
  2504. margin: 2px;
  2505. /* prettier-ignore */
  2506. box-shadow: 0 0 0 1px var(--tertiary), 0 0 0 2px var(--gold-brown);
  2507. border-radius: 3px;
  2508. color: var(--color-text-light-highlight);
  2509. background: var(--primary-light);
  2510. }
  2511. /* ----------------------------------------- */
  2512. /* Polyglot */
  2513. /* ----------------------------------------- */
  2514. [data-chat-interface-theme] #polyglot label {
  2515. display: none;
  2516. }
  2517. [data-chat-interface-theme] .polyglot-lang-select input {
  2518. margin: unset;
  2519. }
  2520. [data-chat-interface-theme] .polyglot-lang-select span.select2-selection {
  2521. background: var(--input-background);
  2522. border: var(--app-border-width) solid;
  2523. border-color: var(--input-border-color) !important;
  2524. color: var(--input-text-color);
  2525. box-shadow: var(--input-box-shadow) !important;
  2526. align-items: center;
  2527. border-radius: 4px;
  2528. outline: 1px solid transparent;
  2529. user-select: text;
  2530. transition: outline-color 0.5s;
  2531. }
  2532. [data-chat-interface-theme] .polyglot-lang-select span.select2-selection:not(:disabled, .disabled, [type=checkbox]):hover, [data-chat-interface-theme] .polyglot-lang-select span.select2-selection:focus {
  2533. outline: 1px solid var(--input-focus-outline-color);
  2534. border: var(--app-border-width) solid;
  2535. border-color: var(--input-border-color);
  2536. color: var(--input-focus-text-color);
  2537. box-shadow: var(--box-shadow);
  2538. }
  2539. [data-chat-interface-theme] .polyglot-lang-select span.select2-selection.disabled, [data-chat-interface-theme] .polyglot-lang-select span.select2-selection:disabled {
  2540. --input-text-color: var(--text-color-disabled);
  2541. --input-background: var(--input-disabled-background);
  2542. --input-border-color: var(--input-disabled-border-color);
  2543. }
  2544. [data-chat-interface-theme] .polyglot-lang-select span.select2-selection.disabled::placeholder, [data-chat-interface-theme] .polyglot-lang-select span.select2-selection:disabled::placeholder {
  2545. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  2546. }
  2547. [data-chat-interface-theme] .polyglot-lang-select span.select2-selection::placeholder {
  2548. color: var(--input-placeholder-color);
  2549. }
  2550. [data-chat-interface-theme] .polyglot-lang-select span.select2-selection[type=checkbox] {
  2551. outline: unset !important;
  2552. border: unset !important;
  2553. box-shadow: unset !important;
  2554. }
  2555. [data-chat-interface-theme] .polyglot-lang-select .select2-container--default .select2-selection--single .select2-selection__rendered {
  2556. color: var(--input-text-color);
  2557. }
  2558. [data-chat-interface-theme] .polyglot-lang-select .select2-container--default .select2-selection--single .select2-selection__arrow b {
  2559. border-color: var(--input-text-color) transparent transparent transparent;
  2560. }
  2561. [data-chat-interface-theme] .polyglot-user-list div {
  2562. box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.5) inset;
  2563. width: 14px;
  2564. height: 14px;
  2565. }
  2566. #taskbar.taskbar {
  2567. width: calc((100vw - var(--sidebar-width)) / var(--ft-scale));
  2568. }
  2569. [data-theme].quick-insert-app {
  2570. background: none;
  2571. background: var(--app-background);
  2572. border: var(--app-border-width) solid var(--app-border-color);
  2573. text-shadow: var(--app-text-shadow);
  2574. border-radius: var(--border-radius);
  2575. box-shadow: var(--box-shadow);
  2576. color: var(--text-color-3);
  2577. backdrop-filter: blur(5px);
  2578. }
  2579. [data-theme].quick-insert-app .quick-insert-result li img {
  2580. border: 1px solid var(--color-primary-1);
  2581. border-radius: var(--border-radius);
  2582. background-color: var(--color-secondary-2);
  2583. }
  2584. [data-theme].quick-insert-app .search-selected a,
  2585. [data-theme] .quick-insert-result li a:hover {
  2586. background: var(--color-primary-2);
  2587. text-shadow: 0px 1px 2px black !important;
  2588. border-radius: var(--border-radius);
  2589. }
  2590. [data-theme].quick-insert-app .search-selected a span.sub,
  2591. [data-theme] .quick-insert-result li a:hover span.sub {
  2592. color: var(--text-color-4);
  2593. }
  2594. [data-theme].quick-insert-app .search-editable-input {
  2595. background: var(--input-background);
  2596. border: var(--app-border-width) solid;
  2597. border-color: var(--input-border-color) !important;
  2598. color: var(--input-text-color);
  2599. box-shadow: var(--input-box-shadow) !important;
  2600. align-items: center;
  2601. border-radius: 4px;
  2602. outline: 1px solid transparent;
  2603. user-select: text;
  2604. transition: outline-color 0.5s;
  2605. outline: none !important;
  2606. text-shadow: none;
  2607. }
  2608. [data-theme].quick-insert-app .search-editable-input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].quick-insert-app .search-editable-input:focus {
  2609. outline: 1px solid var(--input-focus-outline-color);
  2610. border: var(--app-border-width) solid;
  2611. border-color: var(--input-border-color);
  2612. color: var(--input-focus-text-color);
  2613. box-shadow: var(--box-shadow);
  2614. }
  2615. [data-theme].quick-insert-app .search-editable-input.disabled, [data-theme].quick-insert-app .search-editable-input:disabled {
  2616. --input-text-color: var(--text-color-disabled);
  2617. --input-background: var(--input-disabled-background);
  2618. --input-border-color: var(--input-disabled-border-color);
  2619. }
  2620. [data-theme].quick-insert-app .search-editable-input.disabled::placeholder, [data-theme].quick-insert-app .search-editable-input:disabled::placeholder {
  2621. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  2622. }
  2623. [data-theme].quick-insert-app .search-editable-input::placeholder {
  2624. color: var(--input-placeholder-color);
  2625. }
  2626. [data-theme].quick-insert-app .search-editable-input[type=checkbox] {
  2627. outline: unset !important;
  2628. border: unset !important;
  2629. box-shadow: unset !important;
  2630. }
  2631. [data-theme] .quick-insert-hint {
  2632. background: none;
  2633. }
  2634. [data-theme] .quick-insert-result {
  2635. background: none;
  2636. }
  2637. [data-theme] .quick-insert-result li a i.action-icon {
  2638. opacity: 1;
  2639. color: var(--text-color-3);
  2640. background: rgba(255, 255, 255, 0.1333333333);
  2641. }
  2642. [data-theme] .quick-insert-result li span.sub {
  2643. color: var(--text-color-5);
  2644. }
  2645. .dorako-ui.quick-insert-app {
  2646. background: none;
  2647. border: none;
  2648. border-radius: var(--border-radius);
  2649. background: none;
  2650. background-color: var(--glass-bg);
  2651. box-shadow: var(--glassy);
  2652. backdrop-filter: blur(5px);
  2653. color: var(--text-color-1);
  2654. text-shadow: 0px 1px 2px black;
  2655. }
  2656. .dorako-ui.quick-insert-app .quick-insert-result li img {
  2657. border: 1px solid var(--tertiary);
  2658. border-radius: var(--border-radius);
  2659. background-color: var(--alt);
  2660. }
  2661. .dorako-ui.quick-insert-app .search-selected a,
  2662. .dorako-ui .quick-insert-result li a:hover {
  2663. background: var(--primary);
  2664. text-shadow: 0px 1px 2px black !important;
  2665. border-radius: var(--border-radius);
  2666. }
  2667. .dorako-ui.quick-insert-app .search-selected a span.sub,
  2668. .dorako-ui .quick-insert-result li a:hover span.sub {
  2669. color: var(--text-color-4);
  2670. }
  2671. .dorako-ui.quick-insert-app .search-editable-input {
  2672. background: none;
  2673. }
  2674. .dorako-ui .quick-insert-hint {
  2675. background: none;
  2676. }
  2677. .dorako-ui .quick-insert-result {
  2678. background: none;
  2679. }
  2680. .dorako-ui .quick-insert-result li a i.action-icon {
  2681. opacity: 1;
  2682. color: var(--text-color-3);
  2683. background: rgba(255, 255, 255, 0.1333333333);
  2684. }
  2685. .dorako-ui .quick-insert-result li span.sub {
  2686. color: var(--text-color-5);
  2687. }
  2688. /* ----------------------------------------- */
  2689. /* Scene Preview */
  2690. /* ----------------------------------------- */
  2691. [data-theme]#smalltime-app #displayContainer {
  2692. background: unset;
  2693. box-shadow: unset;
  2694. }
  2695. [data-theme]#smalltime-app #dragHandle {
  2696. background: unset;
  2697. }
  2698. [data-theme]#smalltime-app #slideContainer {
  2699. max-height: 24px;
  2700. }
  2701. [data-theme]#smalltime-app #dateDisplay {
  2702. text-shadow: 0px 1px 2px black;
  2703. background: unset;
  2704. box-shadow: unset;
  2705. }
  2706. [data-theme]#smalltime-app {
  2707. background: var(--app-background);
  2708. border: var(--app-border-width) solid var(--app-border-color);
  2709. text-shadow: var(--app-text-shadow);
  2710. border-radius: var(--border-radius);
  2711. box-shadow: var(--box-shadow);
  2712. color: var(--text-color-3);
  2713. outline: none;
  2714. }
  2715. [data-theme]#smalltime-app .arrow, [data-theme]#smalltime-app .arrow-left, [data-theme]#smalltime-app.arrow-right {
  2716. background: var(--app-background);
  2717. border: var(--app-border-width) solid var(--app-border-color);
  2718. text-shadow: var(--app-text-shadow);
  2719. border-radius: var(--border-radius);
  2720. box-shadow: var(--box-shadow);
  2721. color: var(--text-color-3);
  2722. background: var(--button-background);
  2723. border: var(--app-border-width) solid var(--button-border-color);
  2724. color: var(--button-text-color);
  2725. box-shadow: var(--box-shadow);
  2726. text-decoration: none;
  2727. cursor: pointer;
  2728. text-shadow: var(--app-text-shadow);
  2729. }
  2730. [data-theme]#smalltime-app .arrow:not(.disabled, :disabled):hover, [data-theme]#smalltime-app .arrow-left:not(.disabled, :disabled):hover, [data-theme]#smalltime-app.arrow-right:not(.disabled, :disabled):hover {
  2731. background: var(--button-hover-background);
  2732. color: var(--button-hover-text-color);
  2733. border: var(--app-border-width) solid var(--button-hover-border-color);
  2734. box-shadow: var(--box-shadow);
  2735. }
  2736. [data-theme]#smalltime-app .arrow.view, [data-theme]#smalltime-app .arrow.selected, [data-theme]#smalltime-app .arrow.active, [data-theme]#smalltime-app .arrow-left.view, [data-theme]#smalltime-app .arrow-left.selected, [data-theme]#smalltime-app .arrow-left.active, [data-theme]#smalltime-app.arrow-right.view, [data-theme]#smalltime-app.arrow-right.selected, [data-theme]#smalltime-app.arrow-right.active {
  2737. background: var(--button-hover-background);
  2738. outline: 1px solid var(--button-focus-outline-color);
  2739. border-color: var(--button-hover-border-color);
  2740. color: var(--button-hover-text-color);
  2741. text-decoration: none !important;
  2742. font-weight: unset !important;
  2743. }
  2744. [data-theme]#smalltime-app .arrow.empty, [data-theme]#smalltime-app .arrow.disabled, [data-theme]#smalltime-app .arrow:disabled, [data-theme]#smalltime-app .arrow-left.empty, [data-theme]#smalltime-app .arrow-left.disabled, [data-theme]#smalltime-app .arrow-left:disabled, [data-theme]#smalltime-app.arrow-right.empty, [data-theme]#smalltime-app.arrow-right.disabled, [data-theme]#smalltime-app.arrow-right:disabled {
  2745. --button-background: var(--button-disabled-background);
  2746. --button-hover-background: var(--button-disabled-background);
  2747. --button-border-color: var(--button-disabled-border-color);
  2748. --button-text-color: var(--text-color-5);
  2749. }
  2750. /* ----------------------------------------- */
  2751. /* Speaking As */
  2752. /* ----------------------------------------- */
  2753. div.speaking-as--currentSpeaker + #chat-controls {
  2754. padding: 0px;
  2755. }
  2756. .chat-sidebar .speaking-as--currentSpeaker {
  2757. border: none;
  2758. border-radius: var(--border-radius);
  2759. background: none;
  2760. background-color: var(--glass-bg);
  2761. box-shadow: var(--glassy);
  2762. background-color: var(--glass-bg-light);
  2763. padding-left: 5px;
  2764. margin: 0px 5px;
  2765. text-shadow: 0px 0px 3px black;
  2766. padding-left: 8px;
  2767. }
  2768. .speaking-as--currentSpeaker--button {
  2769. cursor: pointer;
  2770. }
  2771. .speaking-as--currentSpeaker--button:hover {
  2772. color: var(--color-text-light-highlight);
  2773. }
  2774. [data-theme] .speaking-as--currentSpeaker {
  2775. background: var(--app-background);
  2776. border: var(--app-border-width) solid var(--app-border-color);
  2777. text-shadow: var(--app-text-shadow);
  2778. border-radius: var(--border-radius);
  2779. box-shadow: var(--box-shadow);
  2780. color: var(--text-color-3);
  2781. margin: 0px var(--sidebar-margin);
  2782. }
  2783. .compendium-toc .toc .toc-entry .name {
  2784. text-decoration-color: var(--color-underline-header);
  2785. }
  2786. .compendium-toc .toc .content {
  2787. column-rule: 4px double var(--color-underline-header);
  2788. }
  2789. .swpf-compendium .window-header a.header-button {
  2790. color: var(--color-text-dark-primary);
  2791. font-weight: bold;
  2792. }
  2793. body.system-swade {
  2794. --primary-dark: #5c0b07;
  2795. --primary: #8c160f;
  2796. --primary-light: #bc2922;
  2797. }
  2798. [data-theme] fieldset.tagger .tag-container .tag {
  2799. border: 1px solid var(--color-secondary-4);
  2800. background: var(--color-secondary-3);
  2801. color: var(--text-color-2);
  2802. }
  2803. [data-theme] fieldset.tagger .tag-container .tag.dropping {
  2804. background: #c6eaa7;
  2805. background: var(--color-primary-2);
  2806. }
  2807. [data-theme] fieldset.tagger .tag-container .tag span:hover {
  2808. color: #834100;
  2809. color: var(--text-color-2);
  2810. }
  2811. [data-theme] fieldset.tagger .tag-container .tag i:hover {
  2812. color: #e30f0f;
  2813. color: var(--color-primary-1);
  2814. }
  2815. [data-theme] fieldset.tagger .tag-container .tag:has(i:hover) {
  2816. background-color: #ffb6b6;
  2817. background-color: var(--color-primary-2);
  2818. background-color: var(--color-level-error);
  2819. }
  2820. [data-theme] fieldset.tagger .tag-container .tag:has(span:hover) {
  2821. background-color: #fffdd4;
  2822. background-color: var(--color-primary-2);
  2823. }
  2824. /* ----------------------------------------- */
  2825. /* PF2e Target Damage */
  2826. /* ----------------------------------------- */
  2827. .pf2e-td.name {
  2828. font-size: var(--font-size-9);
  2829. }
  2830. [data-theme] .pf2e-td .damage-application {
  2831. margin-top: unset;
  2832. }
  2833. [data-theme] .pf2e-td.small-button.target-button {
  2834. background: var(--app-background);
  2835. border: var(--app-border-width) solid var(--app-border-color);
  2836. text-shadow: var(--app-text-shadow);
  2837. border-radius: var(--border-radius);
  2838. box-shadow: var(--box-shadow);
  2839. color: var(--text-color-3);
  2840. background: var(--button-background);
  2841. border: var(--app-border-width) solid var(--button-border-color);
  2842. color: var(--button-text-color);
  2843. box-shadow: var(--box-shadow);
  2844. text-decoration: none;
  2845. cursor: pointer;
  2846. text-shadow: var(--app-text-shadow);
  2847. transition: background 0.1s ease-in-out;
  2848. --button-background: var(--button-toggle-background);
  2849. --button-border-color: var(--button-toggle-border-color);
  2850. --button-focus-outline-color: var(--button-toggle-focus-outline-color);
  2851. --button-hover-background: var(--button-toggle-hover-background);
  2852. --button-hover-border-color: var(--button-toggle-hover-border-color);
  2853. }
  2854. [data-theme] .pf2e-td.small-button.target-button:not(.disabled, :disabled):hover {
  2855. background: var(--button-hover-background);
  2856. color: var(--button-hover-text-color);
  2857. border: var(--app-border-width) solid var(--button-hover-border-color);
  2858. box-shadow: var(--box-shadow);
  2859. }
  2860. [data-theme] .pf2e-td.small-button.target-button.view, [data-theme] .pf2e-td.small-button.target-button.selected, [data-theme] .pf2e-td.small-button.target-button.active {
  2861. background: var(--button-hover-background);
  2862. outline: 1px solid var(--button-focus-outline-color);
  2863. border-color: var(--button-hover-border-color);
  2864. color: var(--button-hover-text-color);
  2865. text-decoration: none !important;
  2866. font-weight: unset !important;
  2867. }
  2868. [data-theme] .pf2e-td.small-button.target-button.empty, [data-theme] .pf2e-td.small-button.target-button.disabled, [data-theme] .pf2e-td.small-button.target-button:disabled {
  2869. --button-background: var(--button-disabled-background);
  2870. --button-hover-background: var(--button-disabled-background);
  2871. --button-border-color: var(--button-disabled-border-color);
  2872. --button-text-color: var(--text-color-5);
  2873. }
  2874. [data-theme] .pf2e-td.small-button.target-button:disabled {
  2875. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  2876. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  2877. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  2878. }
  2879. [data-theme].message.chat-message .message-content .pf2e.chat-card .card-buttons .save.pf2e-td.criticalSuccess {
  2880. --button-background: var(--degree-success-critical);
  2881. --button-hover-background: var(--degree-success-critical);
  2882. --button-text-color: white;
  2883. }
  2884. [data-theme].message.chat-message .message-content .pf2e.chat-card .card-buttons .save.pf2e-td.success {
  2885. --button-background: var(--degree-success);
  2886. --button-hover-background: var(--degree-success);
  2887. --button-text-color: white;
  2888. }
  2889. [data-theme].message.chat-message .message-content .pf2e.chat-card .card-buttons .save.pf2e-td.failure {
  2890. --button-background: var(--degree-failure);
  2891. --button-hover-background: var(--degree-failure);
  2892. --button-text-color: white;
  2893. }
  2894. [data-theme].message.chat-message .message-content .pf2e.chat-card .card-buttons .save.pf2e-td.criticalFailure {
  2895. --button-background: var(--degree-failure-critical);
  2896. --button-hover-background: var(--degree-failure-critical);
  2897. --button-text-color: white;
  2898. }
  2899. .chat-message .message-content .pf2e-td.damage-application button .label {
  2900. font-size: var(--font-size-8);
  2901. }
  2902. wrapper.pf2e-td.name-top .pf2e-td.name {
  2903. background: rgba(0, 0, 0, 0.1);
  2904. border: 1px solid var(--color-border-light-2);
  2905. border-radius: 3px;
  2906. box-shadow: 0 0 2px #fff inset;
  2907. width: 100%;
  2908. }
  2909. [data-theme]#token-action-hud-core-settings input {
  2910. background: var(--input-background);
  2911. border: var(--app-border-width) solid;
  2912. border-color: var(--input-border-color) !important;
  2913. color: var(--input-text-color);
  2914. box-shadow: var(--input-box-shadow) !important;
  2915. align-items: center;
  2916. border-radius: 4px;
  2917. outline: 1px solid transparent;
  2918. user-select: text;
  2919. transition: outline-color 0.5s;
  2920. }
  2921. [data-theme]#token-action-hud-core-settings input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme]#token-action-hud-core-settings input:focus {
  2922. outline: 1px solid var(--input-focus-outline-color);
  2923. border: var(--app-border-width) solid;
  2924. border-color: var(--input-border-color);
  2925. color: var(--input-focus-text-color);
  2926. box-shadow: var(--box-shadow);
  2927. }
  2928. [data-theme]#token-action-hud-core-settings input.disabled, [data-theme]#token-action-hud-core-settings input:disabled {
  2929. --input-text-color: var(--text-color-disabled);
  2930. --input-background: var(--input-disabled-background);
  2931. --input-border-color: var(--input-disabled-border-color);
  2932. }
  2933. [data-theme]#token-action-hud-core-settings input.disabled::placeholder, [data-theme]#token-action-hud-core-settings input:disabled::placeholder {
  2934. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  2935. }
  2936. [data-theme]#token-action-hud-core-settings input::placeholder {
  2937. color: var(--input-placeholder-color);
  2938. }
  2939. [data-theme]#token-action-hud-core-settings input[type=checkbox] {
  2940. outline: unset !important;
  2941. border: unset !important;
  2942. box-shadow: unset !important;
  2943. }
  2944. #tooltip[data-theme].locked-tooltip.tah-tooltip :is(a.content-link, a.inline-roll), #tooltip[data-theme].tah-tooltip :is(a.content-link, a.inline-roll), #tooltip[data-theme].active:has(.tah-tooltip-wrapper) :is(a.content-link, a.inline-roll) {
  2945. background: var(--inline-background);
  2946. border: 1px solid var(--inline-border-color);
  2947. color: var(--inline-text-color) !important;
  2948. box-shadow: var(--inline-box-shadow);
  2949. }
  2950. #tooltip[data-theme].locked-tooltip.tah-tooltip :is(a.content-link, a.inline-roll).broken, #tooltip[data-theme].tah-tooltip :is(a.content-link, a.inline-roll).broken, #tooltip[data-theme].active:has(.tah-tooltip-wrapper) :is(a.content-link, a.inline-roll).broken {
  2951. border: 1px dashed red;
  2952. background: rgba(255, 0, 0, 0.05);
  2953. }
  2954. #tooltip[data-theme].locked-tooltip.tah-tooltip :is(a.content-link, a.inline-roll).gmroll, #tooltip[data-theme].tah-tooltip :is(a.content-link, a.inline-roll).gmroll, #tooltip[data-theme].active:has(.tah-tooltip-wrapper) :is(a.content-link, a.inline-roll).gmroll {
  2955. background: #e8e8ef;
  2956. border-color: #545469;
  2957. }
  2958. #tooltip[data-theme].locked-tooltip.tah-tooltip :is(a.content-link, a.inline-roll).blindroll, #tooltip[data-theme].tah-tooltip :is(a.content-link, a.inline-roll).blindroll, #tooltip[data-theme].active:has(.tah-tooltip-wrapper) :is(a.content-link, a.inline-roll).blindroll {
  2959. background: #f5eaf5;
  2960. border-color: #6b476b;
  2961. }
  2962. #tooltip[data-theme].locked-tooltip.tah-tooltip :is(a.content-link, a.inline-roll)::before,
  2963. #tooltip[data-theme].locked-tooltip.tah-tooltip :is(a.content-link, a.inline-roll) i,
  2964. #tooltip[data-theme].locked-tooltip.tah-tooltip :is(a.content-link, a.inline-roll) i.icon, #tooltip[data-theme].tah-tooltip :is(a.content-link, a.inline-roll)::before,
  2965. #tooltip[data-theme].tah-tooltip :is(a.content-link, a.inline-roll) i,
  2966. #tooltip[data-theme].tah-tooltip :is(a.content-link, a.inline-roll) i.icon, #tooltip[data-theme].active:has(.tah-tooltip-wrapper) :is(a.content-link, a.inline-roll)::before,
  2967. #tooltip[data-theme].active:has(.tah-tooltip-wrapper) :is(a.content-link, a.inline-roll) i,
  2968. #tooltip[data-theme].active:has(.tah-tooltip-wrapper) :is(a.content-link, a.inline-roll) i.icon {
  2969. color: var(--inline-icon-color);
  2970. }
  2971. #tooltip[data-theme].locked-tooltip.tah-tooltip :is(a.content-link, a.inline-roll) [data-visibility]:not([data-visibility=all]), #tooltip[data-theme].tah-tooltip :is(a.content-link, a.inline-roll) [data-visibility]:not([data-visibility=all]), #tooltip[data-theme].active:has(.tah-tooltip-wrapper) :is(a.content-link, a.inline-roll) [data-visibility]:not([data-visibility=all]) {
  2972. color: var(--inline-text-color) !important;
  2973. outline: 1px dashed var(--inline-text-color);
  2974. }
  2975. [data-theme]#token-action-hud .tah-action-button,
  2976. [data-theme]#token-action-hud .tah-action-button:focus,
  2977. [data-theme]#token-action-hud .tah-group-button,
  2978. [data-theme]#token-action-hud .tah-group-button:focus {
  2979. background: var(--app-background);
  2980. border: var(--app-border-width) solid var(--app-border-color);
  2981. text-shadow: var(--app-text-shadow);
  2982. border-radius: var(--border-radius);
  2983. box-shadow: var(--box-shadow);
  2984. color: var(--text-color-3);
  2985. background: var(--button-background);
  2986. border: var(--app-border-width) solid var(--button-border-color);
  2987. color: var(--button-text-color);
  2988. box-shadow: var(--box-shadow);
  2989. text-decoration: none;
  2990. cursor: pointer;
  2991. text-shadow: var(--app-text-shadow);
  2992. }
  2993. [data-theme]#token-action-hud .tah-action-button:not(.disabled, :disabled):hover,
  2994. [data-theme]#token-action-hud .tah-action-button:focus:not(.disabled, :disabled):hover,
  2995. [data-theme]#token-action-hud .tah-group-button:not(.disabled, :disabled):hover,
  2996. [data-theme]#token-action-hud .tah-group-button:focus:not(.disabled, :disabled):hover {
  2997. background: var(--button-hover-background);
  2998. color: var(--button-hover-text-color);
  2999. border: var(--app-border-width) solid var(--button-hover-border-color);
  3000. box-shadow: var(--box-shadow);
  3001. }
  3002. [data-theme]#token-action-hud .tah-action-button.view, [data-theme]#token-action-hud .tah-action-button.selected, [data-theme]#token-action-hud .tah-action-button.active,
  3003. [data-theme]#token-action-hud .tah-action-button:focus.view,
  3004. [data-theme]#token-action-hud .tah-action-button:focus.selected,
  3005. [data-theme]#token-action-hud .tah-action-button:focus.active,
  3006. [data-theme]#token-action-hud .tah-group-button.view,
  3007. [data-theme]#token-action-hud .tah-group-button.selected,
  3008. [data-theme]#token-action-hud .tah-group-button.active,
  3009. [data-theme]#token-action-hud .tah-group-button:focus.view,
  3010. [data-theme]#token-action-hud .tah-group-button:focus.selected,
  3011. [data-theme]#token-action-hud .tah-group-button:focus.active {
  3012. background: var(--button-hover-background);
  3013. outline: 1px solid var(--button-focus-outline-color);
  3014. border-color: var(--button-hover-border-color);
  3015. color: var(--button-hover-text-color);
  3016. text-decoration: none !important;
  3017. font-weight: unset !important;
  3018. }
  3019. [data-theme]#token-action-hud .tah-action-button.empty, [data-theme]#token-action-hud .tah-action-button.disabled, [data-theme]#token-action-hud .tah-action-button:disabled,
  3020. [data-theme]#token-action-hud .tah-action-button:focus.empty,
  3021. [data-theme]#token-action-hud .tah-action-button:focus.disabled,
  3022. [data-theme]#token-action-hud .tah-action-button:focus:disabled,
  3023. [data-theme]#token-action-hud .tah-group-button.empty,
  3024. [data-theme]#token-action-hud .tah-group-button.disabled,
  3025. [data-theme]#token-action-hud .tah-group-button:disabled,
  3026. [data-theme]#token-action-hud .tah-group-button:focus.empty,
  3027. [data-theme]#token-action-hud .tah-group-button:focus.disabled,
  3028. [data-theme]#token-action-hud .tah-group-button:focus:disabled {
  3029. --button-background: var(--button-disabled-background);
  3030. --button-hover-background: var(--button-disabled-background);
  3031. --button-border-color: var(--button-disabled-border-color);
  3032. --button-text-color: var(--text-color-5);
  3033. }
  3034. [data-theme]#token-action-hud .tah-subtitle-text {
  3035. color: var(--text-color-1);
  3036. }
  3037. [data-theme]#token-action-hud .tah-info1,
  3038. [data-theme]#token-action-hud .tah-info2,
  3039. [data-theme]#token-action-hud .tah-info3 {
  3040. color: var(--text-color-4);
  3041. font-size: x-small;
  3042. }
  3043. [data-theme]#token-action-hud button {
  3044. transition: unset !important;
  3045. }
  3046. [data-theme]#token-action-hud #tah-expand-hud {
  3047. background: var(--app-background);
  3048. border: var(--app-border-width) solid var(--app-border-color);
  3049. text-shadow: var(--app-text-shadow);
  3050. border-radius: var(--border-radius);
  3051. box-shadow: var(--box-shadow);
  3052. color: var(--text-color-3);
  3053. justify-content: center;
  3054. width: 32px;
  3055. }
  3056. [data-theme]#token-action-hud #tah-expand-hud > i {
  3057. color: var(--text-color-3);
  3058. text-shadow: 0px 1px 2px black;
  3059. }
  3060. [data-theme]#token-action-hud #tah-collapse-hud,
  3061. [data-theme]#token-action-hud #tah-unlock {
  3062. --box-shadow: none !important;
  3063. box-shadow: none !important;
  3064. }
  3065. [data-theme]#token-action-hud .tah-action-button.toggle {
  3066. background: var(--app-background);
  3067. border: var(--app-border-width) solid var(--app-border-color);
  3068. text-shadow: var(--app-text-shadow);
  3069. border-radius: var(--border-radius);
  3070. box-shadow: var(--box-shadow);
  3071. color: var(--text-color-3);
  3072. background: var(--button-background);
  3073. border: var(--app-border-width) solid var(--button-border-color);
  3074. color: var(--button-text-color);
  3075. box-shadow: var(--box-shadow);
  3076. text-decoration: none;
  3077. cursor: pointer;
  3078. text-shadow: var(--app-text-shadow);
  3079. transition: background 0.1s ease-in-out;
  3080. --button-background: var(--button-toggle-background);
  3081. --button-border-color: var(--button-toggle-border-color);
  3082. --button-focus-outline-color: var(--button-toggle-focus-outline-color);
  3083. --button-hover-background: var(--button-toggle-hover-background);
  3084. --button-hover-border-color: var(--button-toggle-hover-border-color);
  3085. }
  3086. [data-theme]#token-action-hud .tah-action-button.toggle:not(.disabled, :disabled):hover {
  3087. background: var(--button-hover-background);
  3088. color: var(--button-hover-text-color);
  3089. border: var(--app-border-width) solid var(--button-hover-border-color);
  3090. box-shadow: var(--box-shadow);
  3091. }
  3092. [data-theme]#token-action-hud .tah-action-button.toggle.view, [data-theme]#token-action-hud .tah-action-button.toggle.selected, [data-theme]#token-action-hud .tah-action-button.toggle.active {
  3093. background: var(--button-hover-background);
  3094. outline: 1px solid var(--button-focus-outline-color);
  3095. border-color: var(--button-hover-border-color);
  3096. color: var(--button-hover-text-color);
  3097. text-decoration: none !important;
  3098. font-weight: unset !important;
  3099. }
  3100. [data-theme]#token-action-hud .tah-action-button.toggle.empty, [data-theme]#token-action-hud .tah-action-button.toggle.disabled, [data-theme]#token-action-hud .tah-action-button.toggle:disabled {
  3101. --button-background: var(--button-disabled-background);
  3102. --button-hover-background: var(--button-disabled-background);
  3103. --button-border-color: var(--button-disabled-border-color);
  3104. --button-text-color: var(--text-color-5);
  3105. }
  3106. [data-theme]#token-action-hud .tah-action-button.toggle:disabled {
  3107. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  3108. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  3109. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  3110. }
  3111. [data-theme]#token-action-hud .tah-button-image {
  3112. border-top-left-radius: var(--border-radius);
  3113. border-bottom-left-radius: var(--border-radius);
  3114. }
  3115. [data-theme]#token-action-hud .tah-group[data-level="3"] > .tah-list-image {
  3116. background: var(--app-background);
  3117. border: var(--app-border-width) solid var(--app-border-color);
  3118. text-shadow: var(--app-text-shadow);
  3119. border-radius: var(--border-radius);
  3120. box-shadow: var(--box-shadow);
  3121. color: var(--text-color-3);
  3122. }
  3123. [data-theme]#token-action-hud .tah-action button.tah-pf2e-skill-rank-1 {
  3124. --button-background: #171f69;
  3125. --button-border-color: #3a47ba;
  3126. }
  3127. [data-theme]#token-action-hud .tah-action button.tah-pf2e-skill-rank-2 {
  3128. --button-background: #3c005e;
  3129. --button-border-color: #630e94;
  3130. }
  3131. [data-theme]#token-action-hud .tah-action button.tah-pf2e-skill-rank-3 {
  3132. --button-background: #640;
  3133. --button-border-color: rgb(153, 107, 14);
  3134. }
  3135. [data-theme]#token-action-hud .tah-action button.tah-pf2e-skill-rank-4 {
  3136. --button-background: #5e0000;
  3137. --button-border-color: #960b0b;
  3138. }
  3139. [data-theme]#token-action-hud .tah-action button.tah-pf2e-skill-rank-1,
  3140. [data-theme]#token-action-hud .tah-action button.tah-pf2e-skill-rank-2,
  3141. [data-theme]#token-action-hud .tah-action button.tah-pf2e-skill-rank-3,
  3142. [data-theme]#token-action-hud .tah-action button.tah-pf2e-skill-rank-4 {
  3143. --button-text-color: var(--text-color-2);
  3144. }
  3145. [data-theme] #tokenizer div.avatar div.view > div > canvas,
  3146. [data-theme] #tokenizer div.token div.view > div > canvas {
  3147. background: var(--app-background);
  3148. border: var(--app-border-width) solid var(--app-border-color);
  3149. text-shadow: var(--app-text-shadow);
  3150. border-radius: var(--border-radius);
  3151. box-shadow: var(--box-shadow);
  3152. color: var(--text-color-3);
  3153. background-image: linear-gradient(45deg, #808080 25%, transparent 25%), linear-gradient(-45deg, #808080 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #808080 75%), linear-gradient(-45deg, transparent 75%, #808080 75%);
  3154. background-size: 20px 20px;
  3155. background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
  3156. }
  3157. [data-theme] #tokenizer div.menu,
  3158. [data-theme] #tokenizer div.view-layer-control {
  3159. background: unset;
  3160. }
  3161. [data-theme] #tokenizer div.view-layer-control {
  3162. border: unset;
  3163. }
  3164. [data-theme] #tokenizer div.view-layer-control canvas,
  3165. [data-theme] #tokenizer div.view-layer-control .section.move-control button {
  3166. border-radius: var(--border-radius);
  3167. }
  3168. [data-theme] #tokenizer button .fa-regular::before,
  3169. [data-theme] #tokenizer button .fas::before,
  3170. [data-theme] #tokenizer button .button-fas::before {
  3171. margin-top: unset;
  3172. }
  3173. [data-theme] #tokenizer div.view-layer-control .section,
  3174. [data-theme] #tokenizer .section {
  3175. background: var(--app-background);
  3176. border: var(--app-border-width) solid var(--app-border-color);
  3177. text-shadow: var(--app-text-shadow);
  3178. border-radius: var(--border-radius);
  3179. box-shadow: var(--box-shadow);
  3180. color: var(--text-color-3);
  3181. border-color: var(--color-secondary-3);
  3182. }
  3183. [data-theme] #tokenizer div.view-layer-control .section button,
  3184. [data-theme] #tokenizer .section button {
  3185. background: var(--app-background);
  3186. border: var(--app-border-width) solid var(--app-border-color);
  3187. text-shadow: var(--app-text-shadow);
  3188. border-radius: var(--border-radius);
  3189. box-shadow: var(--box-shadow);
  3190. color: var(--text-color-3);
  3191. background: var(--button-background);
  3192. border: var(--app-border-width) solid var(--button-border-color);
  3193. color: var(--button-text-color);
  3194. box-shadow: var(--box-shadow);
  3195. text-decoration: none;
  3196. cursor: pointer;
  3197. text-shadow: var(--app-text-shadow);
  3198. align-items: center;
  3199. }
  3200. [data-theme] #tokenizer div.view-layer-control .section button:not(.disabled, :disabled):hover,
  3201. [data-theme] #tokenizer .section button:not(.disabled, :disabled):hover {
  3202. background: var(--button-hover-background);
  3203. color: var(--button-hover-text-color);
  3204. border: var(--app-border-width) solid var(--button-hover-border-color);
  3205. box-shadow: var(--box-shadow);
  3206. }
  3207. [data-theme] #tokenizer div.view-layer-control .section button.view, [data-theme] #tokenizer div.view-layer-control .section button.selected, [data-theme] #tokenizer div.view-layer-control .section button.active,
  3208. [data-theme] #tokenizer .section button.view,
  3209. [data-theme] #tokenizer .section button.selected,
  3210. [data-theme] #tokenizer .section button.active {
  3211. background: var(--button-hover-background);
  3212. outline: 1px solid var(--button-focus-outline-color);
  3213. border-color: var(--button-hover-border-color);
  3214. color: var(--button-hover-text-color);
  3215. text-decoration: none !important;
  3216. font-weight: unset !important;
  3217. }
  3218. [data-theme] #tokenizer div.view-layer-control .section button.empty, [data-theme] #tokenizer div.view-layer-control .section button.disabled, [data-theme] #tokenizer div.view-layer-control .section button:disabled,
  3219. [data-theme] #tokenizer .section button.empty,
  3220. [data-theme] #tokenizer .section button.disabled,
  3221. [data-theme] #tokenizer .section button:disabled {
  3222. --button-background: var(--button-disabled-background);
  3223. --button-hover-background: var(--button-disabled-background);
  3224. --button-border-color: var(--button-disabled-border-color);
  3225. --button-text-color: var(--text-color-5);
  3226. }
  3227. [data-theme] #tokenizer button.menu-button {
  3228. background: var(--app-background);
  3229. border: var(--app-border-width) solid var(--app-border-color);
  3230. text-shadow: var(--app-text-shadow);
  3231. border-radius: var(--border-radius);
  3232. box-shadow: var(--box-shadow);
  3233. color: var(--text-color-3);
  3234. background: var(--button-background);
  3235. border: var(--app-border-width) solid var(--button-border-color);
  3236. color: var(--button-text-color);
  3237. box-shadow: var(--box-shadow);
  3238. text-decoration: none;
  3239. cursor: pointer;
  3240. text-shadow: var(--app-text-shadow);
  3241. align-items: center;
  3242. }
  3243. [data-theme] #tokenizer button.menu-button:not(.disabled, :disabled):hover {
  3244. background: var(--button-hover-background);
  3245. color: var(--button-hover-text-color);
  3246. border: var(--app-border-width) solid var(--button-hover-border-color);
  3247. box-shadow: var(--box-shadow);
  3248. }
  3249. [data-theme] #tokenizer button.menu-button.view, [data-theme] #tokenizer button.menu-button.selected, [data-theme] #tokenizer button.menu-button.active {
  3250. background: var(--button-hover-background);
  3251. outline: 1px solid var(--button-focus-outline-color);
  3252. border-color: var(--button-hover-border-color);
  3253. color: var(--button-hover-text-color);
  3254. text-decoration: none !important;
  3255. font-weight: unset !important;
  3256. }
  3257. [data-theme] #tokenizer button.menu-button.empty, [data-theme] #tokenizer button.menu-button.disabled, [data-theme] #tokenizer button.menu-button:disabled {
  3258. --button-background: var(--button-disabled-background);
  3259. --button-hover-background: var(--button-disabled-background);
  3260. --button-border-color: var(--button-disabled-border-color);
  3261. --button-text-color: var(--text-color-5);
  3262. }
  3263. [data-theme].tokenizer .title .box-button {
  3264. background: var(--app-background);
  3265. border: var(--app-border-width) solid var(--app-border-color);
  3266. text-shadow: var(--app-text-shadow);
  3267. border-radius: var(--border-radius);
  3268. box-shadow: var(--box-shadow);
  3269. color: var(--text-color-3);
  3270. background: var(--button-background);
  3271. border: var(--app-border-width) solid var(--button-border-color);
  3272. color: var(--button-text-color);
  3273. box-shadow: var(--box-shadow);
  3274. text-decoration: none;
  3275. cursor: pointer;
  3276. text-shadow: var(--app-text-shadow);
  3277. --button-background: var(--color-secondary-2);
  3278. --button-border-color: var(--color-primary-1);
  3279. --button-text-color: var(--text-color-1);
  3280. --button-focus-outline-color: var(--color-primary-1);
  3281. --button-hover-background: var(--color-secondary-3);
  3282. --button-hover-border-color: var(--color-secondary-2);
  3283. --button-hover-text-color: var(--text-color-2);
  3284. }
  3285. [data-theme].tokenizer .title .box-button:not(.disabled, :disabled):hover {
  3286. background: var(--button-hover-background);
  3287. color: var(--button-hover-text-color);
  3288. border: var(--app-border-width) solid var(--button-hover-border-color);
  3289. box-shadow: var(--box-shadow);
  3290. }
  3291. [data-theme].tokenizer .title .box-button.view, [data-theme].tokenizer .title .box-button.selected, [data-theme].tokenizer .title .box-button.active {
  3292. background: var(--button-hover-background);
  3293. outline: 1px solid var(--button-focus-outline-color);
  3294. border-color: var(--button-hover-border-color);
  3295. color: var(--button-hover-text-color);
  3296. text-decoration: none !important;
  3297. font-weight: unset !important;
  3298. }
  3299. [data-theme].tokenizer .title .box-button.empty, [data-theme].tokenizer .title .box-button.disabled, [data-theme].tokenizer .title .box-button:disabled {
  3300. --button-background: var(--button-disabled-background);
  3301. --button-hover-background: var(--button-disabled-background);
  3302. --button-border-color: var(--button-disabled-border-color);
  3303. --button-text-color: var(--text-color-5);
  3304. }
  3305. [data-theme].tokenizer .title .box-button.deselected {
  3306. --button-background: var(--color-secondary-3);
  3307. --button-border-color: var(--color-secondary-2);
  3308. --button-text-color: var(--text-color-2);
  3309. --button-focus-outline-color: var(--color-primary-1);
  3310. --button-hover-background: var(--color-secondary-2);
  3311. --button-hover-border-color: var(--color-secondary-1);
  3312. --button-hover-text-color: var(--text-color-1);
  3313. }
  3314. [data-theme].tokenizer .title .box-button > i:before {
  3315. margin-top: 50% !important;
  3316. }
  3317. /* ----------------------------------------- */
  3318. /* PF2e Workbench */
  3319. /* ----------------------------------------- */
  3320. html .xdy-pf2e-workbench-rarity-common {
  3321. color: var(--rarity-common) !important;
  3322. border-color: var(--rarity-common) !important;
  3323. }
  3324. html .xdy-pf2e-workbench-rarity-uncommon {
  3325. color: var(--rarity-uncommon) !important;
  3326. border-color: var(--rarity-uncommon) !important;
  3327. }
  3328. html .xdy-pf2e-workbench-rarity-rare {
  3329. color: var(--rarity-rare) !important;
  3330. border-color: var(--rarity-rare) !important;
  3331. }
  3332. html .xdy-pf2e-workbench-rarity-unique {
  3333. color: var(--rarity-unique) !important;
  3334. border-color: var(--rarity-unique) !important;
  3335. }
  3336. [data-theme] .roll-app-nav button {
  3337. background: var(--app-background);
  3338. border: var(--app-border-width) solid var(--app-border-color);
  3339. text-shadow: var(--app-text-shadow);
  3340. border-radius: var(--border-radius);
  3341. box-shadow: var(--box-shadow);
  3342. color: var(--text-color-3);
  3343. background: var(--button-background);
  3344. border: var(--app-border-width) solid var(--button-border-color);
  3345. color: var(--button-text-color);
  3346. box-shadow: var(--box-shadow);
  3347. text-decoration: none;
  3348. cursor: pointer;
  3349. text-shadow: var(--app-text-shadow);
  3350. }
  3351. [data-theme] .roll-app-nav button:not(.disabled, :disabled):hover {
  3352. background: var(--button-hover-background);
  3353. color: var(--button-hover-text-color);
  3354. border: var(--app-border-width) solid var(--button-hover-border-color);
  3355. box-shadow: var(--box-shadow);
  3356. }
  3357. [data-theme] .roll-app-nav button.view, [data-theme] .roll-app-nav button.selected, [data-theme] .roll-app-nav button.active {
  3358. background: var(--button-hover-background);
  3359. outline: 1px solid var(--button-focus-outline-color);
  3360. border-color: var(--button-hover-border-color);
  3361. color: var(--button-hover-text-color);
  3362. text-decoration: none !important;
  3363. font-weight: unset !important;
  3364. }
  3365. [data-theme] .roll-app-nav button.empty, [data-theme] .roll-app-nav button.disabled, [data-theme] .roll-app-nav button:disabled {
  3366. --button-background: var(--button-disabled-background);
  3367. --button-hover-background: var(--button-disabled-background);
  3368. --button-border-color: var(--button-disabled-border-color);
  3369. --button-text-color: var(--text-color-5);
  3370. }
  3371. [data-theme] .roll-app .roll-app-table tbody button {
  3372. background: var(--app-background);
  3373. border: var(--app-border-width) solid var(--app-border-color);
  3374. text-shadow: var(--app-text-shadow);
  3375. border-radius: var(--border-radius);
  3376. box-shadow: var(--box-shadow);
  3377. color: var(--text-color-3);
  3378. background: var(--button-background);
  3379. border: var(--app-border-width) solid var(--button-border-color);
  3380. color: var(--button-text-color);
  3381. box-shadow: var(--box-shadow);
  3382. text-decoration: none;
  3383. cursor: pointer;
  3384. text-shadow: var(--app-text-shadow);
  3385. }
  3386. [data-theme] .roll-app .roll-app-table tbody button:not(.disabled, :disabled):hover {
  3387. background: var(--button-hover-background);
  3388. color: var(--button-hover-text-color);
  3389. border: var(--app-border-width) solid var(--button-hover-border-color);
  3390. box-shadow: var(--box-shadow);
  3391. }
  3392. [data-theme] .roll-app .roll-app-table tbody button.view, [data-theme] .roll-app .roll-app-table tbody button.selected, [data-theme] .roll-app .roll-app-table tbody button.active {
  3393. background: var(--button-hover-background);
  3394. outline: 1px solid var(--button-focus-outline-color);
  3395. border-color: var(--button-hover-border-color);
  3396. color: var(--button-hover-text-color);
  3397. text-decoration: none !important;
  3398. font-weight: unset !important;
  3399. }
  3400. [data-theme] .roll-app .roll-app-table tbody button.empty, [data-theme] .roll-app .roll-app-table tbody button.disabled, [data-theme] .roll-app .roll-app-table tbody button:disabled {
  3401. --button-background: var(--button-disabled-background);
  3402. --button-hover-background: var(--button-disabled-background);
  3403. --button-border-color: var(--button-disabled-border-color);
  3404. --button-text-color: var(--text-color-5);
  3405. }
  3406. [data-theme] .roll-app .roll-app-table tbody tr.selected {
  3407. background: var(--color-primary-2);
  3408. border-radius: var(--border-radius);
  3409. }
  3410. [data-theme] .roll-app .roll-app-table tbody tr.selected button.rollable {
  3411. color: var(--text-color-2);
  3412. }
  3413. .scene_actors_selector .window-content {
  3414. border-radius: var(--border-radius);
  3415. }
  3416. /* ----------------------------------------- */
  3417. /* FPS display */
  3418. /* ----------------------------------------- */
  3419. #fps[data-theme] {
  3420. background: var(--app-background);
  3421. border: var(--app-border-width) solid var(--app-border-color);
  3422. text-shadow: var(--app-text-shadow);
  3423. border-radius: var(--border-radius);
  3424. box-shadow: var(--box-shadow);
  3425. color: var(--text-color-3);
  3426. }
  3427. /* ----------------------------------------- */
  3428. /* Tooltip */
  3429. /* ----------------------------------------- */
  3430. #tooltip[data-theme] {
  3431. background: var(--app-background);
  3432. border: 1px solid var(--color-primary-1);
  3433. box-shadow: 0px 0px 6px var(--color-primary-2), 0px 2px 8px 1px var(--color-primary-3);
  3434. backdrop-filter: blur(5px);
  3435. border-radius: var(--border-radius);
  3436. -webkit-backdrop-filter: blur(5px);
  3437. font-size: var(--font-size-16);
  3438. line-height: var(--font-size-16);
  3439. text-shadow: 0px 1px 2px black;
  3440. padding: 0.4em 0.6em;
  3441. }
  3442. /* ----------------------------------------- */
  3443. /* Players */
  3444. /* ----------------------------------------- */
  3445. #players[data-theme] {
  3446. background: var(--app-background);
  3447. border: var(--app-border-width) solid var(--app-border-color);
  3448. text-shadow: var(--app-text-shadow);
  3449. border-radius: var(--border-radius);
  3450. box-shadow: var(--box-shadow);
  3451. color: var(--text-color-3);
  3452. }
  3453. #players[data-theme] h3 {
  3454. cursor: pointer;
  3455. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  3456. color: var(--text-color-3);
  3457. }
  3458. #players[data-theme] h3:hover {
  3459. color: var(--text-color-1);
  3460. text-shadow: 0px 0px 8px var(--color-shadow-highlight);
  3461. }
  3462. /* ----------------------------------------- */
  3463. /* Context menu */
  3464. /* ----------------------------------------- */
  3465. [data-theme] #context-menu {
  3466. background: var(--app-background);
  3467. border: var(--app-border-width) solid var(--app-border-color);
  3468. text-shadow: var(--app-text-shadow);
  3469. border-radius: var(--border-radius);
  3470. box-shadow: var(--box-shadow);
  3471. color: var(--text-color-3);
  3472. background: var(--app-background);
  3473. border: var(--app-border-width) solid var(--app-border-color);
  3474. box-shadow: var(--window-app-box-shadow);
  3475. border-radius: var(--border-radius);
  3476. backdrop-filter: blur(5px);
  3477. -webkit-backdrop-filter: blur(5px);
  3478. text-shadow: 0px 1px 2px black;
  3479. }
  3480. [data-theme] #context-menu li.context-item:first-child {
  3481. border-top-left-radius: var(--border-radius);
  3482. border-top-right-radius: var(--border-radius);
  3483. }
  3484. [data-theme] #context-menu li.context-item:last-child {
  3485. border-bottom-left-radius: var(--border-radius);
  3486. border-bottom-right-radius: var(--border-radius);
  3487. }
  3488. [data-theme] #context-menu li.context-item:hover {
  3489. box-shadow: 0px 0px 0px 1px var(--color-primary-1);
  3490. background: var(--color-primary-2);
  3491. text-shadow: 0px 1px 2px black;
  3492. }
  3493. /* ----------------------------------------- */
  3494. /* Map v1 styling to v2 values */
  3495. /* ----------------------------------------- */
  3496. [data-theme] {
  3497. --color-shadow-primary: transparent;
  3498. --color-shadow-highlight: transparent;
  3499. --color-bg-option: var(--input-background);
  3500. }
  3501. /* ----------------------------------------- */
  3502. /* limited scope specific */
  3503. /* ----------------------------------------- */
  3504. [data-theme][data-dorako-ui-scope=limited][data-color-scheme=dark] {
  3505. --rarity-common: #e1d8cf;
  3506. --rarity-uncommon: #c45500;
  3507. --rarity-rare: #5362ff;
  3508. --rarity-unique: #e127e1;
  3509. --ornamentation: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1{stroke:wheat;stroke-miterlimit:10}.st1,.st2{fill:none}%3C/style%3E%3Cg opacity='1'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zm3.1 3.1h3.1v3.1H3.6zm3.2 0h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zm0 0H.5V13M13 .5H6.8v3.1M29.4.5h3.1v3.1h-3.1zm-3.1 3.1h3.1v3.1h-3.1zm0 3.2h3.1v3.1h-3.1zm-3.2-3.2h3.1v3.1h-3.1zm3.2 0V.5H20M32.5 13V6.8h-3.1M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zm-3.2 0h3.1v3.1h-3.1zm3.2-3.2h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zm3.1-3.1h3.1v3.1H3.6zm0-3.2h3.1v3.1H3.6zm3.2 3.2h3.1v3.1H6.8zM6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  3510. }
  3511. /* ------------------------------------------------------------- */
  3512. /* Generalized style choices (inclusive of limited scope) */
  3513. /* ------------------------------------------------------------- */
  3514. [data-theme][data-color-scheme=dark] {
  3515. --rarity-common: #e1d8cf;
  3516. --rarity-uncommon: #c45500;
  3517. --rarity-rare: #5362ff;
  3518. --rarity-unique: #e127e1;
  3519. --color-rarity-common: #e1d8cf;
  3520. --color-rarity-uncommon: #c45500;
  3521. --color-rarity-rare: #5362ff;
  3522. --color-rarity-unique: #e127e1;
  3523. --ornamentation: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1{stroke:wheat;stroke-miterlimit:10}.st1,.st2{fill:none}%3C/style%3E%3Cg opacity='1'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zm3.1 3.1h3.1v3.1H3.6zm3.2 0h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zm0 0H.5V13M13 .5H6.8v3.1M29.4.5h3.1v3.1h-3.1zm-3.1 3.1h3.1v3.1h-3.1zm0 3.2h3.1v3.1h-3.1zm-3.2-3.2h3.1v3.1h-3.1zm3.2 0V.5H20M32.5 13V6.8h-3.1M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zm-3.2 0h3.1v3.1h-3.1zm3.2-3.2h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zm3.1-3.1h3.1v3.1H3.6zm0-3.2h3.1v3.1H3.6zm3.2 3.2h3.1v3.1H6.8zM6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  3524. /* Degrees of success */
  3525. --degree-success-critical: rgb(107, 255, 0);
  3526. --degree-success: rgb(0, 241, 255);
  3527. --degree-failure: rgb(255, 129, 0);
  3528. --degree-failure-critical: rgb(255, 0, 0);
  3529. /* Value adjustments (e.g. weak/elite) */
  3530. --adjusted-higher: #009988;
  3531. --adjusted-lower: #cc3311;
  3532. }
  3533. [data-theme][data-color-scheme=dark].pf2e.item.sheet {
  3534. --color-text-dark-2: var(--text-color-3);
  3535. --color-text-dark-4: var(--text-color-3);
  3536. --color-text-dark-input: var(--text-color-3);
  3537. --color-border-dark: var(--text-color-2);
  3538. --color-border-medium: var(--input-border-color);
  3539. }
  3540. [data-theme][data-color-scheme=dark].chat-message .message-content + .pf2e-toolbelt-target-damage, [data-theme][data-color-scheme=dark].chat-message .message-content + .pf2e-toolbelt-target-spell {
  3541. --criticalSuccess: var(--degree-success-critical);
  3542. --success: var(--degree-success);
  3543. --failure: var(--degree-failure);
  3544. --criticalFailure: var(--degree-failure-critical);
  3545. }
  3546. [data-color-scheme=light] {
  3547. --rarity-common: #323232;
  3548. --rarity-uncommon: #98513d;
  3549. --rarity-rare: #002664;
  3550. --rarity-unique: #54166e;
  3551. --color-rarity-common: #323232;
  3552. --color-rarity-uncommon: #98513d;
  3553. --color-rarity-rare: #002664;
  3554. --color-rarity-unique: #54166e;
  3555. --ornamentation: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1{stroke:wheat;stroke-miterlimit:10}.st1,.st2{fill:none}%3C/style%3E%3Cg opacity='1'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zm3.1 3.1h3.1v3.1H3.6zm3.2 0h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zm0 0H.5V13M13 .5H6.8v3.1M29.4.5h3.1v3.1h-3.1zm-3.1 3.1h3.1v3.1h-3.1zm0 3.2h3.1v3.1h-3.1zm-3.2-3.2h3.1v3.1h-3.1zm3.2 0V.5H20M32.5 13V6.8h-3.1M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zm-3.2 0h3.1v3.1h-3.1zm3.2-3.2h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zm3.1-3.1h3.1v3.1H3.6zm0-3.2h3.1v3.1H3.6zm3.2 3.2h3.1v3.1H6.8zM6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  3556. /* Degrees of success */
  3557. --degree-success-critical: rgb(0, 128, 0);
  3558. --degree-success: rgb(0, 0, 255);
  3559. --degree-failure: rgb(255, 69, 0);
  3560. --degree-failure-critical: red;
  3561. /* Value adjustments (e.g. weak/elite) */
  3562. --adjusted-higher: #009988;
  3563. --adjusted-lower: #cc3311;
  3564. }
  3565. [data-color-scheme=light].filepicker .favorites .paths {
  3566. --color-text-dark-primary: white;
  3567. --button-text-color: white;
  3568. }
  3569. /* ----------------------------------------- */
  3570. /* Default values */
  3571. /* ----------------------------------------- */
  3572. [data-chat-interface-theme] #chat-log ~ *,
  3573. [data-theme] {
  3574. /* App variables */
  3575. --app-background: transparent;
  3576. --app-border-color: black;
  3577. --app-text-shadow: none;
  3578. --app-border-width: 1px;
  3579. /* Window app variables */
  3580. --window-app-background: white;
  3581. --window-app-box-shadow: 0px 5px 30px black;
  3582. /* Input variables */
  3583. /* Other variables */
  3584. --icon-border-color: yellow;
  3585. --box-shadow: 0px 1px 3px 1px black;
  3586. --ornamentation-gray: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1%7Bstroke:%23231f20;stroke-miterlimit:10%7D.st1,.st2%7Bfill:none%7D%3C/style%3E%3Cg opacity='.25'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cg%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zM3.6 3.6h3.1v3.1H3.6zM6.8 3.6h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zM3.6 6.8H.5V13M13 .5H6.8v3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M29.4.5h3.1v3.1h-3.1zM26.3 3.6h3.1v3.1h-3.1zM26.3 6.8h3.1v3.1h-3.1zM23.1 3.6h3.1v3.1h-3.1zM26.3 3.6V.5H20'/%3E%3Cpath class='st1' d='M32.5 13V6.8h-3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zM23.1 26.3h3.1v3.1h-3.1zM26.3 23.1h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zM3.6 26.3h3.1v3.1H3.6zM3.6 23.1h3.1v3.1H3.6zM6.8 26.3h3.1v3.1H6.8z'/%3E%3Cpath class='st1' d='M6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  3587. --ornamentation-gold: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1{stroke:wheat;stroke-miterlimit:10}.st1,.st2{fill:none}%3C/style%3E%3Cg opacity='1'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zm3.1 3.1h3.1v3.1H3.6zm3.2 0h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zm0 0H.5V13M13 .5H6.8v3.1M29.4.5h3.1v3.1h-3.1zm-3.1 3.1h3.1v3.1h-3.1zm0 3.2h3.1v3.1h-3.1zm-3.2-3.2h3.1v3.1h-3.1zm3.2 0V.5H20M32.5 13V6.8h-3.1M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zm-3.2 0h3.1v3.1h-3.1zm3.2-3.2h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zm3.1-3.1h3.1v3.1H3.6zm0-3.2h3.1v3.1H3.6zm3.2 3.2h3.1v3.1H6.8zM6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  3588. }
  3589. [data-chat-interface-theme] #chat-log ~ * .item-controls button[data-action=apply],
  3590. [data-chat-interface-theme] #chat-log ~ * button[data-action=accept],
  3591. [data-chat-interface-theme] #chat-log ~ * form button[type=submit],
  3592. [data-chat-interface-theme] #chat-log ~ * form button[data-action=save],
  3593. [data-chat-interface-theme] #chat-log ~ * form.check-modifiers-content button.roll,
  3594. [data-chat-interface-theme] #chat-log ~ * button.bright,
  3595. [data-theme] .item-controls button[data-action=apply],
  3596. [data-theme] button[data-action=accept],
  3597. [data-theme] form button[type=submit],
  3598. [data-theme] form button[data-action=save],
  3599. [data-theme] form.check-modifiers-content button.roll,
  3600. [data-theme] button.bright {
  3601. background: var(--app-background);
  3602. border: var(--app-border-width) solid var(--app-border-color);
  3603. text-shadow: var(--app-text-shadow);
  3604. border-radius: var(--border-radius);
  3605. box-shadow: var(--box-shadow);
  3606. color: var(--text-color-3);
  3607. background: var(--button-background);
  3608. border: var(--app-border-width) solid var(--button-border-color);
  3609. color: var(--button-text-color);
  3610. box-shadow: var(--box-shadow);
  3611. text-decoration: none;
  3612. cursor: pointer;
  3613. text-shadow: var(--app-text-shadow);
  3614. transition: background 0.1s ease-in-out;
  3615. --button-background: var(--accent-color);
  3616. --button-border-color: var(--accent-color-dark);
  3617. --button-text-color: var(--accent-text-color);
  3618. --app-text-shadow: none;
  3619. --button-hover-background: var(--accent-color-light);
  3620. --button-hover-border-color: var(--accent-color);
  3621. --button-hover-text-color: var(--accent-text-color);
  3622. }
  3623. [data-chat-interface-theme] #chat-log ~ * .item-controls button[data-action=apply]:not(.disabled, :disabled):hover,
  3624. [data-chat-interface-theme] #chat-log ~ * button[data-action=accept]:not(.disabled, :disabled):hover,
  3625. [data-chat-interface-theme] #chat-log ~ * form button[type=submit]:not(.disabled, :disabled):hover,
  3626. [data-chat-interface-theme] #chat-log ~ * form button[data-action=save]:not(.disabled, :disabled):hover,
  3627. [data-chat-interface-theme] #chat-log ~ * form.check-modifiers-content button.roll:not(.disabled, :disabled):hover,
  3628. [data-chat-interface-theme] #chat-log ~ * button.bright:not(.disabled, :disabled):hover,
  3629. [data-theme] .item-controls button[data-action=apply]:not(.disabled, :disabled):hover,
  3630. [data-theme] button[data-action=accept]:not(.disabled, :disabled):hover,
  3631. [data-theme] form button[type=submit]:not(.disabled, :disabled):hover,
  3632. [data-theme] form button[data-action=save]:not(.disabled, :disabled):hover,
  3633. [data-theme] form.check-modifiers-content button.roll:not(.disabled, :disabled):hover,
  3634. [data-theme] button.bright:not(.disabled, :disabled):hover {
  3635. background: var(--button-hover-background);
  3636. color: var(--button-hover-text-color);
  3637. border: var(--app-border-width) solid var(--button-hover-border-color);
  3638. box-shadow: var(--box-shadow);
  3639. }
  3640. [data-chat-interface-theme] #chat-log ~ * .item-controls button[data-action=apply].view, [data-chat-interface-theme] #chat-log ~ * .item-controls button[data-action=apply].selected, [data-chat-interface-theme] #chat-log ~ * .item-controls button[data-action=apply].active,
  3641. [data-chat-interface-theme] #chat-log ~ * button[data-action=accept].view,
  3642. [data-chat-interface-theme] #chat-log ~ * button[data-action=accept].selected,
  3643. [data-chat-interface-theme] #chat-log ~ * button[data-action=accept].active,
  3644. [data-chat-interface-theme] #chat-log ~ * form button[type=submit].view,
  3645. [data-chat-interface-theme] #chat-log ~ * form button[type=submit].selected,
  3646. [data-chat-interface-theme] #chat-log ~ * form button[type=submit].active,
  3647. [data-chat-interface-theme] #chat-log ~ * form button[data-action=save].view,
  3648. [data-chat-interface-theme] #chat-log ~ * form button[data-action=save].selected,
  3649. [data-chat-interface-theme] #chat-log ~ * form button[data-action=save].active,
  3650. [data-chat-interface-theme] #chat-log ~ * form.check-modifiers-content button.roll.view,
  3651. [data-chat-interface-theme] #chat-log ~ * form.check-modifiers-content button.roll.selected,
  3652. [data-chat-interface-theme] #chat-log ~ * form.check-modifiers-content button.roll.active,
  3653. [data-chat-interface-theme] #chat-log ~ * button.bright.view,
  3654. [data-chat-interface-theme] #chat-log ~ * button.bright.selected,
  3655. [data-chat-interface-theme] #chat-log ~ * button.bright.active,
  3656. [data-theme] .item-controls button[data-action=apply].view,
  3657. [data-theme] .item-controls button[data-action=apply].selected,
  3658. [data-theme] .item-controls button[data-action=apply].active,
  3659. [data-theme] button[data-action=accept].view,
  3660. [data-theme] button[data-action=accept].selected,
  3661. [data-theme] button[data-action=accept].active,
  3662. [data-theme] form button[type=submit].view,
  3663. [data-theme] form button[type=submit].selected,
  3664. [data-theme] form button[type=submit].active,
  3665. [data-theme] form button[data-action=save].view,
  3666. [data-theme] form button[data-action=save].selected,
  3667. [data-theme] form button[data-action=save].active,
  3668. [data-theme] form.check-modifiers-content button.roll.view,
  3669. [data-theme] form.check-modifiers-content button.roll.selected,
  3670. [data-theme] form.check-modifiers-content button.roll.active,
  3671. [data-theme] button.bright.view,
  3672. [data-theme] button.bright.selected,
  3673. [data-theme] button.bright.active {
  3674. background: var(--button-hover-background);
  3675. outline: 1px solid var(--button-focus-outline-color);
  3676. border-color: var(--button-hover-border-color);
  3677. color: var(--button-hover-text-color);
  3678. text-decoration: none !important;
  3679. font-weight: unset !important;
  3680. }
  3681. [data-chat-interface-theme] #chat-log ~ * .item-controls button[data-action=apply].empty, [data-chat-interface-theme] #chat-log ~ * .item-controls button[data-action=apply].disabled, [data-chat-interface-theme] #chat-log ~ * .item-controls button[data-action=apply]:disabled,
  3682. [data-chat-interface-theme] #chat-log ~ * button[data-action=accept].empty,
  3683. [data-chat-interface-theme] #chat-log ~ * button[data-action=accept].disabled,
  3684. [data-chat-interface-theme] #chat-log ~ * button[data-action=accept]:disabled,
  3685. [data-chat-interface-theme] #chat-log ~ * form button[type=submit].empty,
  3686. [data-chat-interface-theme] #chat-log ~ * form button[type=submit].disabled,
  3687. [data-chat-interface-theme] #chat-log ~ * form button[type=submit]:disabled,
  3688. [data-chat-interface-theme] #chat-log ~ * form button[data-action=save].empty,
  3689. [data-chat-interface-theme] #chat-log ~ * form button[data-action=save].disabled,
  3690. [data-chat-interface-theme] #chat-log ~ * form button[data-action=save]:disabled,
  3691. [data-chat-interface-theme] #chat-log ~ * form.check-modifiers-content button.roll.empty,
  3692. [data-chat-interface-theme] #chat-log ~ * form.check-modifiers-content button.roll.disabled,
  3693. [data-chat-interface-theme] #chat-log ~ * form.check-modifiers-content button.roll:disabled,
  3694. [data-chat-interface-theme] #chat-log ~ * button.bright.empty,
  3695. [data-chat-interface-theme] #chat-log ~ * button.bright.disabled,
  3696. [data-chat-interface-theme] #chat-log ~ * button.bright:disabled,
  3697. [data-theme] .item-controls button[data-action=apply].empty,
  3698. [data-theme] .item-controls button[data-action=apply].disabled,
  3699. [data-theme] .item-controls button[data-action=apply]:disabled,
  3700. [data-theme] button[data-action=accept].empty,
  3701. [data-theme] button[data-action=accept].disabled,
  3702. [data-theme] button[data-action=accept]:disabled,
  3703. [data-theme] form button[type=submit].empty,
  3704. [data-theme] form button[type=submit].disabled,
  3705. [data-theme] form button[type=submit]:disabled,
  3706. [data-theme] form button[data-action=save].empty,
  3707. [data-theme] form button[data-action=save].disabled,
  3708. [data-theme] form button[data-action=save]:disabled,
  3709. [data-theme] form.check-modifiers-content button.roll.empty,
  3710. [data-theme] form.check-modifiers-content button.roll.disabled,
  3711. [data-theme] form.check-modifiers-content button.roll:disabled,
  3712. [data-theme] button.bright.empty,
  3713. [data-theme] button.bright.disabled,
  3714. [data-theme] button.bright:disabled {
  3715. --button-background: var(--button-disabled-background);
  3716. --button-hover-background: var(--button-disabled-background);
  3717. --button-border-color: var(--button-disabled-border-color);
  3718. --button-text-color: var(--text-color-5);
  3719. }
  3720. [data-chat-interface-theme] #chat-log ~ * .item-controls button[data-action=apply]:disabled,
  3721. [data-chat-interface-theme] #chat-log ~ * button[data-action=accept]:disabled,
  3722. [data-chat-interface-theme] #chat-log ~ * form button[type=submit]:disabled,
  3723. [data-chat-interface-theme] #chat-log ~ * form button[data-action=save]:disabled,
  3724. [data-chat-interface-theme] #chat-log ~ * form.check-modifiers-content button.roll:disabled,
  3725. [data-chat-interface-theme] #chat-log ~ * button.bright:disabled,
  3726. [data-theme] .item-controls button[data-action=apply]:disabled,
  3727. [data-theme] button[data-action=accept]:disabled,
  3728. [data-theme] form button[type=submit]:disabled,
  3729. [data-theme] form button[data-action=save]:disabled,
  3730. [data-theme] form.check-modifiers-content button.roll:disabled,
  3731. [data-theme] button.bright:disabled {
  3732. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  3733. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  3734. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  3735. }
  3736. [data-chat-interface-theme] #chat-log ~ * ::-webkit-scrollbar-thumb,
  3737. [data-theme] ::-webkit-scrollbar-thumb {
  3738. outline: none;
  3739. border-radius: 3px;
  3740. background: var(--scrollbar-thumb-background);
  3741. border: 1px solid var(--scrollbar-thumb-border-color);
  3742. transition: outline 0.15s;
  3743. }
  3744. [data-chat-interface-theme] #chat-log ~ * ::-webkit-scrollbar-track,
  3745. [data-theme] ::-webkit-scrollbar-track {
  3746. box-shadow: 0 0 1px var(--color-secondary-3) inset;
  3747. box-shadow: unset;
  3748. border-radius: 4px;
  3749. }
  3750. [data-chat-interface-theme] #chat-log ~ * input[type=checkbox]:checked,
  3751. [data-chat-interface-theme] #chat-log ~ * input[type=radio]:checked,
  3752. [data-theme] input[type=checkbox]:checked,
  3753. [data-theme] input[type=radio]:checked {
  3754. accent-color: var(--accent-color);
  3755. }
  3756. [data-chat-interface-theme] #chat-log ~ * code,
  3757. [data-theme] code {
  3758. background: var(--color-secondary-4);
  3759. border: 1px solid var(--color-secondary-3);
  3760. color: var(--text-color-2);
  3761. border-radius: 3px;
  3762. padding: 0px 2px;
  3763. }
  3764. [data-chat-interface-theme] #chat-log ~ * a.content-link,
  3765. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check]:not([data-pf2-traits*=secret]),
  3766. [data-chat-interface-theme] #chat-log ~ * a.entity-link,
  3767. [data-chat-interface-theme] #chat-log ~ * [data-pf2-action],
  3768. [data-chat-interface-theme] #chat-log ~ * span[data-pf2-effect-area],
  3769. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]),
  3770. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) .label,
  3771. [data-chat-interface-theme] #chat-log ~ * a.inline-roll,
  3772. [data-theme] a.content-link,
  3773. [data-theme] [data-pf2-check]:not([data-pf2-traits*=secret]),
  3774. [data-theme] a.entity-link,
  3775. [data-theme] [data-pf2-action],
  3776. [data-theme] span[data-pf2-effect-area],
  3777. [data-theme] a.inline-check:not([data-pf2-traits*=secret]),
  3778. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) .label,
  3779. [data-theme] a.inline-roll {
  3780. background: var(--inline-background);
  3781. border: 1px solid var(--inline-border-color);
  3782. color: var(--inline-text-color) !important;
  3783. box-shadow: var(--inline-box-shadow);
  3784. }
  3785. [data-chat-interface-theme] #chat-log ~ * a.content-link [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3786. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check]:not([data-pf2-traits*=secret]) [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3787. [data-chat-interface-theme] #chat-log ~ * a.entity-link [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3788. [data-chat-interface-theme] #chat-log ~ * [data-pf2-action] [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3789. [data-chat-interface-theme] #chat-log ~ * span[data-pf2-effect-area] [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3790. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3791. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) .label [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3792. [data-chat-interface-theme] #chat-log ~ * a.inline-roll [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3793. [data-theme] a.content-link [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3794. [data-theme] [data-pf2-check]:not([data-pf2-traits*=secret]) [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3795. [data-theme] a.entity-link [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3796. [data-theme] [data-pf2-action] [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3797. [data-theme] span[data-pf2-effect-area] [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3798. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3799. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) .label [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3800. [data-theme] a.inline-roll [data-visibility]:not([data-visibility=all])[data-visibility=gm] {
  3801. background: none;
  3802. }
  3803. [data-chat-interface-theme] #chat-log ~ * a.content-link.broken,
  3804. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check]:not([data-pf2-traits*=secret]).broken,
  3805. [data-chat-interface-theme] #chat-log ~ * a.entity-link.broken,
  3806. [data-chat-interface-theme] #chat-log ~ * [data-pf2-action].broken,
  3807. [data-chat-interface-theme] #chat-log ~ * span[data-pf2-effect-area].broken,
  3808. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]).broken,
  3809. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) .label.broken,
  3810. [data-chat-interface-theme] #chat-log ~ * a.inline-roll.broken,
  3811. [data-theme] a.content-link.broken,
  3812. [data-theme] [data-pf2-check]:not([data-pf2-traits*=secret]).broken,
  3813. [data-theme] a.entity-link.broken,
  3814. [data-theme] [data-pf2-action].broken,
  3815. [data-theme] span[data-pf2-effect-area].broken,
  3816. [data-theme] a.inline-check:not([data-pf2-traits*=secret]).broken,
  3817. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) .label.broken,
  3818. [data-theme] a.inline-roll.broken {
  3819. border: 1px dashed red;
  3820. background: rgba(255, 0, 0, 0.05);
  3821. }
  3822. [data-chat-interface-theme] #chat-log ~ * a.content-link.gmroll,
  3823. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check]:not([data-pf2-traits*=secret]).gmroll,
  3824. [data-chat-interface-theme] #chat-log ~ * a.entity-link.gmroll,
  3825. [data-chat-interface-theme] #chat-log ~ * [data-pf2-action].gmroll,
  3826. [data-chat-interface-theme] #chat-log ~ * span[data-pf2-effect-area].gmroll,
  3827. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]).gmroll,
  3828. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) .label.gmroll,
  3829. [data-chat-interface-theme] #chat-log ~ * a.inline-roll.gmroll,
  3830. [data-theme] a.content-link.gmroll,
  3831. [data-theme] [data-pf2-check]:not([data-pf2-traits*=secret]).gmroll,
  3832. [data-theme] a.entity-link.gmroll,
  3833. [data-theme] [data-pf2-action].gmroll,
  3834. [data-theme] span[data-pf2-effect-area].gmroll,
  3835. [data-theme] a.inline-check:not([data-pf2-traits*=secret]).gmroll,
  3836. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) .label.gmroll,
  3837. [data-theme] a.inline-roll.gmroll {
  3838. background: #e8e8ef;
  3839. border-color: #545469;
  3840. color: black !important;
  3841. }
  3842. [data-chat-interface-theme] #chat-log ~ * a.content-link.gmroll i,
  3843. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check]:not([data-pf2-traits*=secret]).gmroll i,
  3844. [data-chat-interface-theme] #chat-log ~ * a.entity-link.gmroll i,
  3845. [data-chat-interface-theme] #chat-log ~ * [data-pf2-action].gmroll i,
  3846. [data-chat-interface-theme] #chat-log ~ * span[data-pf2-effect-area].gmroll i,
  3847. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]).gmroll i,
  3848. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) .label.gmroll i,
  3849. [data-chat-interface-theme] #chat-log ~ * a.inline-roll.gmroll i,
  3850. [data-theme] a.content-link.gmroll i,
  3851. [data-theme] [data-pf2-check]:not([data-pf2-traits*=secret]).gmroll i,
  3852. [data-theme] a.entity-link.gmroll i,
  3853. [data-theme] [data-pf2-action].gmroll i,
  3854. [data-theme] span[data-pf2-effect-area].gmroll i,
  3855. [data-theme] a.inline-check:not([data-pf2-traits*=secret]).gmroll i,
  3856. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) .label.gmroll i,
  3857. [data-theme] a.inline-roll.gmroll i {
  3858. color: var(--color-text-dark-inactive) !important;
  3859. }
  3860. [data-chat-interface-theme] #chat-log ~ * a.content-link.blindroll,
  3861. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check]:not([data-pf2-traits*=secret]).blindroll,
  3862. [data-chat-interface-theme] #chat-log ~ * a.entity-link.blindroll,
  3863. [data-chat-interface-theme] #chat-log ~ * [data-pf2-action].blindroll,
  3864. [data-chat-interface-theme] #chat-log ~ * span[data-pf2-effect-area].blindroll,
  3865. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]).blindroll,
  3866. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) .label.blindroll,
  3867. [data-chat-interface-theme] #chat-log ~ * a.inline-roll.blindroll,
  3868. [data-theme] a.content-link.blindroll,
  3869. [data-theme] [data-pf2-check]:not([data-pf2-traits*=secret]).blindroll,
  3870. [data-theme] a.entity-link.blindroll,
  3871. [data-theme] [data-pf2-action].blindroll,
  3872. [data-theme] span[data-pf2-effect-area].blindroll,
  3873. [data-theme] a.inline-check:not([data-pf2-traits*=secret]).blindroll,
  3874. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) .label.blindroll,
  3875. [data-theme] a.inline-roll.blindroll {
  3876. background: #f5eaf5;
  3877. border-color: #6b476b;
  3878. color: black !important;
  3879. }
  3880. [data-chat-interface-theme] #chat-log ~ * a.content-link.blindroll i,
  3881. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check]:not([data-pf2-traits*=secret]).blindroll i,
  3882. [data-chat-interface-theme] #chat-log ~ * a.entity-link.blindroll i,
  3883. [data-chat-interface-theme] #chat-log ~ * [data-pf2-action].blindroll i,
  3884. [data-chat-interface-theme] #chat-log ~ * span[data-pf2-effect-area].blindroll i,
  3885. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]).blindroll i,
  3886. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) .label.blindroll i,
  3887. [data-chat-interface-theme] #chat-log ~ * a.inline-roll.blindroll i,
  3888. [data-theme] a.content-link.blindroll i,
  3889. [data-theme] [data-pf2-check]:not([data-pf2-traits*=secret]).blindroll i,
  3890. [data-theme] a.entity-link.blindroll i,
  3891. [data-theme] [data-pf2-action].blindroll i,
  3892. [data-theme] span[data-pf2-effect-area].blindroll i,
  3893. [data-theme] a.inline-check:not([data-pf2-traits*=secret]).blindroll i,
  3894. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) .label.blindroll i,
  3895. [data-theme] a.inline-roll.blindroll i {
  3896. color: var(--color-text-dark-inactive) !important;
  3897. }
  3898. [data-chat-interface-theme] #chat-log ~ * a.content-link::before,
  3899. [data-chat-interface-theme] #chat-log ~ * a.content-link i,
  3900. [data-chat-interface-theme] #chat-log ~ * a.content-link i.icon,
  3901. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check]:not([data-pf2-traits*=secret])::before,
  3902. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check]:not([data-pf2-traits*=secret]) i,
  3903. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check]:not([data-pf2-traits*=secret]) i.icon,
  3904. [data-chat-interface-theme] #chat-log ~ * a.entity-link::before,
  3905. [data-chat-interface-theme] #chat-log ~ * a.entity-link i,
  3906. [data-chat-interface-theme] #chat-log ~ * a.entity-link i.icon,
  3907. [data-chat-interface-theme] #chat-log ~ * [data-pf2-action]::before,
  3908. [data-chat-interface-theme] #chat-log ~ * [data-pf2-action] i,
  3909. [data-chat-interface-theme] #chat-log ~ * [data-pf2-action] i.icon,
  3910. [data-chat-interface-theme] #chat-log ~ * span[data-pf2-effect-area]::before,
  3911. [data-chat-interface-theme] #chat-log ~ * span[data-pf2-effect-area] i,
  3912. [data-chat-interface-theme] #chat-log ~ * span[data-pf2-effect-area] i.icon,
  3913. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret])::before,
  3914. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) i,
  3915. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) i.icon,
  3916. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) .label::before,
  3917. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) .label i,
  3918. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) .label i.icon,
  3919. [data-chat-interface-theme] #chat-log ~ * a.inline-roll::before,
  3920. [data-chat-interface-theme] #chat-log ~ * a.inline-roll i,
  3921. [data-chat-interface-theme] #chat-log ~ * a.inline-roll i.icon,
  3922. [data-theme] a.content-link::before,
  3923. [data-theme] a.content-link i,
  3924. [data-theme] a.content-link i.icon,
  3925. [data-theme] [data-pf2-check]:not([data-pf2-traits*=secret])::before,
  3926. [data-theme] [data-pf2-check]:not([data-pf2-traits*=secret]) i,
  3927. [data-theme] [data-pf2-check]:not([data-pf2-traits*=secret]) i.icon,
  3928. [data-theme] a.entity-link::before,
  3929. [data-theme] a.entity-link i,
  3930. [data-theme] a.entity-link i.icon,
  3931. [data-theme] [data-pf2-action]::before,
  3932. [data-theme] [data-pf2-action] i,
  3933. [data-theme] [data-pf2-action] i.icon,
  3934. [data-theme] span[data-pf2-effect-area]::before,
  3935. [data-theme] span[data-pf2-effect-area] i,
  3936. [data-theme] span[data-pf2-effect-area] i.icon,
  3937. [data-theme] a.inline-check:not([data-pf2-traits*=secret])::before,
  3938. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) i,
  3939. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) i.icon,
  3940. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) .label::before,
  3941. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) .label i,
  3942. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) .label i.icon,
  3943. [data-theme] a.inline-roll::before,
  3944. [data-theme] a.inline-roll i,
  3945. [data-theme] a.inline-roll i.icon {
  3946. color: var(--inline-icon-color);
  3947. }
  3948. [data-chat-interface-theme] #chat-log ~ * a.content-link [data-visibility]:not([data-visibility=all]),
  3949. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check]:not([data-pf2-traits*=secret]) [data-visibility]:not([data-visibility=all]),
  3950. [data-chat-interface-theme] #chat-log ~ * a.entity-link [data-visibility]:not([data-visibility=all]),
  3951. [data-chat-interface-theme] #chat-log ~ * [data-pf2-action] [data-visibility]:not([data-visibility=all]),
  3952. [data-chat-interface-theme] #chat-log ~ * span[data-pf2-effect-area] [data-visibility]:not([data-visibility=all]),
  3953. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) [data-visibility]:not([data-visibility=all]),
  3954. [data-chat-interface-theme] #chat-log ~ * a.inline-check:not([data-pf2-traits*=secret]) .label [data-visibility]:not([data-visibility=all]),
  3955. [data-chat-interface-theme] #chat-log ~ * a.inline-roll [data-visibility]:not([data-visibility=all]),
  3956. [data-theme] a.content-link [data-visibility]:not([data-visibility=all]),
  3957. [data-theme] [data-pf2-check]:not([data-pf2-traits*=secret]) [data-visibility]:not([data-visibility=all]),
  3958. [data-theme] a.entity-link [data-visibility]:not([data-visibility=all]),
  3959. [data-theme] [data-pf2-action] [data-visibility]:not([data-visibility=all]),
  3960. [data-theme] span[data-pf2-effect-area] [data-visibility]:not([data-visibility=all]),
  3961. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) [data-visibility]:not([data-visibility=all]),
  3962. [data-theme] a.inline-check:not([data-pf2-traits*=secret]) .label [data-visibility]:not([data-visibility=all]),
  3963. [data-theme] a.inline-roll [data-visibility]:not([data-visibility=all]) {
  3964. color: var(--inline-text-color) !important;
  3965. outline: 1px dashed var(--inline-text-color);
  3966. }
  3967. [data-chat-interface-theme] #chat-log ~ * [data-pf2-check][data-pf2-traits*=secret],
  3968. [data-chat-interface-theme] #chat-log ~ * [data-visibility]:not([data-visibility=all])[data-visibility=gm],
  3969. [data-theme] [data-pf2-check][data-pf2-traits*=secret],
  3970. [data-theme] [data-visibility]:not([data-visibility=all])[data-visibility=gm] {
  3971. color: black;
  3972. }
  3973. [data-chat-interface-theme] #chat-log ~ * i[data-pf2-repost],
  3974. [data-theme] i[data-pf2-repost] {
  3975. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  3976. cursor: pointer;
  3977. background: unset;
  3978. border-left: unset;
  3979. }
  3980. [data-chat-interface-theme] #chat-log ~ * i[data-pf2-repost]:hover::before,
  3981. [data-theme] i[data-pf2-repost]:hover::before {
  3982. color: var(--color-primary-2);
  3983. }
  3984. [data-chat-interface-theme] #chat-log ~ *.pf2e.item.sheet form .sheet-body fieldset.basics,
  3985. [data-theme].pf2e.item.sheet form .sheet-body fieldset.basics {
  3986. background: none !important;
  3987. border: none !important;
  3988. }
  3989. /* ------------------------------------------------------------ */
  3990. /* Generalized style choices (exlusive of limited scope) */
  3991. /* ------------------------------------------------------------ */
  3992. [data-theme][data-dorako-ui-scope=unlimited][data-color-scheme=dark] h1 {
  3993. color: var(--text-color-1);
  3994. }
  3995. [data-theme][data-dorako-ui-scope=unlimited][data-color-scheme=dark] h2 {
  3996. color: var(--text-color-1);
  3997. }
  3998. [data-theme][data-dorako-ui-scope=unlimited][data-color-scheme=dark] h3 {
  3999. color: var(--text-color-1);
  4000. }
  4001. [data-theme][data-dorako-ui-scope=unlimited][data-color-scheme=dark] h4 {
  4002. color: var(--text-color-2);
  4003. }
  4004. [data-theme][data-dorako-ui-scope=unlimited][data-color-scheme=dark] h5 {
  4005. color: var(--text-color-2);
  4006. }
  4007. [data-theme][data-dorako-ui-scope=unlimited][data-color-scheme=dark] h6 {
  4008. color: var(--text-color-2);
  4009. }
  4010. [data-theme][data-dorako-ui-scope=unlimited] {
  4011. color: var(--text-color-3);
  4012. }
  4013. [data-theme][data-dorako-ui-scope=unlimited] input[type=text],
  4014. [data-theme][data-dorako-ui-scope=unlimited] input[type=number],
  4015. [data-theme][data-dorako-ui-scope=unlimited] input[type=password],
  4016. [data-theme][data-dorako-ui-scope=unlimited] input[type=date],
  4017. [data-theme][data-dorako-ui-scope=unlimited] input[type=time],
  4018. [data-theme][data-dorako-ui-scope=unlimited] input[type=search] {
  4019. min-width: 24px;
  4020. }
  4021. [data-theme][data-dorako-ui-scope=unlimited] fieldset {
  4022. border: 1px solid var(--fieldset-border-color) !important;
  4023. background: var(--fieldset-background-color) !important;
  4024. border-radius: var(--border-radius);
  4025. }
  4026. [data-theme][data-dorako-ui-scope=unlimited] fieldset > legend {
  4027. color: var(--fieldset-legend-color);
  4028. text-shadow: unset;
  4029. }
  4030. [data-theme][data-dorako-ui-scope=unlimited] input[type=range] {
  4031. background: none !important;
  4032. --input-focus-outline-color: transparent;
  4033. --input-border-color: transparent;
  4034. --box-shadow: none;
  4035. }
  4036. [data-theme][data-dorako-ui-scope=unlimited] input[type=range]::-webkit-slider-runnable-track {
  4037. box-shadow: unset;
  4038. border-radius: 3px;
  4039. background: var(--color-secondary-5);
  4040. border: 1px solid var(--color-secondary-4);
  4041. }
  4042. [data-theme][data-dorako-ui-scope=unlimited] input[type=range]::-webkit-slider-thumb {
  4043. border-radius: 50%;
  4044. box-shadow: unset;
  4045. }
  4046. [data-theme][data-dorako-ui-scope=unlimited] input[type=range]:disabled::-webkit-slider-thumb {
  4047. background: color-mix(in srgb, var(--accent-color) 50%, black);
  4048. border: 1px solid color-mix(in srgb, var(--accent-text-color) 50%, black);
  4049. }
  4050. [data-theme][data-dorako-ui-scope=unlimited] input[type=range]:not(:disabled)::-webkit-slider-thumb {
  4051. background: var(--accent-color);
  4052. border: 1px solid var(--color-primary-1);
  4053. }
  4054. [data-theme][data-dorako-ui-scope=unlimited] input[type=color][data-edit] {
  4055. border: 1px solid var(--color-border-light-highlight);
  4056. border-radius: var(--border-radius);
  4057. }
  4058. [data-theme][data-dorako-ui-scope=unlimited] input[type=color i]::-webkit-color-swatch {
  4059. border-color: var(--color-secondary-4);
  4060. }
  4061. [data-theme][data-dorako-ui-scope=unlimited] input[type=range] + .range-value {
  4062. flex: none;
  4063. height: 24px;
  4064. padding: 0 0.5rem;
  4065. display: flex;
  4066. align-items: center;
  4067. gap: 0.25rem;
  4068. background: var(--accent-color);
  4069. border: 1px solid var(--color-primary-1);
  4070. color: var(--accent-text-color);
  4071. text-shadow: none;
  4072. box-shadow: var(--box-shadow);
  4073. border-radius: 3px;
  4074. font-size: var(--font-size-12);
  4075. }
  4076. [data-theme][data-dorako-ui-scope=unlimited] a.button,
  4077. [data-theme][data-dorako-ui-scope=unlimited] button:not(.pm-dropdown) {
  4078. background: var(--app-background);
  4079. border: var(--app-border-width) solid var(--app-border-color);
  4080. text-shadow: var(--app-text-shadow);
  4081. border-radius: var(--border-radius);
  4082. box-shadow: var(--box-shadow);
  4083. color: var(--text-color-3);
  4084. background: var(--button-background);
  4085. border: var(--app-border-width) solid var(--button-border-color);
  4086. color: var(--button-text-color);
  4087. box-shadow: var(--box-shadow);
  4088. text-decoration: none;
  4089. cursor: pointer;
  4090. text-shadow: var(--app-text-shadow);
  4091. }
  4092. [data-theme][data-dorako-ui-scope=unlimited] a.button:not(.disabled, :disabled):hover,
  4093. [data-theme][data-dorako-ui-scope=unlimited] button:not(.pm-dropdown):not(.disabled, :disabled):hover {
  4094. background: var(--button-hover-background);
  4095. color: var(--button-hover-text-color);
  4096. border: var(--app-border-width) solid var(--button-hover-border-color);
  4097. box-shadow: var(--box-shadow);
  4098. }
  4099. [data-theme][data-dorako-ui-scope=unlimited] a.button.view, [data-theme][data-dorako-ui-scope=unlimited] a.button.selected, [data-theme][data-dorako-ui-scope=unlimited] a.button.active,
  4100. [data-theme][data-dorako-ui-scope=unlimited] button:not(.pm-dropdown).view,
  4101. [data-theme][data-dorako-ui-scope=unlimited] button:not(.pm-dropdown).selected,
  4102. [data-theme][data-dorako-ui-scope=unlimited] button:not(.pm-dropdown).active {
  4103. background: var(--button-hover-background);
  4104. outline: 1px solid var(--button-focus-outline-color);
  4105. border-color: var(--button-hover-border-color);
  4106. color: var(--button-hover-text-color);
  4107. text-decoration: none !important;
  4108. font-weight: unset !important;
  4109. }
  4110. [data-theme][data-dorako-ui-scope=unlimited] a.button.empty, [data-theme][data-dorako-ui-scope=unlimited] a.button.disabled, [data-theme][data-dorako-ui-scope=unlimited] a.button:disabled,
  4111. [data-theme][data-dorako-ui-scope=unlimited] button:not(.pm-dropdown).empty,
  4112. [data-theme][data-dorako-ui-scope=unlimited] button:not(.pm-dropdown).disabled,
  4113. [data-theme][data-dorako-ui-scope=unlimited] button:not(.pm-dropdown):disabled {
  4114. --button-background: var(--button-disabled-background);
  4115. --button-hover-background: var(--button-disabled-background);
  4116. --button-border-color: var(--button-disabled-border-color);
  4117. --button-text-color: var(--text-color-5);
  4118. }
  4119. [data-theme][data-dorako-ui-scope=unlimited] .prosemirror menu .pm-dropdown:hover i {
  4120. color: black;
  4121. }
  4122. [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button {
  4123. background: var(--app-background);
  4124. border: var(--app-border-width) solid var(--app-border-color);
  4125. text-shadow: var(--app-text-shadow);
  4126. border-radius: var(--border-radius);
  4127. box-shadow: var(--box-shadow);
  4128. color: var(--text-color-3);
  4129. background: var(--button-background);
  4130. border: var(--app-border-width) solid var(--button-border-color);
  4131. color: var(--button-text-color);
  4132. box-shadow: var(--box-shadow);
  4133. text-decoration: none;
  4134. cursor: pointer;
  4135. text-shadow: var(--app-text-shadow);
  4136. }
  4137. [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button:not(.disabled, :disabled):hover {
  4138. background: var(--button-hover-background);
  4139. color: var(--button-hover-text-color);
  4140. border: var(--app-border-width) solid var(--button-hover-border-color);
  4141. box-shadow: var(--box-shadow);
  4142. }
  4143. [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.view, [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.selected, [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.active {
  4144. background: var(--button-hover-background);
  4145. outline: 1px solid var(--button-focus-outline-color);
  4146. border-color: var(--button-hover-border-color);
  4147. color: var(--button-hover-text-color);
  4148. text-decoration: none !important;
  4149. font-weight: unset !important;
  4150. }
  4151. [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.empty, [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.disabled, [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button:disabled {
  4152. --button-background: var(--button-disabled-background);
  4153. --button-hover-background: var(--button-disabled-background);
  4154. --button-border-color: var(--button-disabled-border-color);
  4155. --button-text-color: var(--text-color-5);
  4156. }
  4157. [data-theme][data-dorako-ui-scope=unlimited] input[type=text],
  4158. [data-theme][data-dorako-ui-scope=unlimited] input[type=number],
  4159. [data-theme][data-dorako-ui-scope=unlimited] input[type=password],
  4160. [data-theme][data-dorako-ui-scope=unlimited] input[type=date],
  4161. [data-theme][data-dorako-ui-scope=unlimited] input[type=time],
  4162. [data-theme][data-dorako-ui-scope=unlimited] input[type=search],
  4163. [data-theme][data-dorako-ui-scope=unlimited] select:not(.tag) {
  4164. background: var(--input-background);
  4165. border: var(--app-border-width) solid;
  4166. border-color: var(--input-border-color) !important;
  4167. color: var(--input-text-color);
  4168. box-shadow: var(--input-box-shadow) !important;
  4169. align-items: center;
  4170. border-radius: 4px;
  4171. outline: 1px solid transparent;
  4172. user-select: text;
  4173. transition: outline-color 0.5s;
  4174. }
  4175. [data-theme][data-dorako-ui-scope=unlimited] input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=unlimited] input[type=text]:focus,
  4176. [data-theme][data-dorako-ui-scope=unlimited] input[type=number]:not(:disabled, .disabled, [type=checkbox]):hover,
  4177. [data-theme][data-dorako-ui-scope=unlimited] input[type=number]:focus,
  4178. [data-theme][data-dorako-ui-scope=unlimited] input[type=password]:not(:disabled, .disabled, [type=checkbox]):hover,
  4179. [data-theme][data-dorako-ui-scope=unlimited] input[type=password]:focus,
  4180. [data-theme][data-dorako-ui-scope=unlimited] input[type=date]:not(:disabled, .disabled, [type=checkbox]):hover,
  4181. [data-theme][data-dorako-ui-scope=unlimited] input[type=date]:focus,
  4182. [data-theme][data-dorako-ui-scope=unlimited] input[type=time]:not(:disabled, .disabled, [type=checkbox]):hover,
  4183. [data-theme][data-dorako-ui-scope=unlimited] input[type=time]:focus,
  4184. [data-theme][data-dorako-ui-scope=unlimited] input[type=search]:not(:disabled, .disabled, [type=checkbox]):hover,
  4185. [data-theme][data-dorako-ui-scope=unlimited] input[type=search]:focus,
  4186. [data-theme][data-dorako-ui-scope=unlimited] select:not(.tag):not(:disabled, .disabled, [type=checkbox]):hover,
  4187. [data-theme][data-dorako-ui-scope=unlimited] select:not(.tag):focus {
  4188. outline: 1px solid var(--input-focus-outline-color);
  4189. border: var(--app-border-width) solid;
  4190. border-color: var(--input-border-color);
  4191. color: var(--input-focus-text-color);
  4192. box-shadow: var(--box-shadow);
  4193. }
  4194. [data-theme][data-dorako-ui-scope=unlimited] input[type=text].disabled, [data-theme][data-dorako-ui-scope=unlimited] input[type=text]:disabled,
  4195. [data-theme][data-dorako-ui-scope=unlimited] input[type=number].disabled,
  4196. [data-theme][data-dorako-ui-scope=unlimited] input[type=number]:disabled,
  4197. [data-theme][data-dorako-ui-scope=unlimited] input[type=password].disabled,
  4198. [data-theme][data-dorako-ui-scope=unlimited] input[type=password]:disabled,
  4199. [data-theme][data-dorako-ui-scope=unlimited] input[type=date].disabled,
  4200. [data-theme][data-dorako-ui-scope=unlimited] input[type=date]:disabled,
  4201. [data-theme][data-dorako-ui-scope=unlimited] input[type=time].disabled,
  4202. [data-theme][data-dorako-ui-scope=unlimited] input[type=time]:disabled,
  4203. [data-theme][data-dorako-ui-scope=unlimited] input[type=search].disabled,
  4204. [data-theme][data-dorako-ui-scope=unlimited] input[type=search]:disabled,
  4205. [data-theme][data-dorako-ui-scope=unlimited] select:not(.tag).disabled,
  4206. [data-theme][data-dorako-ui-scope=unlimited] select:not(.tag):disabled {
  4207. --input-text-color: var(--text-color-disabled);
  4208. --input-background: var(--input-disabled-background);
  4209. --input-border-color: var(--input-disabled-border-color);
  4210. }
  4211. [data-theme][data-dorako-ui-scope=unlimited] input[type=text].disabled::placeholder, [data-theme][data-dorako-ui-scope=unlimited] input[type=text]:disabled::placeholder,
  4212. [data-theme][data-dorako-ui-scope=unlimited] input[type=number].disabled::placeholder,
  4213. [data-theme][data-dorako-ui-scope=unlimited] input[type=number]:disabled::placeholder,
  4214. [data-theme][data-dorako-ui-scope=unlimited] input[type=password].disabled::placeholder,
  4215. [data-theme][data-dorako-ui-scope=unlimited] input[type=password]:disabled::placeholder,
  4216. [data-theme][data-dorako-ui-scope=unlimited] input[type=date].disabled::placeholder,
  4217. [data-theme][data-dorako-ui-scope=unlimited] input[type=date]:disabled::placeholder,
  4218. [data-theme][data-dorako-ui-scope=unlimited] input[type=time].disabled::placeholder,
  4219. [data-theme][data-dorako-ui-scope=unlimited] input[type=time]:disabled::placeholder,
  4220. [data-theme][data-dorako-ui-scope=unlimited] input[type=search].disabled::placeholder,
  4221. [data-theme][data-dorako-ui-scope=unlimited] input[type=search]:disabled::placeholder,
  4222. [data-theme][data-dorako-ui-scope=unlimited] select:not(.tag).disabled::placeholder,
  4223. [data-theme][data-dorako-ui-scope=unlimited] select:not(.tag):disabled::placeholder {
  4224. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  4225. }
  4226. [data-theme][data-dorako-ui-scope=unlimited] input[type=text]::placeholder,
  4227. [data-theme][data-dorako-ui-scope=unlimited] input[type=number]::placeholder,
  4228. [data-theme][data-dorako-ui-scope=unlimited] input[type=password]::placeholder,
  4229. [data-theme][data-dorako-ui-scope=unlimited] input[type=date]::placeholder,
  4230. [data-theme][data-dorako-ui-scope=unlimited] input[type=time]::placeholder,
  4231. [data-theme][data-dorako-ui-scope=unlimited] input[type=search]::placeholder,
  4232. [data-theme][data-dorako-ui-scope=unlimited] select:not(.tag)::placeholder {
  4233. color: var(--input-placeholder-color);
  4234. }
  4235. [data-theme][data-dorako-ui-scope=unlimited] input[type=text][type=checkbox],
  4236. [data-theme][data-dorako-ui-scope=unlimited] input[type=number][type=checkbox],
  4237. [data-theme][data-dorako-ui-scope=unlimited] input[type=password][type=checkbox],
  4238. [data-theme][data-dorako-ui-scope=unlimited] input[type=date][type=checkbox],
  4239. [data-theme][data-dorako-ui-scope=unlimited] input[type=time][type=checkbox],
  4240. [data-theme][data-dorako-ui-scope=unlimited] input[type=search][type=checkbox],
  4241. [data-theme][data-dorako-ui-scope=unlimited] select:not(.tag)[type=checkbox] {
  4242. outline: unset !important;
  4243. border: unset !important;
  4244. box-shadow: unset !important;
  4245. }
  4246. [data-theme][data-dorako-ui-scope=unlimited] textarea {
  4247. color: var(--input-text-color);
  4248. background: var(--input-background);
  4249. border: var(--window-app-border-width);
  4250. border-color: var(--input-border-color);
  4251. }
  4252. [data-theme][data-dorako-ui-scope=unlimited] hr {
  4253. border: none;
  4254. border-top: 1px solid var(--app-border-color);
  4255. border-bottom: 1px solid var(--color-secondary-5);
  4256. }
  4257. [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.default {
  4258. background: var(--app-background);
  4259. border: var(--app-border-width) solid var(--app-border-color);
  4260. text-shadow: var(--app-text-shadow);
  4261. border-radius: var(--border-radius);
  4262. box-shadow: var(--box-shadow);
  4263. color: var(--text-color-3);
  4264. background: var(--button-background);
  4265. border: var(--app-border-width) solid var(--button-border-color);
  4266. color: var(--button-text-color);
  4267. box-shadow: var(--box-shadow);
  4268. text-decoration: none;
  4269. cursor: pointer;
  4270. text-shadow: var(--app-text-shadow);
  4271. }
  4272. [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.default:not(.disabled, :disabled):hover {
  4273. background: var(--button-hover-background);
  4274. color: var(--button-hover-text-color);
  4275. border: var(--app-border-width) solid var(--button-hover-border-color);
  4276. box-shadow: var(--box-shadow);
  4277. }
  4278. [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.default.view, [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.default.selected, [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.default.active {
  4279. background: var(--button-hover-background);
  4280. outline: 1px solid var(--button-focus-outline-color);
  4281. border-color: var(--button-hover-border-color);
  4282. color: var(--button-hover-text-color);
  4283. text-decoration: none !important;
  4284. font-weight: unset !important;
  4285. }
  4286. [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.default.empty, [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.default.disabled, [data-theme][data-dorako-ui-scope=unlimited].dialog .dialog-buttons button.default:disabled {
  4287. --button-background: var(--button-disabled-background);
  4288. --button-hover-background: var(--button-disabled-background);
  4289. --button-border-color: var(--button-disabled-border-color);
  4290. --button-text-color: var(--text-color-5);
  4291. }
  4292. [data-theme][data-dorako-ui-scope=unlimited] [data-visibility]:not([data-visibility=all]) {
  4293. color: black;
  4294. text-shadow: none;
  4295. }
  4296. [data-theme][data-dorako-ui-scope=unlimited] form .form-group .form-fields button {
  4297. height: var(--form-field-height);
  4298. }
  4299. [data-theme][data-dorako-ui-scope=unlimited].sheet header.sheet-header img {
  4300. background: var(--app-background);
  4301. border: var(--app-border-width) solid var(--app-border-color);
  4302. text-shadow: var(--app-text-shadow);
  4303. border-radius: var(--border-radius);
  4304. box-shadow: var(--box-shadow);
  4305. color: var(--text-color-3);
  4306. border: 1px solid var(--icon-border-color);
  4307. }
  4308. [data-theme][data-dorako-ui-scope=unlimited].sheet header.sheet-header h1 input {
  4309. --font-size: inherit;
  4310. font-size: 28px;
  4311. }
  4312. [data-theme][data-dorako-ui-scope=unlimited].app.sidebar-popout .window-content {
  4313. color: inherit;
  4314. }
  4315. /* ----------------------------------------- */
  4316. /* App and Window-app */
  4317. /* ----------------------------------------- */
  4318. [data-theme].app {
  4319. border-radius: var(--border-radius);
  4320. background: unset;
  4321. background: var(--app-background);
  4322. background-position: top;
  4323. background-size: cover;
  4324. border: var(--app-border-width) solid;
  4325. border-color: var(--app-border-color);
  4326. }
  4327. [data-theme].window-app {
  4328. background: var(--window-app-background);
  4329. background-position: top;
  4330. background-size: cover;
  4331. border: var(--window-app-border-width) solid;
  4332. border-color: var(--window-app-border-color);
  4333. backdrop-filter: blur(4px);
  4334. box-shadow: var(--window-app-box-shadow);
  4335. }
  4336. [data-theme].window-app.sidebar-popout {
  4337. border: var(--app-border-width) solid var(--window-app-border-color);
  4338. box-shadow: var(--box-shadow);
  4339. }
  4340. [data-theme].window-app .window-header {
  4341. flex: 0 0 27px;
  4342. border: unset;
  4343. text-shadow: 0px 1px 2px black;
  4344. border-radius: var(--border-radius) var(--border-radius) 0px 0px;
  4345. }
  4346. [data-theme].window-app .window-content {
  4347. background: unset !important;
  4348. box-shadow: unset;
  4349. }
  4350. [data-theme].window-app .window-resizable-handle {
  4351. background: var(--color-primary-4);
  4352. border: 1px solid var(--window-app-border-color);
  4353. border-radius: 4px 0px var(--border-radius) 0px;
  4354. border-bottom-color: var(--color-primary-3);
  4355. border-right-color: var(--color-primary-3);
  4356. bottom: -1px;
  4357. right: -1px;
  4358. z-index: 2;
  4359. }
  4360. /* ----------------------------------------- */
  4361. /* Application specific */
  4362. /* ----------------------------------------- */
  4363. [data-theme].token-sheet, [data-theme].dialog {
  4364. height: auto !important;
  4365. }
  4366. [data-theme].token-sheet nav.sheet-tabs.secondary-tabs {
  4367. margin-top: 2px;
  4368. }
  4369. [data-theme] .inline-roll .dice-tooltip {
  4370. background: var(--app-background);
  4371. border: 1px solid var(--color-primary-1);
  4372. box-shadow: 0px 0px 6px var(--color-primary-2), 0px 2px 8px 1px var(--color-primary-3);
  4373. backdrop-filter: blur(5px);
  4374. border-radius: var(--border-radius);
  4375. -webkit-backdrop-filter: blur(5px);
  4376. font-size: var(--font-size-16);
  4377. line-height: var(--font-size-16);
  4378. text-shadow: 0px 1px 2px black;
  4379. padding: 0.4em 0.6em;
  4380. }
  4381. [data-theme] #chat-controls .roll-type-select {
  4382. background: var(--input-background);
  4383. border: var(--app-border-width) solid;
  4384. border-color: var(--input-border-color) !important;
  4385. color: var(--input-text-color);
  4386. box-shadow: var(--input-box-shadow) !important;
  4387. align-items: center;
  4388. border-radius: 4px;
  4389. outline: 1px solid transparent;
  4390. user-select: text;
  4391. transition: outline-color 0.5s;
  4392. margin: 0px;
  4393. }
  4394. [data-theme] #chat-controls .roll-type-select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme] #chat-controls .roll-type-select:focus {
  4395. outline: 1px solid var(--input-focus-outline-color);
  4396. border: var(--app-border-width) solid;
  4397. border-color: var(--input-border-color);
  4398. color: var(--input-focus-text-color);
  4399. box-shadow: var(--box-shadow);
  4400. }
  4401. [data-theme] #chat-controls .roll-type-select.disabled, [data-theme] #chat-controls .roll-type-select:disabled {
  4402. --input-text-color: var(--text-color-disabled);
  4403. --input-background: var(--input-disabled-background);
  4404. --input-border-color: var(--input-disabled-border-color);
  4405. }
  4406. [data-theme] #chat-controls .roll-type-select.disabled::placeholder, [data-theme] #chat-controls .roll-type-select:disabled::placeholder {
  4407. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  4408. }
  4409. [data-theme] #chat-controls .roll-type-select::placeholder {
  4410. color: var(--input-placeholder-color);
  4411. }
  4412. [data-theme] #chat-controls .roll-type-select[type=checkbox] {
  4413. outline: unset !important;
  4414. border: unset !important;
  4415. box-shadow: unset !important;
  4416. }
  4417. [data-theme].filepicker .favorites .paths {
  4418. box-shadow: unset;
  4419. border: 1px solid var(--input-border-color);
  4420. background: var(--input-background);
  4421. }
  4422. [data-theme].filepicker .favorites .paths .path {
  4423. background: var(--app-background);
  4424. border: var(--app-border-width) solid var(--app-border-color);
  4425. text-shadow: var(--app-text-shadow);
  4426. border-radius: var(--border-radius);
  4427. box-shadow: var(--box-shadow);
  4428. color: var(--text-color-3);
  4429. background: var(--button-background);
  4430. border: var(--app-border-width) solid var(--button-border-color);
  4431. color: var(--button-text-color);
  4432. box-shadow: var(--box-shadow);
  4433. text-decoration: none;
  4434. cursor: pointer;
  4435. text-shadow: var(--app-text-shadow);
  4436. transition: background 0.1s ease-in-out;
  4437. --button-background: var(--button-toggle-background);
  4438. --button-border-color: var(--button-toggle-border-color);
  4439. --button-focus-outline-color: var(--button-toggle-focus-outline-color);
  4440. --button-hover-background: var(--button-toggle-hover-background);
  4441. --button-hover-border-color: var(--button-toggle-hover-border-color);
  4442. border-radius: 3px;
  4443. }
  4444. [data-theme].filepicker .favorites .paths .path:not(.disabled, :disabled):hover {
  4445. background: var(--button-hover-background);
  4446. color: var(--button-hover-text-color);
  4447. border: var(--app-border-width) solid var(--button-hover-border-color);
  4448. box-shadow: var(--box-shadow);
  4449. }
  4450. [data-theme].filepicker .favorites .paths .path.view, [data-theme].filepicker .favorites .paths .path.selected, [data-theme].filepicker .favorites .paths .path.active {
  4451. background: var(--button-hover-background);
  4452. outline: 1px solid var(--button-focus-outline-color);
  4453. border-color: var(--button-hover-border-color);
  4454. color: var(--button-hover-text-color);
  4455. text-decoration: none !important;
  4456. font-weight: unset !important;
  4457. }
  4458. [data-theme].filepicker .favorites .paths .path.empty, [data-theme].filepicker .favorites .paths .path.disabled, [data-theme].filepicker .favorites .paths .path:disabled {
  4459. --button-background: var(--button-disabled-background);
  4460. --button-hover-background: var(--button-disabled-background);
  4461. --button-border-color: var(--button-disabled-border-color);
  4462. --button-text-color: var(--text-color-5);
  4463. }
  4464. [data-theme].filepicker .favorites .paths .path:disabled {
  4465. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  4466. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  4467. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  4468. }
  4469. [data-theme].filepicker .current-dir button {
  4470. height: 32px;
  4471. }
  4472. [data-theme].package-configuration aside.sidebar {
  4473. border: unset;
  4474. }
  4475. [data-theme].package-configuration aside.sidebar nav.tabs {
  4476. gap: 5px;
  4477. }
  4478. [data-theme].package-configuration aside.sidebar nav.tabs .category-tab {
  4479. background: var(--app-background);
  4480. border: var(--app-border-width) solid var(--app-border-color);
  4481. text-shadow: var(--app-text-shadow);
  4482. border-radius: var(--border-radius);
  4483. box-shadow: var(--box-shadow);
  4484. color: var(--text-color-3);
  4485. background: var(--button-background);
  4486. border: var(--app-border-width) solid var(--button-border-color);
  4487. color: var(--button-text-color);
  4488. box-shadow: var(--box-shadow);
  4489. text-decoration: none;
  4490. cursor: pointer;
  4491. text-shadow: var(--app-text-shadow);
  4492. padding: 4px 8px;
  4493. margin: 1px 4px;
  4494. }
  4495. [data-theme].package-configuration aside.sidebar nav.tabs .category-tab:not(.disabled, :disabled):hover {
  4496. background: var(--button-hover-background);
  4497. color: var(--button-hover-text-color);
  4498. border: var(--app-border-width) solid var(--button-hover-border-color);
  4499. box-shadow: var(--box-shadow);
  4500. }
  4501. [data-theme].package-configuration aside.sidebar nav.tabs .category-tab.view, [data-theme].package-configuration aside.sidebar nav.tabs .category-tab.selected, [data-theme].package-configuration aside.sidebar nav.tabs .category-tab.active {
  4502. background: var(--button-hover-background);
  4503. outline: 1px solid var(--button-focus-outline-color);
  4504. border-color: var(--button-hover-border-color);
  4505. color: var(--button-hover-text-color);
  4506. text-decoration: none !important;
  4507. font-weight: unset !important;
  4508. }
  4509. [data-theme].package-configuration aside.sidebar nav.tabs .category-tab.empty, [data-theme].package-configuration aside.sidebar nav.tabs .category-tab.disabled, [data-theme].package-configuration aside.sidebar nav.tabs .category-tab:disabled {
  4510. --button-background: var(--button-disabled-background);
  4511. --button-hover-background: var(--button-disabled-background);
  4512. --button-border-color: var(--button-disabled-border-color);
  4513. --button-text-color: var(--text-color-5);
  4514. }
  4515. [data-theme].sheet nav.sheet-tabs {
  4516. border: none;
  4517. }
  4518. [data-theme] .directory .action-buttons button {
  4519. box-shadow: var(--box-shadow);
  4520. }
  4521. [data-theme] .directory .directory-header .header-search input {
  4522. background: var(--input-background);
  4523. border: var(--app-border-width) solid;
  4524. border-color: var(--input-border-color) !important;
  4525. color: var(--input-text-color);
  4526. box-shadow: var(--input-box-shadow) !important;
  4527. align-items: center;
  4528. border-radius: 4px;
  4529. outline: 1px solid transparent;
  4530. user-select: text;
  4531. transition: outline-color 0.5s;
  4532. }
  4533. [data-theme] .directory .directory-header .header-search input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme] .directory .directory-header .header-search input:focus {
  4534. outline: 1px solid var(--input-focus-outline-color);
  4535. border: var(--app-border-width) solid;
  4536. border-color: var(--input-border-color);
  4537. color: var(--input-focus-text-color);
  4538. box-shadow: var(--box-shadow);
  4539. }
  4540. [data-theme] .directory .directory-header .header-search input.disabled, [data-theme] .directory .directory-header .header-search input:disabled {
  4541. --input-text-color: var(--text-color-disabled);
  4542. --input-background: var(--input-disabled-background);
  4543. --input-border-color: var(--input-disabled-border-color);
  4544. }
  4545. [data-theme] .directory .directory-header .header-search input.disabled::placeholder, [data-theme] .directory .directory-header .header-search input:disabled::placeholder {
  4546. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  4547. }
  4548. [data-theme] .directory .directory-header .header-search input::placeholder {
  4549. color: var(--input-placeholder-color);
  4550. }
  4551. [data-theme] .directory .directory-header .header-search input[type=checkbox] {
  4552. outline: unset !important;
  4553. border: unset !important;
  4554. box-shadow: unset !important;
  4555. }
  4556. [data-theme] .directory .action-buttons button,
  4557. [data-theme] .settings-sidebar button {
  4558. background: var(--app-background);
  4559. border: var(--app-border-width) solid var(--app-border-color);
  4560. text-shadow: var(--app-text-shadow);
  4561. border-radius: var(--border-radius);
  4562. box-shadow: var(--box-shadow);
  4563. color: var(--text-color-3);
  4564. background: var(--button-background);
  4565. border: var(--app-border-width) solid var(--button-border-color);
  4566. color: var(--button-text-color);
  4567. box-shadow: var(--box-shadow);
  4568. text-decoration: none;
  4569. cursor: pointer;
  4570. text-shadow: var(--app-text-shadow);
  4571. }
  4572. [data-theme] .directory .action-buttons button:not(.disabled, :disabled):hover,
  4573. [data-theme] .settings-sidebar button:not(.disabled, :disabled):hover {
  4574. background: var(--button-hover-background);
  4575. color: var(--button-hover-text-color);
  4576. border: var(--app-border-width) solid var(--button-hover-border-color);
  4577. box-shadow: var(--box-shadow);
  4578. }
  4579. [data-theme] .directory .action-buttons button.view, [data-theme] .directory .action-buttons button.selected, [data-theme] .directory .action-buttons button.active,
  4580. [data-theme] .settings-sidebar button.view,
  4581. [data-theme] .settings-sidebar button.selected,
  4582. [data-theme] .settings-sidebar button.active {
  4583. background: var(--button-hover-background);
  4584. outline: 1px solid var(--button-focus-outline-color);
  4585. border-color: var(--button-hover-border-color);
  4586. color: var(--button-hover-text-color);
  4587. text-decoration: none !important;
  4588. font-weight: unset !important;
  4589. }
  4590. [data-theme] .directory .action-buttons button.empty, [data-theme] .directory .action-buttons button.disabled, [data-theme] .directory .action-buttons button:disabled,
  4591. [data-theme] .settings-sidebar button.empty,
  4592. [data-theme] .settings-sidebar button.disabled,
  4593. [data-theme] .settings-sidebar button:disabled {
  4594. --button-background: var(--button-disabled-background);
  4595. --button-hover-background: var(--button-disabled-background);
  4596. --button-border-color: var(--button-disabled-border-color);
  4597. --button-text-color: var(--text-color-5);
  4598. }
  4599. /* ----------------------------------------- */
  4600. /* Core overwrites */
  4601. /* ----------------------------------------- */
  4602. [data-theme][data-color-scheme=dark].app.token-sheet .tab.active[data-tab=appearance] fieldset {
  4603. border-color: var(--color-secondary-3);
  4604. }
  4605. [data-theme][data-color-scheme=dark].app.token-sheet .tab.active[data-tab=appearance] fieldset > legend {
  4606. color: var(--text-color-2);
  4607. }
  4608. [data-theme].window-app .tabs .item {
  4609. background: var(--app-background);
  4610. border: var(--app-border-width) solid var(--app-border-color);
  4611. text-shadow: var(--app-text-shadow);
  4612. border-radius: var(--border-radius);
  4613. box-shadow: var(--box-shadow);
  4614. color: var(--text-color-3);
  4615. background: var(--button-background);
  4616. border: var(--app-border-width) solid var(--button-border-color);
  4617. color: var(--button-text-color);
  4618. box-shadow: var(--box-shadow);
  4619. text-decoration: none;
  4620. cursor: pointer;
  4621. text-shadow: var(--app-text-shadow);
  4622. }
  4623. [data-theme].window-app .tabs .item:not(.disabled, :disabled):hover {
  4624. background: var(--button-hover-background);
  4625. color: var(--button-hover-text-color);
  4626. border: var(--app-border-width) solid var(--button-hover-border-color);
  4627. box-shadow: var(--box-shadow);
  4628. }
  4629. [data-theme].window-app .tabs .item.view, [data-theme].window-app .tabs .item.selected, [data-theme].window-app .tabs .item.active {
  4630. background: var(--button-hover-background);
  4631. outline: 1px solid var(--button-focus-outline-color);
  4632. border-color: var(--button-hover-border-color);
  4633. color: var(--button-hover-text-color);
  4634. text-decoration: none !important;
  4635. font-weight: unset !important;
  4636. }
  4637. [data-theme].window-app .tabs .item.empty, [data-theme].window-app .tabs .item.disabled, [data-theme].window-app .tabs .item:disabled {
  4638. --button-background: var(--button-disabled-background);
  4639. --button-hover-background: var(--button-disabled-background);
  4640. --button-border-color: var(--button-disabled-border-color);
  4641. --button-text-color: var(--text-color-5);
  4642. }
  4643. [data-theme].sheet nav.sheet-tabs {
  4644. gap: 5px;
  4645. }
  4646. /* ----------------------------------------- */
  4647. /* Journals */
  4648. /* ----------------------------------------- */
  4649. [data-theme].sheet.journal-entry .journal-entry-content {
  4650. background: unset;
  4651. border: unset;
  4652. }
  4653. [data-theme].journal-sheet .journal-header .title {
  4654. background: var(--input-background);
  4655. border: var(--app-border-width) solid;
  4656. border-color: var(--input-border-color) !important;
  4657. color: var(--input-text-color);
  4658. box-shadow: var(--input-box-shadow) !important;
  4659. align-items: center;
  4660. border-radius: 4px;
  4661. outline: 1px solid transparent;
  4662. user-select: text;
  4663. transition: outline-color 0.5s;
  4664. }
  4665. [data-theme].journal-sheet .journal-header .title:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].journal-sheet .journal-header .title:focus {
  4666. outline: 1px solid var(--input-focus-outline-color);
  4667. border: var(--app-border-width) solid;
  4668. border-color: var(--input-border-color);
  4669. color: var(--input-focus-text-color);
  4670. box-shadow: var(--box-shadow);
  4671. }
  4672. [data-theme].journal-sheet .journal-header .title.disabled, [data-theme].journal-sheet .journal-header .title:disabled {
  4673. --input-text-color: var(--text-color-disabled);
  4674. --input-background: var(--input-disabled-background);
  4675. --input-border-color: var(--input-disabled-border-color);
  4676. }
  4677. [data-theme].journal-sheet .journal-header .title.disabled::placeholder, [data-theme].journal-sheet .journal-header .title:disabled::placeholder {
  4678. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  4679. }
  4680. [data-theme].journal-sheet .journal-header .title::placeholder {
  4681. color: var(--input-placeholder-color);
  4682. }
  4683. [data-theme].journal-sheet .journal-header .title[type=checkbox] {
  4684. outline: unset !important;
  4685. border: unset !important;
  4686. box-shadow: unset !important;
  4687. }
  4688. [data-theme] .editor-edit {
  4689. background: var(--app-background);
  4690. border: var(--app-border-width) solid var(--app-border-color);
  4691. text-shadow: var(--app-text-shadow);
  4692. border-radius: var(--border-radius);
  4693. box-shadow: var(--box-shadow);
  4694. color: var(--text-color-3);
  4695. background: var(--button-background);
  4696. border: var(--app-border-width) solid var(--button-border-color);
  4697. color: var(--button-text-color);
  4698. box-shadow: var(--box-shadow);
  4699. text-decoration: none;
  4700. cursor: pointer;
  4701. text-shadow: var(--app-text-shadow);
  4702. border-radius: 3px;
  4703. padding: 2px 5px;
  4704. }
  4705. [data-theme] .editor-edit:not(.disabled, :disabled):hover {
  4706. background: var(--button-hover-background);
  4707. color: var(--button-hover-text-color);
  4708. border: var(--app-border-width) solid var(--button-hover-border-color);
  4709. box-shadow: var(--box-shadow);
  4710. }
  4711. [data-theme] .editor-edit.view, [data-theme] .editor-edit.selected, [data-theme] .editor-edit.active {
  4712. background: var(--button-hover-background);
  4713. outline: 1px solid var(--button-focus-outline-color);
  4714. border-color: var(--button-hover-border-color);
  4715. color: var(--button-hover-text-color);
  4716. text-decoration: none !important;
  4717. font-weight: unset !important;
  4718. }
  4719. [data-theme] .editor-edit.empty, [data-theme] .editor-edit.disabled, [data-theme] .editor-edit:disabled {
  4720. --button-background: var(--button-disabled-background);
  4721. --button-hover-background: var(--button-disabled-background);
  4722. --button-border-color: var(--button-disabled-border-color);
  4723. --button-text-color: var(--text-color-5);
  4724. }
  4725. /* ----------------------------------------- */
  4726. /* Tables */
  4727. /* ----------------------------------------- */
  4728. [data-theme] table.pf2e,
  4729. [data-theme] table.pf2-table {
  4730. --text-dark: black;
  4731. }
  4732. [data-theme] table:not(.pf2-table, .pf2e) tr:nth-child(even) {
  4733. background: color-mix(in srgb, var(--color-secondary-3) 20%, transparent);
  4734. }
  4735. /* ----------------------------------------- */
  4736. /* Tagify and tags */
  4737. /* ----------------------------------------- */
  4738. [data-theme] .tagify,
  4739. [data-theme] .tah-dialog-tags-dropdown .tagify__dropdown__wrapper,
  4740. [data-theme] tags.tagify.pf2e-tagify {
  4741. --tags-disabled-bg: #f1f1f1;
  4742. --tags-border-color: #ddd;
  4743. --tags-hover-border-color: #ccc;
  4744. --tags-focus-border-color: #3595f6;
  4745. --tag-border-radius: 3px;
  4746. --tag-bg: #e5e5e5;
  4747. --tag-hover: #d3e2e2;
  4748. --tag-text-color: black;
  4749. --tag-text-color--edit: black;
  4750. --tag-pad: 0.3em 0.5em;
  4751. --tag-inset-shadow-size: 1.1em;
  4752. --tag-invalid-color: #d39494;
  4753. --tag-invalid-bg: rgba(211, 148, 148, 0.5);
  4754. --tag-remove-bg: rgba(211, 148, 148, 0.3);
  4755. --tag-remove-btn-color: black;
  4756. --tag-remove-btn-bg: none;
  4757. --tag-remove-btn-bg--hover: #c77777;
  4758. --input-color: inherit;
  4759. --tag-hide-transition: 0.3s;
  4760. --placeholder-color: rgba(0, 0, 0, 0.4);
  4761. --placeholder-color-focus: rgba(0, 0, 0, 0.25);
  4762. --tag-bg: var(--color-primary-2);
  4763. --tags-hover-border-color: var(--color-secondary-3);
  4764. --tag-color: var(--text-color-2);
  4765. --tag-bg: var(--color-secondary-4);
  4766. --tag-border-color: var(--color-border-medium);
  4767. --tags-border-color: var(--color-border-medium);
  4768. background: var(--input-background);
  4769. border: var(--app-border-width) solid var(--input-border-color);
  4770. box-shadow: var(--input-box-shadow);
  4771. border-radius: 3px;
  4772. }
  4773. [data-theme] .tagify .tagify__dropdown__item,
  4774. [data-theme] .tah-dialog-tags-dropdown .tagify__dropdown__wrapper .tagify__dropdown__item,
  4775. [data-theme] tags.tagify.pf2e-tagify .tagify__dropdown__item {
  4776. color: var(--color-text-1);
  4777. }
  4778. [data-theme] .tagify.tagify--empty .tagify__input::before,
  4779. [data-theme] .tah-dialog-tags-dropdown .tagify__dropdown__wrapper.tagify--empty .tagify__input::before,
  4780. [data-theme] tags.tagify.pf2e-tagify.tagify--empty .tagify__input::before {
  4781. color: var(--text-color-5);
  4782. }
  4783. [data-theme] .tagify:hover,
  4784. [data-theme] .tah-dialog-tags-dropdown .tagify__dropdown__wrapper:hover,
  4785. [data-theme] tags.tagify.pf2e-tagify:hover {
  4786. box-shadow: unset;
  4787. }
  4788. [data-theme] .tagify select.tag,
  4789. [data-theme] .tah-dialog-tags-dropdown .tagify__dropdown__wrapper select.tag,
  4790. [data-theme] tags.tagify.pf2e-tagify select.tag {
  4791. border-width: 1px 1px 1px 1px;
  4792. }
  4793. [data-theme] .tagify tag,
  4794. [data-theme] .tah-dialog-tags-dropdown .tagify__dropdown__wrapper tag,
  4795. [data-theme] tags.tagify.pf2e-tagify tag {
  4796. border-radius: 4px;
  4797. border: 1px solid var(--tag-border-color);
  4798. }
  4799. [data-theme] .tagify tag .tagify__tag__removeBtn,
  4800. [data-theme] .tah-dialog-tags-dropdown .tagify__dropdown__wrapper tag .tagify__tag__removeBtn,
  4801. [data-theme] tags.tagify.pf2e-tagify tag .tagify__tag__removeBtn {
  4802. width: 12px;
  4803. height: 12px;
  4804. font: 12px/1 Arial;
  4805. }
  4806. [data-theme] .tagify tag .tagify__tag__removeBtn,
  4807. [data-theme] .tagify tag > div .tagify__tag-text,
  4808. [data-theme] .tah-dialog-tags-dropdown .tagify__dropdown__wrapper tag .tagify__tag__removeBtn,
  4809. [data-theme] .tah-dialog-tags-dropdown .tagify__dropdown__wrapper tag > div .tagify__tag-text,
  4810. [data-theme] tags.tagify.pf2e-tagify tag .tagify__tag__removeBtn,
  4811. [data-theme] tags.tagify.pf2e-tagify tag > div .tagify__tag-text {
  4812. color: var(--tag-color);
  4813. }
  4814. /* ----------------------------------------- */
  4815. /* System overwrites */
  4816. /* ----------------------------------------- */
  4817. [data-theme][data-color-scheme=dark].pf2e.item.sheet {
  4818. --color-text-dark-2: var(--text-color-3);
  4819. --color-text-dark-4: var(--text-color-3);
  4820. --color-text-dark-input: var(--text-color-3);
  4821. --color-border-dark: var(--text-color-2);
  4822. --color-border-medium: var(--color-secondary-3);
  4823. }
  4824. [data-theme] {
  4825. --visibility-gm-bg: #e8e8efaa;
  4826. --visibility-owner-bg: #ddebe1aa;
  4827. }
  4828. [data-theme] table.pf2-table {
  4829. text-shadow: none;
  4830. }
  4831. [data-theme] [data-visibility]:not([data-visibility=all])[data-visibility=gm] [data-visibility=gm] {
  4832. background: none;
  4833. }
  4834. [data-theme].pf2e.item.sheet input {
  4835. background: var(--input-background);
  4836. border: var(--app-border-width) solid;
  4837. border-color: var(--input-border-color) !important;
  4838. color: var(--input-text-color);
  4839. box-shadow: var(--input-box-shadow) !important;
  4840. align-items: center;
  4841. border-radius: 4px;
  4842. outline: 1px solid transparent;
  4843. user-select: text;
  4844. transition: outline-color 0.5s;
  4845. }
  4846. [data-theme].pf2e.item.sheet input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet input:focus {
  4847. outline: 1px solid var(--input-focus-outline-color);
  4848. border: var(--app-border-width) solid;
  4849. border-color: var(--input-border-color);
  4850. color: var(--input-focus-text-color);
  4851. box-shadow: var(--box-shadow);
  4852. }
  4853. [data-theme].pf2e.item.sheet input.disabled, [data-theme].pf2e.item.sheet input:disabled {
  4854. --input-text-color: var(--text-color-disabled);
  4855. --input-background: var(--input-disabled-background);
  4856. --input-border-color: var(--input-disabled-border-color);
  4857. }
  4858. [data-theme].pf2e.item.sheet input.disabled::placeholder, [data-theme].pf2e.item.sheet input:disabled::placeholder {
  4859. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  4860. }
  4861. [data-theme].pf2e.item.sheet input::placeholder {
  4862. color: var(--input-placeholder-color);
  4863. }
  4864. [data-theme].pf2e.item.sheet input[type=checkbox] {
  4865. outline: unset !important;
  4866. border: unset !important;
  4867. box-shadow: unset !important;
  4868. }
  4869. [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form .rule-element-header .priority input {
  4870. width: 5ch;
  4871. }
  4872. [data-theme].pf2e.item.sheet form .sheet-content section.sidebar .item-summary, [data-theme].pf2e.item.sheet form .sheet-content section.sheet-sidebar .item-summary {
  4873. color: var(--color-text-dark-secondary);
  4874. }
  4875. [data-theme].pf2e.item.sheet .sheet-header .details {
  4876. align-items: center;
  4877. }
  4878. [data-theme]#generate-check-prompt nav h4 a {
  4879. background: var(--app-background);
  4880. border: var(--app-border-width) solid var(--app-border-color);
  4881. text-shadow: var(--app-text-shadow);
  4882. border-radius: var(--border-radius);
  4883. box-shadow: var(--box-shadow);
  4884. color: var(--text-color-3);
  4885. background: var(--button-background);
  4886. border: var(--app-border-width) solid var(--button-border-color);
  4887. color: var(--button-text-color);
  4888. box-shadow: var(--box-shadow);
  4889. text-decoration: none;
  4890. cursor: pointer;
  4891. text-shadow: var(--app-text-shadow);
  4892. padding: 4px 8px;
  4893. }
  4894. [data-theme]#generate-check-prompt nav h4 a:not(.disabled, :disabled):hover {
  4895. background: var(--button-hover-background);
  4896. color: var(--button-hover-text-color);
  4897. border: var(--app-border-width) solid var(--button-hover-border-color);
  4898. box-shadow: var(--box-shadow);
  4899. }
  4900. [data-theme]#generate-check-prompt nav h4 a.view, [data-theme]#generate-check-prompt nav h4 a.selected, [data-theme]#generate-check-prompt nav h4 a.active {
  4901. background: var(--button-hover-background);
  4902. outline: 1px solid var(--button-focus-outline-color);
  4903. border-color: var(--button-hover-border-color);
  4904. color: var(--button-hover-text-color);
  4905. text-decoration: none !important;
  4906. font-weight: unset !important;
  4907. }
  4908. [data-theme]#generate-check-prompt nav h4 a.empty, [data-theme]#generate-check-prompt nav h4 a.disabled, [data-theme]#generate-check-prompt nav h4 a:disabled {
  4909. --button-background: var(--button-disabled-background);
  4910. --button-hover-background: var(--button-disabled-background);
  4911. --button-border-color: var(--button-disabled-border-color);
  4912. --button-text-color: var(--text-color-5);
  4913. }
  4914. [data-theme]#generate-check-prompt .dialog-content tags.tagify {
  4915. --tags-disabled-bg: #f1f1f1;
  4916. --tags-border-color: #ddd;
  4917. --tags-hover-border-color: #ccc;
  4918. --tags-focus-border-color: #3595f6;
  4919. --tag-border-radius: 3px;
  4920. --tag-bg: #e5e5e5;
  4921. --tag-hover: #d3e2e2;
  4922. --tag-text-color: black;
  4923. --tag-text-color--edit: black;
  4924. --tag-pad: 0.3em 0.5em;
  4925. --tag-inset-shadow-size: 1.1em;
  4926. --tag-invalid-color: #d39494;
  4927. --tag-invalid-bg: rgba(211, 148, 148, 0.5);
  4928. --tag-remove-bg: rgba(211, 148, 148, 0.3);
  4929. --tag-remove-btn-color: black;
  4930. --tag-remove-btn-bg: none;
  4931. --tag-remove-btn-bg--hover: #c77777;
  4932. --input-color: inherit;
  4933. --tag-hide-transition: 0.3s;
  4934. --placeholder-color: rgba(0, 0, 0, 0.4);
  4935. --placeholder-color-focus: rgba(0, 0, 0, 0.25);
  4936. --tag-bg: var(--color-primary-2);
  4937. --tags-border-color: var(--color-secondary-4);
  4938. --tags-hover-border-color: var(--color-secondary-3);
  4939. --tag-color: var(--text-color-2);
  4940. --tag-bg: var(--color-secondary-4);
  4941. --tag-border-color: var(--color-secondary-3);
  4942. --tags-border-color: var(--color-secondary-3);
  4943. border: 1px solid var(--tag-border-color);
  4944. border-radius: 3px;
  4945. }
  4946. [data-theme].pf2e.item.sheet form .form-list, [data-theme].pf2e.item.sheet form section.sheet-body fieldset {
  4947. border-color: var(--color-secondary-3);
  4948. }
  4949. [data-theme].pf2e.item.sheet form .form-list > legend, [data-theme].pf2e.item.sheet form section.sheet-body fieldset > legend {
  4950. color: var(--text-color-2);
  4951. }
  4952. [data-theme].pf2e.item.sheet form .form-list.basics, [data-theme].pf2e.item.sheet form section.sheet-body fieldset.basics {
  4953. border-color: transparent;
  4954. }
  4955. [data-theme] section.compendium-sidebar ol.directory-list ol.document-matches li.match .thumbnail img {
  4956. background: var(--app-background);
  4957. border: var(--app-border-width) solid var(--app-border-color);
  4958. text-shadow: var(--app-text-shadow);
  4959. border-radius: var(--border-radius);
  4960. box-shadow: var(--box-shadow);
  4961. color: var(--text-color-3);
  4962. padding: 0px;
  4963. }
  4964. [data-theme] section.compendium-sidebar ol.directory-list ol.document-matches li.match:hover .thumbnail img {
  4965. border: var(--app-border-width) solid;
  4966. border-color: var(--color-primary-2);
  4967. }
  4968. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor:hover a.add-gm-notes {
  4969. display: flex;
  4970. }
  4971. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes {
  4972. background: var(--app-background);
  4973. border: var(--app-border-width) solid var(--app-border-color);
  4974. text-shadow: var(--app-text-shadow);
  4975. border-radius: var(--border-radius);
  4976. box-shadow: var(--box-shadow);
  4977. color: var(--text-color-3);
  4978. background: var(--button-background);
  4979. border: var(--app-border-width) solid var(--button-border-color);
  4980. color: var(--button-text-color);
  4981. box-shadow: var(--box-shadow);
  4982. text-decoration: none;
  4983. cursor: pointer;
  4984. text-shadow: var(--app-text-shadow);
  4985. transition: background 0.1s ease-in-out;
  4986. --button-background: var(--accent-color);
  4987. --button-border-color: var(--accent-color-dark);
  4988. --button-text-color: var(--accent-text-color);
  4989. --app-text-shadow: none;
  4990. --button-hover-background: var(--accent-color-light);
  4991. --button-hover-border-color: var(--accent-color);
  4992. --button-hover-text-color: var(--accent-text-color);
  4993. border-radius: 3px;
  4994. align-content: center;
  4995. justify-content: center;
  4996. right: 40px;
  4997. height: 28px;
  4998. width: 28px;
  4999. background-color: var(--color-primary-4);
  5000. border-color: var(--color-primary-3);
  5001. }
  5002. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes:not(.disabled, :disabled):hover {
  5003. background: var(--button-hover-background);
  5004. color: var(--button-hover-text-color);
  5005. border: var(--app-border-width) solid var(--button-hover-border-color);
  5006. box-shadow: var(--box-shadow);
  5007. }
  5008. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes.view, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes.selected, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes.active {
  5009. background: var(--button-hover-background);
  5010. outline: 1px solid var(--button-focus-outline-color);
  5011. border-color: var(--button-hover-border-color);
  5012. color: var(--button-hover-text-color);
  5013. text-decoration: none !important;
  5014. font-weight: unset !important;
  5015. }
  5016. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes.empty, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes.disabled, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes:disabled {
  5017. --button-background: var(--button-disabled-background);
  5018. --button-hover-background: var(--button-disabled-background);
  5019. --button-border-color: var(--button-disabled-border-color);
  5020. --button-text-color: var(--text-color-5);
  5021. }
  5022. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes:disabled {
  5023. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  5024. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  5025. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  5026. }
  5027. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.add-gm-notes > i {
  5028. margin-top: 3px;
  5029. }
  5030. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit {
  5031. background: var(--app-background);
  5032. border: var(--app-border-width) solid var(--app-border-color);
  5033. text-shadow: var(--app-text-shadow);
  5034. border-radius: var(--border-radius);
  5035. box-shadow: var(--box-shadow);
  5036. color: var(--text-color-3);
  5037. background: var(--button-background);
  5038. border: var(--app-border-width) solid var(--button-border-color);
  5039. color: var(--button-text-color);
  5040. box-shadow: var(--box-shadow);
  5041. text-decoration: none;
  5042. cursor: pointer;
  5043. text-shadow: var(--app-text-shadow);
  5044. transition: background 0.1s ease-in-out;
  5045. --button-background: var(--accent-color);
  5046. --button-border-color: var(--accent-color-dark);
  5047. --button-text-color: var(--accent-text-color);
  5048. --app-text-shadow: none;
  5049. --button-hover-background: var(--accent-color-light);
  5050. --button-hover-border-color: var(--accent-color);
  5051. --button-hover-text-color: var(--accent-text-color);
  5052. border-radius: 3px;
  5053. align-content: center;
  5054. justify-content: center;
  5055. height: 28px;
  5056. width: 28px;
  5057. }
  5058. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit:not(.disabled, :disabled):hover {
  5059. background: var(--button-hover-background);
  5060. color: var(--button-hover-text-color);
  5061. border: var(--app-border-width) solid var(--button-hover-border-color);
  5062. box-shadow: var(--box-shadow);
  5063. }
  5064. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit.view, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit.selected, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit.active {
  5065. background: var(--button-hover-background);
  5066. outline: 1px solid var(--button-focus-outline-color);
  5067. border-color: var(--button-hover-border-color);
  5068. color: var(--button-hover-text-color);
  5069. text-decoration: none !important;
  5070. font-weight: unset !important;
  5071. }
  5072. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit.empty, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit.disabled, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit:disabled {
  5073. --button-background: var(--button-disabled-background);
  5074. --button-hover-background: var(--button-disabled-background);
  5075. --button-border-color: var(--button-disabled-border-color);
  5076. --button-text-color: var(--text-color-5);
  5077. }
  5078. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .editor a.editor-edit:disabled {
  5079. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  5080. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  5081. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  5082. }
  5083. [data-theme].pf2e.item.sheet form .sheet-content input[type=text], [data-theme].pf2e.item.sheet form .sheet-content input[type=number], [data-theme].pf2e.item.sheet form .sheet-content select, [data-theme].pf2e.item.sheet form section.sheet-body input[type=text], [data-theme].pf2e.item.sheet form section.sheet-body input[type=number] {
  5084. background: var(--input-background);
  5085. border: var(--app-border-width) solid;
  5086. border-color: var(--input-border-color) !important;
  5087. color: var(--input-text-color);
  5088. box-shadow: var(--input-box-shadow) !important;
  5089. align-items: center;
  5090. border-radius: 4px;
  5091. outline: 1px solid transparent;
  5092. user-select: text;
  5093. transition: outline-color 0.5s;
  5094. }
  5095. [data-theme].pf2e.item.sheet form .sheet-content input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form .sheet-content input[type=text]:focus, [data-theme].pf2e.item.sheet form .sheet-content input[type=number]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form .sheet-content input[type=number]:focus, [data-theme].pf2e.item.sheet form .sheet-content select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form .sheet-content select:focus, [data-theme].pf2e.item.sheet form section.sheet-body input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form section.sheet-body input[type=text]:focus, [data-theme].pf2e.item.sheet form section.sheet-body input[type=number]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form section.sheet-body input[type=number]:focus {
  5096. outline: 1px solid var(--input-focus-outline-color);
  5097. border: var(--app-border-width) solid;
  5098. border-color: var(--input-border-color);
  5099. color: var(--input-focus-text-color);
  5100. box-shadow: var(--box-shadow);
  5101. }
  5102. [data-theme].pf2e.item.sheet form .sheet-content input[type=text].disabled, [data-theme].pf2e.item.sheet form .sheet-content input[type=text]:disabled, [data-theme].pf2e.item.sheet form .sheet-content input[type=number].disabled, [data-theme].pf2e.item.sheet form .sheet-content input[type=number]:disabled, [data-theme].pf2e.item.sheet form .sheet-content select.disabled, [data-theme].pf2e.item.sheet form .sheet-content select:disabled, [data-theme].pf2e.item.sheet form section.sheet-body input[type=text].disabled, [data-theme].pf2e.item.sheet form section.sheet-body input[type=text]:disabled, [data-theme].pf2e.item.sheet form section.sheet-body input[type=number].disabled, [data-theme].pf2e.item.sheet form section.sheet-body input[type=number]:disabled {
  5103. --input-text-color: var(--text-color-disabled);
  5104. --input-background: var(--input-disabled-background);
  5105. --input-border-color: var(--input-disabled-border-color);
  5106. }
  5107. [data-theme].pf2e.item.sheet form .sheet-content input[type=text].disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content input[type=text]:disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content input[type=number].disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content input[type=number]:disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content select.disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content select:disabled::placeholder, [data-theme].pf2e.item.sheet form section.sheet-body input[type=text].disabled::placeholder, [data-theme].pf2e.item.sheet form section.sheet-body input[type=text]:disabled::placeholder, [data-theme].pf2e.item.sheet form section.sheet-body input[type=number].disabled::placeholder, [data-theme].pf2e.item.sheet form section.sheet-body input[type=number]:disabled::placeholder {
  5108. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  5109. }
  5110. [data-theme].pf2e.item.sheet form .sheet-content input[type=text]::placeholder, [data-theme].pf2e.item.sheet form .sheet-content input[type=number]::placeholder, [data-theme].pf2e.item.sheet form .sheet-content select::placeholder, [data-theme].pf2e.item.sheet form section.sheet-body input[type=text]::placeholder, [data-theme].pf2e.item.sheet form section.sheet-body input[type=number]::placeholder {
  5111. color: var(--input-placeholder-color);
  5112. }
  5113. [data-theme].pf2e.item.sheet form .sheet-content input[type=text][type=checkbox], [data-theme].pf2e.item.sheet form .sheet-content input[type=number][type=checkbox], [data-theme].pf2e.item.sheet form .sheet-content select[type=checkbox], [data-theme].pf2e.item.sheet form section.sheet-body input[type=text][type=checkbox], [data-theme].pf2e.item.sheet form section.sheet-body input[type=number][type=checkbox] {
  5114. outline: unset !important;
  5115. border: unset !important;
  5116. box-shadow: unset !important;
  5117. }
  5118. [data-theme].pf2e.item.sheet .sheet-header input[type=text], [data-theme].pf2e.item.sheet .sheet-header input[type=number] {
  5119. background: var(--input-background);
  5120. border: var(--app-border-width) solid;
  5121. border-color: var(--input-border-color) !important;
  5122. color: var(--input-text-color);
  5123. box-shadow: var(--input-box-shadow) !important;
  5124. align-items: center;
  5125. border-radius: 4px;
  5126. outline: 1px solid transparent;
  5127. user-select: text;
  5128. transition: outline-color 0.5s;
  5129. }
  5130. [data-theme].pf2e.item.sheet .sheet-header input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet .sheet-header input[type=text]:focus, [data-theme].pf2e.item.sheet .sheet-header input[type=number]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet .sheet-header input[type=number]:focus {
  5131. outline: 1px solid var(--input-focus-outline-color);
  5132. border: var(--app-border-width) solid;
  5133. border-color: var(--input-border-color);
  5134. color: var(--input-focus-text-color);
  5135. box-shadow: var(--box-shadow);
  5136. }
  5137. [data-theme].pf2e.item.sheet .sheet-header input[type=text].disabled, [data-theme].pf2e.item.sheet .sheet-header input[type=text]:disabled, [data-theme].pf2e.item.sheet .sheet-header input[type=number].disabled, [data-theme].pf2e.item.sheet .sheet-header input[type=number]:disabled {
  5138. --input-text-color: var(--text-color-disabled);
  5139. --input-background: var(--input-disabled-background);
  5140. --input-border-color: var(--input-disabled-border-color);
  5141. }
  5142. [data-theme].pf2e.item.sheet .sheet-header input[type=text].disabled::placeholder, [data-theme].pf2e.item.sheet .sheet-header input[type=text]:disabled::placeholder, [data-theme].pf2e.item.sheet .sheet-header input[type=number].disabled::placeholder, [data-theme].pf2e.item.sheet .sheet-header input[type=number]:disabled::placeholder {
  5143. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  5144. }
  5145. [data-theme].pf2e.item.sheet .sheet-header input[type=text]::placeholder, [data-theme].pf2e.item.sheet .sheet-header input[type=number]::placeholder {
  5146. color: var(--input-placeholder-color);
  5147. }
  5148. [data-theme].pf2e.item.sheet .sheet-header input[type=text][type=checkbox], [data-theme].pf2e.item.sheet .sheet-header input[type=number][type=checkbox] {
  5149. outline: unset !important;
  5150. border: unset !important;
  5151. box-shadow: unset !important;
  5152. }
  5153. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details select, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license select, [data-theme].pf2e.item.sheet form .sheet-content section.sidebar select {
  5154. background: var(--input-background);
  5155. border: var(--app-border-width) solid;
  5156. border-color: var(--input-border-color) !important;
  5157. color: var(--input-text-color);
  5158. box-shadow: var(--input-box-shadow) !important;
  5159. align-items: center;
  5160. border-radius: 4px;
  5161. outline: 1px solid transparent;
  5162. user-select: text;
  5163. transition: outline-color 0.5s;
  5164. }
  5165. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details select:focus, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license select:focus, [data-theme].pf2e.item.sheet form .sheet-content section.sidebar select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form .sheet-content section.sidebar select:focus {
  5166. outline: 1px solid var(--input-focus-outline-color);
  5167. border: var(--app-border-width) solid;
  5168. border-color: var(--input-border-color);
  5169. color: var(--input-focus-text-color);
  5170. box-shadow: var(--box-shadow);
  5171. }
  5172. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details select.disabled, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details select:disabled, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license select.disabled, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license select:disabled, [data-theme].pf2e.item.sheet form .sheet-content section.sidebar select.disabled, [data-theme].pf2e.item.sheet form .sheet-content section.sidebar select:disabled {
  5173. --input-text-color: var(--text-color-disabled);
  5174. --input-background: var(--input-disabled-background);
  5175. --input-border-color: var(--input-disabled-border-color);
  5176. }
  5177. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details select.disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details select:disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license select.disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license select:disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content section.sidebar select.disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content section.sidebar select:disabled::placeholder {
  5178. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  5179. }
  5180. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details select::placeholder, [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license select::placeholder, [data-theme].pf2e.item.sheet form .sheet-content section.sidebar select::placeholder {
  5181. color: var(--input-placeholder-color);
  5182. }
  5183. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details select[type=checkbox], [data-theme].pf2e.item.sheet form .sheet-body .tab.active.details fieldset.publication .data .license select[type=checkbox], [data-theme].pf2e.item.sheet form .sheet-content section.sidebar select[type=checkbox] {
  5184. outline: unset !important;
  5185. border: unset !important;
  5186. box-shadow: unset !important;
  5187. }
  5188. [data-theme].pf2e.item.sheet form .sheet-content button:hover:not(:disabled), [data-theme].pf2e.item.sheet form .sheet-content button:focus {
  5189. border: 1px solid var(--button-border-color);
  5190. box-shadow: unset;
  5191. }
  5192. [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):hover:not(:disabled), [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):focus, [data-theme].pf2e.item.sheet form .sheet-content select:hover:not(:disabled), [data-theme].pf2e.item.sheet form .sheet-content select:focus {
  5193. background: var(--input-background);
  5194. border: var(--app-border-width) solid;
  5195. border-color: var(--input-border-color) !important;
  5196. color: var(--input-text-color);
  5197. box-shadow: var(--input-box-shadow) !important;
  5198. align-items: center;
  5199. border-radius: 4px;
  5200. outline: 1px solid transparent;
  5201. user-select: text;
  5202. transition: outline-color 0.5s;
  5203. }
  5204. [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):hover:not(:disabled):not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):hover:not(:disabled):focus, [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):focus:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):focus:focus, [data-theme].pf2e.item.sheet form .sheet-content select:hover:not(:disabled):not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form .sheet-content select:hover:not(:disabled):focus, [data-theme].pf2e.item.sheet form .sheet-content select:focus:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.item.sheet form .sheet-content select:focus:focus {
  5205. outline: 1px solid var(--input-focus-outline-color);
  5206. border: var(--app-border-width) solid;
  5207. border-color: var(--input-border-color);
  5208. color: var(--input-focus-text-color);
  5209. box-shadow: var(--box-shadow);
  5210. }
  5211. [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):hover:not(:disabled).disabled, [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):hover:not(:disabled):disabled, [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):focus.disabled, [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):focus:disabled, [data-theme].pf2e.item.sheet form .sheet-content select:hover:not(:disabled).disabled, [data-theme].pf2e.item.sheet form .sheet-content select:hover:not(:disabled):disabled, [data-theme].pf2e.item.sheet form .sheet-content select:focus.disabled, [data-theme].pf2e.item.sheet form .sheet-content select:focus:disabled {
  5212. --input-text-color: var(--text-color-disabled);
  5213. --input-background: var(--input-disabled-background);
  5214. --input-border-color: var(--input-disabled-border-color);
  5215. }
  5216. [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):hover:not(:disabled).disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):hover:not(:disabled):disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):focus.disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):focus:disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content select:hover:not(:disabled).disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content select:hover:not(:disabled):disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content select:focus.disabled::placeholder, [data-theme].pf2e.item.sheet form .sheet-content select:focus:disabled::placeholder {
  5217. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  5218. }
  5219. [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):hover:not(:disabled)::placeholder, [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):focus::placeholder, [data-theme].pf2e.item.sheet form .sheet-content select:hover:not(:disabled)::placeholder, [data-theme].pf2e.item.sheet form .sheet-content select:focus::placeholder {
  5220. color: var(--input-placeholder-color);
  5221. }
  5222. [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):hover:not(:disabled)[type=checkbox], [data-theme].pf2e.item.sheet form .sheet-content input:not([type=range], [type=checkbox]):focus[type=checkbox], [data-theme].pf2e.item.sheet form .sheet-content select:hover:not(:disabled)[type=checkbox], [data-theme].pf2e.item.sheet form .sheet-content select:focus[type=checkbox] {
  5223. outline: unset !important;
  5224. border: unset !important;
  5225. box-shadow: unset !important;
  5226. }
  5227. [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container .rules-drop-zone {
  5228. background: var(--app-background);
  5229. border: var(--app-border-width) solid var(--app-border-color);
  5230. text-shadow: var(--app-text-shadow);
  5231. border-radius: var(--border-radius);
  5232. box-shadow: var(--box-shadow);
  5233. color: var(--text-color-3);
  5234. --text-dark: var(--text-color-3);
  5235. }
  5236. [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form .rules-drop-container .rules-drop-zone i {
  5237. background: var(--app-background);
  5238. border: var(--app-border-width) solid var(--app-border-color);
  5239. text-shadow: var(--app-text-shadow);
  5240. border-radius: var(--border-radius);
  5241. box-shadow: var(--box-shadow);
  5242. color: var(--text-color-3);
  5243. }
  5244. [data-theme].pf2e.item.sheet.action form .drop-zone {
  5245. background: var(--app-background);
  5246. border: var(--app-border-width) solid var(--app-border-color);
  5247. text-shadow: var(--app-text-shadow);
  5248. border-radius: var(--border-radius);
  5249. box-shadow: var(--box-shadow);
  5250. color: var(--text-color-3);
  5251. }
  5252. [data-theme].pf2e.item.sheet.action form .drop-zone a.content-link, [data-theme].pf2e.item.sheet.action form .drop-zone picture, [data-theme].pf2e.item.sheet.action form .drop-zone img {
  5253. background: var(--app-background);
  5254. border: var(--app-border-width) solid var(--app-border-color);
  5255. text-shadow: var(--app-text-shadow);
  5256. border-radius: var(--border-radius);
  5257. box-shadow: var(--box-shadow);
  5258. color: var(--text-color-3);
  5259. }
  5260. [data-theme].pf2e.item.sheet .sheet-header {
  5261. border: unset;
  5262. }
  5263. [data-theme].pf2e.item.sheet form > nav {
  5264. border: unset;
  5265. }
  5266. [data-theme].pf2e.item.sheet form > nav .sheet-tabs {
  5267. gap: 5px;
  5268. margin: 2px;
  5269. }
  5270. [data-theme].pf2e.item.sheet form > nav .sheet-tabs > a {
  5271. background: var(--app-background);
  5272. border: var(--app-border-width) solid var(--app-border-color);
  5273. text-shadow: var(--app-text-shadow);
  5274. border-radius: var(--border-radius);
  5275. box-shadow: var(--box-shadow);
  5276. color: var(--text-color-3);
  5277. background: var(--button-background);
  5278. border: var(--app-border-width) solid var(--button-border-color);
  5279. color: var(--button-text-color);
  5280. box-shadow: var(--box-shadow);
  5281. text-decoration: none;
  5282. cursor: pointer;
  5283. text-shadow: var(--app-text-shadow);
  5284. }
  5285. [data-theme].pf2e.item.sheet form > nav .sheet-tabs > a:not(.disabled, :disabled):hover {
  5286. background: var(--button-hover-background);
  5287. color: var(--button-hover-text-color);
  5288. border: var(--app-border-width) solid var(--button-hover-border-color);
  5289. box-shadow: var(--box-shadow);
  5290. }
  5291. [data-theme].pf2e.item.sheet form > nav .sheet-tabs > a.view, [data-theme].pf2e.item.sheet form > nav .sheet-tabs > a.selected, [data-theme].pf2e.item.sheet form > nav .sheet-tabs > a.active {
  5292. background: var(--button-hover-background);
  5293. outline: 1px solid var(--button-focus-outline-color);
  5294. border-color: var(--button-hover-border-color);
  5295. color: var(--button-hover-text-color);
  5296. text-decoration: none !important;
  5297. font-weight: unset !important;
  5298. }
  5299. [data-theme].pf2e.item.sheet form > nav .sheet-tabs > a.empty, [data-theme].pf2e.item.sheet form > nav .sheet-tabs > a.disabled, [data-theme].pf2e.item.sheet form > nav .sheet-tabs > a:disabled {
  5300. --button-background: var(--button-disabled-background);
  5301. --button-hover-background: var(--button-disabled-background);
  5302. --button-border-color: var(--button-disabled-border-color);
  5303. --button-text-color: var(--text-color-5);
  5304. }
  5305. [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs {
  5306. border: unset;
  5307. }
  5308. [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs h4 > a {
  5309. background: var(--app-background);
  5310. border: var(--app-border-width) solid var(--app-border-color);
  5311. text-shadow: var(--app-text-shadow);
  5312. border-radius: var(--border-radius);
  5313. box-shadow: var(--box-shadow);
  5314. color: var(--text-color-3);
  5315. background: var(--button-background);
  5316. border: var(--app-border-width) solid var(--button-border-color);
  5317. color: var(--button-text-color);
  5318. box-shadow: var(--box-shadow);
  5319. text-decoration: none;
  5320. cursor: pointer;
  5321. text-shadow: var(--app-text-shadow);
  5322. padding: 5px 10px;
  5323. }
  5324. [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs h4 > a:not(.disabled, :disabled):hover {
  5325. background: var(--button-hover-background);
  5326. color: var(--button-hover-text-color);
  5327. border: var(--app-border-width) solid var(--button-hover-border-color);
  5328. box-shadow: var(--box-shadow);
  5329. }
  5330. [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs h4 > a.view, [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs h4 > a.selected, [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs h4 > a.active {
  5331. background: var(--button-hover-background);
  5332. outline: 1px solid var(--button-focus-outline-color);
  5333. border-color: var(--button-hover-border-color);
  5334. color: var(--button-hover-text-color);
  5335. text-decoration: none !important;
  5336. font-weight: unset !important;
  5337. }
  5338. [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs h4 > a.empty, [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs h4 > a.disabled, [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form nav.rule-tabs h4 > a:disabled {
  5339. --button-background: var(--button-disabled-background);
  5340. --button-hover-background: var(--button-disabled-background);
  5341. --button-border-color: var(--button-disabled-border-color);
  5342. --button-text-color: var(--text-color-5);
  5343. }
  5344. [data-theme].pf2e.item.sheet form .effects-container, [data-theme].pf2e.item.sheet form .details-container, [data-theme].pf2e.item.sheet form .dice-data {
  5345. gap: 5px;
  5346. align-items: center;
  5347. }
  5348. [data-theme].pf2e.item.sheet form section.sheet-body .item-mystification.active .mystification-status label {
  5349. color: var(--color-text-dark-4);
  5350. }
  5351. [data-theme].pf2e.item.sheet form .sheet-body .tab.active.description .gm-notes, [data-theme].pf2e.item.sheet form section.sheet-body .item-description .descriptions .gm-notes {
  5352. background: var(--app-background);
  5353. border: var(--app-border-width) solid var(--app-border-color);
  5354. text-shadow: var(--app-text-shadow);
  5355. border-radius: var(--border-radius);
  5356. box-shadow: var(--box-shadow);
  5357. color: var(--text-color-3);
  5358. background-color: var(--visibility-gm-bg);
  5359. border-style: dashed;
  5360. border-color: var(--color-primary-4);
  5361. text-shadow: none;
  5362. color: black;
  5363. }
  5364. [data-theme].pf2e.item.sheet form section.sheet-body .item-description .descriptions .editor a.add-gm-notes, [data-theme].pf2e.item.sheet form section.sheet-body .item-description .descriptions .editor a.editor-edit {
  5365. background: var(--color-secondary-4);
  5366. border: 1px solid var(--color-secondary-3);
  5367. color: var(--text-color-2);
  5368. }
  5369. [data-theme].pf2e.item.sheet form .sheet-body .tab.mystification.active .unidentified img {
  5370. background: var(--app-background);
  5371. border: var(--app-border-width) solid var(--app-border-color);
  5372. text-shadow: var(--app-text-shadow);
  5373. border-radius: var(--border-radius);
  5374. box-shadow: var(--box-shadow);
  5375. color: var(--text-color-3);
  5376. border: 1px solid;
  5377. border-color: var(--icon-border-color);
  5378. }
  5379. [data-theme].pf2e.item.sheet .sheet-header img {
  5380. background: var(--app-background);
  5381. border: var(--app-border-width) solid var(--app-border-color);
  5382. text-shadow: var(--app-text-shadow);
  5383. border-radius: var(--border-radius);
  5384. box-shadow: var(--box-shadow);
  5385. color: var(--text-color-3);
  5386. --app-border-width: 1px;
  5387. border-color: var(--icon-border-color);
  5388. border-radius: var(--border-radius);
  5389. margin-left: 2px;
  5390. margin-top: 2px;
  5391. }
  5392. [data-theme].pf2e.item.sheet form .tab.active.rules .rule-form .attached-input .attachment, [data-theme].pf2e.item.sheet form .item-rules .rule-form .attached-input .attachment {
  5393. --button-border-color: var(--color-primary-2);
  5394. --button-background: var(--color-primary-3);
  5395. --button-hover-border-color: var(--color-primary-4);
  5396. --button-hover-background: var(--color-primary-5);
  5397. --button-text-color: var(--text-color-2);
  5398. --box-shadow: none;
  5399. border-color: var(--button-border-color);
  5400. z-index: 1;
  5401. }
  5402. [data-theme].pf2e.item.sheet form .item-rules .rule-form .attached-input input, [data-theme].pf2e.item.sheet form .item-rules .rule-form .attached-input tags {
  5403. border-left: unset;
  5404. }
  5405. [data-theme].pf2e.item.sheet form .item-rules .rule-form .attached-input input:hover, [data-theme].pf2e.item.sheet form .item-rules .rule-form .attached-input tags:hover {
  5406. border-left: unset;
  5407. }
  5408. [data-theme] .tox .tox-sidebar-wrap {
  5409. background-color: white;
  5410. }
  5411. [data-theme] .tox.tox-tinymce .tox-tbtn {
  5412. --button-background: white;
  5413. --button-hover-background: gray;
  5414. --app-text-shadow: none;
  5415. --box-shadow: none;
  5416. color: black;
  5417. }
  5418. /* ----------------------------------------- */
  5419. /* Controls */
  5420. /* ----------------------------------------- */
  5421. nav#controls[data-theme] {
  5422. padding-top: 12px;
  5423. padding-bottom: 12px;
  5424. display: flex;
  5425. align-items: var(--controls-alignment);
  5426. }
  5427. nav#controls[data-theme] ol.control-tools.sub-controls > li,
  5428. nav#controls[data-theme] ol.control-tools.main-controls {
  5429. margin-right: var(--controls-margin);
  5430. }
  5431. nav#controls[data-theme] ol.control-tools.main-control {
  5432. margin-right: var(--controls-margin);
  5433. }
  5434. nav#controls[data-theme] ol.control-tools li.control-tool,
  5435. nav#controls[data-theme] ol.control-tools > li {
  5436. background: var(--app-background);
  5437. border: var(--app-border-width) solid var(--app-border-color);
  5438. text-shadow: var(--app-text-shadow);
  5439. border-radius: var(--border-radius);
  5440. box-shadow: var(--box-shadow);
  5441. color: var(--text-color-3);
  5442. background: var(--button-background);
  5443. border: var(--app-border-width) solid var(--button-border-color);
  5444. color: var(--button-text-color);
  5445. box-shadow: var(--box-shadow);
  5446. text-decoration: none;
  5447. cursor: pointer;
  5448. text-shadow: var(--app-text-shadow);
  5449. margin-bottom: var(--controls-margin);
  5450. height: var(--control-size);
  5451. width: var(--control-size);
  5452. font-size: calc(var(--control-size) - 12px);
  5453. }
  5454. nav#controls[data-theme] ol.control-tools li.control-tool:not(.disabled, :disabled):hover,
  5455. nav#controls[data-theme] ol.control-tools > li:not(.disabled, :disabled):hover {
  5456. background: var(--button-hover-background);
  5457. color: var(--button-hover-text-color);
  5458. border: var(--app-border-width) solid var(--button-hover-border-color);
  5459. box-shadow: var(--box-shadow);
  5460. }
  5461. nav#controls[data-theme] ol.control-tools li.control-tool.view, nav#controls[data-theme] ol.control-tools li.control-tool.selected, nav#controls[data-theme] ol.control-tools li.control-tool.active,
  5462. nav#controls[data-theme] ol.control-tools > li.view,
  5463. nav#controls[data-theme] ol.control-tools > li.selected,
  5464. nav#controls[data-theme] ol.control-tools > li.active {
  5465. background: var(--button-hover-background);
  5466. outline: 1px solid var(--button-focus-outline-color);
  5467. border-color: var(--button-hover-border-color);
  5468. color: var(--button-hover-text-color);
  5469. text-decoration: none !important;
  5470. font-weight: unset !important;
  5471. }
  5472. nav#controls[data-theme] ol.control-tools li.control-tool.empty, nav#controls[data-theme] ol.control-tools li.control-tool.disabled, nav#controls[data-theme] ol.control-tools li.control-tool:disabled,
  5473. nav#controls[data-theme] ol.control-tools > li.empty,
  5474. nav#controls[data-theme] ol.control-tools > li.disabled,
  5475. nav#controls[data-theme] ol.control-tools > li:disabled {
  5476. --button-background: var(--button-disabled-background);
  5477. --button-hover-background: var(--button-disabled-background);
  5478. --button-border-color: var(--button-disabled-border-color);
  5479. --button-text-color: var(--text-color-5);
  5480. }
  5481. nav#controls[data-theme] ol.control-tools li.control-tool > img,
  5482. nav#controls[data-theme] ol.control-tools > li > img {
  5483. filter: sepia() brightness(0.7) sepia(1) grayscale(0.7) drop-shadow(0px 1px 1px black);
  5484. }
  5485. nav#controls[data-theme] ol.control-tools li.control-tool:hover > img,
  5486. nav#controls[data-theme] ol.control-tools > li:hover > img {
  5487. filter: sepia() grayscale(0.95) brightness(1) drop-shadow(0px 1px 1px black);
  5488. }
  5489. nav#controls[data-theme] ol.control-tools li.control-tool.toggle,
  5490. nav#controls[data-theme] ol.control-tools > li.toggle {
  5491. background: var(--app-background);
  5492. border: var(--app-border-width) solid var(--app-border-color);
  5493. text-shadow: var(--app-text-shadow);
  5494. border-radius: var(--border-radius);
  5495. box-shadow: var(--box-shadow);
  5496. color: var(--text-color-3);
  5497. background: var(--button-background);
  5498. border: var(--app-border-width) solid var(--button-border-color);
  5499. color: var(--button-text-color);
  5500. box-shadow: var(--box-shadow);
  5501. text-decoration: none;
  5502. cursor: pointer;
  5503. text-shadow: var(--app-text-shadow);
  5504. transition: background 0.1s ease-in-out;
  5505. --button-background: var(--button-toggle-background);
  5506. --button-border-color: var(--button-toggle-border-color);
  5507. --button-focus-outline-color: var(--button-toggle-focus-outline-color);
  5508. --button-hover-background: var(--button-toggle-hover-background);
  5509. --button-hover-border-color: var(--button-toggle-hover-border-color);
  5510. }
  5511. nav#controls[data-theme] ol.control-tools li.control-tool.toggle:not(.disabled, :disabled):hover,
  5512. nav#controls[data-theme] ol.control-tools > li.toggle:not(.disabled, :disabled):hover {
  5513. background: var(--button-hover-background);
  5514. color: var(--button-hover-text-color);
  5515. border: var(--app-border-width) solid var(--button-hover-border-color);
  5516. box-shadow: var(--box-shadow);
  5517. }
  5518. nav#controls[data-theme] ol.control-tools li.control-tool.toggle.view, nav#controls[data-theme] ol.control-tools li.control-tool.toggle.selected, nav#controls[data-theme] ol.control-tools li.control-tool.toggle.active,
  5519. nav#controls[data-theme] ol.control-tools > li.toggle.view,
  5520. nav#controls[data-theme] ol.control-tools > li.toggle.selected,
  5521. nav#controls[data-theme] ol.control-tools > li.toggle.active {
  5522. background: var(--button-hover-background);
  5523. outline: 1px solid var(--button-focus-outline-color);
  5524. border-color: var(--button-hover-border-color);
  5525. color: var(--button-hover-text-color);
  5526. text-decoration: none !important;
  5527. font-weight: unset !important;
  5528. }
  5529. nav#controls[data-theme] ol.control-tools li.control-tool.toggle.empty, nav#controls[data-theme] ol.control-tools li.control-tool.toggle.disabled, nav#controls[data-theme] ol.control-tools li.control-tool.toggle:disabled,
  5530. nav#controls[data-theme] ol.control-tools > li.toggle.empty,
  5531. nav#controls[data-theme] ol.control-tools > li.toggle.disabled,
  5532. nav#controls[data-theme] ol.control-tools > li.toggle:disabled {
  5533. --button-background: var(--button-disabled-background);
  5534. --button-hover-background: var(--button-disabled-background);
  5535. --button-border-color: var(--button-disabled-border-color);
  5536. --button-text-color: var(--text-color-5);
  5537. }
  5538. nav#controls[data-theme] ol.control-tools li.control-tool.toggle:disabled,
  5539. nav#controls[data-theme] ol.control-tools > li.toggle:disabled {
  5540. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  5541. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  5542. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  5543. }
  5544. [data-theme]#darkness-adjuster {
  5545. outline: none;
  5546. background: var(--app-background);
  5547. border: var(--app-border-width) solid var(--app-border-color);
  5548. text-shadow: var(--app-text-shadow);
  5549. border-radius: var(--border-radius);
  5550. box-shadow: var(--box-shadow);
  5551. color: var(--text-color-3);
  5552. }
  5553. [data-theme]#darkness-adjuster .window-content {
  5554. overflow: hidden;
  5555. background: unset;
  5556. box-shadow: unset;
  5557. border: none;
  5558. }
  5559. /* ----------------------------------------- */
  5560. /* Hotbar */
  5561. /* ----------------------------------------- */
  5562. #hotbar[data-theme] .bar-controls {
  5563. background: var(--app-background);
  5564. border: var(--app-border-width) solid var(--app-border-color);
  5565. text-shadow: var(--app-text-shadow);
  5566. border-radius: var(--border-radius);
  5567. box-shadow: var(--box-shadow);
  5568. color: var(--text-color-3);
  5569. }
  5570. #hotbar[data-theme] .macro {
  5571. height: calc(var(--macro-size) + 2px);
  5572. width: calc(var(--macro-size) + 2px);
  5573. background: var(--app-background);
  5574. border: var(--app-border-width) solid var(--app-border-color);
  5575. text-shadow: var(--app-text-shadow);
  5576. border-radius: var(--border-radius);
  5577. box-shadow: var(--box-shadow);
  5578. color: var(--text-color-3);
  5579. }
  5580. #hotbar[data-theme] .macro.inactive::before, #hotbar[data-theme] .macro.active::before {
  5581. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  5582. content: "";
  5583. position: absolute;
  5584. top: 0;
  5585. left: 0;
  5586. width: 100%;
  5587. height: 100%;
  5588. border-radius: var(--border-radius);
  5589. overflow: hidden;
  5590. pointer-events: none;
  5591. }
  5592. #hotbar[data-theme] .macro.active:hover::before {
  5593. transition: text-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out, border 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, backdrop-filter 0.15s ease-in-out, border-radius 0.15s, outline 0.15s;
  5594. content: "";
  5595. position: absolute;
  5596. top: 0;
  5597. left: 0;
  5598. width: 100%;
  5599. height: 100%;
  5600. background-color: color-mix(in srgb, var(--color-primary-1) 20%, transparent);
  5601. border-radius: var(--border-radius);
  5602. overflow: hidden;
  5603. pointer-events: none;
  5604. }
  5605. #hotbar[data-theme] .macro .macro-key {
  5606. background: none;
  5607. right: 6px;
  5608. padding: 0px;
  5609. font-weight: initial;
  5610. text-shadow: 0px 1px 5px black, 0px 1px 5px black;
  5611. font-size: calc(var(--macro-size) / 3);
  5612. }
  5613. #hotbar[data-theme] .macro .macro-icon {
  5614. border-radius: var(--border-radius);
  5615. height: calc(var(--macro-size) + 0px);
  5616. width: calc(var(--macro-size) + 0px);
  5617. }
  5618. #hotbar[data-theme] #macro-list {
  5619. gap: 5px;
  5620. margin: 0px 5px;
  5621. border: none;
  5622. grid-template-columns: repeat(10, calc(var(--macro-size) + 2px));
  5623. align-content: end;
  5624. }
  5625. /* ----------------------------------------- */
  5626. /* Navigation */
  5627. /* ----------------------------------------- */
  5628. #navigation[data-theme] {
  5629. width: calc(100% - 46px);
  5630. }
  5631. #navigation[data-theme] #nav-toggle {
  5632. background: var(--app-background);
  5633. border: var(--app-border-width) solid var(--app-border-color);
  5634. text-shadow: var(--app-text-shadow);
  5635. border-radius: var(--border-radius);
  5636. box-shadow: var(--box-shadow);
  5637. color: var(--text-color-3);
  5638. display: flex;
  5639. align-items: center;
  5640. justify-content: center;
  5641. flex: 0 0 var(--control-size);
  5642. height: var(--control-size);
  5643. }
  5644. #navigation[data-theme] ol#scene-list li.nav-item {
  5645. background: var(--app-background);
  5646. border: var(--app-border-width) solid var(--app-border-color);
  5647. text-shadow: var(--app-text-shadow);
  5648. border-radius: var(--border-radius);
  5649. box-shadow: var(--box-shadow);
  5650. color: var(--text-color-3);
  5651. background: var(--button-background);
  5652. border: var(--app-border-width) solid var(--button-border-color);
  5653. color: var(--button-text-color);
  5654. box-shadow: var(--box-shadow);
  5655. text-decoration: none;
  5656. cursor: pointer;
  5657. text-shadow: var(--app-text-shadow);
  5658. transition: background 0.1s ease-in-out;
  5659. --button-background: var(--button-toggle-background);
  5660. --button-border-color: var(--button-toggle-border-color);
  5661. --button-focus-outline-color: var(--button-toggle-focus-outline-color);
  5662. --button-hover-background: var(--button-toggle-hover-background);
  5663. --button-hover-border-color: var(--button-toggle-hover-border-color);
  5664. line-height: var(--control-size);
  5665. }
  5666. #navigation[data-theme] ol#scene-list li.nav-item:not(.disabled, :disabled):hover {
  5667. background: var(--button-hover-background);
  5668. color: var(--button-hover-text-color);
  5669. border: var(--app-border-width) solid var(--button-hover-border-color);
  5670. box-shadow: var(--box-shadow);
  5671. }
  5672. #navigation[data-theme] ol#scene-list li.nav-item.view, #navigation[data-theme] ol#scene-list li.nav-item.selected, #navigation[data-theme] ol#scene-list li.nav-item.active {
  5673. background: var(--button-hover-background);
  5674. outline: 1px solid var(--button-focus-outline-color);
  5675. border-color: var(--button-hover-border-color);
  5676. color: var(--button-hover-text-color);
  5677. text-decoration: none !important;
  5678. font-weight: unset !important;
  5679. }
  5680. #navigation[data-theme] ol#scene-list li.nav-item.empty, #navigation[data-theme] ol#scene-list li.nav-item.disabled, #navigation[data-theme] ol#scene-list li.nav-item:disabled {
  5681. --button-background: var(--button-disabled-background);
  5682. --button-hover-background: var(--button-disabled-background);
  5683. --button-border-color: var(--button-disabled-border-color);
  5684. --button-text-color: var(--text-color-5);
  5685. }
  5686. #navigation[data-theme] ol#scene-list li.nav-item:disabled {
  5687. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  5688. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  5689. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  5690. }
  5691. #navigation[data-theme] ol#scene-list li.nav-item > a:hover {
  5692. text-shadow: unset;
  5693. }
  5694. #navigation[data-theme] ol#scene-list li.nav-item .scene-players {
  5695. text-shadow: none;
  5696. }
  5697. /* ----------------------------------------- */
  5698. /* Notifications */
  5699. /* ----------------------------------------- */
  5700. [data-theme] .notification {
  5701. border: 1px solid transparent;
  5702. text-shadow: 0px 0px 3px black;
  5703. box-shadow: 0px 2px 2px black;
  5704. }
  5705. [data-theme] .notification.info {
  5706. background: var(--color-level-info-bg);
  5707. border-color: var(--color-level-info-border);
  5708. }
  5709. [data-theme] .notification.alert, [data-theme] .notification.warning {
  5710. background: var(--color-level-warning-bg);
  5711. border-color: var(--color-level-warning-border);
  5712. }
  5713. [data-theme] .notification.error {
  5714. background: var(--color-level-error-bg);
  5715. border-color: var(--color-level-error-border);
  5716. }
  5717. /* ----------------------------------------- */
  5718. /* Placeable HUD */
  5719. /* ----------------------------------------- */
  5720. [data-theme] #token-hud .attribute.bar1 input {
  5721. --input-border-color: var(--color-level-success-border);
  5722. --input-focus-outline-color: var(--color-level-success-border);
  5723. --input-background: var(--color-level-success-bg);
  5724. --input-focus-text-color: var(--text-color-2);
  5725. --input-text-color: var(--text-color-2);
  5726. }
  5727. [data-theme] #token-hud .attribute.bar2 input {
  5728. --input-border-color: var(--color-level-info-border);
  5729. --input-focus-outline-color: var(--color-level-info-border);
  5730. --input-background: var(--color-level-info-bg);
  5731. --input-text-color: var(--text-color-2);
  5732. }
  5733. [data-theme].placeable-hud input[type=text] {
  5734. background: var(--input-background);
  5735. border: var(--app-border-width) solid;
  5736. border-color: var(--input-border-color) !important;
  5737. color: var(--input-text-color);
  5738. box-shadow: var(--input-box-shadow) !important;
  5739. align-items: center;
  5740. border-radius: 4px;
  5741. outline: 1px solid transparent;
  5742. user-select: text;
  5743. transition: outline-color 0.5s;
  5744. text-shadow: 0px 1px 2px black;
  5745. --input-focus-text-color: var(--text-color-2);
  5746. }
  5747. [data-theme].placeable-hud input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].placeable-hud input[type=text]:focus {
  5748. outline: 1px solid var(--input-focus-outline-color);
  5749. border: var(--app-border-width) solid;
  5750. border-color: var(--input-border-color);
  5751. color: var(--input-focus-text-color);
  5752. box-shadow: var(--box-shadow);
  5753. }
  5754. [data-theme].placeable-hud input[type=text].disabled, [data-theme].placeable-hud input[type=text]:disabled {
  5755. --input-text-color: var(--text-color-disabled);
  5756. --input-background: var(--input-disabled-background);
  5757. --input-border-color: var(--input-disabled-border-color);
  5758. }
  5759. [data-theme].placeable-hud input[type=text].disabled::placeholder, [data-theme].placeable-hud input[type=text]:disabled::placeholder {
  5760. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  5761. }
  5762. [data-theme].placeable-hud input[type=text]::placeholder {
  5763. color: var(--input-placeholder-color);
  5764. }
  5765. [data-theme].placeable-hud input[type=text][type=checkbox] {
  5766. outline: unset !important;
  5767. border: unset !important;
  5768. box-shadow: unset !important;
  5769. }
  5770. [data-theme].placeable-hud input[type=text][name=elevation] {
  5771. --input-background: var(--app-background);
  5772. font-size: 18px;
  5773. width: 42px;
  5774. }
  5775. [data-theme] .placeable-hud .control-icon img {
  5776. opacity: 1;
  5777. }
  5778. [data-theme] #token-hud .attribute i.fas {
  5779. color: var(--color-secondary-1);
  5780. text-shadow: 0px 1px 2px black;
  5781. }
  5782. /* ----------------------------------------- */
  5783. /* Token HUD */
  5784. /* ----------------------------------------- */
  5785. #token-hud[data-theme] .status-effects.active {
  5786. gap: 5px;
  5787. background: unset;
  5788. border: unset;
  5789. box-shadow: unset;
  5790. }
  5791. #token-hud[data-theme] .status-effects.active picture img {
  5792. opacity: unset;
  5793. background: var(--app-background);
  5794. border: var(--app-border-width) solid var(--app-border-color);
  5795. text-shadow: var(--app-text-shadow);
  5796. border-radius: var(--border-radius);
  5797. box-shadow: var(--box-shadow);
  5798. color: var(--text-color-3);
  5799. }
  5800. #token-hud[data-theme] .status-effects.active picture:hover img {
  5801. border-color: var(--color-primary-2);
  5802. box-shadow: 0px 0px 6px var(--color-primary-3), 0px 2px 8px 1px var(--color-primary-4);
  5803. }
  5804. #token-hud[data-theme] .status-effects.active picture.active img {
  5805. border-color: var(--color-primary-1);
  5806. box-shadow: 0px 0px 6px var(--color-primary-2), 0px 2px 8px 1px var(--color-primary-3);
  5807. }
  5808. #token-hud[data-theme] .status-effects .title-bar {
  5809. background: var(--app-background);
  5810. border: var(--app-border-width) solid var(--app-border-color);
  5811. text-shadow: var(--app-text-shadow);
  5812. border-radius: var(--border-radius);
  5813. box-shadow: var(--box-shadow);
  5814. color: var(--text-color-3);
  5815. background: var(--app-background);
  5816. border: var(--app-border-width) solid var(--app-border-color);
  5817. box-shadow: var(--window-app-box-shadow);
  5818. border-radius: var(--border-radius);
  5819. backdrop-filter: blur(5px);
  5820. -webkit-backdrop-filter: blur(5px);
  5821. text-shadow: 0px 1px 2px black;
  5822. }
  5823. #token-hud[data-theme] .status-effects .effect-control .badge {
  5824. border-width: 1px;
  5825. border-radius: 0px var(--border-radius) 0px 3px;
  5826. background: var(--color-primary-3);
  5827. border-left-color: var(--color-primary-1);
  5828. border-bottom-color: var(--color-primary-1);
  5829. color: var(--text-color-2);
  5830. font-size: 10px;
  5831. text-shadow: 0px 1px 2px black;
  5832. top: 0px;
  5833. right: 1px;
  5834. font-weight: 600;
  5835. }
  5836. #token-hud[data-theme] .status-effects .effect-control .badge.fa-lock:before {
  5837. position: relative;
  5838. font-size: 6px;
  5839. }
  5840. #token-hud[data-theme] .status-effects .effect-control {
  5841. opacity: unset;
  5842. }
  5843. [data-theme] .control-icon {
  5844. background: var(--app-background);
  5845. border: var(--app-border-width) solid var(--app-border-color);
  5846. text-shadow: var(--app-text-shadow);
  5847. border-radius: var(--border-radius);
  5848. box-shadow: var(--box-shadow);
  5849. color: var(--text-color-3);
  5850. background: var(--button-background);
  5851. border: var(--app-border-width) solid var(--button-border-color);
  5852. color: var(--button-text-color);
  5853. box-shadow: var(--box-shadow);
  5854. text-decoration: none;
  5855. cursor: pointer;
  5856. text-shadow: var(--app-text-shadow);
  5857. }
  5858. [data-theme] .control-icon:not(.disabled, :disabled):hover {
  5859. background: var(--button-hover-background);
  5860. color: var(--button-hover-text-color);
  5861. border: var(--app-border-width) solid var(--button-hover-border-color);
  5862. box-shadow: var(--box-shadow);
  5863. }
  5864. [data-theme] .control-icon.view, [data-theme] .control-icon.selected, [data-theme] .control-icon.active {
  5865. background: var(--button-hover-background);
  5866. outline: 1px solid var(--button-focus-outline-color);
  5867. border-color: var(--button-hover-border-color);
  5868. color: var(--button-hover-text-color);
  5869. text-decoration: none !important;
  5870. font-weight: unset !important;
  5871. }
  5872. [data-theme] .control-icon.empty, [data-theme] .control-icon.disabled, [data-theme] .control-icon:disabled {
  5873. --button-background: var(--button-disabled-background);
  5874. --button-hover-background: var(--button-disabled-background);
  5875. --button-border-color: var(--button-disabled-border-color);
  5876. --button-text-color: var(--text-color-5);
  5877. }
  5878. [data-theme] .control-icon > img {
  5879. filter: sepia() brightness(0.7) sepia(1) grayscale(0.7) drop-shadow(0px 1px 1px black);
  5880. }
  5881. [data-theme] .control-icon:hover > img {
  5882. filter: sepia() grayscale(0.95) brightness(1) drop-shadow(0px 1px 1px black);
  5883. }
  5884. [data-theme] .control-icon[data-action=visibility], [data-theme] .control-icon[data-action=effects], [data-theme] .control-icon[data-action=combat], [data-theme] .control-icon[data-action=locked], [data-theme] .control-icon[data-action=target], [data-theme] .control-icon[data-action=active], [data-theme] .control-icon[data-action=mystify] {
  5885. background: var(--app-background);
  5886. border: var(--app-border-width) solid var(--app-border-color);
  5887. text-shadow: var(--app-text-shadow);
  5888. border-radius: var(--border-radius);
  5889. box-shadow: var(--box-shadow);
  5890. color: var(--text-color-3);
  5891. background: var(--button-background);
  5892. border: var(--app-border-width) solid var(--button-border-color);
  5893. color: var(--button-text-color);
  5894. box-shadow: var(--box-shadow);
  5895. text-decoration: none;
  5896. cursor: pointer;
  5897. text-shadow: var(--app-text-shadow);
  5898. transition: background 0.1s ease-in-out;
  5899. --button-background: var(--button-toggle-background);
  5900. --button-border-color: var(--button-toggle-border-color);
  5901. --button-focus-outline-color: var(--button-toggle-focus-outline-color);
  5902. --button-hover-background: var(--button-toggle-hover-background);
  5903. --button-hover-border-color: var(--button-toggle-hover-border-color);
  5904. }
  5905. [data-theme] .control-icon[data-action=visibility]:not(.disabled, :disabled):hover, [data-theme] .control-icon[data-action=effects]:not(.disabled, :disabled):hover, [data-theme] .control-icon[data-action=combat]:not(.disabled, :disabled):hover, [data-theme] .control-icon[data-action=locked]:not(.disabled, :disabled):hover, [data-theme] .control-icon[data-action=target]:not(.disabled, :disabled):hover, [data-theme] .control-icon[data-action=active]:not(.disabled, :disabled):hover, [data-theme] .control-icon[data-action=mystify]:not(.disabled, :disabled):hover {
  5906. background: var(--button-hover-background);
  5907. color: var(--button-hover-text-color);
  5908. border: var(--app-border-width) solid var(--button-hover-border-color);
  5909. box-shadow: var(--box-shadow);
  5910. }
  5911. [data-theme] .control-icon[data-action=visibility].view, [data-theme] .control-icon[data-action=visibility].selected, [data-theme] .control-icon[data-action=visibility].active, [data-theme] .control-icon[data-action=effects].view, [data-theme] .control-icon[data-action=effects].selected, [data-theme] .control-icon[data-action=effects].active, [data-theme] .control-icon[data-action=combat].view, [data-theme] .control-icon[data-action=combat].selected, [data-theme] .control-icon[data-action=combat].active, [data-theme] .control-icon[data-action=locked].view, [data-theme] .control-icon[data-action=locked].selected, [data-theme] .control-icon[data-action=locked].active, [data-theme] .control-icon[data-action=target].view, [data-theme] .control-icon[data-action=target].selected, [data-theme] .control-icon[data-action=target].active, [data-theme] .control-icon[data-action=active].view, [data-theme] .control-icon[data-action=active].selected, [data-theme] .control-icon[data-action=active].active, [data-theme] .control-icon[data-action=mystify].view, [data-theme] .control-icon[data-action=mystify].selected, [data-theme] .control-icon[data-action=mystify].active {
  5912. background: var(--button-hover-background);
  5913. outline: 1px solid var(--button-focus-outline-color);
  5914. border-color: var(--button-hover-border-color);
  5915. color: var(--button-hover-text-color);
  5916. text-decoration: none !important;
  5917. font-weight: unset !important;
  5918. }
  5919. [data-theme] .control-icon[data-action=visibility].empty, [data-theme] .control-icon[data-action=visibility].disabled, [data-theme] .control-icon[data-action=visibility]:disabled, [data-theme] .control-icon[data-action=effects].empty, [data-theme] .control-icon[data-action=effects].disabled, [data-theme] .control-icon[data-action=effects]:disabled, [data-theme] .control-icon[data-action=combat].empty, [data-theme] .control-icon[data-action=combat].disabled, [data-theme] .control-icon[data-action=combat]:disabled, [data-theme] .control-icon[data-action=locked].empty, [data-theme] .control-icon[data-action=locked].disabled, [data-theme] .control-icon[data-action=locked]:disabled, [data-theme] .control-icon[data-action=target].empty, [data-theme] .control-icon[data-action=target].disabled, [data-theme] .control-icon[data-action=target]:disabled, [data-theme] .control-icon[data-action=active].empty, [data-theme] .control-icon[data-action=active].disabled, [data-theme] .control-icon[data-action=active]:disabled, [data-theme] .control-icon[data-action=mystify].empty, [data-theme] .control-icon[data-action=mystify].disabled, [data-theme] .control-icon[data-action=mystify]:disabled {
  5920. --button-background: var(--button-disabled-background);
  5921. --button-hover-background: var(--button-disabled-background);
  5922. --button-border-color: var(--button-disabled-border-color);
  5923. --button-text-color: var(--text-color-5);
  5924. }
  5925. [data-theme] .control-icon[data-action=visibility]:disabled, [data-theme] .control-icon[data-action=effects]:disabled, [data-theme] .control-icon[data-action=combat]:disabled, [data-theme] .control-icon[data-action=locked]:disabled, [data-theme] .control-icon[data-action=target]:disabled, [data-theme] .control-icon[data-action=active]:disabled, [data-theme] .control-icon[data-action=mystify]:disabled {
  5926. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  5927. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  5928. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  5929. }
  5930. /* ----------------------------------------- */
  5931. /* UI-right */
  5932. /* ----------------------------------------- */
  5933. #ui-right {
  5934. background: linear-gradient(to left, rgba(0, 0, 0, 0.8) calc(100% - 10px), transparent 100%);
  5935. padding-left: 10px;
  5936. padding-top: 5px;
  5937. }
  5938. #ui-right #sidebar {
  5939. background: none;
  5940. box-shadow: none;
  5941. border: none;
  5942. margin: 0px;
  5943. height: 100%;
  5944. }
  5945. /* ----------------------------------------- */
  5946. /* Sidebar */
  5947. /* ----------------------------------------- */
  5948. #chat,
  5949. [data-chat-interface-theme] .chat-sidebar {
  5950. --sidebar-gap: 4px;
  5951. --sidebar-margin: 6px;
  5952. gap: var(--sidebar-gap);
  5953. padding-bottom: var(--sidebar-margin);
  5954. }
  5955. [data-chat-interface-theme] section.chat-sidebar .jump-to-bottom > a {
  5956. background: black;
  5957. z-index: 1;
  5958. }
  5959. [data-dorako-ui-scope=sidebar] .tab:not([data-tab=chat]) button {
  5960. background: var(--app-background);
  5961. border: var(--app-border-width) solid var(--app-border-color);
  5962. text-shadow: var(--app-text-shadow);
  5963. border-radius: var(--border-radius);
  5964. box-shadow: var(--box-shadow);
  5965. color: var(--text-color-3);
  5966. background: var(--button-background);
  5967. border: var(--app-border-width) solid var(--button-border-color);
  5968. color: var(--button-text-color);
  5969. box-shadow: var(--box-shadow);
  5970. text-decoration: none;
  5971. cursor: pointer;
  5972. text-shadow: var(--app-text-shadow);
  5973. }
  5974. [data-dorako-ui-scope=sidebar] .tab:not([data-tab=chat]) button:not(.disabled, :disabled):hover {
  5975. background: var(--button-hover-background);
  5976. color: var(--button-hover-text-color);
  5977. border: var(--app-border-width) solid var(--button-hover-border-color);
  5978. box-shadow: var(--box-shadow);
  5979. }
  5980. [data-dorako-ui-scope=sidebar] .tab:not([data-tab=chat]) button.view, [data-dorako-ui-scope=sidebar] .tab:not([data-tab=chat]) button.selected, [data-dorako-ui-scope=sidebar] .tab:not([data-tab=chat]) button.active {
  5981. background: var(--button-hover-background);
  5982. outline: 1px solid var(--button-focus-outline-color);
  5983. border-color: var(--button-hover-border-color);
  5984. color: var(--button-hover-text-color);
  5985. text-decoration: none !important;
  5986. font-weight: unset !important;
  5987. }
  5988. [data-dorako-ui-scope=sidebar] .tab:not([data-tab=chat]) button.empty, [data-dorako-ui-scope=sidebar] .tab:not([data-tab=chat]) button.disabled, [data-dorako-ui-scope=sidebar] .tab:not([data-tab=chat]) button:disabled {
  5989. --button-background: var(--button-disabled-background);
  5990. --button-hover-background: var(--button-disabled-background);
  5991. --button-border-color: var(--button-disabled-border-color);
  5992. --button-text-color: var(--text-color-5);
  5993. }
  5994. [data-dorako-ui-scope=sidebar] .tab input:not([type=range]) {
  5995. background: var(--input-background);
  5996. border: var(--app-border-width) solid;
  5997. border-color: var(--input-border-color) !important;
  5998. color: var(--input-text-color);
  5999. box-shadow: var(--input-box-shadow) !important;
  6000. align-items: center;
  6001. border-radius: 4px;
  6002. outline: 1px solid transparent;
  6003. user-select: text;
  6004. transition: outline-color 0.5s;
  6005. }
  6006. [data-dorako-ui-scope=sidebar] .tab input:not([type=range]):not(:disabled, .disabled, [type=checkbox]):hover, [data-dorako-ui-scope=sidebar] .tab input:not([type=range]):focus {
  6007. outline: 1px solid var(--input-focus-outline-color);
  6008. border: var(--app-border-width) solid;
  6009. border-color: var(--input-border-color);
  6010. color: var(--input-focus-text-color);
  6011. box-shadow: var(--box-shadow);
  6012. }
  6013. [data-dorako-ui-scope=sidebar] .tab input:not([type=range]).disabled, [data-dorako-ui-scope=sidebar] .tab input:not([type=range]):disabled {
  6014. --input-text-color: var(--text-color-disabled);
  6015. --input-background: var(--input-disabled-background);
  6016. --input-border-color: var(--input-disabled-border-color);
  6017. }
  6018. [data-dorako-ui-scope=sidebar] .tab input:not([type=range]).disabled::placeholder, [data-dorako-ui-scope=sidebar] .tab input:not([type=range]):disabled::placeholder {
  6019. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6020. }
  6021. [data-dorako-ui-scope=sidebar] .tab input:not([type=range])::placeholder {
  6022. color: var(--input-placeholder-color);
  6023. }
  6024. [data-dorako-ui-scope=sidebar] .tab input:not([type=range])[type=checkbox] {
  6025. outline: unset !important;
  6026. border: unset !important;
  6027. box-shadow: unset !important;
  6028. }
  6029. [data-dorako-ui-scope=sidebar] ::-webkit-scrollbar-thumb {
  6030. outline: none;
  6031. border-radius: 3px;
  6032. background: var(--scrollbar-thumb-background);
  6033. border: 1px solid var(--scrollbar-thumb-border-color);
  6034. transition: outline 0.15s;
  6035. }
  6036. [data-dorako-ui-scope=sidebar] ::-webkit-scrollbar-track {
  6037. box-shadow: 0 0 1px var(--color-secondary-3) inset;
  6038. box-shadow: unset;
  6039. border-radius: 4px;
  6040. }
  6041. [data-dorako-ui-scope=sidebar] #settings ul#game-details li.system-buttons {
  6042. gap: 5px;
  6043. }
  6044. [data-dorako-ui-scope=sidebar] #settings ul#game-details li.system-buttons button {
  6045. background: var(--app-background);
  6046. border: var(--app-border-width) solid var(--app-border-color);
  6047. text-shadow: var(--app-text-shadow);
  6048. border-radius: var(--border-radius);
  6049. box-shadow: var(--box-shadow);
  6050. color: var(--text-color-3);
  6051. background: var(--button-background);
  6052. border: var(--app-border-width) solid var(--button-border-color);
  6053. color: var(--button-text-color);
  6054. box-shadow: var(--box-shadow);
  6055. text-decoration: none;
  6056. cursor: pointer;
  6057. text-shadow: var(--app-text-shadow);
  6058. }
  6059. [data-dorako-ui-scope=sidebar] #settings ul#game-details li.system-buttons button:not(.disabled, :disabled):hover {
  6060. background: var(--button-hover-background);
  6061. color: var(--button-hover-text-color);
  6062. border: var(--app-border-width) solid var(--button-hover-border-color);
  6063. box-shadow: var(--box-shadow);
  6064. }
  6065. [data-dorako-ui-scope=sidebar] #settings ul#game-details li.system-buttons button.view, [data-dorako-ui-scope=sidebar] #settings ul#game-details li.system-buttons button.selected, [data-dorako-ui-scope=sidebar] #settings ul#game-details li.system-buttons button.active {
  6066. background: var(--button-hover-background);
  6067. outline: 1px solid var(--button-focus-outline-color);
  6068. border-color: var(--button-hover-border-color);
  6069. color: var(--button-hover-text-color);
  6070. text-decoration: none !important;
  6071. font-weight: unset !important;
  6072. }
  6073. [data-dorako-ui-scope=sidebar] #settings ul#game-details li.system-buttons button.empty, [data-dorako-ui-scope=sidebar] #settings ul#game-details li.system-buttons button.disabled, [data-dorako-ui-scope=sidebar] #settings ul#game-details li.system-buttons button:disabled {
  6074. --button-background: var(--button-disabled-background);
  6075. --button-hover-background: var(--button-disabled-background);
  6076. --button-border-color: var(--button-disabled-border-color);
  6077. --button-text-color: var(--text-color-5);
  6078. }
  6079. [data-dorako-ui-scope=sidebar] .compendium.directory .directory-header .compendium-name,
  6080. [data-dorako-ui-scope=sidebar] .compendium-sidebar .directory-item.compendium .compendium-name,
  6081. [data-dorako-ui-scope=sidebar] .compendium-sidebar .directory-item.compendium.locked .compendium-name {
  6082. background: var(--app-background);
  6083. border: var(--app-border-width) solid var(--app-border-color);
  6084. text-shadow: var(--app-text-shadow);
  6085. border-radius: var(--border-radius);
  6086. box-shadow: var(--box-shadow);
  6087. color: var(--text-color-3);
  6088. }
  6089. [data-dorako-ui-scope=sidebar] .compendium-sidebar .directory-item.compendium .compendium-footer .source {
  6090. background: var(--app-background);
  6091. border: var(--app-border-width) solid var(--app-border-color);
  6092. text-shadow: var(--app-text-shadow);
  6093. border-radius: var(--border-radius);
  6094. box-shadow: var(--box-shadow);
  6095. color: var(--text-color-3);
  6096. border-left: unset;
  6097. border-bottom-left-radius: unset;
  6098. border-top-left-radius: unset;
  6099. border-bottom-right-radius: unset;
  6100. }
  6101. [data-dorako-ui-scope=sidebar] .combat-sidebar li.combatant .token-name img.token-effect,
  6102. [data-theme] .combat-sidebar li.combatant .token-name img.token-effect {
  6103. background: var(--app-background);
  6104. border: var(--app-border-width) solid var(--app-border-color);
  6105. text-shadow: var(--app-text-shadow);
  6106. border-radius: var(--border-radius);
  6107. box-shadow: var(--box-shadow);
  6108. color: var(--text-color-3);
  6109. border: 1px solid;
  6110. border-color: var(--icon-border-color);
  6111. }
  6112. /* ----------------------------------------- */
  6113. /* Chatlog */
  6114. /* ----------------------------------------- */
  6115. [data-chat-interface-theme] #chat-log {
  6116. margin-left: calc(var(--sidebar-margin) - 3px);
  6117. }
  6118. [data-chat-interface-theme] #chat-log::-webkit-scrollbar-thumb {
  6119. outline: none;
  6120. border-radius: 3px;
  6121. background: var(--scrollbar-thumb-background);
  6122. border: 1px solid var(--scrollbar-thumb-border-color);
  6123. transition: outline 0.15s;
  6124. }
  6125. [data-chat-interface-theme] #chat-log::-webkit-scrollbar-track {
  6126. box-shadow: none;
  6127. box-shadow: unset;
  6128. border-radius: 4px;
  6129. }
  6130. [data-chat-interface-theme] #chat-log ~ * input[type=checkbox]:checked,
  6131. [data-chat-interface-theme] #chat-log ~ * input[type=radio]:checked {
  6132. accent-color: var(--accent-color);
  6133. }
  6134. [data-chat-interface-theme] #chat-log ~ * button {
  6135. background: var(--app-background);
  6136. border: var(--app-border-width) solid var(--app-border-color);
  6137. text-shadow: var(--app-text-shadow);
  6138. border-radius: var(--border-radius);
  6139. box-shadow: var(--box-shadow);
  6140. color: var(--text-color-3);
  6141. background: var(--button-background);
  6142. border: var(--app-border-width) solid var(--button-border-color);
  6143. color: var(--button-text-color);
  6144. box-shadow: var(--box-shadow);
  6145. text-decoration: none;
  6146. cursor: pointer;
  6147. text-shadow: var(--app-text-shadow);
  6148. }
  6149. [data-chat-interface-theme] #chat-log ~ * button:not(.disabled, :disabled):hover {
  6150. background: var(--button-hover-background);
  6151. color: var(--button-hover-text-color);
  6152. border: var(--app-border-width) solid var(--button-hover-border-color);
  6153. box-shadow: var(--box-shadow);
  6154. }
  6155. [data-chat-interface-theme] #chat-log ~ * button.view, [data-chat-interface-theme] #chat-log ~ * button.selected, [data-chat-interface-theme] #chat-log ~ * button.active {
  6156. background: var(--button-hover-background);
  6157. outline: 1px solid var(--button-focus-outline-color);
  6158. border-color: var(--button-hover-border-color);
  6159. color: var(--button-hover-text-color);
  6160. text-decoration: none !important;
  6161. font-weight: unset !important;
  6162. }
  6163. [data-chat-interface-theme] #chat-log ~ * button.empty, [data-chat-interface-theme] #chat-log ~ * button.disabled, [data-chat-interface-theme] #chat-log ~ * button:disabled {
  6164. --button-background: var(--button-disabled-background);
  6165. --button-hover-background: var(--button-disabled-background);
  6166. --button-border-color: var(--button-disabled-border-color);
  6167. --button-text-color: var(--text-color-5);
  6168. }
  6169. [data-chat-interface-theme] #chat-log ~ * #dorako-rt-buttons button {
  6170. background: var(--app-background);
  6171. border: var(--app-border-width) solid var(--app-border-color);
  6172. text-shadow: var(--app-text-shadow);
  6173. border-radius: var(--border-radius);
  6174. box-shadow: var(--box-shadow);
  6175. color: var(--text-color-3);
  6176. background: var(--button-background);
  6177. border: var(--app-border-width) solid var(--button-border-color);
  6178. color: var(--button-text-color);
  6179. box-shadow: var(--box-shadow);
  6180. text-decoration: none;
  6181. cursor: pointer;
  6182. text-shadow: var(--app-text-shadow);
  6183. transition: background 0.1s ease-in-out;
  6184. --button-background: var(--button-toggle-background);
  6185. --button-border-color: var(--button-toggle-border-color);
  6186. --button-focus-outline-color: var(--button-toggle-focus-outline-color);
  6187. --button-hover-background: var(--button-toggle-hover-background);
  6188. --button-hover-border-color: var(--button-toggle-hover-border-color);
  6189. }
  6190. [data-chat-interface-theme] #chat-log ~ * #dorako-rt-buttons button:not(.disabled, :disabled):hover {
  6191. background: var(--button-hover-background);
  6192. color: var(--button-hover-text-color);
  6193. border: var(--app-border-width) solid var(--button-hover-border-color);
  6194. box-shadow: var(--box-shadow);
  6195. }
  6196. [data-chat-interface-theme] #chat-log ~ * #dorako-rt-buttons button.view, [data-chat-interface-theme] #chat-log ~ * #dorako-rt-buttons button.selected, [data-chat-interface-theme] #chat-log ~ * #dorako-rt-buttons button.active {
  6197. background: var(--button-hover-background);
  6198. outline: 1px solid var(--button-focus-outline-color);
  6199. border-color: var(--button-hover-border-color);
  6200. color: var(--button-hover-text-color);
  6201. text-decoration: none !important;
  6202. font-weight: unset !important;
  6203. }
  6204. [data-chat-interface-theme] #chat-log ~ * #dorako-rt-buttons button.empty, [data-chat-interface-theme] #chat-log ~ * #dorako-rt-buttons button.disabled, [data-chat-interface-theme] #chat-log ~ * #dorako-rt-buttons button:disabled {
  6205. --button-background: var(--button-disabled-background);
  6206. --button-hover-background: var(--button-disabled-background);
  6207. --button-border-color: var(--button-disabled-border-color);
  6208. --button-text-color: var(--text-color-5);
  6209. }
  6210. [data-chat-interface-theme] #chat-log ~ * #dorako-rt-buttons button:disabled {
  6211. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  6212. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  6213. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  6214. }
  6215. [data-chat-interface-theme] #chat-log ~ *#chat-form {
  6216. margin: 0px var(--sidebar-margin);
  6217. }
  6218. [data-chat-interface-theme] #chat-log ~ *#chat-form textarea {
  6219. background: var(--input-background);
  6220. border: var(--app-border-width) solid;
  6221. border-color: var(--input-border-color) !important;
  6222. color: var(--input-text-color);
  6223. box-shadow: var(--input-box-shadow) !important;
  6224. align-items: center;
  6225. border-radius: 4px;
  6226. outline: 1px solid transparent;
  6227. user-select: text;
  6228. transition: outline-color 0.5s;
  6229. height: 100%;
  6230. border-radius: var(--border-radius);
  6231. }
  6232. [data-chat-interface-theme] #chat-log ~ *#chat-form textarea:not(:disabled, .disabled, [type=checkbox]):hover, [data-chat-interface-theme] #chat-log ~ *#chat-form textarea:focus {
  6233. outline: 1px solid var(--input-focus-outline-color);
  6234. border: var(--app-border-width) solid;
  6235. border-color: var(--input-border-color);
  6236. color: var(--input-focus-text-color);
  6237. box-shadow: var(--box-shadow);
  6238. }
  6239. [data-chat-interface-theme] #chat-log ~ *#chat-form textarea.disabled, [data-chat-interface-theme] #chat-log ~ *#chat-form textarea:disabled {
  6240. --input-text-color: var(--text-color-disabled);
  6241. --input-background: var(--input-disabled-background);
  6242. --input-border-color: var(--input-disabled-border-color);
  6243. }
  6244. [data-chat-interface-theme] #chat-log ~ *#chat-form textarea.disabled::placeholder, [data-chat-interface-theme] #chat-log ~ *#chat-form textarea:disabled::placeholder {
  6245. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6246. }
  6247. [data-chat-interface-theme] #chat-log ~ *#chat-form textarea::placeholder {
  6248. color: var(--input-placeholder-color);
  6249. }
  6250. [data-chat-interface-theme] #chat-log ~ *#chat-form textarea[type=checkbox] {
  6251. outline: unset !important;
  6252. border: unset !important;
  6253. box-shadow: unset !important;
  6254. }
  6255. [data-chat-interface-theme] #sidebar-tabs {
  6256. border: unset;
  6257. }
  6258. [data-chat-interface-theme] #sidebar-tabs > .item.active {
  6259. background: var(--app-background);
  6260. border: var(--app-border-width) solid var(--app-border-color);
  6261. text-shadow: var(--app-text-shadow);
  6262. border-radius: var(--border-radius);
  6263. box-shadow: var(--box-shadow);
  6264. color: var(--text-color-3);
  6265. background: var(--button-background);
  6266. border: var(--app-border-width) solid var(--button-border-color);
  6267. color: var(--button-text-color);
  6268. box-shadow: var(--box-shadow);
  6269. text-decoration: none;
  6270. cursor: pointer;
  6271. text-shadow: var(--app-text-shadow);
  6272. --button-focus-outline-color: transparent;
  6273. }
  6274. [data-chat-interface-theme] #sidebar-tabs > .item.active:not(.disabled, :disabled):hover {
  6275. background: var(--button-hover-background);
  6276. color: var(--button-hover-text-color);
  6277. border: var(--app-border-width) solid var(--button-hover-border-color);
  6278. box-shadow: var(--box-shadow);
  6279. }
  6280. [data-chat-interface-theme] #sidebar-tabs > .item.active.view, [data-chat-interface-theme] #sidebar-tabs > .item.active.selected, [data-chat-interface-theme] #sidebar-tabs > .item.active.active {
  6281. background: var(--button-hover-background);
  6282. outline: 1px solid var(--button-focus-outline-color);
  6283. border-color: var(--button-hover-border-color);
  6284. color: var(--button-hover-text-color);
  6285. text-decoration: none !important;
  6286. font-weight: unset !important;
  6287. }
  6288. [data-chat-interface-theme] #sidebar-tabs > .item.active.empty, [data-chat-interface-theme] #sidebar-tabs > .item.active.disabled, [data-chat-interface-theme] #sidebar-tabs > .item.active:disabled {
  6289. --button-background: var(--button-disabled-background);
  6290. --button-hover-background: var(--button-disabled-background);
  6291. --button-border-color: var(--button-disabled-border-color);
  6292. --button-text-color: var(--text-color-5);
  6293. }
  6294. [data-theme].filepicker .display-modes a {
  6295. background: var(--app-background);
  6296. border: var(--app-border-width) solid var(--app-border-color);
  6297. text-shadow: var(--app-text-shadow);
  6298. border-radius: var(--border-radius);
  6299. box-shadow: var(--box-shadow);
  6300. color: var(--text-color-3);
  6301. background: var(--button-background);
  6302. border: var(--app-border-width) solid var(--button-border-color);
  6303. color: var(--button-text-color);
  6304. box-shadow: var(--box-shadow);
  6305. text-decoration: none;
  6306. cursor: pointer;
  6307. text-shadow: var(--app-text-shadow);
  6308. }
  6309. [data-theme].filepicker .display-modes a:not(.disabled, :disabled):hover {
  6310. background: var(--button-hover-background);
  6311. color: var(--button-hover-text-color);
  6312. border: var(--app-border-width) solid var(--button-hover-border-color);
  6313. box-shadow: var(--box-shadow);
  6314. }
  6315. [data-theme].filepicker .display-modes a.view, [data-theme].filepicker .display-modes a.selected, [data-theme].filepicker .display-modes a.active {
  6316. background: var(--button-hover-background);
  6317. outline: 1px solid var(--button-focus-outline-color);
  6318. border-color: var(--button-hover-border-color);
  6319. color: var(--button-hover-text-color);
  6320. text-decoration: none !important;
  6321. font-weight: unset !important;
  6322. }
  6323. [data-theme].filepicker .display-modes a.empty, [data-theme].filepicker .display-modes a.disabled, [data-theme].filepicker .display-modes a:disabled {
  6324. --button-background: var(--button-disabled-background);
  6325. --button-hover-background: var(--button-disabled-background);
  6326. --button-border-color: var(--button-disabled-border-color);
  6327. --button-text-color: var(--text-color-5);
  6328. }
  6329. [data-theme].filepicker .private button.privacy {
  6330. background: var(--app-background);
  6331. border: var(--app-border-width) solid var(--app-border-color);
  6332. text-shadow: var(--app-text-shadow);
  6333. border-radius: var(--border-radius);
  6334. box-shadow: var(--box-shadow);
  6335. color: var(--text-color-3);
  6336. background: var(--button-background);
  6337. border: var(--app-border-width) solid var(--button-border-color);
  6338. color: var(--button-text-color);
  6339. box-shadow: var(--box-shadow);
  6340. text-decoration: none;
  6341. cursor: pointer;
  6342. text-shadow: var(--app-text-shadow);
  6343. --button-background: #7331ff;
  6344. }
  6345. [data-theme].filepicker .private button.privacy:not(.disabled, :disabled):hover {
  6346. background: var(--button-hover-background);
  6347. color: var(--button-hover-text-color);
  6348. border: var(--app-border-width) solid var(--button-hover-border-color);
  6349. box-shadow: var(--box-shadow);
  6350. }
  6351. [data-theme].filepicker .private button.privacy.view, [data-theme].filepicker .private button.privacy.selected, [data-theme].filepicker .private button.privacy.active {
  6352. background: var(--button-hover-background);
  6353. outline: 1px solid var(--button-focus-outline-color);
  6354. border-color: var(--button-hover-border-color);
  6355. color: var(--button-hover-text-color);
  6356. text-decoration: none !important;
  6357. font-weight: unset !important;
  6358. }
  6359. [data-theme].filepicker .private button.privacy.empty, [data-theme].filepicker .private button.privacy.disabled, [data-theme].filepicker .private button.privacy:disabled {
  6360. --button-background: var(--button-disabled-background);
  6361. --button-hover-background: var(--button-disabled-background);
  6362. --button-border-color: var(--button-disabled-border-color);
  6363. --button-text-color: var(--text-color-5);
  6364. }
  6365. [data-theme].filepicker .filepicker-header .quick-link-input-button {
  6366. --box-shadow: none;
  6367. --button-hover-background: none;
  6368. --button-hover-border-color: transparent;
  6369. }
  6370. [data-theme].sheet.army {
  6371. --color-text-light: var(--text-color-2);
  6372. }
  6373. [data-theme].sheet.army.window-app .window-header {
  6374. background: #504c45;
  6375. border-top-left-radius: var(--border-radius);
  6376. border-top-right-radius: var(--border-radius);
  6377. color: #ffffff !important;
  6378. }
  6379. [data-theme].sheet.army form {
  6380. background: unset;
  6381. }
  6382. [data-theme].sheet.army form section.army-body fieldset {
  6383. border: 1px solid var(--fieldset-border-color) !important;
  6384. background: var(--fieldset-background-color) !important;
  6385. border-radius: var(--border-radius);
  6386. }
  6387. [data-theme].sheet.army form section.army-body fieldset > legend {
  6388. color: var(--fieldset-legend-color);
  6389. text-shadow: unset;
  6390. }
  6391. [data-theme].sheet.army form .army-sidebar header {
  6392. --primary: var(--color-primary-2);
  6393. }
  6394. [data-theme].sheet.army form ol.item-list li.item .item-icon {
  6395. border-radius: 3px;
  6396. border-color: var(--icon-border-color);
  6397. }
  6398. [data-theme].sheet.hazard {
  6399. --color-text-light: var(--text-color-2);
  6400. }
  6401. [data-theme].sheet.hazard.window-app .window-header {
  6402. background: #19302c;
  6403. border-top-left-radius: var(--border-radius);
  6404. border-top-right-radius: var(--border-radius);
  6405. color: #ffffff !important;
  6406. }
  6407. [data-theme].sheet.hazard.window-app.minimized .window-header {
  6408. border-radius: var(--border-radius);
  6409. }
  6410. [data-theme].sheet.hazard .section-container.publication .section-body input[type=text], [data-theme].sheet.hazard .container input[type=text], [data-theme].sheet.hazard .container input[type=number], [data-theme].sheet.hazard .container select {
  6411. background: var(--input-background);
  6412. border: var(--app-border-width) solid;
  6413. border-color: var(--input-border-color) !important;
  6414. color: var(--input-text-color);
  6415. box-shadow: var(--input-box-shadow) !important;
  6416. align-items: center;
  6417. border-radius: 4px;
  6418. outline: 1px solid transparent;
  6419. user-select: text;
  6420. transition: outline-color 0.5s;
  6421. }
  6422. [data-theme].sheet.hazard .section-container.publication .section-body input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].sheet.hazard .section-container.publication .section-body input[type=text]:focus, [data-theme].sheet.hazard .container input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].sheet.hazard .container input[type=text]:focus, [data-theme].sheet.hazard .container input[type=number]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].sheet.hazard .container input[type=number]:focus, [data-theme].sheet.hazard .container select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].sheet.hazard .container select:focus {
  6423. outline: 1px solid var(--input-focus-outline-color);
  6424. border: var(--app-border-width) solid;
  6425. border-color: var(--input-border-color);
  6426. color: var(--input-focus-text-color);
  6427. box-shadow: var(--box-shadow);
  6428. }
  6429. [data-theme].sheet.hazard .section-container.publication .section-body input[type=text].disabled, [data-theme].sheet.hazard .section-container.publication .section-body input[type=text]:disabled, [data-theme].sheet.hazard .container input[type=text].disabled, [data-theme].sheet.hazard .container input[type=text]:disabled, [data-theme].sheet.hazard .container input[type=number].disabled, [data-theme].sheet.hazard .container input[type=number]:disabled, [data-theme].sheet.hazard .container select.disabled, [data-theme].sheet.hazard .container select:disabled {
  6430. --input-text-color: var(--text-color-disabled);
  6431. --input-background: var(--input-disabled-background);
  6432. --input-border-color: var(--input-disabled-border-color);
  6433. }
  6434. [data-theme].sheet.hazard .section-container.publication .section-body input[type=text].disabled::placeholder, [data-theme].sheet.hazard .section-container.publication .section-body input[type=text]:disabled::placeholder, [data-theme].sheet.hazard .container input[type=text].disabled::placeholder, [data-theme].sheet.hazard .container input[type=text]:disabled::placeholder, [data-theme].sheet.hazard .container input[type=number].disabled::placeholder, [data-theme].sheet.hazard .container input[type=number]:disabled::placeholder, [data-theme].sheet.hazard .container select.disabled::placeholder, [data-theme].sheet.hazard .container select:disabled::placeholder {
  6435. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6436. }
  6437. [data-theme].sheet.hazard .section-container.publication .section-body input[type=text]::placeholder, [data-theme].sheet.hazard .container input[type=text]::placeholder, [data-theme].sheet.hazard .container input[type=number]::placeholder, [data-theme].sheet.hazard .container select::placeholder {
  6438. color: var(--input-placeholder-color);
  6439. }
  6440. [data-theme].sheet.hazard .section-container.publication .section-body input[type=text][type=checkbox], [data-theme].sheet.hazard .container input[type=text][type=checkbox], [data-theme].sheet.hazard .container input[type=number][type=checkbox], [data-theme].sheet.hazard .container select[type=checkbox] {
  6441. outline: unset !important;
  6442. border: unset !important;
  6443. box-shadow: unset !important;
  6444. }
  6445. [data-theme].sheet.hazard form > header {
  6446. --text-dark: black;
  6447. }
  6448. [data-theme].sheet.hazard .section-container, [data-theme].sheet.hazard form > header {
  6449. --input-text-color: white;
  6450. }
  6451. [data-theme].sheet.hazard form > header .details {
  6452. display: flex;
  6453. flex-direction: column;
  6454. gap: 3px;
  6455. }
  6456. [data-theme].sheet.hazard form > header .title {
  6457. align-items: center;
  6458. }
  6459. [data-theme].sheet.hazard .sidebar .sidebar-title {
  6460. border: unset;
  6461. }
  6462. [data-theme].sheet.hazard .sidebar {
  6463. border: unset;
  6464. box-shadow: unset;
  6465. }
  6466. [data-theme].sheet.hazard .sidebar > section {
  6467. gap: 3px;
  6468. display: flex;
  6469. flex-direction: column;
  6470. }
  6471. [data-theme].sheet.hazard .section-container .section-header h4 {
  6472. color: var(--text-color-2);
  6473. }
  6474. [data-theme].sheet.hazard .section-container {
  6475. background: var(--app-background);
  6476. border: var(--app-border-width) solid var(--app-border-color);
  6477. text-shadow: var(--app-text-shadow);
  6478. border-radius: var(--border-radius);
  6479. box-shadow: var(--box-shadow);
  6480. color: var(--text-color-3);
  6481. padding: unset;
  6482. margin: 4px 6px 0;
  6483. border: 1px solid var(--color-primary-3);
  6484. background: var(--color-primary-4);
  6485. }
  6486. [data-theme].sheet.hazard .section-container .section-header {
  6487. background: unset;
  6488. border: unset;
  6489. }
  6490. [data-theme].sheet.hazard .section-container .section-body {
  6491. background: unset;
  6492. border: unset;
  6493. }
  6494. [data-theme].sheet.familiar form {
  6495. background: unset;
  6496. }
  6497. [data-theme].sheet.familiar .section-container {
  6498. background: var(--app-background);
  6499. border: var(--app-border-width) solid var(--app-border-color);
  6500. text-shadow: var(--app-text-shadow);
  6501. border-radius: var(--border-radius);
  6502. box-shadow: var(--box-shadow);
  6503. color: var(--text-color-3);
  6504. --primary: var(--text-color-3);
  6505. padding: unset;
  6506. margin: 4px 6px 0;
  6507. border: 1px solid var(--color-primary-3);
  6508. background: var(--color-primary-4);
  6509. border-radius: var(--border-radius);
  6510. }
  6511. [data-theme].sheet.familiar .section-container .section-header {
  6512. background: unset;
  6513. border: unset;
  6514. }
  6515. [data-theme].sheet.familiar .section-container .section-body {
  6516. background: unset;
  6517. border: unset;
  6518. }
  6519. [data-theme].sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input, [data-theme].sheet.familiar .familiar-sheet-header .header-content .charname input, [data-theme].sheet.familiar select, [data-theme].sheet.familiar .familiar-section .familiar-content input[type=text] {
  6520. background: var(--input-background);
  6521. border: var(--app-border-width) solid;
  6522. border-color: var(--input-border-color) !important;
  6523. color: var(--input-text-color);
  6524. box-shadow: var(--input-box-shadow) !important;
  6525. align-items: center;
  6526. border-radius: 4px;
  6527. outline: 1px solid transparent;
  6528. user-select: text;
  6529. transition: outline-color 0.5s;
  6530. }
  6531. [data-theme].sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input:focus, [data-theme].sheet.familiar .familiar-sheet-header .header-content .charname input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].sheet.familiar .familiar-sheet-header .header-content .charname input:focus, [data-theme].sheet.familiar select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].sheet.familiar select:focus, [data-theme].sheet.familiar .familiar-section .familiar-content input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].sheet.familiar .familiar-section .familiar-content input[type=text]:focus {
  6532. outline: 1px solid var(--input-focus-outline-color);
  6533. border: var(--app-border-width) solid;
  6534. border-color: var(--input-border-color);
  6535. color: var(--input-focus-text-color);
  6536. box-shadow: var(--box-shadow);
  6537. }
  6538. [data-theme].sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input.disabled, [data-theme].sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input:disabled, [data-theme].sheet.familiar .familiar-sheet-header .header-content .charname input.disabled, [data-theme].sheet.familiar .familiar-sheet-header .header-content .charname input:disabled, [data-theme].sheet.familiar select.disabled, [data-theme].sheet.familiar select:disabled, [data-theme].sheet.familiar .familiar-section .familiar-content input[type=text].disabled, [data-theme].sheet.familiar .familiar-section .familiar-content input[type=text]:disabled {
  6539. --input-text-color: var(--text-color-disabled);
  6540. --input-background: var(--input-disabled-background);
  6541. --input-border-color: var(--input-disabled-border-color);
  6542. }
  6543. [data-theme].sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input.disabled::placeholder, [data-theme].sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input:disabled::placeholder, [data-theme].sheet.familiar .familiar-sheet-header .header-content .charname input.disabled::placeholder, [data-theme].sheet.familiar .familiar-sheet-header .header-content .charname input:disabled::placeholder, [data-theme].sheet.familiar select.disabled::placeholder, [data-theme].sheet.familiar select:disabled::placeholder, [data-theme].sheet.familiar .familiar-section .familiar-content input[type=text].disabled::placeholder, [data-theme].sheet.familiar .familiar-section .familiar-content input[type=text]:disabled::placeholder {
  6544. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6545. }
  6546. [data-theme].sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input::placeholder, [data-theme].sheet.familiar .familiar-sheet-header .header-content .charname input::placeholder, [data-theme].sheet.familiar select::placeholder, [data-theme].sheet.familiar .familiar-section .familiar-content input[type=text]::placeholder {
  6547. color: var(--input-placeholder-color);
  6548. }
  6549. [data-theme].sheet.familiar .familiar-sheet-header .header-content .details-section .hp-section .value input[type=checkbox], [data-theme].sheet.familiar .familiar-sheet-header .header-content .charname input[type=checkbox], [data-theme].sheet.familiar select[type=checkbox], [data-theme].sheet.familiar .familiar-section .familiar-content input[type=text][type=checkbox] {
  6550. outline: unset !important;
  6551. border: unset !important;
  6552. box-shadow: unset !important;
  6553. }
  6554. [data-theme].sheet.familiar .familiar-sheet-header .header-content .charname input {
  6555. font-size: 24px;
  6556. margin-right: 100px;
  6557. }
  6558. [data-theme].sheet.familiar .skills-content .skills-list .skill-name {
  6559. background: var(--app-background);
  6560. border: var(--app-border-width) solid var(--app-border-color);
  6561. text-shadow: var(--app-text-shadow);
  6562. border-radius: var(--border-radius);
  6563. box-shadow: var(--box-shadow);
  6564. color: var(--text-color-3);
  6565. background: var(--button-background);
  6566. border: var(--app-border-width) solid var(--button-border-color);
  6567. color: var(--button-text-color);
  6568. box-shadow: var(--box-shadow);
  6569. text-decoration: none;
  6570. cursor: pointer;
  6571. text-shadow: var(--app-text-shadow);
  6572. }
  6573. [data-theme].sheet.familiar .skills-content .skills-list .skill-name:not(.disabled, :disabled):hover {
  6574. background: var(--button-hover-background);
  6575. color: var(--button-hover-text-color);
  6576. border: var(--app-border-width) solid var(--button-hover-border-color);
  6577. box-shadow: var(--box-shadow);
  6578. }
  6579. [data-theme].sheet.familiar .skills-content .skills-list .skill-name.view, [data-theme].sheet.familiar .skills-content .skills-list .skill-name.selected, [data-theme].sheet.familiar .skills-content .skills-list .skill-name.active {
  6580. background: var(--button-hover-background);
  6581. outline: 1px solid var(--button-focus-outline-color);
  6582. border-color: var(--button-hover-border-color);
  6583. color: var(--button-hover-text-color);
  6584. text-decoration: none !important;
  6585. font-weight: unset !important;
  6586. }
  6587. [data-theme].sheet.familiar .skills-content .skills-list .skill-name.empty, [data-theme].sheet.familiar .skills-content .skills-list .skill-name.disabled, [data-theme].sheet.familiar .skills-content .skills-list .skill-name:disabled {
  6588. --button-background: var(--button-disabled-background);
  6589. --button-hover-background: var(--button-disabled-background);
  6590. --button-border-color: var(--button-disabled-border-color);
  6591. --button-text-color: var(--text-color-5);
  6592. }
  6593. [data-theme].sheet.actor.loot section.sidebar {
  6594. box-shadow: unset;
  6595. border: unset;
  6596. }
  6597. [data-theme].sheet.actor.loot section.sidebar .image-container > img.actor-image {
  6598. border: unset;
  6599. }
  6600. [data-theme].sheet.actor.loot section.sidebar .gm-settings {
  6601. border: unset;
  6602. }
  6603. [data-theme].sheet.actor.loot .sheet-header {
  6604. border: unset;
  6605. box-shadow: unset;
  6606. }
  6607. [data-theme].sheet.actor.loot section.sidebar .gm-settings .loot-distribution {
  6608. box-shadow: unset;
  6609. background: unset;
  6610. display: flex;
  6611. flex-direction: column;
  6612. gap: 3px;
  6613. }
  6614. [data-theme].sheet.actor.loot .sheet-header .tags .tag, [data-theme].sheet.actor.loot .sheet-header h1 > input {
  6615. background: var(--input-background);
  6616. border: var(--app-border-width) solid;
  6617. border-color: var(--input-border-color) !important;
  6618. color: var(--input-text-color);
  6619. box-shadow: var(--input-box-shadow) !important;
  6620. align-items: center;
  6621. border-radius: 4px;
  6622. outline: 1px solid transparent;
  6623. user-select: text;
  6624. transition: outline-color 0.5s;
  6625. }
  6626. [data-theme].sheet.actor.loot .sheet-header .tags .tag:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].sheet.actor.loot .sheet-header .tags .tag:focus, [data-theme].sheet.actor.loot .sheet-header h1 > input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].sheet.actor.loot .sheet-header h1 > input:focus {
  6627. outline: 1px solid var(--input-focus-outline-color);
  6628. border: var(--app-border-width) solid;
  6629. border-color: var(--input-border-color);
  6630. color: var(--input-focus-text-color);
  6631. box-shadow: var(--box-shadow);
  6632. }
  6633. [data-theme].sheet.actor.loot .sheet-header .tags .tag.disabled, [data-theme].sheet.actor.loot .sheet-header .tags .tag:disabled, [data-theme].sheet.actor.loot .sheet-header h1 > input.disabled, [data-theme].sheet.actor.loot .sheet-header h1 > input:disabled {
  6634. --input-text-color: var(--text-color-disabled);
  6635. --input-background: var(--input-disabled-background);
  6636. --input-border-color: var(--input-disabled-border-color);
  6637. }
  6638. [data-theme].sheet.actor.loot .sheet-header .tags .tag.disabled::placeholder, [data-theme].sheet.actor.loot .sheet-header .tags .tag:disabled::placeholder, [data-theme].sheet.actor.loot .sheet-header h1 > input.disabled::placeholder, [data-theme].sheet.actor.loot .sheet-header h1 > input:disabled::placeholder {
  6639. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6640. }
  6641. [data-theme].sheet.actor.loot .sheet-header .tags .tag::placeholder, [data-theme].sheet.actor.loot .sheet-header h1 > input::placeholder {
  6642. color: var(--input-placeholder-color);
  6643. }
  6644. [data-theme].sheet.actor.loot .sheet-header .tags .tag[type=checkbox], [data-theme].sheet.actor.loot .sheet-header h1 > input[type=checkbox] {
  6645. outline: unset !important;
  6646. border: unset !important;
  6647. box-shadow: unset !important;
  6648. }
  6649. [data-theme].sheet.actor.loot form section.sidebar .gm-settings .loot-distribution button {
  6650. background: var(--app-background);
  6651. border: var(--app-border-width) solid var(--app-border-color);
  6652. text-shadow: var(--app-text-shadow);
  6653. border-radius: var(--border-radius);
  6654. box-shadow: var(--box-shadow);
  6655. color: var(--text-color-3);
  6656. background: var(--button-background);
  6657. border: var(--app-border-width) solid var(--button-border-color);
  6658. color: var(--button-text-color);
  6659. box-shadow: var(--box-shadow);
  6660. text-decoration: none;
  6661. cursor: pointer;
  6662. text-shadow: var(--app-text-shadow);
  6663. }
  6664. [data-theme].sheet.actor.loot form section.sidebar .gm-settings .loot-distribution button:not(.disabled, :disabled):hover {
  6665. background: var(--button-hover-background);
  6666. color: var(--button-hover-text-color);
  6667. border: var(--app-border-width) solid var(--button-hover-border-color);
  6668. box-shadow: var(--box-shadow);
  6669. }
  6670. [data-theme].sheet.actor.loot form section.sidebar .gm-settings .loot-distribution button.view, [data-theme].sheet.actor.loot form section.sidebar .gm-settings .loot-distribution button.selected, [data-theme].sheet.actor.loot form section.sidebar .gm-settings .loot-distribution button.active {
  6671. background: var(--button-hover-background);
  6672. outline: 1px solid var(--button-focus-outline-color);
  6673. border-color: var(--button-hover-border-color);
  6674. color: var(--button-hover-text-color);
  6675. text-decoration: none !important;
  6676. font-weight: unset !important;
  6677. }
  6678. [data-theme].sheet.actor.loot form section.sidebar .gm-settings .loot-distribution button.empty, [data-theme].sheet.actor.loot form section.sidebar .gm-settings .loot-distribution button.disabled, [data-theme].sheet.actor.loot form section.sidebar .gm-settings .loot-distribution button:disabled {
  6679. --button-background: var(--button-disabled-background);
  6680. --button-hover-background: var(--button-disabled-background);
  6681. --button-border-color: var(--button-disabled-border-color);
  6682. --button-text-color: var(--text-color-5);
  6683. }
  6684. [data-theme][data-dorako-ui-scope=limited].sheet.pf2e.actor.npc.app {
  6685. --section-background: var(--color-primary-5);
  6686. --section-header: var(--color-primary-4);
  6687. --section-border-color: var(--scrollbar-thumb-border-color);
  6688. --section-outline-color: var(--color-secondary-5);
  6689. --section-header-text-color: var(--text-color-2);
  6690. --tag-border-color: var(--text-color-5);
  6691. --tag-background-color: var(--color-secondary-4);
  6692. --tag-text-color: var(--text-color-4);
  6693. --color-text-dark-input: var(--text-color-3);
  6694. --text-dark: var(--text-color-2);
  6695. }
  6696. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li .item-name h4:hover {
  6697. --secondary: var(--accent-color);
  6698. }
  6699. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .spell-level-header input {
  6700. background: var(--input-background);
  6701. border: var(--app-border-width) solid;
  6702. border-color: var(--input-border-color) !important;
  6703. color: var(--input-text-color);
  6704. box-shadow: var(--input-box-shadow) !important;
  6705. align-items: center;
  6706. border-radius: 4px;
  6707. outline: 1px solid transparent;
  6708. user-select: text;
  6709. transition: outline-color 0.5s;
  6710. }
  6711. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .spell-level-header input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .spell-level-header input:focus {
  6712. outline: 1px solid var(--input-focus-outline-color);
  6713. border: var(--app-border-width) solid;
  6714. border-color: var(--input-border-color);
  6715. color: var(--input-focus-text-color);
  6716. box-shadow: var(--box-shadow);
  6717. }
  6718. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .spell-level-header input.disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .spell-level-header input:disabled {
  6719. --input-text-color: var(--text-color-disabled);
  6720. --input-background: var(--input-disabled-background);
  6721. --input-border-color: var(--input-disabled-border-color);
  6722. }
  6723. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .spell-level-header input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .spell-level-header input:disabled::placeholder {
  6724. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6725. }
  6726. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .spell-level-header input::placeholder {
  6727. color: var(--input-placeholder-color);
  6728. }
  6729. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .spell-level-header input[type=checkbox] {
  6730. outline: unset !important;
  6731. border: unset !important;
  6732. box-shadow: unset !important;
  6733. }
  6734. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .attribute select {
  6735. background: var(--input-background);
  6736. border: var(--app-border-width) solid;
  6737. border-color: var(--input-border-color) !important;
  6738. color: var(--input-text-color);
  6739. box-shadow: var(--input-box-shadow) !important;
  6740. align-items: center;
  6741. border-radius: 4px;
  6742. outline: 1px solid transparent;
  6743. user-select: text;
  6744. transition: outline-color 0.5s;
  6745. max-width: 60px;
  6746. }
  6747. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .attribute select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .attribute select:focus {
  6748. outline: 1px solid var(--input-focus-outline-color);
  6749. border: var(--app-border-width) solid;
  6750. border-color: var(--input-border-color);
  6751. color: var(--input-focus-text-color);
  6752. box-shadow: var(--box-shadow);
  6753. }
  6754. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .attribute select.disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .attribute select:disabled {
  6755. --input-text-color: var(--text-color-disabled);
  6756. --input-background: var(--input-disabled-background);
  6757. --input-border-color: var(--input-disabled-border-color);
  6758. }
  6759. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .attribute select.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .attribute select:disabled::placeholder {
  6760. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6761. }
  6762. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .attribute select::placeholder {
  6763. color: var(--input-placeholder-color);
  6764. }
  6765. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .attribute select[type=checkbox] {
  6766. outline: unset !important;
  6767. border: unset !important;
  6768. box-shadow: unset !important;
  6769. }
  6770. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li.spell-level-header input, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li .uses input {
  6771. background: var(--input-background);
  6772. border: var(--app-border-width) solid;
  6773. border-color: var(--input-border-color) !important;
  6774. color: var(--input-text-color);
  6775. box-shadow: var(--input-box-shadow) !important;
  6776. align-items: center;
  6777. border-radius: 4px;
  6778. outline: 1px solid transparent;
  6779. user-select: text;
  6780. transition: outline-color 0.5s;
  6781. }
  6782. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li.spell-level-header input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li.spell-level-header input:focus, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li .uses input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li .uses input:focus {
  6783. outline: 1px solid var(--input-focus-outline-color);
  6784. border: var(--app-border-width) solid;
  6785. border-color: var(--input-border-color);
  6786. color: var(--input-focus-text-color);
  6787. box-shadow: var(--box-shadow);
  6788. }
  6789. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li.spell-level-header input.disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li.spell-level-header input:disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li .uses input.disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li .uses input:disabled {
  6790. --input-text-color: var(--text-color-disabled);
  6791. --input-background: var(--input-disabled-background);
  6792. --input-border-color: var(--input-disabled-border-color);
  6793. }
  6794. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li.spell-level-header input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li.spell-level-header input:disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li .uses input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li .uses input:disabled::placeholder {
  6795. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6796. }
  6797. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li.spell-level-header input::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li .uses input::placeholder {
  6798. color: var(--input-placeholder-color);
  6799. }
  6800. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li.spell-level-header input[type=checkbox], [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form ol.spell-list > li .uses input[type=checkbox] {
  6801. outline: unset !important;
  6802. border: unset !important;
  6803. box-shadow: unset !important;
  6804. }
  6805. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .actions-options .actions-option select {
  6806. background: var(--input-background);
  6807. border: var(--app-border-width) solid;
  6808. border-color: var(--input-border-color) !important;
  6809. color: var(--input-text-color);
  6810. box-shadow: var(--input-box-shadow) !important;
  6811. align-items: center;
  6812. border-radius: 4px;
  6813. outline: 1px solid transparent;
  6814. user-select: text;
  6815. transition: outline-color 0.5s;
  6816. }
  6817. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .actions-options .actions-option select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .actions-options .actions-option select:focus {
  6818. outline: 1px solid var(--input-focus-outline-color);
  6819. border: var(--app-border-width) solid;
  6820. border-color: var(--input-border-color);
  6821. color: var(--input-focus-text-color);
  6822. box-shadow: var(--box-shadow);
  6823. }
  6824. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .actions-options .actions-option select.disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .actions-options .actions-option select:disabled {
  6825. --input-text-color: var(--text-color-disabled);
  6826. --input-background: var(--input-disabled-background);
  6827. --input-border-color: var(--input-disabled-border-color);
  6828. }
  6829. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .actions-options .actions-option select.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .actions-options .actions-option select:disabled::placeholder {
  6830. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6831. }
  6832. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .actions-options .actions-option select::placeholder {
  6833. color: var(--input-placeholder-color);
  6834. }
  6835. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .actions-options .actions-option select[type=checkbox] {
  6836. outline: unset !important;
  6837. border: unset !important;
  6838. box-shadow: unset !important;
  6839. }
  6840. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .attack-input, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .dc-input {
  6841. background: var(--input-background);
  6842. border: var(--app-border-width) solid;
  6843. border-color: var(--input-border-color) !important;
  6844. color: var(--input-text-color);
  6845. box-shadow: var(--input-box-shadow) !important;
  6846. align-items: center;
  6847. border-radius: 4px;
  6848. outline: 1px solid transparent;
  6849. user-select: text;
  6850. transition: outline-color 0.5s;
  6851. }
  6852. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .attack-input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .attack-input:focus, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .dc-input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .dc-input:focus {
  6853. outline: 1px solid var(--input-focus-outline-color);
  6854. border: var(--app-border-width) solid;
  6855. border-color: var(--input-border-color);
  6856. color: var(--input-focus-text-color);
  6857. box-shadow: var(--box-shadow);
  6858. }
  6859. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .attack-input.disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .attack-input:disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .dc-input.disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .dc-input:disabled {
  6860. --input-text-color: var(--text-color-disabled);
  6861. --input-background: var(--input-disabled-background);
  6862. --input-border-color: var(--input-disabled-border-color);
  6863. }
  6864. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .attack-input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .attack-input:disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .dc-input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .dc-input:disabled::placeholder {
  6865. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6866. }
  6867. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .attack-input::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .dc-input::placeholder {
  6868. color: var(--input-placeholder-color);
  6869. }
  6870. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .attack-input[type=checkbox], [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .entries-list .spellcasting-entry .header .inline-field .dc-input[type=checkbox] {
  6871. outline: unset !important;
  6872. border: unset !important;
  6873. box-shadow: unset !important;
  6874. }
  6875. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text .license select {
  6876. background: var(--input-background);
  6877. border: var(--app-border-width) solid;
  6878. border-color: var(--input-border-color) !important;
  6879. color: var(--input-text-color);
  6880. box-shadow: var(--input-box-shadow) !important;
  6881. align-items: center;
  6882. border-radius: 4px;
  6883. outline: 1px solid transparent;
  6884. user-select: text;
  6885. transition: outline-color 0.5s;
  6886. }
  6887. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text .license select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text .license select:focus {
  6888. outline: 1px solid var(--input-focus-outline-color);
  6889. border: var(--app-border-width) solid;
  6890. border-color: var(--input-border-color);
  6891. color: var(--input-focus-text-color);
  6892. box-shadow: var(--box-shadow);
  6893. }
  6894. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text .license select.disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text .license select:disabled {
  6895. --input-text-color: var(--text-color-disabled);
  6896. --input-background: var(--input-disabled-background);
  6897. --input-border-color: var(--input-disabled-border-color);
  6898. }
  6899. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text .license select.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text .license select:disabled::placeholder {
  6900. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6901. }
  6902. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text .license select::placeholder {
  6903. color: var(--input-placeholder-color);
  6904. }
  6905. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text .license select[type=checkbox] {
  6906. outline: unset !important;
  6907. border: unset !important;
  6908. box-shadow: unset !important;
  6909. }
  6910. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .spellcasting-entry select {
  6911. background: var(--input-background);
  6912. border: var(--app-border-width) solid;
  6913. border-color: var(--input-border-color) !important;
  6914. color: var(--input-text-color);
  6915. box-shadow: var(--input-box-shadow) !important;
  6916. align-items: center;
  6917. border-radius: 4px;
  6918. outline: 1px solid transparent;
  6919. user-select: text;
  6920. transition: outline-color 0.5s;
  6921. }
  6922. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .spellcasting-entry select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .spellcasting-entry select:focus {
  6923. outline: 1px solid var(--input-focus-outline-color);
  6924. border: var(--app-border-width) solid;
  6925. border-color: var(--input-border-color);
  6926. color: var(--input-focus-text-color);
  6927. box-shadow: var(--box-shadow);
  6928. }
  6929. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .spellcasting-entry select.disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .spellcasting-entry select:disabled {
  6930. --input-text-color: var(--text-color-disabled);
  6931. --input-background: var(--input-disabled-background);
  6932. --input-border-color: var(--input-disabled-border-color);
  6933. }
  6934. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .spellcasting-entry select.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .spellcasting-entry select:disabled::placeholder {
  6935. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6936. }
  6937. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .spellcasting-entry select::placeholder {
  6938. color: var(--input-placeholder-color);
  6939. }
  6940. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .spellcasting-entry select[type=checkbox] {
  6941. outline: unset !important;
  6942. border: unset !important;
  6943. box-shadow: unset !important;
  6944. }
  6945. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text] {
  6946. background: var(--input-background);
  6947. border: var(--app-border-width) solid;
  6948. border-color: var(--input-border-color) !important;
  6949. color: var(--input-text-color);
  6950. box-shadow: var(--input-box-shadow) !important;
  6951. align-items: center;
  6952. border-radius: 4px;
  6953. outline: 1px solid transparent;
  6954. user-select: text;
  6955. transition: outline-color 0.5s;
  6956. }
  6957. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text]:focus {
  6958. outline: 1px solid var(--input-focus-outline-color);
  6959. border: var(--app-border-width) solid;
  6960. border-color: var(--input-border-color);
  6961. color: var(--input-focus-text-color);
  6962. box-shadow: var(--box-shadow);
  6963. }
  6964. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text].disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text]:disabled {
  6965. --input-text-color: var(--text-color-disabled);
  6966. --input-background: var(--input-disabled-background);
  6967. --input-border-color: var(--input-disabled-border-color);
  6968. }
  6969. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text].disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text]:disabled::placeholder {
  6970. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  6971. }
  6972. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text]::placeholder {
  6973. color: var(--input-placeholder-color);
  6974. }
  6975. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section.publication .notes-text input[type=text][type=checkbox] {
  6976. outline: unset !important;
  6977. border: unset !important;
  6978. box-shadow: unset !important;
  6979. }
  6980. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .side-bar-section.initiative select {
  6981. background: var(--input-background);
  6982. border: var(--app-border-width) solid;
  6983. border-color: var(--input-border-color) !important;
  6984. color: var(--input-text-color);
  6985. box-shadow: var(--input-box-shadow) !important;
  6986. align-items: center;
  6987. border-radius: 4px;
  6988. outline: 1px solid transparent;
  6989. user-select: text;
  6990. transition: outline-color 0.5s;
  6991. }
  6992. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .side-bar-section.initiative select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .side-bar-section.initiative select:focus {
  6993. outline: 1px solid var(--input-focus-outline-color);
  6994. border: var(--app-border-width) solid;
  6995. border-color: var(--input-border-color);
  6996. color: var(--input-focus-text-color);
  6997. box-shadow: var(--box-shadow);
  6998. }
  6999. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .side-bar-section.initiative select.disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .side-bar-section.initiative select:disabled {
  7000. --input-text-color: var(--text-color-disabled);
  7001. --input-background: var(--input-disabled-background);
  7002. --input-border-color: var(--input-disabled-border-color);
  7003. }
  7004. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .side-bar-section.initiative select.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .side-bar-section.initiative select:disabled::placeholder {
  7005. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  7006. }
  7007. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .side-bar-section.initiative select::placeholder {
  7008. color: var(--input-placeholder-color);
  7009. }
  7010. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .side-bar-section.initiative select[type=checkbox] {
  7011. outline: unset !important;
  7012. border: unset !important;
  7013. box-shadow: unset !important;
  7014. }
  7015. [data-theme][data-dorako-ui-scope=limited].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .ammo select.linked {
  7016. padding: 3px;
  7017. }
  7018. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .actions-list li.action:not(:last-child), [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .attacks-list li.action:not(:last-child) {
  7019. border-color: var(--section-border-color);
  7020. }
  7021. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-section > h4 {
  7022. color: var(--text-color-2);
  7023. }
  7024. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .details-label {
  7025. color: var(--text-color-2);
  7026. }
  7027. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .notes .notes-text {
  7028. color: var(--text-color-3);
  7029. }
  7030. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .footer button.spellcasting-create {
  7031. background: var(--app-background);
  7032. border: var(--app-border-width) solid var(--app-border-color);
  7033. text-shadow: var(--app-text-shadow);
  7034. border-radius: var(--border-radius);
  7035. box-shadow: var(--box-shadow);
  7036. color: var(--text-color-3);
  7037. background: var(--button-background);
  7038. border: var(--app-border-width) solid var(--button-border-color);
  7039. color: var(--button-text-color);
  7040. box-shadow: var(--box-shadow);
  7041. text-decoration: none;
  7042. cursor: pointer;
  7043. text-shadow: var(--app-text-shadow);
  7044. transition: background 0.1s ease-in-out;
  7045. --button-background: var(--accent-color);
  7046. --button-border-color: var(--accent-color-dark);
  7047. --button-text-color: var(--accent-text-color);
  7048. --app-text-shadow: none;
  7049. --button-hover-background: var(--accent-color-light);
  7050. --button-hover-border-color: var(--accent-color);
  7051. --button-hover-text-color: var(--accent-text-color);
  7052. }
  7053. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .footer button.spellcasting-create:not(.disabled, :disabled):hover {
  7054. background: var(--button-hover-background);
  7055. color: var(--button-hover-text-color);
  7056. border: var(--app-border-width) solid var(--button-hover-border-color);
  7057. box-shadow: var(--box-shadow);
  7058. }
  7059. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .footer button.spellcasting-create.view, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .footer button.spellcasting-create.selected, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .footer button.spellcasting-create.active {
  7060. background: var(--button-hover-background);
  7061. outline: 1px solid var(--button-focus-outline-color);
  7062. border-color: var(--button-hover-border-color);
  7063. color: var(--button-hover-text-color);
  7064. text-decoration: none !important;
  7065. font-weight: unset !important;
  7066. }
  7067. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .footer button.spellcasting-create.empty, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .footer button.spellcasting-create.disabled, [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .footer button.spellcasting-create:disabled {
  7068. --button-background: var(--button-disabled-background);
  7069. --button-hover-background: var(--button-disabled-background);
  7070. --button-border-color: var(--button-disabled-border-color);
  7071. --button-text-color: var(--text-color-5);
  7072. }
  7073. [data-theme][data-dorako-ui-scope=limited].actor.npc.sheet form .sheet-body .footer button.spellcasting-create:disabled {
  7074. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  7075. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  7076. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  7077. }
  7078. [data-theme][data-dorako-ui-scope=limited].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-name, [data-theme][data-dorako-ui-scope=limited].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-name {
  7079. gap: 5px;
  7080. }
  7081. [data-theme].app.npc-skills-editor form ol li.skill:nth-child(even) {
  7082. background-color: color-mix(in srgb, var(--color-secondary-4) 20%, transparent);
  7083. }
  7084. [data-theme].app.npc-skills-editor form ol li.skill:nth-child(odd) {
  7085. background-color: color-mix(in srgb, var(--color-secondary-4) 40%, transparent);
  7086. }
  7087. [data-theme].app.npc-skills-editor form ol li.skill.header {
  7088. background-color: var(--color-primary-2);
  7089. }
  7090. [data-theme].pf2e.actor {
  7091. --contrastive-transparent: rgba(255, 255, 255, 0.2);
  7092. }
  7093. [data-theme].actor.sheet .item-image:hover i {
  7094. color: white;
  7095. background: var(--color-primary-2);
  7096. text-shadow: 0px 1px 2px black;
  7097. border-radius: 3px;
  7098. }
  7099. [data-theme].pf2e.item.sheet form > nav > .tabs > a:last-of-type {
  7100. padding: 5px 10px;
  7101. }
  7102. [data-theme].pf2e.actor form input[type=text], [data-theme].pf2e.actor form input[type=number] {
  7103. background: var(--input-background);
  7104. border: var(--app-border-width) solid;
  7105. border-color: var(--input-border-color) !important;
  7106. color: var(--input-text-color);
  7107. box-shadow: var(--input-box-shadow) !important;
  7108. align-items: center;
  7109. border-radius: 4px;
  7110. outline: 1px solid transparent;
  7111. user-select: text;
  7112. transition: outline-color 0.5s;
  7113. }
  7114. [data-theme].pf2e.actor form input[type=text]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.actor form input[type=text]:focus, [data-theme].pf2e.actor form input[type=number]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].pf2e.actor form input[type=number]:focus {
  7115. outline: 1px solid var(--input-focus-outline-color);
  7116. border: var(--app-border-width) solid;
  7117. border-color: var(--input-border-color);
  7118. color: var(--input-focus-text-color);
  7119. box-shadow: var(--box-shadow);
  7120. }
  7121. [data-theme].pf2e.actor form input[type=text].disabled, [data-theme].pf2e.actor form input[type=text]:disabled, [data-theme].pf2e.actor form input[type=number].disabled, [data-theme].pf2e.actor form input[type=number]:disabled {
  7122. --input-text-color: var(--text-color-disabled);
  7123. --input-background: var(--input-disabled-background);
  7124. --input-border-color: var(--input-disabled-border-color);
  7125. }
  7126. [data-theme].pf2e.actor form input[type=text].disabled::placeholder, [data-theme].pf2e.actor form input[type=text]:disabled::placeholder, [data-theme].pf2e.actor form input[type=number].disabled::placeholder, [data-theme].pf2e.actor form input[type=number]:disabled::placeholder {
  7127. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  7128. }
  7129. [data-theme].pf2e.actor form input[type=text]::placeholder, [data-theme].pf2e.actor form input[type=number]::placeholder {
  7130. color: var(--input-placeholder-color);
  7131. }
  7132. [data-theme].pf2e.actor form input[type=text][type=checkbox], [data-theme].pf2e.actor form input[type=number][type=checkbox] {
  7133. outline: unset !important;
  7134. border: unset !important;
  7135. box-shadow: unset !important;
  7136. }
  7137. [data-theme] .tags.paizo-style .tag.rarity.common,
  7138. [data-theme] .tags.paizo-style .tag.rarity[value=common],
  7139. [data-theme] .tags.paizo-style .tag.rarity > option[value=common] {
  7140. --input-text-color: black;
  7141. }
  7142. [data-theme].pf2e.actor form .tag-legacy {
  7143. background: var(--color-secondary-4);
  7144. border: unset;
  7145. box-shadow: 0px 0px 0px 1px var(--contrastive-transparent) inset;
  7146. }
  7147. [data-theme].spellcasting-entry.preparation ol.spell-list > li .item-summary {
  7148. border: unset;
  7149. }
  7150. [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item.unidentified {
  7151. color: black;
  7152. border-radius: var(--border-radius);
  7153. }
  7154. [data-theme].actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-summary {
  7155. border-top: unset;
  7156. }
  7157. [data-theme] .tags,
  7158. [data-dorako-ui-scope=limited] .tags {
  7159. --color-rarity-common: #323232;
  7160. }
  7161. [data-theme] .currency li > button,
  7162. [data-dorako-ui-scope=limited] .currency li > button {
  7163. background: var(--app-background);
  7164. border: var(--app-border-width) solid var(--app-border-color);
  7165. text-shadow: var(--app-text-shadow);
  7166. border-radius: var(--border-radius);
  7167. box-shadow: var(--box-shadow);
  7168. color: var(--text-color-3);
  7169. background: var(--button-background);
  7170. border: var(--app-border-width) solid var(--button-border-color);
  7171. color: var(--button-text-color);
  7172. box-shadow: var(--box-shadow);
  7173. text-decoration: none;
  7174. cursor: pointer;
  7175. text-shadow: var(--app-text-shadow);
  7176. }
  7177. [data-theme] .currency li > button:not(.disabled, :disabled):hover,
  7178. [data-dorako-ui-scope=limited] .currency li > button:not(.disabled, :disabled):hover {
  7179. background: var(--button-hover-background);
  7180. color: var(--button-hover-text-color);
  7181. border: var(--app-border-width) solid var(--button-hover-border-color);
  7182. box-shadow: var(--box-shadow);
  7183. }
  7184. [data-theme] .currency li > button.view, [data-theme] .currency li > button.selected, [data-theme] .currency li > button.active,
  7185. [data-dorako-ui-scope=limited] .currency li > button.view,
  7186. [data-dorako-ui-scope=limited] .currency li > button.selected,
  7187. [data-dorako-ui-scope=limited] .currency li > button.active {
  7188. background: var(--button-hover-background);
  7189. outline: 1px solid var(--button-focus-outline-color);
  7190. border-color: var(--button-hover-border-color);
  7191. color: var(--button-hover-text-color);
  7192. text-decoration: none !important;
  7193. font-weight: unset !important;
  7194. }
  7195. [data-theme] .currency li > button.empty, [data-theme] .currency li > button.disabled, [data-theme] .currency li > button:disabled,
  7196. [data-dorako-ui-scope=limited] .currency li > button.empty,
  7197. [data-dorako-ui-scope=limited] .currency li > button.disabled,
  7198. [data-dorako-ui-scope=limited] .currency li > button:disabled {
  7199. --button-background: var(--button-disabled-background);
  7200. --button-hover-background: var(--button-disabled-background);
  7201. --button-border-color: var(--button-disabled-border-color);
  7202. --button-text-color: var(--text-color-5);
  7203. }
  7204. [data-theme].spellcasting-entry.preparation ol.spell-list > li .item-name .item-image, [data-theme].actor.sheet .item-image,
  7205. [data-dorako-ui-scope=limited].spellcasting-entry.preparation ol.spell-list > li .item-name .item-image,
  7206. [data-dorako-ui-scope=limited].actor.sheet .item-image {
  7207. background: var(--app-background);
  7208. border: var(--app-border-width) solid var(--app-border-color);
  7209. text-shadow: var(--app-text-shadow);
  7210. border-radius: var(--border-radius);
  7211. box-shadow: var(--box-shadow);
  7212. color: var(--text-color-3);
  7213. margin: 1px 2px;
  7214. border: 1px solid;
  7215. border-color: var(--icon-border-color);
  7216. border-radius: 3px;
  7217. }
  7218. [data-theme].spellcasting-entry.preparation ol.spell-list > li .item-name .item-image img, [data-theme].actor.sheet .item-image img,
  7219. [data-dorako-ui-scope=limited].spellcasting-entry.preparation ol.spell-list > li .item-name .item-image img,
  7220. [data-dorako-ui-scope=limited].actor.sheet .item-image img {
  7221. border-radius: 3px;
  7222. }
  7223. [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed,
  7224. [data-dorako-ui-scope=limited].actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed {
  7225. border-radius: 3px;
  7226. }
  7227. [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed i,
  7228. [data-dorako-ui-scope=limited].actor.sheet.character .crb-style .sheet-body .sheet-content .item-image.framed i {
  7229. text-shadow: none;
  7230. }
  7231. [data-theme][data-dorako-ui-scope=limited].sheet.party {
  7232. --color-border: var(--color-primary-3);
  7233. --alt-dark: var(--text-color-4);
  7234. --sub: var(--color-secondary-3);
  7235. --text-dark: var(--text-color-2);
  7236. }
  7237. [data-theme][data-dorako-ui-scope=limited].sheet.party .tag-light {
  7238. background: var(--tag-color);
  7239. border-color: var(--color-secondary-4);
  7240. color: white;
  7241. }
  7242. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav {
  7243. background: unset;
  7244. box-shadow: unset;
  7245. }
  7246. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav a,
  7247. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav .tab {
  7248. background: var(--app-background);
  7249. border: var(--app-border-width) solid var(--app-border-color);
  7250. text-shadow: var(--app-text-shadow);
  7251. border-radius: var(--border-radius);
  7252. box-shadow: var(--box-shadow);
  7253. color: var(--text-color-3);
  7254. background: var(--button-background);
  7255. border: var(--app-border-width) solid var(--button-border-color);
  7256. color: var(--button-text-color);
  7257. box-shadow: var(--box-shadow);
  7258. text-decoration: none;
  7259. cursor: pointer;
  7260. text-shadow: var(--app-text-shadow);
  7261. font-family: var(--font-primary);
  7262. }
  7263. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav a:not(.disabled, :disabled):hover,
  7264. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav .tab:not(.disabled, :disabled):hover {
  7265. background: var(--button-hover-background);
  7266. color: var(--button-hover-text-color);
  7267. border: var(--app-border-width) solid var(--button-hover-border-color);
  7268. box-shadow: var(--box-shadow);
  7269. }
  7270. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav a.view, [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav a.selected, [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav a.active,
  7271. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav .tab.view,
  7272. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav .tab.selected,
  7273. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav .tab.active {
  7274. background: var(--button-hover-background);
  7275. outline: 1px solid var(--button-focus-outline-color);
  7276. border-color: var(--button-hover-border-color);
  7277. color: var(--button-hover-text-color);
  7278. text-decoration: none !important;
  7279. font-weight: unset !important;
  7280. }
  7281. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav a.empty, [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav a.disabled, [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav a:disabled,
  7282. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav .tab.empty,
  7283. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav .tab.disabled,
  7284. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav .tab:disabled {
  7285. --button-background: var(--button-disabled-background);
  7286. --button-hover-background: var(--button-disabled-background);
  7287. --button-border-color: var(--button-disabled-border-color);
  7288. --button-text-color: var(--text-color-5);
  7289. }
  7290. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav a.active,
  7291. [data-theme][data-dorako-ui-scope=limited].sheet.party nav.sub-nav .tab.active {
  7292. font-weight: unset;
  7293. }
  7294. [data-theme][data-dorako-ui-scope=limited].sheet.kingdom .tab.active[data-tab=activities] .skills .control-dc .mod, [data-theme][data-dorako-ui-scope=limited].sheet.kingdom .tab.active[data-tab=features] .feat-item .item-name .feat-slot-title {
  7295. --secondary: var(--accent-color);
  7296. }
  7297. [data-theme][data-dorako-ui-scope=limited].sheet.party .sidebar {
  7298. box-shadow: unset;
  7299. border: unset;
  7300. }
  7301. [data-theme][data-dorako-ui-scope=limited].sheet.party form {
  7302. background: unset;
  7303. }
  7304. [data-theme][data-dorako-ui-scope=limited].sheet.party.window-app .window-header {
  7305. background: #1f391f;
  7306. border-top-left-radius: var(--border-radius);
  7307. border-top-right-radius: var(--border-radius);
  7308. }
  7309. [data-theme][data-dorako-ui-scope=limited].sheet.party.window-app.minimized .window-header {
  7310. border-radius: var(--border-radius);
  7311. }
  7312. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .summary {
  7313. background: var(--color-primary-4);
  7314. border-image-source: var(--ornamentation);
  7315. }
  7316. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .summary nav button {
  7317. background: var(--app-background);
  7318. border: var(--app-border-width) solid var(--app-border-color);
  7319. text-shadow: var(--app-text-shadow);
  7320. border-radius: var(--border-radius);
  7321. box-shadow: var(--box-shadow);
  7322. color: var(--text-color-3);
  7323. background: var(--button-background);
  7324. border: var(--app-border-width) solid var(--button-border-color);
  7325. color: var(--button-text-color);
  7326. box-shadow: var(--box-shadow);
  7327. text-decoration: none;
  7328. cursor: pointer;
  7329. text-shadow: var(--app-text-shadow);
  7330. }
  7331. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .summary nav button:not(.disabled, :disabled):hover {
  7332. background: var(--button-hover-background);
  7333. color: var(--button-hover-text-color);
  7334. border: var(--app-border-width) solid var(--button-hover-border-color);
  7335. box-shadow: var(--box-shadow);
  7336. }
  7337. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .summary nav button.view, [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .summary nav button.selected, [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .summary nav button.active {
  7338. background: var(--button-hover-background);
  7339. outline: 1px solid var(--button-focus-outline-color);
  7340. border-color: var(--button-hover-border-color);
  7341. color: var(--button-hover-text-color);
  7342. text-decoration: none !important;
  7343. font-weight: unset !important;
  7344. }
  7345. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .summary nav button.empty, [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .summary nav button.disabled, [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .summary nav button:disabled {
  7346. --button-background: var(--button-disabled-background);
  7347. --button-hover-background: var(--button-disabled-background);
  7348. --button-border-color: var(--button-disabled-border-color);
  7349. --button-text-color: var(--text-color-5);
  7350. }
  7351. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .member > .data .main-stats > section {
  7352. background-color: var(--color-primary-4);
  7353. }
  7354. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .member > .data .main-stats > section.ac {
  7355. background: unset;
  7356. border: unset;
  7357. }
  7358. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .member > .data .main-stats .ac .value {
  7359. color: var(--color-primary-1);
  7360. }
  7361. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=aftermath] .activities .member-activity .empty .name, [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=exploration] .activities .member-activity .empty .name {
  7362. color: var(--text-color-2);
  7363. }
  7364. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=aftermath] .activities .member-activity, [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=exploration] .activities .member-activity {
  7365. background-color: var(--color-primary-4);
  7366. }
  7367. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=aftermath] .member > .data header .hero-points .empty, [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .member > .data header .hero-points .empty {
  7368. border: 2px dashed var(--color-primary-2);
  7369. }
  7370. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=aftermath] .member > .data header .name, [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=overview] .member > .data header .name {
  7371. color: var(--text-color-2);
  7372. }
  7373. [data-theme][data-dorako-ui-scope=limited].sheet.party header.content-header .buttons {
  7374. gap: 5px;
  7375. }
  7376. [data-theme][data-dorako-ui-scope=limited].sheet.party header.content-header .buttons button {
  7377. background: var(--app-background);
  7378. border: var(--app-border-width) solid var(--app-border-color);
  7379. text-shadow: var(--app-text-shadow);
  7380. border-radius: var(--border-radius);
  7381. box-shadow: var(--box-shadow);
  7382. color: var(--text-color-3);
  7383. background: var(--button-background);
  7384. border: var(--app-border-width) solid var(--button-border-color);
  7385. color: var(--button-text-color);
  7386. box-shadow: var(--box-shadow);
  7387. text-decoration: none;
  7388. cursor: pointer;
  7389. text-shadow: var(--app-text-shadow);
  7390. }
  7391. [data-theme][data-dorako-ui-scope=limited].sheet.party header.content-header .buttons button:not(.disabled, :disabled):hover {
  7392. background: var(--button-hover-background);
  7393. color: var(--button-hover-text-color);
  7394. border: var(--app-border-width) solid var(--button-hover-border-color);
  7395. box-shadow: var(--box-shadow);
  7396. }
  7397. [data-theme][data-dorako-ui-scope=limited].sheet.party header.content-header .buttons button.view, [data-theme][data-dorako-ui-scope=limited].sheet.party header.content-header .buttons button.selected, [data-theme][data-dorako-ui-scope=limited].sheet.party header.content-header .buttons button.active {
  7398. background: var(--button-hover-background);
  7399. outline: 1px solid var(--button-focus-outline-color);
  7400. border-color: var(--button-hover-border-color);
  7401. color: var(--button-hover-text-color);
  7402. text-decoration: none !important;
  7403. font-weight: unset !important;
  7404. }
  7405. [data-theme][data-dorako-ui-scope=limited].sheet.party header.content-header .buttons button.empty, [data-theme][data-dorako-ui-scope=limited].sheet.party header.content-header .buttons button.disabled, [data-theme][data-dorako-ui-scope=limited].sheet.party header.content-header .buttons button:disabled {
  7406. --button-background: var(--button-disabled-background);
  7407. --button-hover-background: var(--button-disabled-background);
  7408. --button-border-color: var(--button-disabled-border-color);
  7409. --button-text-color: var(--text-color-5);
  7410. }
  7411. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=aftermath] .activities .member-activity .empty .icon, [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=exploration] .activities .member-activity .empty .icon {
  7412. background: var(--color-primary-5);
  7413. }
  7414. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .activity-name {
  7415. overflow: unset;
  7416. }
  7417. [data-theme][data-dorako-ui-scope=limited].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .icon img {
  7418. background: var(--app-background);
  7419. border: var(--app-border-width) solid var(--app-border-color);
  7420. text-shadow: var(--app-text-shadow);
  7421. border-radius: var(--border-radius);
  7422. box-shadow: var(--box-shadow);
  7423. color: var(--text-color-3);
  7424. filter: unset;
  7425. border-color: var(--color-primary-2);
  7426. }
  7427. [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .time .time-options {
  7428. background: var(--input-background);
  7429. border: var(--app-border-width) solid;
  7430. border-color: var(--input-border-color) !important;
  7431. color: var(--input-text-color);
  7432. box-shadow: var(--input-box-shadow) !important;
  7433. align-items: center;
  7434. border-radius: 4px;
  7435. outline: 1px solid transparent;
  7436. user-select: text;
  7437. transition: outline-color 0.5s;
  7438. }
  7439. [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .time .time-options:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .time .time-options:focus {
  7440. outline: 1px solid var(--input-focus-outline-color);
  7441. border: var(--app-border-width) solid;
  7442. border-color: var(--input-border-color);
  7443. color: var(--input-focus-text-color);
  7444. box-shadow: var(--box-shadow);
  7445. }
  7446. [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .time .time-options.disabled, [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .time .time-options:disabled {
  7447. --input-text-color: var(--text-color-disabled);
  7448. --input-background: var(--input-disabled-background);
  7449. --input-border-color: var(--input-disabled-border-color);
  7450. }
  7451. [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .time .time-options.disabled::placeholder, [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .time .time-options:disabled::placeholder {
  7452. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  7453. }
  7454. [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .time .time-options::placeholder {
  7455. color: var(--input-placeholder-color);
  7456. }
  7457. [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .time .time-options[type=checkbox] {
  7458. outline: unset !important;
  7459. border: unset !important;
  7460. box-shadow: unset !important;
  7461. }
  7462. [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .run-actions button {
  7463. background: var(--app-background);
  7464. border: var(--app-border-width) solid var(--app-border-color);
  7465. text-shadow: var(--app-text-shadow);
  7466. border-radius: var(--border-radius);
  7467. box-shadow: var(--box-shadow);
  7468. color: var(--text-color-3);
  7469. background: var(--button-background);
  7470. border: var(--app-border-width) solid var(--button-border-color);
  7471. color: var(--button-text-color);
  7472. box-shadow: var(--box-shadow);
  7473. text-decoration: none;
  7474. cursor: pointer;
  7475. text-shadow: var(--app-text-shadow);
  7476. }
  7477. [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .run-actions button:not(.disabled, :disabled):hover {
  7478. background: var(--button-hover-background);
  7479. color: var(--button-hover-text-color);
  7480. border: var(--app-border-width) solid var(--button-hover-border-color);
  7481. box-shadow: var(--box-shadow);
  7482. }
  7483. [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .run-actions button.view, [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .run-actions button.selected, [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .run-actions button.active {
  7484. background: var(--button-hover-background);
  7485. outline: 1px solid var(--button-focus-outline-color);
  7486. border-color: var(--button-hover-border-color);
  7487. color: var(--button-hover-text-color);
  7488. text-decoration: none !important;
  7489. font-weight: unset !important;
  7490. }
  7491. [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .run-actions button.empty, [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .run-actions button.disabled, [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity .activity-entries .activity .run-actions button:disabled {
  7492. --button-background: var(--button-disabled-background);
  7493. --button-hover-background: var(--button-disabled-background);
  7494. --button-border-color: var(--button-disabled-border-color);
  7495. --button-text-color: var(--text-color-5);
  7496. }
  7497. .chat-message[data-theme] {
  7498. background: unset;
  7499. background: var(--app-background);
  7500. border: var(--app-border-width) solid var(--app-border-color);
  7501. text-shadow: var(--app-text-shadow);
  7502. border-radius: var(--border-radius);
  7503. box-shadow: var(--box-shadow);
  7504. color: var(--text-color-3);
  7505. background: var(--window-app-background);
  7506. border: var(--window-app-border-width) solid var(--window-app-border-color);
  7507. --color-text-light-6: var(--color-secondary-4);
  7508. --color-text-dark-secondary: var(--text-color-4);
  7509. }
  7510. .chat-message[data-theme] > .message-content .message-buttons button .cue i {
  7511. --fa-primary-color: var(--text-color-1);
  7512. --fa-secondary-color: var(--text-color-3);
  7513. }
  7514. .chat-message[data-theme] .message-content {
  7515. text-shadow: 0px 1px 1px black;
  7516. }
  7517. .chat-message[data-theme] .pf2e.chat-card .card-header h3 {
  7518. font-family: var(--serif);
  7519. font-size: x-large;
  7520. line-height: 1.3rem;
  7521. color: var(--text-color-2);
  7522. }
  7523. .chat-message[data-theme] .pf2e.chat-card .card-header h3.pf2-icon {
  7524. font-family: "Pathfinder2eActions", sans-serif;
  7525. flex: 0;
  7526. margin-right: 5px;
  7527. }
  7528. .chat-message[data-theme] .pf2e.chat-card .card-footer span {
  7529. border-right: 1px solid var(--color-secondary-4);
  7530. }
  7531. .chat-message[data-theme] .pf2e.chat-card .card-footer span:last-child {
  7532. border: unset;
  7533. }
  7534. .chat-message[data-theme] .table-draw .table-results .table-result img.result-image {
  7535. background: var(--app-background);
  7536. border: var(--app-border-width) solid var(--app-border-color);
  7537. text-shadow: var(--app-text-shadow);
  7538. border-radius: var(--border-radius);
  7539. box-shadow: var(--box-shadow);
  7540. color: var(--text-color-3);
  7541. border: 1px solid var(--icon-border-color);
  7542. }
  7543. .chat-message[data-theme] .table-draw .table-results .table-result img.result-image[src$=".svg"] {
  7544. background-color: white;
  7545. }
  7546. .chat-message[data-theme] .dice-tooltip .dice-rolls .roll.d20 {
  7547. text-shadow: none;
  7548. }
  7549. .chat-message[data-theme] .message-content .damage-roll .dice-result .dice-tooltip .instance {
  7550. border-radius: var(--border-radius);
  7551. }
  7552. .chat-message[data-theme] .dice-roll .dice-formula,
  7553. .chat-message[data-theme] .dice-roll .dice-total {
  7554. background: var(--app-background);
  7555. border: var(--app-border-width) solid var(--app-border-color);
  7556. text-shadow: var(--app-text-shadow);
  7557. border-radius: var(--border-radius);
  7558. box-shadow: var(--box-shadow);
  7559. color: var(--text-color-3);
  7560. }
  7561. .chat-message[data-theme] .dice-roll .dice-formula button,
  7562. .chat-message[data-theme] .dice-roll .dice-total button {
  7563. background: var(--app-background);
  7564. border: var(--app-border-width) solid var(--app-border-color);
  7565. text-shadow: var(--app-text-shadow);
  7566. border-radius: var(--border-radius);
  7567. box-shadow: var(--box-shadow);
  7568. color: var(--text-color-3);
  7569. background: var(--button-background);
  7570. border: var(--app-border-width) solid var(--button-border-color);
  7571. color: var(--button-text-color);
  7572. box-shadow: var(--box-shadow);
  7573. text-decoration: none;
  7574. cursor: pointer;
  7575. text-shadow: var(--app-text-shadow);
  7576. transition: background 0.1s ease-in-out;
  7577. --button-background: var(--accent-color);
  7578. --button-border-color: var(--accent-color-dark);
  7579. --button-text-color: var(--accent-text-color);
  7580. --app-text-shadow: none;
  7581. --button-hover-background: var(--accent-color-light);
  7582. --button-hover-border-color: var(--accent-color);
  7583. --button-hover-text-color: var(--accent-text-color);
  7584. display: flex;
  7585. align-items: center;
  7586. justify-content: center;
  7587. }
  7588. .chat-message[data-theme] .dice-roll .dice-formula button:not(.disabled, :disabled):hover,
  7589. .chat-message[data-theme] .dice-roll .dice-total button:not(.disabled, :disabled):hover {
  7590. background: var(--button-hover-background);
  7591. color: var(--button-hover-text-color);
  7592. border: var(--app-border-width) solid var(--button-hover-border-color);
  7593. box-shadow: var(--box-shadow);
  7594. }
  7595. .chat-message[data-theme] .dice-roll .dice-formula button.view, .chat-message[data-theme] .dice-roll .dice-formula button.selected, .chat-message[data-theme] .dice-roll .dice-formula button.active,
  7596. .chat-message[data-theme] .dice-roll .dice-total button.view,
  7597. .chat-message[data-theme] .dice-roll .dice-total button.selected,
  7598. .chat-message[data-theme] .dice-roll .dice-total button.active {
  7599. background: var(--button-hover-background);
  7600. outline: 1px solid var(--button-focus-outline-color);
  7601. border-color: var(--button-hover-border-color);
  7602. color: var(--button-hover-text-color);
  7603. text-decoration: none !important;
  7604. font-weight: unset !important;
  7605. }
  7606. .chat-message[data-theme] .dice-roll .dice-formula button.empty, .chat-message[data-theme] .dice-roll .dice-formula button.disabled, .chat-message[data-theme] .dice-roll .dice-formula button:disabled,
  7607. .chat-message[data-theme] .dice-roll .dice-total button.empty,
  7608. .chat-message[data-theme] .dice-roll .dice-total button.disabled,
  7609. .chat-message[data-theme] .dice-roll .dice-total button:disabled {
  7610. --button-background: var(--button-disabled-background);
  7611. --button-hover-background: var(--button-disabled-background);
  7612. --button-border-color: var(--button-disabled-border-color);
  7613. --button-text-color: var(--text-color-5);
  7614. }
  7615. .chat-message[data-theme] .dice-roll .dice-formula button:disabled,
  7616. .chat-message[data-theme] .dice-roll .dice-total button:disabled {
  7617. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  7618. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  7619. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  7620. }
  7621. .chat-message[data-theme] .dice-tooltip .part-header .part-total {
  7622. background: var(--app-background);
  7623. border: var(--app-border-width) solid var(--app-border-color);
  7624. text-shadow: var(--app-text-shadow);
  7625. border-radius: var(--border-radius);
  7626. box-shadow: var(--box-shadow);
  7627. color: var(--text-color-3);
  7628. box-shadow: unset;
  7629. border-bottom-left-radius: 0px;
  7630. border-bottom-right-radius: 0px;
  7631. border-bottom: unset;
  7632. }
  7633. .chat-message[data-theme] .pf2e.chat-card .card-header {
  7634. border: unset;
  7635. }
  7636. .chat-message[data-theme] .pf2e.chat-card .card-header img {
  7637. background: var(--app-background);
  7638. border: var(--app-border-width) solid var(--app-border-color);
  7639. text-shadow: var(--app-text-shadow);
  7640. border-radius: var(--border-radius);
  7641. box-shadow: var(--box-shadow);
  7642. color: var(--text-color-3);
  7643. border: 1px solid;
  7644. border-color: var(--icon-border-color);
  7645. }
  7646. .chat-message[data-theme] .pf2e.chat-card .card-footer {
  7647. border-top: 1px solid var(--app-border-color);
  7648. margin: 0px -5px;
  7649. padding: 0px 5px;
  7650. }
  7651. /* ----------------------------------------- */
  7652. /* Damage buttons */
  7653. /* ----------------------------------------- */
  7654. .chat-message[data-theme] .flavor-text hr {
  7655. display: none;
  7656. }
  7657. .chat-message[data-theme] .card-content hr {
  7658. margin-left: -5px;
  7659. margin-right: -5px;
  7660. }
  7661. .chat-message[data-theme] .pf2e.chat-card .card-buttons .spell-attack-buttons,
  7662. .chat-message[data-theme] .pf2e.chat-card .card-buttons .spell-button {
  7663. gap: 3px;
  7664. }
  7665. .chat-message[data-theme] .persistent-damage-recovery {
  7666. margin-top: 4px;
  7667. }
  7668. .chat-message[data-theme] .persistent-damage-recovery hr {
  7669. display: none;
  7670. }
  7671. .message[data-theme]:not([data-theme^=crb][data-color-scheme=light]) .message-content .damage-application img {
  7672. filter: invert(1) brightness(0.7) sepia(1) grayscale(0.7) drop-shadow(0px 1px 1px black);
  7673. }
  7674. .message[data-theme]:not([data-theme^=crb][data-color-scheme=light]) .message-content .damage-application button:hover img {
  7675. filter: invert(1) drop-shadow(0px 1px 1px black);
  7676. }
  7677. .message[data-theme] .message-content .damage-application {
  7678. gap: 3px;
  7679. margin-top: 3px;
  7680. text-rendering: geometricPrecision;
  7681. }
  7682. .message[data-theme] .message-content .damage-application button {
  7683. margin: 0px;
  7684. }
  7685. .message[data-theme] .message-content .damage-application button.half-damage .transparent-half {
  7686. display: none;
  7687. }
  7688. .message[data-theme] .message-content .damage-application button.half-damage .fa-heart-broken {
  7689. position: relative;
  7690. -webkit-text-fill-color: unset;
  7691. }
  7692. .message[data-theme] .message-content .damage-application button.half-damage .fa-heart-broken::before {
  7693. opacity: 0.5;
  7694. }
  7695. .message[data-theme] .message-content .damage-application button.half-damage .fa-heart-broken::after {
  7696. content: "\f7a9";
  7697. font-family: "Font Awesome 5 Free";
  7698. display: block;
  7699. z-index: 1;
  7700. opacity: 1;
  7701. position: absolute;
  7702. top: 0px;
  7703. left: 2.4px;
  7704. clip-path: polygon(45% 0%, 50% 100%, 100% 100%, 100% 4%);
  7705. }
  7706. .message[data-theme] .message-content .damage-application button[data-action=shield-block]:hover {
  7707. background-color: var(--color-secondary-2);
  7708. border: var(--app-border-width) solid;
  7709. border-color: var(--color-secondary-1);
  7710. }
  7711. .message[data-theme] .message-content .damage-application button[data-action=shield-block].shield-activated {
  7712. color: var(--button-hover-text-color);
  7713. background-color: var(--color-secondary-1);
  7714. border: var(--app-border-width) solid;
  7715. border-color: var(--color-secondary-2);
  7716. }
  7717. .message[data-theme] .message-content .damage-application button[data-action=shield-block].shield-activated:hover {
  7718. background-color: var(--color-secondary-2);
  7719. border: var(--app-border-width) solid;
  7720. border-color: var(--color-secondary-1);
  7721. }
  7722. .message[data-theme] .message-content .damage-application button[data-action=apply-healing] .fa-stack i.fa-plus {
  7723. --fa-inverse: white;
  7724. text-shadow: none;
  7725. }
  7726. .message[data-theme] .message-content .damage-application button[data-action=apply-healing]:hover {
  7727. background-color: var(--color-level-success);
  7728. border-color: var(--color-level-success-border);
  7729. }
  7730. .message[data-theme] .message-content .damage-application button[data-action=apply-healing]:hover .fa-stack i.fa-plus {
  7731. --fa-inverse: var(--color-level-success);
  7732. text-shadow: none;
  7733. }
  7734. /* ----------------------------------------- */
  7735. /* Header */
  7736. /* ----------------------------------------- */
  7737. .chat-message[data-theme] .message-header {
  7738. border-radius: var(--border-radius) var(--border-radius) 0px 0px;
  7739. }
  7740. .chat-message[data-theme] .message-header .player-name,
  7741. .chat-message[data-theme] .message-header .message-sender {
  7742. max-width: 160px;
  7743. text-overflow: ellipsis;
  7744. overflow: hidden;
  7745. white-space: nowrap;
  7746. }
  7747. .chat-message[data-theme] .message-header .portrait-and-name {
  7748. flex-grow: 1;
  7749. display: flex;
  7750. flex-basis: 100px;
  7751. gap: 5px;
  7752. }
  7753. .chat-message[data-theme] .message-header .portrait-and-name .portrait-wrapper {
  7754. width: var(--avatar-size);
  7755. display: flex;
  7756. flex: none;
  7757. justify-content: center;
  7758. align-items: center;
  7759. }
  7760. .chat-message[data-theme] .message-header .portrait-and-name .portrait-wrapper .portrait {
  7761. height: var(--avatar-size);
  7762. object-fit: contain;
  7763. z-index: 0;
  7764. }
  7765. .chat-message[data-theme] .message-header .portrait-and-name .portrait-wrapper .portrait.actor {
  7766. border-radius: 3px;
  7767. }
  7768. .chat-message[data-theme] .message-header .portrait-and-name .sender-wrapper {
  7769. display: flex;
  7770. gap: 3px;
  7771. flex-direction: column;
  7772. justify-content: left;
  7773. align-self: center;
  7774. z-index: 1;
  7775. }
  7776. .chat-message[data-theme] .message-header .portrait-and-name .sender-wrapper .message-sender,
  7777. .chat-message[data-theme] .message-header .portrait-and-name .sender-wrapper .player-name {
  7778. align-self: flex-start;
  7779. line-height: initial;
  7780. }
  7781. /* ----------------------------------------- */
  7782. /* System overwrites */
  7783. /* ----------------------------------------- */
  7784. [data-theme].chat-message > .message-content ul.participant-conditions {
  7785. border: unset;
  7786. box-shadow: unset;
  7787. }
  7788. [data-theme].chat-message > .message-content ul.participant-conditions li img {
  7789. background: var(--app-background);
  7790. border: var(--app-border-width) solid var(--app-border-color);
  7791. text-shadow: var(--app-text-shadow);
  7792. border-radius: var(--border-radius);
  7793. box-shadow: var(--box-shadow);
  7794. color: var(--text-color-3);
  7795. }
  7796. [data-theme].chat-message .message-content .damage-taken button.revert-damage {
  7797. background: var(--app-background);
  7798. border: var(--app-border-width) solid var(--app-border-color);
  7799. text-shadow: var(--app-text-shadow);
  7800. border-radius: var(--border-radius);
  7801. box-shadow: var(--box-shadow);
  7802. color: var(--text-color-3);
  7803. background: var(--button-background);
  7804. border: var(--app-border-width) solid var(--button-border-color);
  7805. color: var(--button-text-color);
  7806. box-shadow: var(--box-shadow);
  7807. text-decoration: none;
  7808. cursor: pointer;
  7809. text-shadow: var(--app-text-shadow);
  7810. }
  7811. [data-theme].chat-message .message-content .damage-taken button.revert-damage:not(.disabled, :disabled):hover {
  7812. background: var(--button-hover-background);
  7813. color: var(--button-hover-text-color);
  7814. border: var(--app-border-width) solid var(--button-hover-border-color);
  7815. box-shadow: var(--box-shadow);
  7816. }
  7817. [data-theme].chat-message .message-content .damage-taken button.revert-damage.view, [data-theme].chat-message .message-content .damage-taken button.revert-damage.selected, [data-theme].chat-message .message-content .damage-taken button.revert-damage.active {
  7818. background: var(--button-hover-background);
  7819. outline: 1px solid var(--button-focus-outline-color);
  7820. border-color: var(--button-hover-border-color);
  7821. color: var(--button-hover-text-color);
  7822. text-decoration: none !important;
  7823. font-weight: unset !important;
  7824. }
  7825. [data-theme].chat-message .message-content .damage-taken button.revert-damage.empty, [data-theme].chat-message .message-content .damage-taken button.revert-damage.disabled, [data-theme].chat-message .message-content .damage-taken button.revert-damage:disabled {
  7826. --button-background: var(--button-disabled-background);
  7827. --button-hover-background: var(--button-disabled-background);
  7828. --button-border-color: var(--button-disabled-border-color);
  7829. --button-text-color: var(--text-color-5);
  7830. }
  7831. [data-theme].chat-message.emote > .message-content p.action-content img {
  7832. background: var(--app-background);
  7833. border: var(--app-border-width) solid var(--app-border-color);
  7834. text-shadow: var(--app-text-shadow);
  7835. border-radius: var(--border-radius);
  7836. box-shadow: var(--box-shadow);
  7837. color: var(--text-color-3);
  7838. border: 1px solid;
  7839. border-color: var(--icon-border-color);
  7840. }
  7841. [data-theme] .dice-roll .dice-total.success {
  7842. color: var(--degree-success-critical);
  7843. }
  7844. [data-theme] .dice-roll .dice-total.failure {
  7845. color: var(--degree-failure-critical);
  7846. }
  7847. [data-theme] .window-content .journal-entry-content .journal-entry-page .journal-page-content .fumble-deck,
  7848. [data-theme] .window-content .journal-entry-content .journal-entry-page .journal-page-content .critical-deck {
  7849. --text-dark: var(--text-color-2);
  7850. }
  7851. [data-theme] .window-content .journal-entry-content .journal-entry-page .journal-page-content .fumble-deck blockquote,
  7852. [data-theme] .window-content .journal-entry-content .journal-entry-page .journal-page-content .critical-deck blockquote {
  7853. color: var(--text-color-3);
  7854. box-shadow: 0px 1px 3px 1px black;
  7855. background: var(--color-primary-4);
  7856. }
  7857. [data-theme] .window-content .journal-entry-content .journal-entry-page .journal-page-content .fumble-deck blockquote {
  7858. border: 1px solid var(--color-level-error);
  7859. background-color: var(--color-level-error-bg);
  7860. }
  7861. [data-theme] .window-content .journal-entry-content .journal-entry-page .journal-page-content .critical-deck blockquote {
  7862. border: 1px solid var(--color-level-success);
  7863. background-color: var(--color-level-success-bg);
  7864. }
  7865. [data-theme] .window-content .journal-entry-content .journal-entry-page .journal-page-content .fumble-deck h1,
  7866. [data-theme] .window-content .journal-entry-content .journal-entry-page .journal-page-content .critical-deck h1 {
  7867. background-color: var(--color-primary-2);
  7868. border: 1px solid var(--color-primary-1);
  7869. color: var(--text-color-2);
  7870. text-shadow: 0px 1px 2px black;
  7871. box-shadow: 0px 1px 3px 1px black;
  7872. font-family: var(--font-primary);
  7873. }
  7874. [data-theme] .window-content .journal-entry-content .journal-entry-page .journal-page-content .fumble-deck code,
  7875. [data-theme] .window-content .journal-entry-content .journal-entry-page .journal-page-content .critical-deck code {
  7876. background: unset;
  7877. box-shadow: unset;
  7878. border-radius: 32px;
  7879. background-color: var(--color-secondary-2);
  7880. border: 1px solid var(--color-secondary-1);
  7881. color: var(--text-color-2);
  7882. text-shadow: 0px 1px 2px black;
  7883. box-shadow: 0px 1px 3px 1px black;
  7884. font-family: var(--font-primary);
  7885. }
  7886. [data-theme].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action .item-summary, [data-theme].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .item-summary, [data-theme].sheet.party [data-tab=overview] .summary, [data-theme].sheet.party [data-tab=exploration] .activities .member-activity, [data-theme].sheet.party [data-tab=aftermath] .activities .member-activity, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute h3.modifier, [data-theme].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels ol.actions-list li.action.expanded .item-summary, [data-theme].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions .actions-container .actions-tabs-wrapper .actions-panels .actions-options, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.crafting .crafting-options, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.proficiencies-list li, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .skills-list .skill, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .lores-list .skill, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .proficiencies-pane .combat-list .skill, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .ability-scores .ability h3.ability-mod, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attribute-modifiers .attribute, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attribute-modifiers .attribute h3.attribute-mod {
  7887. border-image-source: var(--ornamentation);
  7888. }
  7889. /* ----------------------------------------- */
  7890. /* PC Sheet Theme */
  7891. /* ----------------------------------------- */
  7892. [data-theme][data-theme-color] {
  7893. --ornamentation: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1%7Bstroke:%23231f20;stroke-miterlimit:10%7D.st1,.st2%7Bfill:none%7D%3C/style%3E%3Cg opacity='.25'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cg%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zM3.6 3.6h3.1v3.1H3.6zM6.8 3.6h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zM3.6 6.8H.5V13M13 .5H6.8v3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M29.4.5h3.1v3.1h-3.1zM26.3 3.6h3.1v3.1h-3.1zM26.3 6.8h3.1v3.1h-3.1zM23.1 3.6h3.1v3.1h-3.1zM26.3 3.6V.5H20'/%3E%3Cpath class='st1' d='M32.5 13V6.8h-3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zM23.1 26.3h3.1v3.1h-3.1zM26.3 23.1h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zM3.6 26.3h3.1v3.1H3.6zM3.6 23.1h3.1v3.1H3.6zM6.8 26.3h3.1v3.1H6.8z'/%3E%3Cpath class='st1' d='M6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  7894. }
  7895. [data-theme][data-theme-color].actor.sheet .crb-style .sheet-body .sheet-content ol.directory-list .action-header {
  7896. background: var(--theme-color);
  7897. }
  7898. [data-theme][data-theme-color].actor.sheet .inventory .container-metadata .container-capacity .container-capacity-bar, [data-theme][data-theme-color].actor.sheet .inventory .encumbrance .encumbrance-bar {
  7899. background: var(--theme-color);
  7900. }
  7901. [data-theme][data-theme-color].actor.sheet .inventory .encumbrance.over-limit .encumbrance-bar {
  7902. background: var(--theme-text-color) !important;
  7903. }
  7904. [data-theme][data-theme-color].actor.sheet .blue-button {
  7905. background: var(--theme-text-color) !important;
  7906. }
  7907. [data-theme][data-theme-color].actor.sheet .crb-style .stroke-header svg {
  7908. fill: none;
  7909. }
  7910. [data-theme].actor.sheet[data-theme-color] .window-content .inventory ul.items > li .item-summary,
  7911. [data-theme].actor.sheet[data-theme-color] .inventory .item-summary {
  7912. background: color-mix(in srgb, var(--theme-color) 25%, transparent);
  7913. }
  7914. [data-theme].actor.sheet[data-theme-color] aside .logo {
  7915. filter: grayscale(0.6);
  7916. }
  7917. [data-theme].actor.sheet[data-theme-color] aside .sidebar .hitpoints .hp-big .container.current-hp {
  7918. background-image: linear-gradient(90deg, var(--theme-color) 0%, var(--theme-text-color) 50%, var(--theme-color) 100%);
  7919. background-color: var(--secondary);
  7920. }
  7921. [data-theme].actor.sheet[data-theme-color] aside .sidebar .initiative-select select {
  7922. background-color: var(--theme-color);
  7923. }
  7924. [data-theme].actor.sheet[data-theme-color] nav.sheet-navigation {
  7925. background: var(--theme-text-color);
  7926. }
  7927. [data-theme].actor.sheet[data-theme-color=red] {
  7928. --theme-text-color: var(--primary-light);
  7929. --theme-color: var(--primary);
  7930. --theme-color-dark: var(--primary-dark);
  7931. }
  7932. [data-theme].actor.sheet[data-theme-color=red] .crb-style {
  7933. --header: url("../img/red-header.webp");
  7934. background-image: url("../img/red-header.webp"), var(--sheet);
  7935. }
  7936. [data-theme].actor.sheet[data-theme-color=blue] {
  7937. --scrollbar-thumb-background: var(--secondary-light);
  7938. --scrollbar-thumb-border-color: var(--tertiary);
  7939. --color-scrollbar-hover: var(--theme-text-color);
  7940. --theme-color-dark: var(--secondary-dark);
  7941. --theme-color: var(--secondary);
  7942. --theme-text-color: var(--secondary-light);
  7943. }
  7944. [data-theme].actor.sheet[data-theme-color=blue] .crb-style {
  7945. --header: url("../img/blue-header.webp");
  7946. background-image: url("../img/blue-header.webp"), var(--sheet);
  7947. }
  7948. [data-theme].actor.sheet[data-theme-color=blue] .crb-style aside {
  7949. background-image: url("../img/blue-sidebar-top.webp"), url("../img/blue-sidebar-bottom.webp");
  7950. }
  7951. [data-theme].actor.sheet[data-theme-color=blue] .crb-style aside .sidebar .armor-class .shield.hp {
  7952. background: url("../img/blue-shield.webp") no-repeat top center;
  7953. }
  7954. [data-theme].actor.sheet[data-theme-color=blue] .crb-style header.char-header .char-level .level {
  7955. background: url("../img/blue-level-badge.webp") no-repeat;
  7956. }
  7957. [data-theme].actor.sheet[data-theme-color=blue] .crb-style nav.sheet-navigation .item:hover,
  7958. [data-theme].actor.sheet[data-theme-color=blue] .crb-style nav.sheet-navigation .item.active {
  7959. background-image: url("../img/blue-nav-item.webp");
  7960. }
  7961. [data-theme].actor.sheet[data-theme-color=green] {
  7962. --scrollbar-thumb-background: var(--remaster-light);
  7963. --scrollbar-thumb-border-color: var(--tertiary);
  7964. --color-scrollbar-hover: var(--theme-text-color);
  7965. --theme-color-dark: var(--remaster-dark);
  7966. --theme-color: var(--remaster);
  7967. --theme-text-color: var(--remaster-light);
  7968. }
  7969. [data-theme].actor.sheet[data-theme-color=green] .crb-style {
  7970. --header: url("../img/green-header.webp");
  7971. background-image: url("../img/green-header.webp"), var(--sheet);
  7972. }
  7973. [data-theme].actor.sheet[data-theme-color=green] .crb-style aside {
  7974. background-image: url("../img/green-sidebar-top.webp"), url("../img/green-sidebar-bottom.webp");
  7975. }
  7976. [data-theme].actor.sheet[data-theme-color=green] .crb-style aside .armor-class .shield.hp {
  7977. background: url("../img/blue-shield.webp") no-repeat top center;
  7978. }
  7979. [data-theme].actor.sheet[data-theme-color=green] header.char-header .char-level .level {
  7980. background: url("../img/blue-level-badge.webp") no-repeat;
  7981. }
  7982. [data-theme].actor.sheet[data-theme-color=green] nav.sheet-navigation .item:hover,
  7983. [data-theme].actor.sheet[data-theme-color=green] nav.sheet-navigation .item.active {
  7984. background-image: url("../img/green-nav-item.webp");
  7985. }
  7986. [data-theme].actor.sheet[data-theme-color=purple] {
  7987. --theme-color-dark: #3b0062;
  7988. --theme-color: #520982;
  7989. --theme-text-color: rgb(107, 29, 137);
  7990. --color-scrollbar-hover: var(--theme-text-color);
  7991. --scrollbar-thumb-background: var(--theme-color);
  7992. --scrollbar-thumb-border-color: var(--tertiary);
  7993. }
  7994. [data-theme].actor.sheet[data-theme-color=purple] .crb-style {
  7995. --header: url("../img/purple-header.webp");
  7996. background-image: url("../img/purple-header.webp"), var(--sheet);
  7997. }
  7998. [data-theme].actor.sheet[data-theme-color=purple] .crb-style aside {
  7999. background-image: url("../img/purple-sidebar-top.webp"), url("../img/purple-sidebar-bottom.webp");
  8000. }
  8001. [data-theme].actor.sheet[data-theme-color=purple] .crb-style aside .armor-class .shield.hp {
  8002. background: url("../img/blue-shield.webp") no-repeat top center;
  8003. }
  8004. [data-theme].actor.sheet[data-theme-color=purple] .crb-style header.char-header .char-level .level {
  8005. background: url("../img/blue-level-badge.webp") no-repeat;
  8006. }
  8007. [data-theme].actor.sheet[data-theme-color=purple] .crb-style nav.sheet-navigation .item:hover,
  8008. [data-theme].actor.sheet[data-theme-color=purple] .crb-style nav.sheet-navigation .item.active {
  8009. background-image: url("../img/blue-nav-item.webp");
  8010. }
  8011. [data-theme].actor.sheet[data-theme-color=black] {
  8012. --theme-color-dark: black;
  8013. --theme-color: #111;
  8014. --theme-text-color: #222;
  8015. --scrollbar-thumb-background: var(--theme-color);
  8016. --scrollbar-thumb-border-color: var(--tertiary);
  8017. --color-scrollbar-hover: var(--theme-text-color);
  8018. }
  8019. [data-theme].actor.sheet[data-theme-color=black] .crb-style {
  8020. --header: url("../img/black-header.webp");
  8021. background-image: url("../img/green-header.webp"), var(--sheet);
  8022. }
  8023. [data-theme].actor.sheet[data-theme-color=black] .crb-style aside {
  8024. background-image: url("../img/black-sidebar-top.webp"), url("../img/black-sidebar-bottom.webp");
  8025. }
  8026. [data-theme].actor.sheet[data-theme-color=black] .crb-style aside .armor-class .shield.hp {
  8027. background: url("../img/blue-shield.webp") no-repeat top center;
  8028. }
  8029. [data-theme].actor.sheet[data-theme-color=black] .crb-style header.char-header .char-level .level {
  8030. background: url("../img/blue-level-badge.webp") no-repeat;
  8031. }
  8032. [data-theme].actor.sheet[data-theme-color=black] .crb-style nav.sheet-navigation .item:hover,
  8033. [data-theme].actor.sheet[data-theme-color=black] .crb-style nav.sheet-navigation .item.active {
  8034. background-image: url("../img/blue-nav-item.webp");
  8035. }
  8036. [data-theme][data-dorako-ui-scope=limited].actor.sheet .crb-style {
  8037. background: unset;
  8038. background: var(--header), transparent !important;
  8039. background-repeat: repeat-x, no-repeat !important;
  8040. background-size: auto 89px, cover !important;
  8041. background-attachment: local !important;
  8042. }
  8043. [data-theme][data-dorako-ui-scope=limited]:not([data-theme-color]).sheet.actor.window-app.character .window-header, [data-theme][data-dorako-ui-scope=limited]:not([data-theme-color]).sheet.actor.window-app.vehicle .window-header, [data-theme][data-dorako-ui-scope=limited][data-theme-color=red].sheet.actor.window-app.vehicle .window-header, [data-theme][data-dorako-ui-scope=limited][data-theme-color=red].sheet.actor.window-app.character .window-header {
  8044. background: #5a0c02;
  8045. }
  8046. [data-theme][data-dorako-ui-scope=limited][data-theme-color=green].sheet.actor.window-app.vehicle .window-header, [data-theme][data-dorako-ui-scope=limited][data-theme-color=green].sheet.actor.window-app.character .window-header {
  8047. background: #0e2a1a;
  8048. }
  8049. [data-theme][data-dorako-ui-scope=limited][data-theme-color=blue].sheet.actor.window-app.vehicle .window-header, [data-theme][data-dorako-ui-scope=limited][data-theme-color=blue].sheet.actor.window-app.character .window-header {
  8050. background: #1a1e5f;
  8051. }
  8052. [data-theme][data-dorako-ui-scope=limited][data-theme-color=purple].sheet.actor.window-app.vehicle .window-header, [data-theme][data-dorako-ui-scope=limited][data-theme-color=purple].sheet.actor.window-app.character .window-header {
  8053. background: #340c5b;
  8054. }
  8055. [data-theme][data-dorako-ui-scope=limited][data-theme-color=black].sheet.actor.window-app.vehicle .window-header, [data-theme][data-dorako-ui-scope=limited][data-theme-color=black].sheet.actor.window-app.character .window-header {
  8056. background: #151515;
  8057. }
  8058. [data-theme][data-dorako-ui-scope=limited][data-theme-color].sheet.actor.window-app.vehicle .window-header, [data-theme][data-dorako-ui-scope=limited][data-theme-color].sheet.actor.window-app.character .window-header {
  8059. color: white;
  8060. }
  8061. [data-theme][data-dorako-ui-scope=limited].sheet.actor.window-app.minimized .window-header {
  8062. border-radius: var(--border-radius);
  8063. }
  8064. [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill .skill-score, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill .skill-score, [data-theme].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill .skill-score {
  8065. color: var(--accent-color);
  8066. }
  8067. /* ----------------------------------------- */
  8068. /* Theme */
  8069. /* ----------------------------------------- */
  8070. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) {
  8071. --color-text-dark-4: var(--text-color-5);
  8072. --color-pf-primary: var(--color-primary-1);
  8073. }
  8074. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body {
  8075. background: unset;
  8076. }
  8077. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body input[type=number] {
  8078. background: var(--input-background);
  8079. border: var(--app-border-width) solid;
  8080. border-color: var(--input-border-color) !important;
  8081. color: var(--input-text-color);
  8082. box-shadow: var(--input-box-shadow) !important;
  8083. align-items: center;
  8084. border-radius: 4px;
  8085. outline: 1px solid transparent;
  8086. user-select: text;
  8087. transition: outline-color 0.5s;
  8088. }
  8089. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body input[type=number]:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body input[type=number]:focus {
  8090. outline: 1px solid var(--input-focus-outline-color);
  8091. border: var(--app-border-width) solid;
  8092. border-color: var(--input-border-color);
  8093. color: var(--input-focus-text-color);
  8094. box-shadow: var(--box-shadow);
  8095. }
  8096. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body input[type=number].disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body input[type=number]:disabled {
  8097. --input-text-color: var(--text-color-disabled);
  8098. --input-background: var(--input-disabled-background);
  8099. --input-border-color: var(--input-disabled-border-color);
  8100. }
  8101. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body input[type=number].disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body input[type=number]:disabled::placeholder {
  8102. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  8103. }
  8104. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body input[type=number]::placeholder {
  8105. color: var(--input-placeholder-color);
  8106. }
  8107. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body input[type=number][type=checkbox] {
  8108. outline: unset !important;
  8109. border: unset !important;
  8110. box-shadow: unset !important;
  8111. }
  8112. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body section.major > header,
  8113. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .details-label,
  8114. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body h1,
  8115. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body h2,
  8116. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body h3,
  8117. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body h4,
  8118. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body h5,
  8119. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body h6 {
  8120. --primary: var(--text-color-2);
  8121. }
  8122. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) button.daily-crafting {
  8123. background: var(--app-background);
  8124. border: var(--app-border-width) solid var(--app-border-color);
  8125. text-shadow: var(--app-text-shadow);
  8126. border-radius: var(--border-radius);
  8127. box-shadow: var(--box-shadow);
  8128. color: var(--text-color-3);
  8129. background: var(--button-background);
  8130. border: var(--app-border-width) solid var(--button-border-color);
  8131. color: var(--button-text-color);
  8132. box-shadow: var(--box-shadow);
  8133. text-decoration: none;
  8134. cursor: pointer;
  8135. text-shadow: var(--app-text-shadow);
  8136. transition: background 0.1s ease-in-out;
  8137. --button-background: var(--accent-color);
  8138. --button-border-color: var(--accent-color-dark);
  8139. --button-text-color: var(--accent-text-color);
  8140. --app-text-shadow: none;
  8141. --button-hover-background: var(--accent-color-light);
  8142. --button-hover-border-color: var(--accent-color);
  8143. --button-hover-text-color: var(--accent-text-color);
  8144. }
  8145. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) button.daily-crafting:not(.disabled, :disabled):hover {
  8146. background: var(--button-hover-background);
  8147. color: var(--button-hover-text-color);
  8148. border: var(--app-border-width) solid var(--button-hover-border-color);
  8149. box-shadow: var(--box-shadow);
  8150. }
  8151. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) button.daily-crafting.view, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) button.daily-crafting.selected, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) button.daily-crafting.active {
  8152. background: var(--button-hover-background);
  8153. outline: 1px solid var(--button-focus-outline-color);
  8154. border-color: var(--button-hover-border-color);
  8155. color: var(--button-hover-text-color);
  8156. text-decoration: none !important;
  8157. font-weight: unset !important;
  8158. }
  8159. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) button.daily-crafting.empty, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) button.daily-crafting.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) button.daily-crafting:disabled {
  8160. --button-background: var(--button-disabled-background);
  8161. --button-hover-background: var(--button-disabled-background);
  8162. --button-border-color: var(--button-disabled-border-color);
  8163. --button-text-color: var(--text-color-5);
  8164. }
  8165. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) button.daily-crafting:disabled {
  8166. --button-background: color-mix(in srgb, var(--button-background) 50%, transparent 50%);
  8167. --button-border-color: color-mix(in srgb, var(--button-border-color) 50%, transparent 50%);
  8168. --button-hover-background: color-mix(in srgb, var(--button-hover-background) 50%, transparent 50%);
  8169. }
  8170. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .abcd img.deity-emblem, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .pc_deity img.symbol {
  8171. background: var(--color-primary-4);
  8172. border: 1px solid var(--color-primary-3);
  8173. box-shadow: 0px 0px 0px 1px var(--color-primary-3), var(--box-shadow);
  8174. }
  8175. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav {
  8176. background: unset;
  8177. box-shadow: unset;
  8178. }
  8179. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav a,
  8180. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav .tab {
  8181. background: var(--app-background);
  8182. border: var(--app-border-width) solid var(--app-border-color);
  8183. text-shadow: var(--app-text-shadow);
  8184. border-radius: var(--border-radius);
  8185. box-shadow: var(--box-shadow);
  8186. color: var(--text-color-3);
  8187. background: var(--button-background);
  8188. border: var(--app-border-width) solid var(--button-border-color);
  8189. color: var(--button-text-color);
  8190. box-shadow: var(--box-shadow);
  8191. text-decoration: none;
  8192. cursor: pointer;
  8193. text-shadow: var(--app-text-shadow);
  8194. font-family: var(--font-primary);
  8195. }
  8196. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav a:not(.disabled, :disabled):hover,
  8197. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav .tab:not(.disabled, :disabled):hover {
  8198. background: var(--button-hover-background);
  8199. color: var(--button-hover-text-color);
  8200. border: var(--app-border-width) solid var(--button-hover-border-color);
  8201. box-shadow: var(--box-shadow);
  8202. }
  8203. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav a.view, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav a.selected, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav a.active,
  8204. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav .tab.view,
  8205. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav .tab.selected,
  8206. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav .tab.active {
  8207. background: var(--button-hover-background);
  8208. outline: 1px solid var(--button-focus-outline-color);
  8209. border-color: var(--button-hover-border-color);
  8210. color: var(--button-hover-text-color);
  8211. text-decoration: none !important;
  8212. font-weight: unset !important;
  8213. }
  8214. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav a.empty, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav a.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav a:disabled,
  8215. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav .tab.empty,
  8216. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav .tab.disabled,
  8217. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav .tab:disabled {
  8218. --button-background: var(--button-disabled-background);
  8219. --button-hover-background: var(--button-disabled-background);
  8220. --button-border-color: var(--button-disabled-border-color);
  8221. --button-text-color: var(--text-color-5);
  8222. }
  8223. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav a.active,
  8224. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).sheet.actor .crb-style nav.sub-nav .tab.active {
  8225. font-weight: unset;
  8226. }
  8227. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .item-image:hover i {
  8228. background: var(--color-primary-2);
  8229. color: var(--text-color-1);
  8230. text-shadow: 0px 1px 2px black;
  8231. border-radius: 2px;
  8232. }
  8233. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.lores-list input, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input {
  8234. background: var(--input-background);
  8235. border: var(--app-border-width) solid;
  8236. border-color: var(--input-border-color) !important;
  8237. color: var(--input-text-color);
  8238. box-shadow: var(--input-box-shadow) !important;
  8239. align-items: center;
  8240. border-radius: 4px;
  8241. outline: 1px solid transparent;
  8242. user-select: text;
  8243. transition: outline-color 0.5s;
  8244. }
  8245. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.lores-list input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.lores-list input:focus, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input:focus, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input:focus {
  8246. outline: 1px solid var(--input-focus-outline-color);
  8247. border: var(--app-border-width) solid;
  8248. border-color: var(--input-border-color);
  8249. color: var(--input-focus-text-color);
  8250. box-shadow: var(--box-shadow);
  8251. }
  8252. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.lores-list input.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.lores-list input:disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input:disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input:disabled {
  8253. --input-text-color: var(--text-color-disabled);
  8254. --input-background: var(--input-disabled-background);
  8255. --input-border-color: var(--input-disabled-border-color);
  8256. }
  8257. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.lores-list input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.lores-list input:disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input:disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input:disabled::placeholder {
  8258. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  8259. }
  8260. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.lores-list input::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input::placeholder {
  8261. color: var(--input-placeholder-color);
  8262. }
  8263. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.lores-list input[type=checkbox], [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill input[type=checkbox], [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill input[type=checkbox] {
  8264. outline: unset !important;
  8265. border: unset !important;
  8266. box-shadow: unset !important;
  8267. }
  8268. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input {
  8269. background: var(--input-background);
  8270. border: var(--app-border-width) solid;
  8271. border-color: var(--input-border-color) !important;
  8272. color: var(--input-text-color);
  8273. box-shadow: var(--input-box-shadow) !important;
  8274. align-items: center;
  8275. border-radius: 4px;
  8276. outline: 1px solid transparent;
  8277. user-select: text;
  8278. transition: outline-color 0.5s;
  8279. }
  8280. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input:focus {
  8281. outline: 1px solid var(--input-focus-outline-color);
  8282. border: var(--app-border-width) solid;
  8283. border-color: var(--input-border-color);
  8284. color: var(--input-focus-text-color);
  8285. box-shadow: var(--box-shadow);
  8286. }
  8287. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input:disabled {
  8288. --input-text-color: var(--text-color-disabled);
  8289. --input-background: var(--input-disabled-background);
  8290. --input-border-color: var(--input-disabled-border-color);
  8291. }
  8292. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input:disabled::placeholder {
  8293. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  8294. }
  8295. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input::placeholder {
  8296. color: var(--input-placeholder-color);
  8297. }
  8298. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography section input[type=checkbox] {
  8299. outline: unset !important;
  8300. border: unset !important;
  8301. box-shadow: unset !important;
  8302. }
  8303. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .editor {
  8304. background: var(--input-background);
  8305. border: var(--app-border-width) solid;
  8306. border-color: var(--input-border-color) !important;
  8307. color: var(--input-text-color);
  8308. box-shadow: var(--input-box-shadow) !important;
  8309. align-items: center;
  8310. border-radius: 4px;
  8311. outline: 1px solid transparent;
  8312. user-select: text;
  8313. transition: outline-color 0.5s;
  8314. height: auto;
  8315. }
  8316. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .editor:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .editor:focus {
  8317. outline: 1px solid var(--input-focus-outline-color);
  8318. border: var(--app-border-width) solid;
  8319. border-color: var(--input-border-color);
  8320. color: var(--input-focus-text-color);
  8321. box-shadow: var(--box-shadow);
  8322. }
  8323. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .editor.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .editor:disabled {
  8324. --input-text-color: var(--text-color-disabled);
  8325. --input-background: var(--input-disabled-background);
  8326. --input-border-color: var(--input-disabled-border-color);
  8327. }
  8328. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .editor.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .editor:disabled::placeholder {
  8329. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  8330. }
  8331. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .editor::placeholder {
  8332. color: var(--input-placeholder-color);
  8333. }
  8334. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .editor[type=checkbox] {
  8335. outline: unset !important;
  8336. border: unset !important;
  8337. box-shadow: unset !important;
  8338. }
  8339. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.biography .editor .tox.tox-tinymce {
  8340. background: white;
  8341. }
  8342. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style.locked.limited .sheet-body .sheet-content .tab.biography section input,
  8343. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style.locked.limited .sheet-body .sheet-content .tab.biography .editor {
  8344. --input-text-color: var(--text-color-3);
  8345. --input-focus-text-color: var(--text-color-3);
  8346. --input-background: transparent;
  8347. --input-border-color: transparent;
  8348. --input-focus-outline-color: transparent;
  8349. --box-shadow: transparent;
  8350. }
  8351. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style.locked.limited .sheet-body .sheet-content .tab.biography section input:hover,
  8352. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style.locked.limited .sheet-body .sheet-content .tab.biography .editor:hover {
  8353. outline-color: transparent;
  8354. }
  8355. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input {
  8356. background: var(--input-background);
  8357. border: var(--app-border-width) solid;
  8358. border-color: var(--input-border-color) !important;
  8359. color: var(--input-text-color);
  8360. box-shadow: var(--input-box-shadow) !important;
  8361. align-items: center;
  8362. border-radius: 4px;
  8363. outline: 1px solid transparent;
  8364. user-select: text;
  8365. transition: outline-color 0.5s;
  8366. }
  8367. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input:focus, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input:focus {
  8368. outline: 1px solid var(--input-focus-outline-color);
  8369. border: var(--app-border-width) solid;
  8370. border-color: var(--input-border-color);
  8371. color: var(--input-focus-text-color);
  8372. box-shadow: var(--box-shadow);
  8373. }
  8374. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input:disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input:disabled {
  8375. --input-text-color: var(--text-color-disabled);
  8376. --input-background: var(--input-disabled-background);
  8377. --input-border-color: var(--input-disabled-border-color);
  8378. }
  8379. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input:disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input:disabled::placeholder {
  8380. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  8381. }
  8382. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input::placeholder {
  8383. color: var(--input-placeholder-color);
  8384. }
  8385. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header input[type=checkbox], [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .uses input[type=checkbox] {
  8386. outline: unset !important;
  8387. border: unset !important;
  8388. box-shadow: unset !important;
  8389. }
  8390. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3 {
  8391. background: var(--input-background);
  8392. border: var(--app-border-width) solid;
  8393. border-color: var(--input-border-color) !important;
  8394. color: var(--input-text-color);
  8395. box-shadow: var(--input-box-shadow) !important;
  8396. align-items: center;
  8397. border-radius: 4px;
  8398. outline: 1px solid transparent;
  8399. user-select: text;
  8400. transition: outline-color 0.5s;
  8401. padding: 0.5em 0.25em;
  8402. }
  8403. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3:focus {
  8404. outline: 1px solid var(--input-focus-outline-color);
  8405. border: var(--app-border-width) solid;
  8406. border-color: var(--input-border-color);
  8407. color: var(--input-focus-text-color);
  8408. box-shadow: var(--box-shadow);
  8409. }
  8410. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3:disabled {
  8411. --input-text-color: var(--text-color-disabled);
  8412. --input-background: var(--input-disabled-background);
  8413. --input-border-color: var(--input-disabled-border-color);
  8414. }
  8415. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3:disabled::placeholder {
  8416. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  8417. }
  8418. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3::placeholder {
  8419. color: var(--input-placeholder-color);
  8420. }
  8421. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3[type=checkbox] {
  8422. outline: unset !important;
  8423. border: unset !important;
  8424. box-shadow: unset !important;
  8425. }
  8426. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .pc h3:hover {
  8427. outline: 0px transparent !important;
  8428. }
  8429. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .crb-style .details-input {
  8430. background: var(--input-background);
  8431. border: var(--app-border-width) solid;
  8432. border-color: var(--input-border-color) !important;
  8433. color: var(--input-text-color);
  8434. box-shadow: var(--input-box-shadow) !important;
  8435. align-items: center;
  8436. border-radius: 4px;
  8437. outline: 1px solid transparent;
  8438. user-select: text;
  8439. transition: outline-color 0.5s;
  8440. }
  8441. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .crb-style .details-input:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .crb-style .details-input:focus {
  8442. outline: 1px solid var(--input-focus-outline-color);
  8443. border: var(--app-border-width) solid;
  8444. border-color: var(--input-border-color);
  8445. color: var(--input-focus-text-color);
  8446. box-shadow: var(--box-shadow);
  8447. }
  8448. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .crb-style .details-input.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .crb-style .details-input:disabled {
  8449. --input-text-color: var(--text-color-disabled);
  8450. --input-background: var(--input-disabled-background);
  8451. --input-border-color: var(--input-disabled-border-color);
  8452. }
  8453. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .crb-style .details-input.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .crb-style .details-input:disabled::placeholder {
  8454. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  8455. }
  8456. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .crb-style .details-input::placeholder {
  8457. color: var(--input-placeholder-color);
  8458. }
  8459. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .crb-style .details-input[type=checkbox] {
  8460. outline: unset !important;
  8461. border: unset !important;
  8462. box-shadow: unset !important;
  8463. }
  8464. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate {
  8465. background: var(--app-background);
  8466. border: var(--app-border-width) solid var(--app-border-color);
  8467. text-shadow: var(--app-text-shadow);
  8468. border-radius: var(--border-radius);
  8469. box-shadow: var(--box-shadow);
  8470. color: var(--text-color-3);
  8471. background: var(--button-background);
  8472. border: var(--app-border-width) solid var(--button-border-color);
  8473. color: var(--button-text-color);
  8474. box-shadow: var(--box-shadow);
  8475. text-decoration: none;
  8476. cursor: pointer;
  8477. text-shadow: var(--app-text-shadow);
  8478. }
  8479. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate:not(.disabled, :disabled):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate:not(.disabled, :disabled):hover {
  8480. background: var(--button-hover-background);
  8481. color: var(--button-hover-text-color);
  8482. border: var(--app-border-width) solid var(--button-hover-border-color);
  8483. box-shadow: var(--box-shadow);
  8484. }
  8485. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate.view, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate.selected, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate.active, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate.view, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate.selected, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate.active {
  8486. background: var(--button-hover-background);
  8487. outline: 1px solid var(--button-focus-outline-color);
  8488. border-color: var(--button-hover-border-color);
  8489. color: var(--button-hover-text-color);
  8490. text-decoration: none !important;
  8491. font-weight: unset !important;
  8492. }
  8493. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate.empty, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate:disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate.empty, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions button.activate:disabled {
  8494. --button-background: var(--button-disabled-background);
  8495. --button-hover-background: var(--button-disabled-background);
  8496. --button-border-color: var(--button-disabled-border-color);
  8497. --button-text-color: var(--text-color-5);
  8498. }
  8499. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style aside .sidebar .tags .tag.edit-btn {
  8500. background: #dad8cc;
  8501. }
  8502. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .rollable .d20-svg {
  8503. filter: invert(1);
  8504. }
  8505. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .character-details .alignment select {
  8506. --input-text-color: black;
  8507. --input-background: transparent;
  8508. --input-border-color: transparent;
  8509. --box-shadow: transparent;
  8510. color: black;
  8511. }
  8512. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .label {
  8513. opacity: unset;
  8514. color: var(--text-color-5);
  8515. }
  8516. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.proficiencies-list li .modifier {
  8517. --primary: var(--accent-color);
  8518. }
  8519. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.proficiencies-list li a.skill-name:hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies ul.proficiencies-list li a.modifier:hover {
  8520. --primary: var(--accent-color-light);
  8521. }
  8522. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike {
  8523. border-image: linear-gradient(90deg, transparent, var(--color-primary-2) 20%, transparent) 1;
  8524. }
  8525. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike {
  8526. --text-dark: black;
  8527. --primary: var(--color-primary-2);
  8528. }
  8529. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .button-group button {
  8530. --primary: var(--system-primary);
  8531. --secondary: var(--system-secondary);
  8532. }
  8533. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .attack-popout select {
  8534. background: var(--input-background);
  8535. border: var(--app-border-width) solid;
  8536. border-color: var(--input-border-color) !important;
  8537. color: var(--input-text-color);
  8538. box-shadow: var(--input-box-shadow) !important;
  8539. align-items: center;
  8540. border-radius: 4px;
  8541. outline: 1px solid transparent;
  8542. user-select: text;
  8543. transition: outline-color 0.5s;
  8544. }
  8545. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .attack-popout select:not(:disabled, .disabled, [type=checkbox]):hover, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .attack-popout select:focus {
  8546. outline: 1px solid var(--input-focus-outline-color);
  8547. border: var(--app-border-width) solid;
  8548. border-color: var(--input-border-color);
  8549. color: var(--input-focus-text-color);
  8550. box-shadow: var(--box-shadow);
  8551. }
  8552. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .attack-popout select.disabled, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .attack-popout select:disabled {
  8553. --input-text-color: var(--text-color-disabled);
  8554. --input-background: var(--input-disabled-background);
  8555. --input-border-color: var(--input-disabled-border-color);
  8556. }
  8557. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .attack-popout select.disabled::placeholder, [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .attack-popout select:disabled::placeholder {
  8558. color: color-mix(in srgb, var(--input-placeholder-color) 50%, transparent);
  8559. }
  8560. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .attack-popout select::placeholder {
  8561. color: var(--input-placeholder-color);
  8562. }
  8563. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]) .attack-popout select[type=checkbox] {
  8564. outline: unset !important;
  8565. border: unset !important;
  8566. box-shadow: unset !important;
  8567. }
  8568. [data-theme][data-dorako-ui-scope=limited]:not([data-theme^=crb][data-color-scheme=light]).actor.sheet.character .attack-popout.actions ol.actions-list li.strike .item-name .item-image {
  8569. flex: 0 0 32px;
  8570. }
  8571. [data-theme][data-color-scheme=dark].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike .alt-usage .alt-usage-icon[src$=svg] {
  8572. filter: invert(1);
  8573. }
  8574. [data-theme].spellcasting-entry.preparation ol.spell-list > li.spell-level-header, [data-theme].actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header,
  8575. [data-dorako-ui-scope=limited].spellcasting-entry.preparation ol.spell-list > li.spell-level-header,
  8576. [data-dorako-ui-scope=limited].actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li.spell-level-header {
  8577. background: var(--color-secondary-5-75);
  8578. }
  8579. [data-theme].spellcasting-entry.preparation,
  8580. [data-dorako-ui-scope=limited].spellcasting-entry.preparation {
  8581. --color-border-light-2: var(--color-secondary-4);
  8582. }
  8583. [data-theme]#compendium-browser > section.window-content > .content-box .compendium-browser-settings form .setting-section, [data-theme]#license-viewer > section.window-content > .content-box .compendium-browser-settings form .setting-section, [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .filtercontainer, [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .sortcontainer, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .filtercontainer, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .sortcontainer {
  8584. background: var(--app-background);
  8585. border: var(--app-border-width) solid var(--app-border-color);
  8586. text-shadow: var(--app-text-shadow);
  8587. border-radius: var(--border-radius);
  8588. box-shadow: var(--box-shadow);
  8589. color: var(--text-color-3);
  8590. padding: 5px;
  8591. cursor: pointer;
  8592. color: var(--input-text-color);
  8593. margin-left: 2px;
  8594. }
  8595. [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .list-buttons button, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .list-buttons button {
  8596. background: var(--app-background);
  8597. border: var(--app-border-width) solid var(--app-border-color);
  8598. text-shadow: var(--app-text-shadow);
  8599. border-radius: var(--border-radius);
  8600. box-shadow: var(--box-shadow);
  8601. color: var(--text-color-3);
  8602. background: var(--button-background);
  8603. border: var(--app-border-width) solid var(--button-border-color);
  8604. color: var(--button-text-color);
  8605. box-shadow: var(--box-shadow);
  8606. text-decoration: none;
  8607. cursor: pointer;
  8608. text-shadow: var(--app-text-shadow);
  8609. padding: 5px;
  8610. margin-bottom: 5px;
  8611. }
  8612. [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .list-buttons button:not(.disabled, :disabled):hover, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .list-buttons button:not(.disabled, :disabled):hover {
  8613. background: var(--button-hover-background);
  8614. color: var(--button-hover-text-color);
  8615. border: var(--app-border-width) solid var(--button-hover-border-color);
  8616. box-shadow: var(--box-shadow);
  8617. }
  8618. [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .list-buttons button.view, [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .list-buttons button.selected, [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .list-buttons button.active, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .list-buttons button.view, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .list-buttons button.selected, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .list-buttons button.active {
  8619. background: var(--button-hover-background);
  8620. outline: 1px solid var(--button-focus-outline-color);
  8621. border-color: var(--button-hover-border-color);
  8622. color: var(--button-hover-text-color);
  8623. text-decoration: none !important;
  8624. font-weight: unset !important;
  8625. }
  8626. [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .list-buttons button.empty, [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .list-buttons button.disabled, [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .list-buttons button:disabled, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .list-buttons button.empty, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .list-buttons button.disabled, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .list-buttons button:disabled {
  8627. --button-background: var(--button-disabled-background);
  8628. --button-hover-background: var(--button-disabled-background);
  8629. --button-border-color: var(--button-disabled-border-color);
  8630. --button-text-color: var(--text-color-5);
  8631. }
  8632. [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .control-area, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .control-area {
  8633. display: flex;
  8634. flex-direction: column;
  8635. gap: 5px;
  8636. overflow-x: clip;
  8637. }
  8638. [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser .control-area > div:first-child, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser .control-area > div:first-child {
  8639. margin-top: 10px;
  8640. }
  8641. [data-theme]#compendium-browser .spell-browser .item img {
  8642. background: var(--app-background);
  8643. border: var(--app-border-width) solid var(--app-border-color);
  8644. text-shadow: var(--app-text-shadow);
  8645. border-radius: var(--border-radius);
  8646. box-shadow: var(--box-shadow);
  8647. color: var(--text-color-3);
  8648. }
  8649. [data-theme]#compendium-browser [data-tab=action] .spell-browser .item img, [data-theme]#compendium-browser [data-tab=spell] .spell-browser .item img {
  8650. background-color: white;
  8651. }
  8652. [data-theme]#compendium-browser > section.window-content > .content-box .compendium-browser-settings > nav, [data-theme]#license-viewer > section.window-content > .content-box .compendium-browser-settings > nav, [data-theme]#compendium-browser > section.window-content > .content-box > nav, [data-theme]#license-viewer > section.window-content > .content-box > nav {
  8653. --secondary: var(--color-secondary-3);
  8654. }
  8655. [data-theme]#compendium-browser > section.window-content > .content-box .spell-browser ul.result-list > li:hover, [data-theme]#license-viewer > section.window-content > .content-box .spell-browser ul.result-list > li:hover {
  8656. background-color: rgba(122, 122, 122, 0.5);
  8657. }
  8658. [data-theme].roll-modifiers-dialog {
  8659. --secondary: var(--color-secondary-3);
  8660. border: none;
  8661. }
  8662. [data-theme].roll-modifiers-dialog .window-header {
  8663. background: linear-gradient(90deg, var(--secondary) 0%, var(--color-secondary-3) 50%, var(--secondary) 100%);
  8664. color: var(--text-color-1) !important;
  8665. }
  8666. /* ----------------------------------------- */
  8667. /* Code Mirror in system */
  8668. /* ----------------------------------------- */
  8669. [data-theme][data-color-scheme=dark].pf2e.item.sheet form .tab.active.rules .rule-editing > .cm-editor, [data-theme][data-color-scheme=dark].pf2e.item.sheet form .item-rules .rule-editing > .cm-editor {
  8670. background-color: var(--input-background);
  8671. border-radius: var(--border-radius);
  8672. border: 1px solid var(--input-border-color);
  8673. color: var(--input-text-color);
  8674. }
  8675. [data-theme][data-color-scheme=dark] .ͼ2 .cm-content {
  8676. caret-color: white;
  8677. }
  8678. [data-theme][data-color-scheme=dark] .ͼ2 .cm-gutters {
  8679. background-color: var(--application-bg);
  8680. border-right: 1px solid var(--color-primary-2);
  8681. border: unset;
  8682. }
  8683. [data-theme][data-color-scheme=dark] .ͼ2 .cm-activeLineGutter {
  8684. background-color: var(--color-primary-1);
  8685. color: black;
  8686. }
  8687. [data-theme][data-color-scheme=dark] .ͼ2 .cm-activeLine {
  8688. background-color: color-mix(in srgb, var(--color-primary-2) 20%, transparent);
  8689. }
  8690. [data-theme][data-color-scheme=dark] .ͼ1.cm-focused .cm-matchingBracket {
  8691. background-color: yellow;
  8692. color: black;
  8693. border-radius: 3px;
  8694. box-shadow: 0px 2px 3px black;
  8695. }
  8696. [data-theme][data-color-scheme=dark] .ͼe {
  8697. color: red;
  8698. }
  8699. [data-theme][data-color-scheme=dark] .ͼd {
  8700. color: greenyellow;
  8701. }
  8702. [data-theme][data-color-scheme=dark] .ͼc {
  8703. color: var(--color-level-info);
  8704. }
  8705. [data-theme][data-color-scheme=dark] .ͼb {
  8706. color: rgb(217, 31, 217);
  8707. }
  8708. [data-theme][data-color-scheme=dark] .ͼ1 .cm-lintPoint:after {
  8709. border-bottom: 4px solid var(--primary-light);
  8710. }
  8711. /* ----------------------------------------- */
  8712. /* Code Mirror module */
  8713. /* ----------------------------------------- */
  8714. [data-theme] .CodeMirror {
  8715. cursor: text;
  8716. background: white;
  8717. box-shadow: var(--box-shadow);
  8718. border-radius: var(--border-radius);
  8719. }
  8720. [data-theme]#effects-panel .effect-item .effect-info .description a,
  8721. [data-theme]#effects-panel .effect-item .effect-info .description span[data-pf2-effect-area] {
  8722. color: var(--inline-text-color);
  8723. }
  8724. [data-theme]#effects-panel .effect-item .effect-info {
  8725. background: var(--app-background);
  8726. border: var(--app-border-width) solid var(--app-border-color);
  8727. text-shadow: var(--app-text-shadow);
  8728. border-radius: var(--border-radius);
  8729. box-shadow: var(--box-shadow);
  8730. color: var(--text-color-3);
  8731. background: var(--app-background);
  8732. border: var(--app-border-width) solid var(--app-border-color);
  8733. box-shadow: var(--window-app-box-shadow);
  8734. border-radius: var(--border-radius);
  8735. backdrop-filter: blur(5px);
  8736. -webkit-backdrop-filter: blur(5px);
  8737. text-shadow: 0px 1px 2px black;
  8738. min-height: 34px;
  8739. font-size: var(--font-size-20);
  8740. line-height: var(--font-size-20);
  8741. }
  8742. [data-theme]#effects-panel .effect-item .effect-info .description {
  8743. background: unset;
  8744. }
  8745. [data-theme]#effects-panel .effect-item[data-badge-type=formula] > .icon:hover::before {
  8746. border-radius: var(--border-radius);
  8747. padding: none;
  8748. background: var(--button-hover-background);
  8749. text-shadow: 0px 1px 2px black;
  8750. }
  8751. [data-theme]#effects-panel .effect-item > .icon {
  8752. border: var(--app-border-width) var(--icon-border-color);
  8753. border-radius: var(--border-radius);
  8754. --box-shadow: 0px 1px 3px 1px black;
  8755. box-shadow: var(--box-shadow);
  8756. color: var(--text-color-3);
  8757. position: relative;
  8758. }
  8759. [data-theme]#effects-panel .effect-item > .icon.aura {
  8760. border-radius: 50%;
  8761. border: 1px solid var(--color-primary-1);
  8762. box-shadow: 0px 0px 6px var(--color-primary-2), 0px 2px 8px 1px var(--color-primary-3);
  8763. }
  8764. [data-theme]#effects-panel .effect-item > .icon .linked {
  8765. color: var(--text-color-2);
  8766. background: var(--color-primary-3);
  8767. border: 1px solid var(--color-secondary-4);
  8768. border-radius: 4px 0px var(--border-radius) 0px;
  8769. border-bottom: unset;
  8770. border-right: unset;
  8771. text-shadow: 0px 1px 2px black;
  8772. }
  8773. [data-theme]#effects-panel .effect-item > .icon .value-wrapper {
  8774. background: none;
  8775. bottom: -1px;
  8776. left: -3px;
  8777. }
  8778. [data-theme]#effects-panel .effect-item > .icon .value-wrapper .value {
  8779. padding: 2px;
  8780. color: var(--text-color-2);
  8781. background: var(--color-primary-3);
  8782. border-radius: 0px 4px 0px var(--border-radius);
  8783. border: 1px solid var(--color-secondary-4);
  8784. border-bottom: unset;
  8785. border-left: unset;
  8786. text-shadow: 0px 1px 2px black;
  8787. }
  8788. [data-theme]#effects-panel .effect-item > .icon .expired {
  8789. position: absolute;
  8790. left: auto;
  8791. width: 80%;
  8792. width: unset;
  8793. padding: 2px 1px;
  8794. color: var(--text-color-1);
  8795. background: var(--color-primary-2);
  8796. border: 1px solid var(--color-primary-1);
  8797. text-shadow: 0px 1px 2px black;
  8798. border-radius: 0px 0px 4px 4px;
  8799. }
  8800. /* ----------------------------------------- */
  8801. /* Map v1 styling to v2 values */
  8802. /* ----------------------------------------- */
  8803. [data-theme^=crb][data-color-scheme=dark] {
  8804. --color-border-light-highlight: black;
  8805. --color-text-dark-primary: var(--text-color-3);
  8806. --color-text-dark-secondary: var(--text-color-5);
  8807. --color-bg-option: black;
  8808. --accent-text-color: black;
  8809. --accent-color-light: var(--tertiary);
  8810. --accent-color: var(--tertiary-dark);
  8811. --accent-color-dark: var(--gold-brown);
  8812. }
  8813. /* ----------------------------------------- */
  8814. /* Limited */
  8815. /* ----------------------------------------- */
  8816. [data-theme^=crb][data-color-scheme=dark][data-dorako-ui-scope=limited] {
  8817. --input-background: var(--glass-bg);
  8818. --color-primary-2: var(--tertiary-dark);
  8819. --color-secondary-5-75: rgba(0, 0, 0, 0.5);
  8820. --color-border-light-2: black;
  8821. --button-hover-text-color: black;
  8822. }
  8823. /* ----------------------------------------- */
  8824. /* Unlimited */
  8825. /* ----------------------------------------- */
  8826. [data-theme^=crb][data-color-scheme=dark][data-dorako-ui-scope=unlimited] .tagify,
  8827. [data-theme^=crb][data-color-scheme=dark][data-dorako-ui-scope=unlimited] select,
  8828. [data-theme^=crb][data-color-scheme=dark][data-dorako-ui-scope=unlimited] input,
  8829. [data-theme^=crb][data-color-scheme=dark][data-dorako-ui-scope=unlimited] button {
  8830. --app-background: var(--glass-bg-light);
  8831. --input-border-color: transparent;
  8832. --input-background: var(--glass-bg);
  8833. --input-focus-outline-color: var(--tertiary);
  8834. --input-box-shadow: var(--glassy);
  8835. }
  8836. /* ----------------------------------------- */
  8837. /* General */
  8838. /* ----------------------------------------- */
  8839. [data-theme^=crb][data-color-scheme=dark] {
  8840. --sheet: var(--sheet-dark);
  8841. --ornamentation: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1{stroke:wheat;stroke-miterlimit:10}.st1,.st2{fill:none}%3C/style%3E%3Cg opacity='1'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zm3.1 3.1h3.1v3.1H3.6zm3.2 0h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zm0 0H.5V13M13 .5H6.8v3.1M29.4.5h3.1v3.1h-3.1zm-3.1 3.1h3.1v3.1h-3.1zm0 3.2h3.1v3.1h-3.1zm-3.2-3.2h3.1v3.1h-3.1zm3.2 0V.5H20M32.5 13V6.8h-3.1M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zm-3.2 0h3.1v3.1h-3.1zm3.2-3.2h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zm3.1-3.1h3.1v3.1H3.6zm0-3.2h3.1v3.1H3.6zm3.2 3.2h3.1v3.1H6.8zM6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  8842. --color-secondary-4: #26231f;
  8843. --text-color-1: color-mix(in srgb, var(--color-text-light-highlight), 20% white)
  8844. --text-color-2: var(--color-text-light-highlight);
  8845. --text-color-3: var(--color-text-light-heading);
  8846. --text-color-5: color-mix(in srgb, var(--color-text-light-heading), 20% black);
  8847. --window-app-background: var(--sheet-dark);
  8848. --app-background: var(--glass-bg);
  8849. --app-border-width: 0px;
  8850. --input-text-color: var(--text-color-3);
  8851. --input-background: var(--glass-bg);
  8852. --input-border-color: transparent;
  8853. --input-focus-text-color: var(--text-color-2);
  8854. --input-placeholder-color: var(--text-color-5);
  8855. --input-disabled-background: black;
  8856. --input-disabled-border-color: black;
  8857. --button-bright-text-color: black;
  8858. --color-border-medium: var(--tertiary) !important;
  8859. --color-border-divider: var(--tertiary) !important;
  8860. --bg: rgba(0, 0, 0, 0.5);
  8861. --fieldset-border-color: var(--tertiary);
  8862. --fieldset-background-color: transparent;
  8863. --fieldset-legend-color: var(--text-color-2);
  8864. --text-dark: var(--text-color-2);
  8865. }
  8866. [data-theme^=crb][data-color-scheme=dark] input[type=range] + .range-value {
  8867. color: black;
  8868. text-shadow: none;
  8869. font-weight: 800;
  8870. --input-focus-text-color: black;
  8871. }
  8872. /* ----------------------------------------- */
  8873. /* PF2e sheets */
  8874. /* ----------------------------------------- */
  8875. [data-theme^=crb][data-color-scheme=dark] {
  8876. /* ----------------------------------------- */
  8877. /* NPC sheet */
  8878. /* ----------------------------------------- */
  8879. /* ----------------------------------------- */
  8880. /* Actor sheet */
  8881. /* ----------------------------------------- */
  8882. }
  8883. [data-theme^=crb][data-color-scheme=dark] .tags .tag.tag_transparent,
  8884. [data-theme^=crb][data-color-scheme=dark] .tags .tag option.tag_transparent {
  8885. box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);
  8886. }
  8887. [data-theme^=crb][data-color-scheme=dark].sheet.pf2e.actor.npc.app {
  8888. --section-background: var(--sheet-dark);
  8889. --section-header: var(--primary);
  8890. --section-border-color: var(--tertiary);
  8891. --section-outline-color: var(--gold-brown);
  8892. --section-header-text-color: var(--text-color-2);
  8893. --tag-border-color: var(--text-color-5);
  8894. --tag-background-color: var(--color-secondary-4);
  8895. --tag-text-color: var(--text-color-4);
  8896. --color-text-dark-input: var(--text-color-3);
  8897. --input-background: rgba(0, 0, 0, 0.1);
  8898. --input-focus-outline-color: var(--tertiary);
  8899. --text-dark: var(--text-color-2);
  8900. }
  8901. [data-theme^=crb][data-color-scheme=dark].sheet.pf2e.actor.npc.app.dorako-ux.sheet.pf2e.actor.npc form .side-bar-section, [data-theme^=crb][data-color-scheme=dark].sheet.pf2e.actor.npc.app.dorako-ux.sheet.pf2e.actor.npc form .section-container:not(.headerless) {
  8902. background-image: var(--sheet);
  8903. }
  8904. [data-theme^=crb][data-color-scheme=dark].sheet.pf2e.actor.npc.app input {
  8905. --box-shadow: none;
  8906. }
  8907. [data-theme^=crb][data-color-scheme=dark].actor.sheet .crb-style .sheet-body {
  8908. --text-dark: var(--text-color-2);
  8909. --color-border-light-primary: var(--tertiary);
  8910. --color-border-light-highlight: var(--tertiary);
  8911. --sub: var(--text-color-disabled);
  8912. --alt: var(--text-color-5);
  8913. --bg: rgba(0, 0, 0, 0.5);
  8914. }
  8915. [data-theme^=crb][data-color-scheme=dark].actor.sheet .inventory .list-row .item-controls, [data-theme^=crb][data-color-scheme=dark].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .feat-slot-title, [data-theme^=crb][data-color-scheme=dark].actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h4:hover, [data-theme^=crb][data-color-scheme=dark].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .skill-score {
  8916. --secondary: var(--tertiary);
  8917. --fa-inverse: black;
  8918. }
  8919. [data-theme^=crb][data-color-scheme=dark].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill, [data-theme^=crb][data-color-scheme=dark].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill, [data-theme^=crb][data-color-scheme=dark].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill {
  8920. --primary: var(--tertiary);
  8921. }
  8922. [data-theme^=crb][data-color-scheme=dark].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item, [data-theme^=crb][data-color-scheme=dark].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action, [data-theme^=crb][data-color-scheme=dark].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike {
  8923. border-image: linear-gradient(90deg, transparent, var(--tertiary) 20%, transparent) 1;
  8924. }
  8925. /* ----------------------------------------- */
  8926. /* Chat messages */
  8927. /* ----------------------------------------- */
  8928. [data-theme^=crb][data-color-scheme=dark].chat-message button {
  8929. --button-background: var(--glass-bg);
  8930. }
  8931. [data-theme^=crb][data-color-scheme=dark].chat-message .dice-roll .dice-formula button, [data-theme^=crb][data-color-scheme=dark].chat-message .dice-roll .dice-total button {
  8932. background: var(--glass-bg-light);
  8933. --button-text-color: var(--text-color-2);
  8934. }
  8935. [data-theme^=crb][data-color-scheme=dark].chat-message .dice-roll .dice-formula button:hover, [data-theme^=crb][data-color-scheme=dark].chat-message .dice-roll .dice-total button:hover {
  8936. --button-hover-text-color: var(--text-color-1);
  8937. background: var(--glass-bg);
  8938. }
  8939. /* ----------------------------------------- */
  8940. /* Map v1 styling to v2 values */
  8941. /* ----------------------------------------- */
  8942. [data-theme^=crb][data-color-scheme=light] {
  8943. --color-border-highlight: var(--accent-color);
  8944. --color-border-highlight-alt: var(--accent-color-dark);
  8945. --color-text-dark-primary: var(--text-color-3);
  8946. --color-text-dark-secondary: var(--text-color-5);
  8947. --color-bg-option: white;
  8948. }
  8949. /* ----------------------------------------- */
  8950. /* Light theme */
  8951. /* ----------------------------------------- */
  8952. [data-theme^=crb][data-color-scheme=light] {
  8953. --accent-text-color: white;
  8954. --accent-color-light: var(--primary-light);
  8955. --accent-color: var(--primary-light);
  8956. --accent-color-dark: var(--primary);
  8957. }
  8958. [data-theme^=crb][data-color-scheme=light].window-app button.bright {
  8959. --button-background: var(--accent-color);
  8960. --button-border-color: var(--accent-color-dark);
  8961. --button-text-color: white !important;
  8962. --button-hover-text-color: white !important;
  8963. --app-text-shadow: none;
  8964. }
  8965. [data-theme^=crb][data-color-scheme=light] input[type=range] + .range-value {
  8966. border: none;
  8967. }
  8968. /* ----------------------------------------- */
  8969. /* PF2e sheets */
  8970. /* ----------------------------------------- */
  8971. [data-theme^=crb][data-color-scheme=light] {
  8972. --sheet: var(--sheet-light);
  8973. --ornamentation: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1%7Bstroke:%23231f20;stroke-miterlimit:10%7D.st1,.st2%7Bfill:none%7D%3C/style%3E%3Cg opacity='.25'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cg%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zM3.6 3.6h3.1v3.1H3.6zM6.8 3.6h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zM3.6 6.8H.5V13M13 .5H6.8v3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M29.4.5h3.1v3.1h-3.1zM26.3 3.6h3.1v3.1h-3.1zM26.3 6.8h3.1v3.1h-3.1zM23.1 3.6h3.1v3.1h-3.1zM26.3 3.6V.5H20'/%3E%3Cpath class='st1' d='M32.5 13V6.8h-3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zM23.1 26.3h3.1v3.1h-3.1zM26.3 23.1h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zM3.6 26.3h3.1v3.1H3.6zM3.6 23.1h3.1v3.1H3.6zM6.8 26.3h3.1v3.1H6.8z'/%3E%3Cpath class='st1' d='M6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  8974. --window-app-background: var(--sheet);
  8975. --window-app-border-color: var(--tertiary);
  8976. --window-app-border-width: 1px;
  8977. --color-text-dark-primary: #191813;
  8978. --color-text-dark-secondary: #4b4a44;
  8979. --color-secondary-5-75: rgba(96, 88, 86, 0.25);
  8980. --app-background: rgba(255, 255, 255, 0.5);
  8981. --app-border-color: transparent;
  8982. --app-border-width: none;
  8983. --app-text-shadow: none;
  8984. --button-text-color: black;
  8985. --box-shadow: var(--gold-and-glow);
  8986. --button-focus-outline-color: transparent;
  8987. --input-disabled-background: rgba(255, 255, 255, 0.2);
  8988. --input-disabled-border-color: transparent;
  8989. --window-app-box-shadow: 0px 5px 20px 3px black;
  8990. --fieldset-border-color: gray;
  8991. --fieldset-background-color: transparent;
  8992. --fieldset-legend-color: black;
  8993. /* ----------------------------------------- */
  8994. /* Familiar sheet */
  8995. /* ----------------------------------------- */
  8996. /* ----------------------------------------- */
  8997. /* NPC sheet */
  8998. /* ----------------------------------------- */
  8999. }
  9000. [data-theme^=crb][data-color-scheme=light] tagify,
  9001. [data-theme^=crb][data-color-scheme=light] select,
  9002. [data-theme^=crb][data-color-scheme=light] input {
  9003. --input-border-color: var(--color-text-light-5);
  9004. --input-text-color: var(--color-text-dark-input);
  9005. --input-focus-text-color: var(--color-text-dark-input);
  9006. --input-background: rgba(255, 255, 255, 0.5);
  9007. --input-focus-outline-color: var(--primary-light);
  9008. --input-placeholder-color: var(--color-text-dark-secondary);
  9009. --app-border-width: 1px;
  9010. --box-shadow: none;
  9011. }
  9012. [data-theme^=crb][data-color-scheme=light] #context-menu {
  9013. --app-background: var(--glass-bg);
  9014. color: var(--color-text-light-heading);
  9015. }
  9016. [data-theme^=crb][data-color-scheme=light].chat-message button, [data-theme^=crb][data-color-scheme=light].window-app button, [data-theme^=crb][data-color-scheme=light].package-configuration aside.sidebar nav.tabs .category-tab {
  9017. --box-shadow: none;
  9018. --app-border-width: 1px;
  9019. --button-border-color: var(--color-text-light-5);
  9020. --button-background: rgba(255, 255, 255, 0.5);
  9021. --button-text-color: black;
  9022. text-shadow: none;
  9023. }
  9024. [data-theme^=crb][data-color-scheme=light].pf2e.item.sheet form .sheet-body input[type=text]:not(:disabled), [data-theme^=crb][data-color-scheme=light].pf2e.item.sheet form .sheet-body input[type=number]:not(:disabled) {
  9025. --input-background: rgba(0, 0, 0, 0.05);
  9026. --input-border-color: var(--color-text-light-5);
  9027. }
  9028. [data-theme^=crb][data-color-scheme=light] .tagify,
  9029. [data-theme^=crb][data-color-scheme=light] input {
  9030. --input-background: rgba(0, 0, 0, 0.05);
  9031. --input-border-color: transparent;
  9032. }
  9033. [data-theme^=crb][data-color-scheme=light].sheet.hazard .section-container .section-header input, [data-theme^=crb][data-color-scheme=light].sheet.hazard .section-container.publication .section-body input[type=text] {
  9034. --input-text-color: var(--text-color-2);
  9035. --input-focus-text-color: var(--text-color-1);
  9036. }
  9037. [data-theme^=crb][data-color-scheme=light] .directory .directory-header .header-search input {
  9038. --input-border-color: var(--color-text-light-5);
  9039. --input-text-color: var(--color-text-dark-input);
  9040. --input-focus-text-color: var(--color-text-dark-input);
  9041. --input-background: rgba(255, 255, 255, 0.5);
  9042. --input-focus-outline-color: var(--primary-light);
  9043. }
  9044. [data-theme^=crb][data-color-scheme=light].chat-message {
  9045. color: black;
  9046. --ornamentation: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1%7Bstroke:%23231f20;stroke-miterlimit:10%7D.st1,.st2%7Bfill:none%7D%3C/style%3E%3Cg opacity='.25'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cg%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zM3.6 3.6h3.1v3.1H3.6zM6.8 3.6h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zM3.6 6.8H.5V13M13 .5H6.8v3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M29.4.5h3.1v3.1h-3.1zM26.3 3.6h3.1v3.1h-3.1zM26.3 6.8h3.1v3.1h-3.1zM23.1 3.6h3.1v3.1h-3.1zM26.3 3.6V.5H20'/%3E%3Cpath class='st1' d='M32.5 13V6.8h-3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zM23.1 26.3h3.1v3.1h-3.1zM26.3 23.1h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zM3.6 26.3h3.1v3.1H3.6zM3.6 23.1h3.1v3.1H3.6zM6.8 26.3h3.1v3.1H6.8z'/%3E%3Cpath class='st1' d='M6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  9047. --app-background: rgba(255, 255, 255, 0.2);
  9048. --app-background: rgba(0, 0, 0, 0.1);
  9049. --app-border-width: 1px;
  9050. --box-shadow: 0px 0px 0px 1px var(--gold-brown);
  9051. --app-text-shadow: none;
  9052. }
  9053. [data-theme^=crb][data-color-scheme=light].chat-message hr {
  9054. --app-border-color: #23231f20;
  9055. }
  9056. [data-theme^=crb][data-color-scheme=light].chat-message button {
  9057. --button-hover-text-color: white;
  9058. }
  9059. [data-theme^=crb][data-color-scheme=light].chat-message button:hover {
  9060. outline: 1px solid var(--gold-brown);
  9061. }
  9062. [data-theme^=crb][data-color-scheme=light].chat-message .message-content {
  9063. text-shadow: unset;
  9064. --text-color-1: black;
  9065. --text-color-2: black;
  9066. --text-color-3: black;
  9067. text-shadow: 0px 1px 0px white;
  9068. color: black;
  9069. }
  9070. [data-theme^=crb][data-color-scheme=light].chat-message .message-content .dice-roll {
  9071. --app-border-color: var(--tertiary);
  9072. }
  9073. [data-theme^=crb][data-color-scheme=light].chat-message .message-content .dice-roll .dice-total button,
  9074. [data-theme^=crb][data-color-scheme=light].chat-message .message-content .dice-roll .dice-formula button {
  9075. --button-border-color: var(--alt-dark);
  9076. --button-background: var(--alt);
  9077. --button-text-color: white;
  9078. --app-text-shadow: none;
  9079. --button-focus-outline-color: transparent;
  9080. --button-hover-background: var(--tertiary-dark);
  9081. --button-hover-border-color: var(--gold-brown);
  9082. }
  9083. [data-theme^=crb][data-color-scheme=light].chat-message .message-content .dice-roll .part-total {
  9084. --app-border-color: var(--color-text-light-6);
  9085. }
  9086. [data-theme^=crb][data-color-scheme=light]:not([data-dorako-ui-scope=limited], .journal-sheet).window-app .window-header {
  9087. color: black;
  9088. text-shadow: none;
  9089. }
  9090. [data-theme^=crb][data-color-scheme=light].journal-entry-page.window-app .window-header {
  9091. color: black;
  9092. text-shadow: none;
  9093. }
  9094. [data-theme^=crb][data-color-scheme=light].sheet.familiar .section-container {
  9095. color: black;
  9096. --app-background: rgba(255, 255, 255, 0.2);
  9097. --app-border-width: 1px;
  9098. --app-border-color: var(--tertiary);
  9099. --box-shadow: 0px 0px 0px 1px var(--gold-brown);
  9100. --app-text-shadow: none;
  9101. }
  9102. [data-theme^=crb][data-color-scheme=light].sheet.pf2e.actor.npc.app {
  9103. --section-background: var(--sheet-light);
  9104. --section-header: var(--primary);
  9105. --section-border-color: var(--tertiary);
  9106. --section-outline-color: var(--gold-brown);
  9107. --section-header-text-color: var(--text-color-2);
  9108. --tag-border-color: black;
  9109. --tag-background-color: transparent;
  9110. --tag-text-color: black;
  9111. --color-text-dark-input: black;
  9112. --input-border-color: transparent;
  9113. --input-background: rgba(0, 0, 0, 0.1);
  9114. --input-focus-outline-color: var(--tertiary);
  9115. --input-placeholder-color: rgba(40, 40, 40, 1);
  9116. --text-dark: black;
  9117. --contrastive-transparent: rgba(0, 0, 0, 0.5);
  9118. --text-color-3: var(--color-text-dark-primary);
  9119. --app-text-shadow: none;
  9120. }
  9121. [data-theme^=crb][data-color-scheme=light].sheet.pf2e.actor.npc.app.dorako-ux.sheet.pf2e.actor.npc form .side-bar-section, [data-theme^=crb][data-color-scheme=light].sheet.pf2e.actor.npc.app.dorako-ux.sheet.pf2e.actor.npc form .section-container:not(.headerless) {
  9122. background-image: var(--sheet);
  9123. }
  9124. [data-theme^=crb][data-color-scheme=light].sheet.pf2e.actor.npc.app .side-bar-section-header input {
  9125. --input-focus-outline-color: var(--tertiary);
  9126. }
  9127. [data-theme^=crb][data-color-scheme=light].sheet.pf2e.actor.npc.app .window-header {
  9128. color: black;
  9129. text-shadow: none;
  9130. }
  9131. [data-theme^=crb][data-color-scheme=light].sheet.pf2e.actor.npc.app.actor.npc.sheet form .side-bar-section.initiative select {
  9132. --box-shadow: none;
  9133. }
  9134. [data-theme^=crb][data-color-scheme=light].sheet.pf2e.actor.npc.app input {
  9135. --box-shadow: none;
  9136. }
  9137. /* ----------------------------------------- */
  9138. /* Theme colors */
  9139. /* ----------------------------------------- */
  9140. :root {
  9141. --discord-border-color: transparent;
  9142. --discord-background-1: #383a3f;
  9143. --discord-background-2: #313338;
  9144. --discord-background-3: #2b2d31;
  9145. --discord-background-4: #1e1f22;
  9146. --discord-text-1: #ffffff;
  9147. --discord-text-2: #dcdee1;
  9148. --discord-text-3: #b6bac0;
  9149. --discord-text-4: #959ba3;
  9150. --discord-text-5: #79818a;
  9151. --discord-accent-text-color: #8e97fe;
  9152. --discord-accent-color: #5a65ea;
  9153. --discord-accent-color-dark: #4952bd;
  9154. --discord-scrollbar-thumb-background: #1a1b1e;
  9155. --discord-scrollbar-thumb-border-color: transparent;
  9156. --discord-green: #417e4c;
  9157. --discord-attention: #e6b44e;
  9158. --discord-red: #df4f4a;
  9159. }
  9160. /* ----------------------------------------- */
  9161. /* Map v1 styling to v2 values */
  9162. /* ----------------------------------------- */
  9163. [data-theme^=discord] {
  9164. --color-border-light-highlight: var(--discord-background-1);
  9165. --color-border-light-primary: var(--discord-background-2);
  9166. --color-text-hyperlink: var(--accent-color);
  9167. --color-text-light-highlight: var(--text-color-2);
  9168. --color-border-highlight: var(--accent-color);
  9169. --color-border-highlight-alt: var(--accent-color-dark);
  9170. --color-border-divider: var(--discord-border-color);
  9171. --color-text-dark-primary: var(--discord-text-3);
  9172. --color-text-dark-secondary: var(--discord-text-5);
  9173. }
  9174. /* ----------------------------------------- */
  9175. /* Light color scheme */
  9176. /* ----------------------------------------- */
  9177. [data-theme^=discord][data-dorako-ui-scope=limited][data-color-scheme=light],
  9178. [data-theme^=discord][data-color-scheme=light] {
  9179. --discord-scrollbar-thumb-background: #c5c9cd;
  9180. --app-background: #f2f3f5;
  9181. --window-app-background: #ffffff;
  9182. --input-background: #ebedef;
  9183. --input-text-color: #4e5057;
  9184. --button-background: #c5c9cd;
  9185. --button-text-color: black;
  9186. --fieldset-legend-color: black;
  9187. --text-color-1: var(--discord-text-5);
  9188. --text-color-2: var(--discord-text-4);
  9189. --text-color-2: black;
  9190. --text-color-3: var(--discord-text-3);
  9191. --text-color-4: var(--discord-text-2);
  9192. --text-color-5: var(--discord-text-1);
  9193. --inline-background: #e6e8fc;
  9194. --inline-text-color: var(--accent-color);
  9195. --inline-icon-color: var(--accent-color);
  9196. }
  9197. [data-theme^=discord][data-dorako-ui-scope=limited][data-color-scheme=light].sheet.pf2e.actor.npc.app,
  9198. [data-theme^=discord][data-color-scheme=light].sheet.pf2e.actor.npc.app {
  9199. --section-background: var(--window-app-background);
  9200. --section-header: var(--discord-accent-color);
  9201. --section-border-color: var(--discord-accent-text-color);
  9202. --section-outline-color: var(--discord-accent-color-dark);
  9203. --section-header-text-color: white;
  9204. --tag-border-color: transparent;
  9205. --tag-background-color: white;
  9206. --tag-text-color: black;
  9207. --color-text-dark-input: black;
  9208. --input-placeholder-color: var(--discord-text-5);
  9209. --color-border-light-highlight: var(--discord-background-1);
  9210. --color-border-light-primary: var(--discord-background-2);
  9211. --color-border-light-tertiary: var(--discord-green);
  9212. --text-dark: black;
  9213. }
  9214. [data-theme^=discord][data-dorako-ui-scope=limited][data-color-scheme=light] ::-webkit-scrollbar-track,
  9215. [data-theme^=discord][data-color-scheme=light] ::-webkit-scrollbar-track {
  9216. background: #ebedef;
  9217. }
  9218. [data-theme^=discord][data-dorako-ui-scope=limited][data-color-scheme=light].actor.sheet.character,
  9219. [data-theme^=discord][data-color-scheme=light].actor.sheet.character {
  9220. --text-color-5: var(--discord-text-4);
  9221. }
  9222. [data-theme^=discord][data-dorako-ui-scope=limited][data-color-scheme=light].actor.sheet .crb-style .sheet-body,
  9223. [data-theme^=discord][data-color-scheme=light].actor.sheet .crb-style .sheet-body {
  9224. --color-border-divider: var(--discord-background-1);
  9225. }
  9226. [data-theme^=discord][data-dorako-ui-scope=limited][data-color-scheme=light] .tagify,
  9227. [data-theme^=discord][data-color-scheme=light] .tagify {
  9228. --text-color-2: white;
  9229. }
  9230. [data-theme^=discord][data-dorako-ui-scope=limited][data-color-scheme=light].chat-message,
  9231. [data-theme^=discord][data-color-scheme=light].chat-message {
  9232. --text-color-1: black;
  9233. --text-color-2: black;
  9234. --text-color-3: black;
  9235. }
  9236. /* ----------------------------------------- */
  9237. /* Dark color scheme */
  9238. /* ----------------------------------------- */
  9239. [data-theme^=discord][data-dorako-ui-scope=limited][data-color-scheme=dark].sheet.pf2e.actor.npc.app,
  9240. [data-theme^=discord][data-color-scheme=dark].sheet.pf2e.actor.npc.app {
  9241. --section-background: var(--discord-background-4);
  9242. --section-header: var(--discord-accent-color);
  9243. --section-border-color: var(--discord-accent-text-color);
  9244. --section-outline-color: var(--discord-accent-color-dark);
  9245. --section-header-text-color: var(--text-color-2);
  9246. --tag-border-color: var(--discord-green);
  9247. --tag-background-color: var(--discord-background-3);
  9248. --tag-text-color: var(--discord-text-3);
  9249. --color-text-dark-input: var(--discord-text-2);
  9250. --input-placeholder-color: var(--discord-text-5);
  9251. --color-border-light-highlight: var(--discord-background-1);
  9252. --color-border-light-primary: var(--discord-background-2);
  9253. --color-border-light-tertiary: var(--discord-green);
  9254. --text-dark: var(--text-color-2);
  9255. }
  9256. [data-theme^=discord][data-dorako-ui-scope=limited][data-color-scheme=dark].actor.sheet .crb-style .sheet-body,
  9257. [data-theme^=discord][data-color-scheme=dark].actor.sheet .crb-style .sheet-body {
  9258. --color-border-divider: var(--discord-background-1);
  9259. --text-dark: var(--discord-text-2);
  9260. }
  9261. /* ----------------------------------------- */
  9262. /* App UI */
  9263. /* ----------------------------------------- */
  9264. [data-theme^=discord]:not([data-color-scheme]) {
  9265. --app-border-width: 1px;
  9266. --app-background: var(--discord-background-3);
  9267. --app-border-color: var(--discord-background-2);
  9268. --window-app-border-color: #4b4c4f;
  9269. --button-background: var(--discord-background-4);
  9270. --button-border-color: var(--discord-background-1);
  9271. --button-focus-outline-color: var(--accent-color);
  9272. --input-box-shadow: none;
  9273. --input-background: var(--discord-background-1);
  9274. --input-text-color: var(--discord-text-3);
  9275. --input-focus-text-color: var(--discord-text-2);
  9276. --box-shadow: 0px 0px 10px black, 0px 0px 5px black;
  9277. }
  9278. /* ----------------------------------------- */
  9279. /* DUI variables */
  9280. /* ----------------------------------------- */
  9281. [data-chat-interface-theme^=discord] #sidebar-tabs,
  9282. [data-chat-interface-theme^=discord] #chat-log ~ *,
  9283. [data-theme^=discord] {
  9284. /* Base colors */
  9285. --color-primary-4: var(--accent-color-dark);
  9286. --color-primary-1: var(--discord-accent-text-color);
  9287. --color-primary-2: var(--discord-accent-color);
  9288. --color-primary-3: var(--discord-accent-color-dark);
  9289. --color-secondary-1: color-mix(in srgb, var(--discord-green) 90%, white);
  9290. --color-secondary-2: var(--discord-green);
  9291. --color-secondary-3: color-mix(in srgb, var(--discord-green) 90%, black);
  9292. --color-secondary-3-75: var(--color-secondary-3);
  9293. --color-secondary-4: color-mix(in srgb, var(--discord-green) 50%, black);
  9294. --color-secondary-5-75: #4e5057;
  9295. --text-color-1: var(--discord-text-1);
  9296. --text-color-2: var(--discord-text-2);
  9297. --text-color-3: var(--discord-text-3);
  9298. --text-color-4: var(--discord-text-4);
  9299. --text-color-5: var(--discord-text-5);
  9300. /* Misc variables */
  9301. --ornamentation: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1{stroke:wheat;stroke-miterlimit:10}.st1,.st2{fill:none}%3C/style%3E%3Cg opacity='1'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zm3.1 3.1h3.1v3.1H3.6zm3.2 0h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zm0 0H.5V13M13 .5H6.8v3.1M29.4.5h3.1v3.1h-3.1zm-3.1 3.1h3.1v3.1h-3.1zm0 3.2h3.1v3.1h-3.1zm-3.2-3.2h3.1v3.1h-3.1zm3.2 0V.5H20M32.5 13V6.8h-3.1M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zm-3.2 0h3.1v3.1h-3.1zm3.2-3.2h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zm3.1-3.1h3.1v3.1H3.6zm0-3.2h3.1v3.1H3.6zm3.2 3.2h3.1v3.1H6.8zM6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  9302. --box-shadow: none;
  9303. --icon-border-color: var(--discord-attention);
  9304. /* Window app variables */
  9305. --window-app-background: var(--discord-background-3);
  9306. --window-app-border-color: #4b4c4f;
  9307. --window-app-border-width: 1px;
  9308. --window-app-box-shadow: 0px 5px 20px 3px black, 0px 3px 10px 3px rgba(0, 0, 0, 0.5);
  9309. /* App variables */
  9310. --app-background: #161511aa;
  9311. --app-border-color: var(--discord-border-color);
  9312. --app-border-width: 0px;
  9313. --app-text-shadow: none;
  9314. /* Inline variables */
  9315. --inline-box-shadow: none;
  9316. --inline-background: #3d426e;
  9317. --inline-border-color: transparent;
  9318. --inline-text-color: #cacdf7;
  9319. --inline-icon-color: #cacdf7;
  9320. /* Input variables */
  9321. --input-border-color: transparent;
  9322. --input-disabled-background: #494b51;
  9323. --input-disabled-border-color: transparent;
  9324. --input-border-color: transparent;
  9325. --input-background: var(--discord-background-1);
  9326. --input-focus-outline-color: var(--discord-accent-color);
  9327. --input-placeholder-color: color-mix(in srgb, var(--button-text-color) 50%, transparent);
  9328. /* Button variables */
  9329. --button-background: var(--app-background);
  9330. --button-border-color: transparent;
  9331. --button-text-color: var(--discord-text-2);
  9332. --button-focus-outline-color: transparent;
  9333. --button-hover-background: var(--discord-background-1);
  9334. --button-hover-border-color: transparent;
  9335. --button-hover-text-color: var(--discord-text-1);
  9336. --button-disabled-background: #494b51;
  9337. --button-disabled-border-color: transparent;
  9338. --button-toggle-border-color: var(--discord-green);
  9339. --button-toggle-hover-border-color: color-mix(in srgb, var(--discord-green) 50%, white 50%);
  9340. --button-toggle-background: color-mix(in srgb, var(--discord-green) 50%, black 50%);
  9341. --button-toggle-hover-background: var(--discord-green);
  9342. --button-bright-text-color: white;
  9343. /* Fieldset variables */
  9344. --fieldset-border-color: transparent;
  9345. --fieldset-background-color: color-mix(in srgb, var(--discord-attention) 15%, transparent);
  9346. --fieldset-legend-color: var(--discord-text-4);
  9347. /* Scrollbar and accent variables */
  9348. --scrollbar-thumb-background: #1a1b1e;
  9349. --scrollbar-thumb-border-color: var(--discord-scrollbar-thumb-border-color);
  9350. --accent-text-color: var(--discord-text-1);
  9351. --accent-color-light: var(--discord-accent-text-color);
  9352. --accent-color: var(--discord-accent-color);
  9353. --accent-color-dark: var(--discord-accent-color-dark);
  9354. }
  9355. [data-chat-interface-theme^=discord] #sidebar-tabs.window-app button.bright,
  9356. [data-chat-interface-theme^=discord] #chat-log ~ *.window-app button.bright,
  9357. [data-theme^=discord].window-app button.bright {
  9358. --button-background: var(--accent-color);
  9359. --button-border-color: var(--accent-color-dark);
  9360. --button-text-color: white !important;
  9361. --button-hover-text-color: white !important;
  9362. --app-text-shadow: none;
  9363. }
  9364. [data-chat-interface-theme^=discord] #sidebar-tabs ::-webkit-scrollbar-track,
  9365. [data-chat-interface-theme^=discord] #chat-log ~ * ::-webkit-scrollbar-track,
  9366. [data-theme^=discord] ::-webkit-scrollbar-track {
  9367. background: #2b2d31;
  9368. }
  9369. /* ----------------------------------------- */
  9370. /* System variables */
  9371. /* ----------------------------------------- */
  9372. [data-theme^=discord] {
  9373. --color-text-dark-primary: var(--text-color-2);
  9374. --bg: rgba(0, 0, 0, 0.25);
  9375. --color-underline-header: var(--discord-green);
  9376. }
  9377. /* ----------------------------------------- */
  9378. /* Specifics */
  9379. /* ----------------------------------------- */
  9380. [data-theme^=discord].window-app .window-header {
  9381. text-shadow: none;
  9382. color: var(--text-color-2);
  9383. }
  9384. [data-theme^=discord]#effects-panel .effect-item > .icon {
  9385. --border-radius: 50%;
  9386. }
  9387. [data-theme^=discord]#effects-panel .effect-item > .icon.aura {
  9388. border-radius: 33%;
  9389. transform: scale(0.8);
  9390. }
  9391. [data-theme^=discord] section.tab.category.active[data-tab=pf2e-dorako-ux] h2,
  9392. [data-theme^=discord] section.tab.category.active[data-tab=pf2e-dorako-ui] h2,
  9393. [data-theme^=discord] section .form-group.dorako.settings-header {
  9394. color: white;
  9395. box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.25) inset;
  9396. }
  9397. [data-theme^=discord].spellcasting-entry.preparation .item-name {
  9398. --secondary: var(--discord-text-4);
  9399. }
  9400. [data-theme^=discord].pf2e.item.sheet.app {
  9401. --color-border-medium: var(--discord-border-color);
  9402. }
  9403. [data-theme^=discord].actor.sheet .inventory .list-row .item-controls {
  9404. --secondary: var(--discord-text-1);
  9405. }
  9406. [data-theme^=discord].actor.sheet.character {
  9407. --color-border-light-2: var(--discord-border-color);
  9408. }
  9409. [data-theme^=discord].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item, [data-theme^=discord].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action, [data-theme^=discord].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike, [data-theme^=discord].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike {
  9410. border-image: linear-gradient(90deg, transparent, var(--bg3-text-2) 20%, transparent) 1 !important;
  9411. }
  9412. [data-theme^=discord].actor.sheet .inventory .list-row .item-controls, [data-theme^=discord].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .feat-slot-title, [data-theme^=discord].actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h4:hover, [data-theme^=discord].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .skill-score {
  9413. --secondary: var(--discord-green);
  9414. --fa-inverse: white;
  9415. }
  9416. [data-theme^=discord].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill, [data-theme^=discord].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill, [data-theme^=discord].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill {
  9417. --primary: var(--accent-color);
  9418. }
  9419. [data-theme^=discord].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item, [data-theme^=discord].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action, [data-theme^=discord].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike {
  9420. border-image: linear-gradient(90deg, transparent, var(--discord-green) 20%, transparent) 1;
  9421. }
  9422. /* ----------------------------------------- */
  9423. /* Controls */
  9424. /* ----------------------------------------- */
  9425. [data-dorako-ui-scope=controls][data-theme^=discord] {
  9426. --button-hover-background: var(--accent-color);
  9427. --button-focus-outline-color: var(--accent-color-dark);
  9428. --button-hover-border-color: var(--accent-text-color);
  9429. }
  9430. /* ----------------------------------------- */
  9431. /* Navigation */
  9432. /* ----------------------------------------- */
  9433. [data-dorako-ui-scope=navigation][data-theme^=discord] .scene {
  9434. --button-toggle-focus-outline-color: var(--discord-attention);
  9435. }
  9436. [data-dorako-ui-scope=navigation][data-theme^=discord] .scene:not(.gm) {
  9437. --button-toggle-border-color: var(--discord-green);
  9438. --button-toggle-hover-border-color: color-mix(in srgb, var(--discord-green) 50%, white 50%);
  9439. --button-toggle-background: color-mix(in srgb, var(--discord-green) 50%, black 50%);
  9440. --button-toggle-hover-background: var(--discord-green);
  9441. }
  9442. [data-dorako-ui-scope=navigation][data-theme^=discord] .scene.gm {
  9443. --button-toggle-border-color: var(--discord-accent-color);
  9444. --button-toggle-hover-border-color: color-mix(in srgb, var(--discord-accent-color) 50%, white 50%);
  9445. --button-toggle-background: color-mix(in srgb, var(--discord-accent-color) 50%, black 50%);
  9446. --button-toggle-hover-background: var(--discord-accent-color);
  9447. }
  9448. [data-dorako-ui-scope=navigation][data-theme^=discord] .scene.gm.active:not(.view) {
  9449. --button-toggle-focus-outline-color: transparent;
  9450. }
  9451. /* ----------------------------------------- */
  9452. /* Placeable HUD */
  9453. /* ----------------------------------------- */
  9454. [data-theme=discord] [data-dorako-ui-scope=placeable-hud] {
  9455. --button-hover-background: var(--accent-color);
  9456. --button-focus-outline-color: var(--accent-color-dark);
  9457. --button-hover-border-color: var(--accent-text-color);
  9458. }
  9459. /* ----------------------------------------- */
  9460. /* Chat message */
  9461. /* ----------------------------------------- */
  9462. [data-theme^=discord].chat-message {
  9463. background: var(--discord-background-3);
  9464. --button-background: var(--discord-background-2);
  9465. --button-hover-background: #35373b;
  9466. --app-border-width: 1px;
  9467. --color-text-dark-secondary: rgba(255, 255, 255, 0.66);
  9468. --button-hover-border-color: rgba(122, 122, 122, 0.66);
  9469. --button-border-color: rgba(122, 122, 122, 0.33);
  9470. --button-text-color: var(--discord-text-3);
  9471. --button-hover-text-color: var(--discord-text-2);
  9472. --color-level-success: var(--discord-green);
  9473. --color-level-success-border: color-mix(in srgb, var(--discord-green) 50%, white 50%);
  9474. }
  9475. [data-theme^=discord].chat-message.whisper {
  9476. border-color: color-mix(in srgb, var(--discord-background-2) 50%, var(--whisper-bg));
  9477. background: color-mix(in srgb, var(--discord-background-2) 80%, var(--whisper-bg));
  9478. }
  9479. [data-theme^=discord].chat-message.whisper .message-header .message-sender,
  9480. [data-theme^=discord].chat-message.whisper .message-header {
  9481. color: var(--whisper-bg) !important;
  9482. }
  9483. [data-theme^=discord].chat-message.whisper.blind {
  9484. border-color: var(--blind-bg);
  9485. background: color-mix(in srgb, var(--discord-background-2) 80%, var(--blind-bg));
  9486. }
  9487. [data-theme^=discord].chat-message.whisper.blind .message-header .message-sender,
  9488. [data-theme^=discord].chat-message.whisper.blind .message-header {
  9489. color: var(--blind-bg) !important;
  9490. }
  9491. [data-theme^=discord].chat-message .message-header .header-meta.rolltype.blind {
  9492. color: var(--blind-bg);
  9493. }
  9494. [data-theme^=discord].chat-message .message-header .header-meta.rolltype.whisper {
  9495. color: var(--whisper-bg);
  9496. }
  9497. [data-theme^=discord].chat-message .message-header,
  9498. [data-theme^=discord].chat-message .message-header h4 {
  9499. color: color-mix(in srgb, var(--player-color) 80%, white 20%) !important;
  9500. text-shadow: none !important;
  9501. background: none !important;
  9502. }
  9503. [data-theme^=discord].chat-message .message-content {
  9504. text-shadow: none;
  9505. }
  9506. [data-theme^=discord].chat-message .dice-roll .dice-formula,
  9507. [data-theme^=discord].chat-message .dice-roll .dice-total {
  9508. --app-background: rgba(122, 122, 122, 0.33);
  9509. }
  9510. [data-theme^=discord].chat-message .dice-roll .dice-formula button,
  9511. [data-theme^=discord].chat-message .dice-roll .dice-total button {
  9512. --button-text-color: var(--discord-text-1);
  9513. --button-hover-text-color: var(--discord-text-1);
  9514. }
  9515. [data-theme^=discord].chat-message .part-total {
  9516. --app-background: transparent;
  9517. --app-border-color: var(--color-text-light-6);
  9518. }
  9519. [data-theme^=discord].chat-message .chat-card button:hover,
  9520. [data-theme^=discord].chat-message .message-buttons button:hover,
  9521. [data-theme^=discord].chat-message .card-buttons button:hover,
  9522. [data-theme^=discord].chat-message .damage-application button:hover {
  9523. --box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
  9524. }
  9525. [data-theme^=discord].chat-message button[data-action=shield-block]:hover {
  9526. --color-secondary-2: var(--discord-accent-color);
  9527. --color-secondary-1: var(--accent-text-color);
  9528. }
  9529. [data-theme^=discord].chat-message .message-timestamp,
  9530. [data-theme^=discord].chat-message .message-header .header-meta {
  9531. background: none !important;
  9532. border: none !important;
  9533. color: #959ba3;
  9534. text-shadow: none;
  9535. padding: 0px;
  9536. }
  9537. [data-theme^=discord].chat-message .tags .tag.tag_transparent,
  9538. [data-theme^=discord].chat-message .tags .tag option.tag_transparent {
  9539. background-color: color-mix(in srgb, var(--player-color) 20%, transparent);
  9540. box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--player-color) 50%, rgba(255, 255, 255, 0.5));
  9541. }
  9542. [data-theme^=discord][data-color-scheme=light].chat-message {
  9543. background: #ffffff;
  9544. --button-background: #ffffff;
  9545. --button-hover-background: #ebebed;
  9546. --app-border-width: 1px;
  9547. --color-text-dark-secondary: rgba(0, 0, 0, 0.66);
  9548. --button-hover-border-color: rgba(122, 122, 122, 0.66);
  9549. --button-border-color: rgba(122, 122, 122, 0.33);
  9550. --button-text-color: #4e5057;
  9551. --button-hover-text-color: #303237;
  9552. --color-level-success: var(--discord-green);
  9553. --color-level-success-border: color-mix(in srgb, var(--discord-green) 50%, white 50%);
  9554. }
  9555. [data-theme^=discord][data-color-scheme=light].chat-message .message-timestamp,
  9556. [data-theme^=discord][data-color-scheme=light].chat-message .message-header .header-meta {
  9557. color: #313338;
  9558. }
  9559. [data-theme^=discord][data-color-scheme=light].chat-message.whisper {
  9560. border-color: var(--whisper-bg);
  9561. background: color-mix(in srgb, #ffffff 50%, var(--whisper-bg));
  9562. }
  9563. [data-theme^=discord][data-color-scheme=light].chat-message.whisper.blind {
  9564. border-color: var(--blind-bg);
  9565. background: color-mix(in srgb, #ffffff 50%, var(--blind-bg));
  9566. }
  9567. [data-theme^=discord][data-color-scheme=light].chat-message .message-header h4,
  9568. [data-theme^=discord][data-color-scheme=light].chat-message .message-header {
  9569. color: color-mix(in srgb, var(--player-color) 80%, black) !important;
  9570. text-shadow: none !important;
  9571. background: none !important;
  9572. }
  9573. [data-theme^=discord][data-color-scheme=light].chat-message .message-content {
  9574. text-shadow: none;
  9575. }
  9576. /* ----------------------------------------- */
  9577. /* Chatlog */
  9578. /* ----------------------------------------- */
  9579. [data-chat-interface-theme^=discord] {
  9580. --scrollbar-thumb-background: var(--discord-color-scrollbar);
  9581. --scrollbar-thumb-border-color: var(--discord-scrollbar-thumb-border-color);
  9582. --color-scrollbar-hover: var(--discord-color-scrollbar-highlight);
  9583. }
  9584. [data-chat-interface-theme^=discord] #chat-log ~ * {
  9585. --button-border-color: var(--discord-background-1);
  9586. --app-border-width: 1px;
  9587. --button-background: var(--discord-background-3);
  9588. }
  9589. [data-chat-interface-theme^=discord] #dorako-rt-buttons button {
  9590. --button-toggle-border-color: color-mix(in srgb, var(--discord-green) 75%, white);
  9591. --button-toggle-hover-border-color: color-mix(in srgb, var(--discord-attention) 50%, white);
  9592. }
  9593. [data-theme^=discord][data-color-scheme=light] .damage {
  9594. --color-bg-physical: rgba(132, 132, 132, 0.125);
  9595. --color-border-physical: #939292;
  9596. --color-text-physical: black;
  9597. }
  9598. [data-theme^=discord][data-color-scheme=dark] .damage {
  9599. --color-bg-physical: rgba(132, 132, 132, 0.125);
  9600. --color-border-physical: #939292;
  9601. --color-text-physical: #bab9b9;
  9602. }
  9603. :root {
  9604. --brown-1: rgb(223, 207, 153);
  9605. --brown-2: rgb(163, 141, 109);
  9606. --brown-3: rgb(117, 81, 29);
  9607. --brown-4: rgb(115, 78, 50);
  9608. --table-header: rgb(51, 47, 36);
  9609. --table-odd: rgb(38, 35, 27);
  9610. --table-even: rgb(33, 31, 24);
  9611. --dark-20: rgb(20, 20, 20);
  9612. --dark-15: rgb(15, 15, 15);
  9613. --link-color: #f2c462;
  9614. --link-active-color: #f2dcae;
  9615. --red-link-color: #f25749;
  9616. --red-link-active-color:#f2b4ae
  9617. --trade-exact-price: rgb(163, 141, 109);
  9618. --trade-currency-text: rgb(170, 158, 130);
  9619. --trade-button-text-color: rgb(233, 207, 159);
  9620. --trade-text-color-1: rgb(255, 248, 225);
  9621. --trade-text-color-2: rgb(163, 141, 109);
  9622. --trade-text-color-3: rgb(130, 120, 106);
  9623. --poe-color-default: rgb(127, 127, 127);
  9624. --poe-color-valuedefault: rgb(255, 255, 255);
  9625. --poe-color-pink: rgb(255, 192, 203);
  9626. --poe-color-dodgerblue: rgb(30, 144, 255);
  9627. --poe-color-fire: rgb(150, 0, 0);
  9628. --poe-color-cold: rgb(54, 100, 146);
  9629. --poe-text-colorning: rgb(255, 215, 0);
  9630. --poe-color-chaos: rgb(208, 32, 144);
  9631. --poe-color-augmented: rgb(136, 136, 255);
  9632. --poe-color-crafted: rgb(184, 218, 242);
  9633. --poe-color-fractured: rgb(162, 145, 98);
  9634. --poe-color-enchanted: rgb(184, 218, 242);
  9635. --poe-color-hellscaped: rgb(255, 110, 37);
  9636. --poe-color-unmet: rgb(210, 0, 0);
  9637. --poe-color-uniqueitem: rgb(175, 96, 37);
  9638. --poe-color-unique: rgb(175, 96, 37);
  9639. --poe-color-rareitem: rgb(255, 255, 119);
  9640. --poe-color-rare: rgb(255, 255, 119);
  9641. --poe-color-magicitem: rgb(136, 136, 255);
  9642. --poe-color-magic: rgb(136, 136, 255);
  9643. --poe-color-whiteitem: rgb(200, 200, 200);
  9644. --poe-color-normal: rgb(200, 200, 200);
  9645. --poe-color-gemitem: rgb(27, 162, 155);
  9646. --poe-color-gem: rgb(27, 162, 155);
  9647. --poe-color-currencyitem: rgb(170, 158, 130);
  9648. --poe-color-currency: rgb(170, 158, 130);
  9649. --poe-color-questitem: rgb(74, 230, 58);
  9650. --poe-color-quest: rgb(74, 230, 58);
  9651. --poe-color-nemesismod: rgb(255, 200, 0);
  9652. --poe-color-nemesismodoutline: rgb(219, 34, 0); /* 220,255,40,0 */
  9653. --poe-color-talismanmod: rgb(141, 241, 79);
  9654. --poe-color-talismanmodoutline: rgb(0, 0, 0); /* 220,0,0,0 */
  9655. --poe-color-title: rgb(231, 180, 120);
  9656. --poe-color-corrupted: rgb(210, 0, 0);
  9657. --poe-color-favour: rgb(170, 158, 130);
  9658. --poe-color-supporterpacknewitem: rgb(180, 96, 0);
  9659. --poe-color-supporterpackitem: rgb(163, 141, 109);
  9660. --poe-color-bloodlinemod: rgb(210, 0, 220);
  9661. --poe-color-bloodlinemodoutline: rgb(58, 0, 125); /* 200,74,0,160 */
  9662. --poe-color-tormentmod: rgb(50, 230, 100);
  9663. --poe-color-tormentmodoutline: rgb(0, 78, 117); /* 200,0,100,150 */
  9664. --poe-color-canttradeormodify: rgb(210, 0, 0);
  9665. --poe-color-lockedtoaccount: rgb(210, 0, 0);
  9666. --poe-color-divination: rgb(14, 186, 255);
  9667. --poe-color-prophecy: rgb(181, 75, 255);
  9668. --poe-color-essencemod: rgb(164, 210, 255);
  9669. --poe-color-essencemodoutline: rgb(0, 41, 82); /* 210,0,50,100 */
  9670. --poe-color-premiumchat: rgb(253, 242, 126);
  9671. --poe-color-premiumchatoutline: rgb(209, 46, 46);
  9672. --poe-color-uniquefoil: rgb(130, 173, 106);
  9673. --poe-color-legacy: rgb(212, 145, 63);
  9674. --poe-color-bestiarymod: rgb(255, 255, 255);
  9675. --poe-color-bestiarymodoutline: rgb(219, 34, 0); /* 220,255,40,0 */
  9676. --poe-color-blightmod: rgb(255, 255, 255);
  9677. --poe-color-blightmodoutline: rgb(215, 0, 0); /* 255,215,0,0 */
  9678. --poe-color-afflictionmod: rgb(22, 25, 28);
  9679. --poe-color-afflictionmodoutline: rgb(151, 164, 181); /* 200,193,210,232 */
  9680. --poe-color-stackitemlevel: rgb(255, 255, 255);
  9681. --poe-color-harvestprimary: rgb(100, 111, 73);
  9682. --poe-color-harvestsecondary: rgb(83, 130, 161);
  9683. --poe-color-craftingcaster: rgb(179, 248, 254);
  9684. --poe-color-craftingphysical: rgb(199, 157, 147);
  9685. --poe-color-craftingfire: rgb(255, 154, 119);
  9686. --poe-color-craftingcold: rgb(147, 216, 255);
  9687. --poe-color-craftinglightning: rgb(248, 203, 118);
  9688. --poe-color-craftingchaos: rgb(216, 167, 211);
  9689. --poe-color-craftingspeed: rgb(207, 238, 165);
  9690. --poe-color-craftingcrit: rgb(178, 167, 214);
  9691. --poe-color-craftingred: rgb(200, 103, 110);
  9692. --poe-color-craftingblue: rgb(162, 207, 251);
  9693. --poe-color-craftinggreen: rgb(134, 189, 163);
  9694. --poe-color-craftinglife: rgb(201, 110, 110);
  9695. --poe-color-craftingdefences: rgb(168, 143, 103);
  9696. --poe-color-craftingattack: rgb(218, 129, 77);
  9697. --poe-color-heist: rgb(25, 30, 25);
  9698. --poe-color-heiststolenitem: rgb(210, 0, 0);
  9699. --poe-color-atlasmaven: rgb(182, 12, 169);
  9700. --poe-color-ultimatumnumber: rgb(254, 92, 81);
  9701. --poe-color-incursionunreachable: rgb(90, 90, 90);
  9702. --poe-color-lockedinplaceitem: rgb(127, 127, 127);
  9703. --poe-color-craftaffectremove: rgb(254, 153, 0);
  9704. --poe-color-craftaffectwarning: rgb(235, 200, 80);
  9705. --poe-color-craftaffectreroll: rgb(254, 153, 0);
  9706. --poe-color-skillpopuptitle: rgb(249, 230, 202);
  9707. --poe-color-disabledstats: rgb(150, 150, 167);
  9708. --poe-color-skillextrainfo: rgb(255, 192, 119);
  9709. --poe-color-fakeitemcount: rgb(200, 200, 200);
  9710. }
  9711. :root .c-cblock {
  9712. border: 1px solid #2c2b2b;
  9713. background-color: #141414;
  9714. }
  9715. :root .c-cblock--violet {
  9716. border-color: #585477;
  9717. background-color: #151517;
  9718. }
  9719. :root .c-cblock--gold {
  9720. border-color: #75693c;
  9721. background-color: #1c1b19;
  9722. }
  9723. :root .c-mbox--warning {
  9724. border-color: #781c1c;
  9725. background-color: #241515;
  9726. }
  9727. :root .c-mbox--action {
  9728. border-color: #693a1e;
  9729. background-color: #26211f;
  9730. }
  9731. :root .c-mbox--content {
  9732. border-color: #664c1e;
  9733. background-color: #26231f;
  9734. }
  9735. :root .c-mbox--style {
  9736. border-color: #75693c;
  9737. background-color: #24231f;
  9738. }
  9739. :root .c-mbox--info {
  9740. border-color: #4b5e6a;
  9741. background-color: #191b1c;
  9742. }
  9743. :root .c-mbox--legal {
  9744. border-color: #403b2d;
  9745. background-color: #21201c;
  9746. }
  9747. :root .c-mbox--proposal {
  9748. border-color: #585477;
  9749. background-color: #19191c;
  9750. }
  9751. :root .c-mbox--lock {
  9752. border-color: #59534e;
  9753. background-color: #211f1d;
  9754. }
  9755. :root #catlinks {
  9756. border: 1px solid #503a1e;
  9757. background-color: #130f0a;
  9758. }
  9759. [data-theme=poe-wiki],
  9760. [data-theme=poe-wiki][data-dorako-ui-scope=limited] {
  9761. --color-primary-1: var(--tertiary);
  9762. --color-primary-2: var(--poe-color-unique);
  9763. --color-primary-3: var(--primary-dark);
  9764. --color-primary-3-75: color-mix(in srgb, var(--color-primary-3) 75%, transparent);
  9765. --color-primary-4-75: color-mix(in srgb, var(--color-primary-4) 75%, transparent);
  9766. --color-secondary-1: var(--secondary-light);
  9767. --color-secondary-2: var(--secondary);
  9768. --color-secondary-3: var(--secondary-dark);
  9769. --color-secondary-3-75: color-mix(in srgb, var(--color-secondary-3) 75%, transparent);
  9770. --color-secondary-4: #26231f;
  9771. --window-app-background: var(--dark-15);
  9772. --window-app-border-color: var(--brown-4);
  9773. --window-app-border-width: 1px;
  9774. --app-background: var(--glass-bg);
  9775. --app-border-color: var(--alt);
  9776. --app-border-width: 1px;
  9777. --scrollbar-thumb-background: var(--brown-1);
  9778. --scrollbar-thumb-border-color: var(--brown-2);
  9779. --box-shadow: 0px 1px 2px black;
  9780. --accent-color: var(--tertiary);
  9781. --inline-background: transparent;
  9782. --inline-border-color: transparent;
  9783. --inline-text-color: var(--poe-color-magic);
  9784. --inline-icon-color: var(--poe-color-gem);
  9785. --input-border-color: var(--brown-2);
  9786. --color-border-light-primary: var(--brown-1);
  9787. --color-border-light-highlight: var(--brown-2);
  9788. }
  9789. [data-theme=poe-wiki].actor.sheet .crb-style .sheet-body,
  9790. [data-theme=poe-wiki][data-dorako-ui-scope=limited].actor.sheet .crb-style .sheet-body {
  9791. --color-border-medium: var(--brown-1);
  9792. --color-border-divider: var(--brown-1);
  9793. --secondary: var(--poe-color-gem);
  9794. }
  9795. [data-theme=poe-wiki].actor.sheet .inventory .list-row .item-controls,
  9796. [data-theme=poe-wiki][data-dorako-ui-scope=limited].actor.sheet .inventory .list-row .item-controls {
  9797. --secondary: var(--poe-color-gem);
  9798. }
  9799. [data-theme=poe-wiki] select,
  9800. [data-theme=poe-wiki] input,
  9801. [data-theme=poe-wiki] button {
  9802. --button-background: #21201c;
  9803. --button-border-color: #403b2d;
  9804. --input-border-color: var(--brown-2);
  9805. --input-background: var(--alt-dark);
  9806. --input-focus-outline-color: var(--tertiary);
  9807. }
  9808. [data-theme=poe-wiki]#hotbar .macro {
  9809. border: 1px solid black;
  9810. }
  9811. [data-theme=poe-wiki]#sidebar {
  9812. background: var(--app-background) !important;
  9813. box-shadow: var(--box-shadow);
  9814. }
  9815. [data-theme=poe-wiki].sidebar-popout {
  9816. background: var(--app-background) !important;
  9817. }
  9818. [data-theme=poe-wiki].message.chat-message {
  9819. background: var(--window-app-background);
  9820. background-position: top;
  9821. background-size: cover;
  9822. }
  9823. [data-theme=poe-wiki].message.chat-message.whisper {
  9824. background: var(--window-app-background);
  9825. background-color: var(--whisper-bg);
  9826. background-blend-mode: luminosity;
  9827. }
  9828. [data-theme=poe-wiki].message.chat-message.whisper.blind {
  9829. background: var(--window-app-background);
  9830. background-color: var(--blind-bg);
  9831. background-blend-mode: luminosity;
  9832. }
  9833. /* ----------------------------------------- */
  9834. /* Theme colors */
  9835. /* ----------------------------------------- */
  9836. :root {
  9837. --bg3-middle-brown: #9d7b53;
  9838. --bg3-border-color: #5f5244;
  9839. --bg3-background-1: #433c36;
  9840. --bg3-background-2: #423c36;
  9841. --bg3-background-3: #2a2522;
  9842. --bg3-background-4: #292421;
  9843. --bg3-text-1: #fafafa;
  9844. --bg3-text-2: #d1c9b9;
  9845. --bg3-text-3: #b0947b;
  9846. --bg3-text-4: #e8dea8;
  9847. --bg3-text-5: #e1d48f;
  9848. --bg3-accent-color-light: #ff7ba2;
  9849. --bg3-accent-color: #ea4a72;
  9850. --bg3-accent-color-dark: #912737;
  9851. --bg3-color-scrollbar-highlight: #fff7d3;
  9852. --bg3-scrollbar-thumb-background: #ecc090;
  9853. --bg3-scrollbar-thumb-border-color: #6c5842;
  9854. --bg3-blue-light: #0c93bd;
  9855. --bg3-blue: #183541;
  9856. --bg3-blue-dark: #1b2a30;
  9857. --bg3-ba-orange: #ab5623;
  9858. --bg3-action-green: #019740;
  9859. --bg3-pactslot-pink: #f950f9;
  9860. --bg3-spellslot-blue: #79ffff;
  9861. --bg3-bardic-yellow: #cfad00;
  9862. --bg3-icon-green-stroke: #95aaa5;
  9863. --bg3-icon-green-light: #1c4137;
  9864. --bg3-icon-green-dark: #1d3733;
  9865. --bg3-attention: #fe265d;
  9866. --bg3-alliance-ally-yellow: #c09e05;
  9867. --bg3-alliance-opposition-red: #de1847;
  9868. --bg3-alliance-companion-blue: #08c6e4;
  9869. --bg3-alliance-ally-green: #52fead;
  9870. --bg3-rarity-legendary: #dfa633;
  9871. --bg3-rarity-very-rare: #d1017b;
  9872. --bg3-rarity-quest: #cd5f21;
  9873. --bg3-rarity-rare: #00bffd;
  9874. --bg3-rarity-uncommon: #01b638;
  9875. --bg3-rarity-common: #ffe6cb;
  9876. --bg3-info-overlay-light: rgba(255, 255, 255, 0.25);
  9877. --bg3-info-overlay-dark: rgba(0, 0, 0, 0.25);
  9878. /* Brown variant */
  9879. --bg3-bg-inner: #241d16;
  9880. --bg3-bg-outer: #1b1a19;
  9881. --bg3-border-inner: #ab7743;
  9882. --bg3-border-outer: #7b542e;
  9883. --bg3-ui-purple: #4e3061;
  9884. /* Blue variant */
  9885. --bg3-inspect-background: #2a2a2a;
  9886. --bg3-inspect-border-color: #aca493;
  9887. --bg3-healing: #49cbc1;
  9888. --bg3-border-background: linear-gradient(
  9889. to right,
  9890. var(--bg3-border-outer) 0%,
  9891. var(--bg3-border-inner) 50%,
  9892. var(--bg3-border-outer) 100%
  9893. );
  9894. --bg3-tooltip-window-background: linear-gradient(
  9895. to right,
  9896. var(--bg3-bg-outer) 0,
  9897. var(--bg3-bg-inner) 50%,
  9898. var(--bg3-bg-outer) 100%
  9899. );
  9900. --bg3-ui-purple-background: linear-gradient(
  9901. to top,
  9902. color-mix(in srgb, var(--bg3-ui-purple) 50%, transparent) 0,
  9903. transparent 15%
  9904. );
  9905. --top-color: transparent;
  9906. }
  9907. /* ----------------------------------------- */
  9908. /* Map v1 styling to v2 values */
  9909. /* ----------------------------------------- */
  9910. [data-theme^=bg3] {
  9911. --color-border-light-highlight: var(--bg3-border-outer);
  9912. --color-border-light-primary: var(--bg3-border-outer);
  9913. --color-border-light-secondary: var(--bg3-border-outer);
  9914. --color-border-light-tertiary: var(--bg3-border-inner);
  9915. --color-border-dark-primary: var(--bg3-border-inner);
  9916. --color-border-dark-secondary: var(--bg3-border-outer);
  9917. --color-text-hyperlink: var(--accent-color);
  9918. --color-border-highlight: var(--accent-color);
  9919. --color-border-highlight-alt: var(--accent-color-dark);
  9920. --color-border-divider: var(--bg3-border-color);
  9921. --color-text-dark-primary: var(--text-color-3);
  9922. --color-text-dark-secondary: var(--text-color-5);
  9923. --color-bg-option: var(--alt);
  9924. }
  9925. [data-theme^=bg3][data-dorako-ui-scope=limited],
  9926. [data-theme^=bg3] {
  9927. --window-app-background: var(--bg3-tooltip-window-background) padding-box, var(--bg3-border-background) border-box;
  9928. --window-app-border-color: transparent;
  9929. --ornamentation: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1{stroke:wheat;stroke-miterlimit:10}.st1,.st2{fill:none}%3C/style%3E%3Cg opacity='1'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zm3.1 3.1h3.1v3.1H3.6zm3.2 0h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zm0 0H.5V13M13 .5H6.8v3.1M29.4.5h3.1v3.1h-3.1zm-3.1 3.1h3.1v3.1h-3.1zm0 3.2h3.1v3.1h-3.1zm-3.2-3.2h3.1v3.1h-3.1zm3.2 0V.5H20M32.5 13V6.8h-3.1M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zm-3.2 0h3.1v3.1h-3.1zm3.2-3.2h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zm3.1-3.1h3.1v3.1H3.6zm0-3.2h3.1v3.1H3.6zm3.2 3.2h3.1v3.1H6.8zM6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  9930. }
  9931. /* ----------------------------------------- */
  9932. /* DUI variables */
  9933. /* ----------------------------------------- */
  9934. [data-chat-interface-theme^=bg3] #sidebar-tabs,
  9935. [data-chat-interface-theme^=bg3] #chat-log ~ *,
  9936. [data-theme^=bg3] {
  9937. /* Base colors */
  9938. --color-primary-1: var(--bg3-accent-color-light);
  9939. --color-primary-2: var(--bg3-accent-color);
  9940. --color-primary-3: var(--bg3-border-outer);
  9941. --color-primary-4: var(--bg3-blue-dark);
  9942. /* Misc variables */
  9943. --ornamentation: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1{stroke:wheat;stroke-miterlimit:10}.st1,.st2{fill:none}%3C/style%3E%3Cg opacity='1'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zm3.1 3.1h3.1v3.1H3.6zm3.2 0h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zm0 0H.5V13M13 .5H6.8v3.1M29.4.5h3.1v3.1h-3.1zm-3.1 3.1h3.1v3.1h-3.1zm0 3.2h3.1v3.1h-3.1zm-3.2-3.2h3.1v3.1h-3.1zm3.2 0V.5H20M32.5 13V6.8h-3.1M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zm-3.2 0h3.1v3.1h-3.1zm3.2-3.2h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zm3.1-3.1h3.1v3.1H3.6zm0-3.2h3.1v3.1H3.6zm3.2 3.2h3.1v3.1H6.8zM6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  9944. --box-shadow: 0px 1px 2px black;
  9945. --icon-border-color: #ab7743;
  9946. /* Window app variables */
  9947. --window-app-background: radial-gradient(circle at bottom right, #2c282433 0%, #2c2824ff 50%, #0c0804ee 100%),
  9948. radial-gradient(circle at center, transparent 0, #0c0804ee 100%);
  9949. --window-app-border-color: var(--bg3-middle-brown);
  9950. --window-app-border-width: 2px;
  9951. --window-app-box-shadow: 0px 5px 20px 3px black;
  9952. /* App variables */
  9953. --app-background: #161511aa;
  9954. --app-border-color: var(--bg3-border-color);
  9955. --app-border-width: 1px;
  9956. /* Inline variables */
  9957. --inline-background: transparent;
  9958. --inline-border-color: transparent;
  9959. --inline-text-color: var(--bg3-text-4);
  9960. --inline-icon-color: var(--bg3-text-5);
  9961. --inline-box-shadow: none;
  9962. --inline-text-shadow: 0px 1px 1px black;
  9963. /* Input variables */
  9964. --input-box-shadow: none;
  9965. --input-border-color: var(--bg3-bg-outer);
  9966. --input-background: color-mix(in srgb, var(--alt) 50%, transparent);
  9967. --input-disabled-background: var(--bg3-background-4);
  9968. --input-disabled-border-color: var(--bg3-background-3);
  9969. --input-focus-outline-color: var(--tertiary);
  9970. --input-text-color: var(--text-color-2);
  9971. /* Button variables */
  9972. --button-background: var(--app-background);
  9973. --button-border-color: #403b2d;
  9974. --button-text-color: var(--text-color-3);
  9975. --button-focus-outline-color: #d3b87c;
  9976. --button-hover-background: var(--bg3-accent-color-dark);
  9977. --button-hover-border-color: #9a8860;
  9978. --button-hover-text-color: var(--text-color-1);
  9979. --button-disabled-background: rgba(60, 60, 60, 0.5);
  9980. --button-disabled-border-color: rgba(160, 160, 160, 0.5);
  9981. --button-toggle-border-color: #d3b87c;
  9982. --button-toggle-background: radial-gradient(circle, #175868 0, black 100%);
  9983. --button-toggle-hover-background: radial-gradient(circle, var(--bg3-blue-light) 0, var(--bg3-blue) 100%);
  9984. --button-toggle-hover-border-color: #edd5a2;
  9985. --button-bright-text-color: var(--bg3-text-1);
  9986. /* Fieldset variables */
  9987. --fieldset-border-color: transparent;
  9988. --fieldset-background-color: rgba(0, 0, 0, 0.2);
  9989. --fieldset-legend-color: var(--bg3-text-4);
  9990. /* Scrollbar and accent variables */
  9991. --scrollbar-thumb-background: var(--bg3-scrollbar-thumb-background);
  9992. --scrollbar-thumb-border-color: var(--bg3-scrollbar-thumb-border-color);
  9993. --color-scrollbar-hover: var(--bg3-color-scrollbar-highlight);
  9994. --accent-text-color: var(--bg3-text-1);
  9995. --accent-color-light: var(--bg3-accent-color-light);
  9996. --accent-color: var(--bg3-accent-color);
  9997. --accent-color-dark: var(--bg3-accent-color-dark);
  9998. /* Other */
  9999. --rarity-common: var(--bg3-rarity-common) !important;
  10000. --rarity-uncommon: var(--bg3-rarity-uncommon) !important;
  10001. --rarity-rare: var(--bg3-rarity-rare) !important;
  10002. --rarity-unique: var(--bg3-rarity-very-rare) !important;
  10003. --color-rarity-common: var(--bg3-rarity-common) !important;
  10004. --color-rarity-uncommon: var(--bg3-rarity-uncommon) !important;
  10005. --color-rarity-rare: var(--bg3-rarity-rare) !important;
  10006. --color-rarity-unique: var(--bg3-rarity-very-rare) !important;
  10007. --bg3-ui-top-background: linear-gradient(
  10008. to bottom,
  10009. color-mix(in srgb, var(--top-color) 40%, transparent) 0,
  10010. transparent 40%
  10011. );
  10012. }
  10013. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-rarity=common],
  10014. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-rarity=common],
  10015. [data-theme^=bg3][data-rarity=common] {
  10016. --rarity: var(--rarity-common);
  10017. }
  10018. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-rarity=uncommon],
  10019. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-rarity=uncommon],
  10020. [data-theme^=bg3][data-rarity=uncommon] {
  10021. --rarity: var(--rarity-uncommon);
  10022. }
  10023. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-rarity=rare],
  10024. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-rarity=rare],
  10025. [data-theme^=bg3][data-rarity=rare] {
  10026. --rarity: var(--rarity-rare);
  10027. }
  10028. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-rarity=unique],
  10029. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-rarity=unique],
  10030. [data-theme^=bg3][data-rarity=unique] {
  10031. --rarity: var(--rarity-unique);
  10032. }
  10033. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-rarity].window-app,
  10034. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-rarity].window-app,
  10035. [data-theme^=bg3][data-rarity].window-app {
  10036. --top-color: var(--rarity);
  10037. --window-app-border-color: transparent;
  10038. --window-app-background: var(--bg3-ui-top-background) border-box, var(--bg3-ui-purple-background),
  10039. var(--bg3-tooltip-window-background) padding-box, var(--bg3-border-background) border-box;
  10040. }
  10041. [data-chat-interface-theme^=bg3] #sidebar-tabs tags.tags.paizo-style,
  10042. [data-chat-interface-theme^=bg3] #chat-log ~ * tags.tags.paizo-style,
  10043. [data-theme^=bg3] tags.tags.paizo-style {
  10044. --tags-border-color: transparent;
  10045. }
  10046. [data-chat-interface-theme^=bg3] #sidebar-tabs.window-app button.bright,
  10047. [data-chat-interface-theme^=bg3] #chat-log ~ *.window-app button.bright,
  10048. [data-theme^=bg3].window-app button.bright {
  10049. --button-background: var(--accent-color);
  10050. --button-border-color: var(--accent-color-dark);
  10051. --button-text-color: white !important;
  10052. --button-hover-text-color: white !important;
  10053. }
  10054. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc,
  10055. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc,
  10056. [data-theme^=bg3][data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc {
  10057. --bg3-border-inner: #a16a37;
  10058. --bg3-border-outer: #4a2e18;
  10059. --bg3-border-internal: #304248;
  10060. --bg3-bg-inner: #182830;
  10061. --bg3-bg-outer: #151e29;
  10062. --bg3-border-background: linear-gradient(
  10063. to right,
  10064. var(--bg3-border-outer) 0%,
  10065. var(--bg3-border-inner) 50%,
  10066. var(--bg3-border-outer) 100%
  10067. );
  10068. --input-placeholder-color: var(--bg3-text-3);
  10069. --section-background: linear-gradient(
  10070. to right,
  10071. var(--bg3-bg-outer) 0,
  10072. var(--bg3-bg-inner) 50%,
  10073. var(--bg3-bg-outer) 100%
  10074. );
  10075. --section-header: linear-gradient(
  10076. to right,
  10077. var(--bg3-bg-outer) 0,
  10078. var(--bg3-bg-inner) 50%,
  10079. var(--bg3-bg-outer) 100%
  10080. );
  10081. --section-border-color: var(--bg3-border-inner);
  10082. --section-outline-color: var(--bg3-border-outer);
  10083. --section-header-text-color: var(--bg3-text-2);
  10084. --tag-border-color: var(--bg3-border-internal);
  10085. --tag-background-color: transparent;
  10086. --tag-text-color: var(--bg3-text-4);
  10087. --color-text-dark-input: var(--bg3-text-2);
  10088. --input-border-color: transparent;
  10089. --input-background: rgba(0, 0, 0, 0.1);
  10090. --input-focus-outline-color: var(--bg3-border-internal);
  10091. --input-placeholder-color: rgba(40, 40, 40, 1);
  10092. --color-border-light-tertiary: var(--bg3-border-inner);
  10093. --text-dark: var(--bg3-text-4);
  10094. }
  10095. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header,
  10096. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header,
  10097. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header,
  10098. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header,
  10099. [data-theme^=bg3][data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header,
  10100. [data-theme^=bg3][data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header {
  10101. border-width: 0 0 2px;
  10102. border-image: linear-gradient(90deg, transparent, var(--bg3-border-internal) 50%, transparent) 1 repeat;
  10103. position: relative;
  10104. }
  10105. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header .side-bar-label,
  10106. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header h4,
  10107. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header .side-bar-label,
  10108. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header h4,
  10109. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header .side-bar-label,
  10110. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header h4,
  10111. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header .side-bar-label,
  10112. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header h4,
  10113. [data-theme^=bg3][data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header .side-bar-label,
  10114. [data-theme^=bg3][data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header h4,
  10115. [data-theme^=bg3][data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header .side-bar-label,
  10116. [data-theme^=bg3][data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header h4 {
  10117. z-index: 1;
  10118. }
  10119. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header::before,
  10120. [data-chat-interface-theme^=bg3] #sidebar-tabs[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header::before,
  10121. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header::before,
  10122. [data-chat-interface-theme^=bg3] #chat-log ~ *[data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header::before,
  10123. [data-theme^=bg3][data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .side-bar-section:not(.collapsed) .side-bar-section-header::before,
  10124. [data-theme^=bg3][data-dorako-ui-scope=limited].dorako-ux.sheet.pf2e.actor.npc form .section-container .section-header::before {
  10125. background: rgba(255, 255, 255, 0.1);
  10126. content: "";
  10127. position: absolute;
  10128. top: 0px;
  10129. left: 0px;
  10130. width: 100%;
  10131. height: 100%;
  10132. overflow: hidden;
  10133. pointer-events: none;
  10134. background: linear-gradient(to top, rgba(0, 0, 0, 0.33), transparent);
  10135. }
  10136. /* ----------------------------------------- */
  10137. /* System variables */
  10138. /* ----------------------------------------- */
  10139. [data-theme^=bg3] {
  10140. --color-text-dark-primary: var(--text-color-2);
  10141. --bg: rgba(0, 0, 0, 0.5);
  10142. --sub: var(--bg3-middle-brown);
  10143. --text-dark: var(--bg3-text-1);
  10144. --color-border-light-1: var(--color-text-light-highlight);
  10145. --color-underline-header: var(--bg3-middle-brown);
  10146. }
  10147. /* ----------------------------------------- */
  10148. /* Specifics */
  10149. /* ----------------------------------------- */
  10150. [data-theme^=bg3] .roll-note[data-visibility=gm],
  10151. [data-theme^=bg3] table.pf2e,
  10152. [data-theme^=bg3] table.pf2-table {
  10153. --inline-background: color-mix(in srgb, var(--bg3-accent-color-dark) 75%, transparent);
  10154. --inline-border-color: var(--bg3-accent-color);
  10155. --inline-text-color: var(--bg3-text-1);
  10156. --inline-icon-color: var(--bg3-text-1);
  10157. --inline-box-shadow: 0px 1px 2px black;
  10158. --inline-text-shadow: 0px 1px 1px black;
  10159. }
  10160. [data-theme^=bg3] h1 {
  10161. border-image: linear-gradient(90deg, transparent, var(--color-underline-header) 50%, transparent) 1;
  10162. }
  10163. [data-theme^=bg3].spellcasting-entry.preparation .item-name {
  10164. --secondary: var(--bg3-text-4);
  10165. }
  10166. [data-theme^=bg3].app.window-app {
  10167. box-shadow: var(--window-app-box-shadow), 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset;
  10168. }
  10169. [data-theme^=bg3].pf2e.item.sheet.app {
  10170. --color-border-medium: var(--bg3-border-color);
  10171. }
  10172. [data-theme^=bg3].actor.sheet .crb-style .sheet-body {
  10173. --color-border-medium: var(--brown-1);
  10174. --color-border-divider: var(--scrollbar-thumb-border-color);
  10175. --text-dark: var(--bg3-text-2);
  10176. }
  10177. [data-theme^=bg3].actor.sheet .inventory .list-row .item-controls {
  10178. --secondary: var(--bg3-text-1);
  10179. }
  10180. [data-theme^=bg3].actor.sheet.character {
  10181. --color-border-light-2: var(--bg3-border-color);
  10182. }
  10183. [data-theme^=bg3].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item, [data-theme^=bg3].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action, [data-theme^=bg3].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike, [data-theme^=bg3].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike {
  10184. border-image: linear-gradient(90deg, transparent, var(--bg3-text-2) 20%, transparent) 1 !important;
  10185. }
  10186. [data-theme^=bg3].actor.sheet .inventory .list-row .item-controls, [data-theme^=bg3].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.feats .feat-item .item-name .feat-slot-title, [data-theme^=bg3].actor.sheet .crb-style .sheet-body .sheet-content ol.spell-list > li .item-name h4:hover, [data-theme^=bg3].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.spellcasting .spellcasting-entry .spell-ability-data .skill-score {
  10187. --secondary: var(--bg3-text-1);
  10188. --fa-inverse: black;
  10189. }
  10190. [data-theme^=bg3].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .lores-list .skill, [data-theme^=bg3].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .combat-list .skill, [data-theme^=bg3].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.proficiencies .skills-list .skill {
  10191. --primary: var(--tertiary);
  10192. }
  10193. [data-theme^=bg3].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.effects .effects-list .item, [data-theme^=bg3].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.action, [data-theme^=bg3].actor.sheet .crb-style .sheet-body .sheet-content .tab.actions ol.actions-list li.strike {
  10194. border-image: linear-gradient(90deg, transparent, var(--tertiary) 20%, transparent) 1;
  10195. }
  10196. [data-theme^=bg3].window-app.sidebar-popout {
  10197. border: none;
  10198. }
  10199. /* ----------------------------------------- */
  10200. /* FPS display */
  10201. /* ----------------------------------------- */
  10202. #fps[data-theme^=bg3] {
  10203. background: var(--bg3-tooltip-window-background) padding-box, linear-gradient(to right, var(--bg3-border-outer) 0%, var(--bg3-border-inner) 50%, var(--bg3-border-outer) 100%) border-box;
  10204. border: 2px solid transparent;
  10205. box-shadow: 0px 0px 30px black, 0px 0px 20px black, 0px 0px 10px black;
  10206. }
  10207. /* ----------------------------------------- */
  10208. /* Tooltip */
  10209. /* ----------------------------------------- */
  10210. #tooltip[data-theme^=bg3] {
  10211. --border-radius: 12px;
  10212. box-shadow: 0px 0px 30px black, 0px 0px 20px black, 0px 0px 10px black, 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset;
  10213. backdrop-filter: none;
  10214. border-radius: var(--border-radius);
  10215. text-shadow: none;
  10216. padding: 1em 1em;
  10217. font-family: var(--serif);
  10218. color: var(--bg3-text-3);
  10219. background: var(--bg3-tooltip-window-background) padding-box, linear-gradient(to right, var(--bg3-border-outer) 0%, var(--bg3-border-inner) 50%, var(--bg3-border-outer) 100%) border-box;
  10220. border: 2px solid transparent;
  10221. }
  10222. [data-theme^=bg3]#effects-panel .effect-item .effect-info {
  10223. background: var(--bg3-tooltip-window-background) padding-box, linear-gradient(to right, var(--bg3-border-outer) 0%, var(--bg3-border-inner) 50%, var(--bg3-border-outer) 100%) border-box;
  10224. border: 2px solid transparent;
  10225. box-shadow: 0px 0px 30px black, 0px 0px 20px black, 0px 0px 10px black, 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset;
  10226. backdrop-filter: none;
  10227. border-radius: var(--border-radius);
  10228. text-shadow: none;
  10229. color: var(--bg3-text-3);
  10230. }
  10231. [data-theme^=bg3]#effects-panel .effect-item > .icon {
  10232. --border-radius: 50%;
  10233. --icon-border-color: #d3b87c;
  10234. outline: 1px solid #9a8860;
  10235. }
  10236. [data-theme^=bg3]#effects-panel .effect-item > .icon.aura {
  10237. border-radius: 33%;
  10238. transform: scale(0.8);
  10239. }
  10240. /* ----------------------------------------- */
  10241. /* Navigation */
  10242. /* ----------------------------------------- */
  10243. [data-dorako-ui-scope=navigation][data-theme^=bg3] #nav-toggle {
  10244. background: var(--bg3-tooltip-window-background) padding-box, var(--bg3-border-background) border-box !important;
  10245. border: 2px solid transparent !important;
  10246. box-shadow: 0px 1px 2px black, 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset !important;
  10247. }
  10248. [data-dorako-ui-scope=navigation][data-theme^=bg3] .scene {
  10249. border: 2px solid transparent !important;
  10250. line-height: calc(var(--control-size) - 4px) !important;
  10251. position: relative;
  10252. box-shadow: 0px 1px 2px black, 0px 0px 5px black, 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset !important;
  10253. --button-toggle-focus-outline-color: #d3b87c;
  10254. }
  10255. [data-dorako-ui-scope=navigation][data-theme^=bg3] .scene.view::before {
  10256. background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.2), transparent);
  10257. border-radius: var(--border-radius);
  10258. content: "";
  10259. position: absolute;
  10260. top: 0;
  10261. left: 0;
  10262. width: 100%;
  10263. height: 100%;
  10264. overflow: visible;
  10265. pointer-events: none;
  10266. z-index: 0;
  10267. }
  10268. [data-dorako-ui-scope=navigation][data-theme^=bg3] .scene:not(.gm) {
  10269. --button-toggle-background: var(--bg3-tooltip-window-background) padding-box,
  10270. var(--bg3-border-background) border-box;
  10271. --button-toggle-hover-background: var(--bg3-tooltip-window-background) padding-box,
  10272. var(--bg3-border-background) border-box;
  10273. }
  10274. [data-dorako-ui-scope=navigation][data-theme^=bg3] .scene.gm {
  10275. --bg3-border-inner: #a16a37;
  10276. --bg3-border-outer: #4a2e18;
  10277. --bg3-border-internal: #304248;
  10278. --bg3-bg-inner: #182830;
  10279. --bg3-bg-outer: #151e29;
  10280. --bg3-border-background: linear-gradient(
  10281. to right,
  10282. var(--bg3-border-outer) 0%,
  10283. var(--bg3-border-inner) 50%,
  10284. var(--bg3-border-outer) 100%
  10285. );
  10286. --bg3-tooltip-window-background: linear-gradient(
  10287. to right,
  10288. var(--bg3-bg-outer) 0,
  10289. var(--bg3-bg-inner) 50%,
  10290. var(--bg3-bg-outer) 100%
  10291. );
  10292. --button-toggle-background: var(--bg3-tooltip-window-background) padding-box,
  10293. var(--bg3-border-background) border-box;
  10294. --button-toggle-hover-background: var(--bg3-tooltip-window-background) padding-box,
  10295. var(--bg3-border-background) border-box;
  10296. }
  10297. [data-dorako-ui-scope=navigation][data-theme^=bg3] .scene.gm.active:not(.view) {
  10298. --button-toggle-focus-outline-color: transparent;
  10299. }
  10300. /* ----------------------------------------- */
  10301. /* Hotbar */
  10302. /* ----------------------------------------- */
  10303. [data-dorako-ui-scope=hotbar][data-theme^=bg3] nav.action-bar {
  10304. border-radius: var(--border-radius);
  10305. --app-border-color: rgba(0, 0, 0, 0.4);
  10306. --box-shadow: 0px 0px 6px 2px black inset;
  10307. }
  10308. [data-dorako-ui-scope=hotbar][data-theme^=bg3] nav.action-bar .macro {
  10309. --border-radius: 3px;
  10310. --app-background: rgba(80, 80, 80, 0.4);
  10311. }
  10312. [data-dorako-ui-scope=hotbar][data-theme^=bg3] .bar-controls {
  10313. background: var(--bg3-tooltip-window-background) !important;
  10314. border: 1px solid var(--bg3-border-outer) !important;
  10315. border-top-color: var(--bg3-border-inner) !important;
  10316. border-bottom-color: var(--bg3-border-inner) !important;
  10317. box-shadow: var(--box-shadow), 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset !important;
  10318. z-index: 1;
  10319. }
  10320. /* ----------------------------------------- */
  10321. /* Chat message */
  10322. /* ----------------------------------------- */
  10323. [data-theme^=bg3].chat-message .message-content .damage-application button[data-action=apply-healing]:hover,
  10324. [data-theme^=bg3].chat-message .message-content + .pf2e-toolbelt-target-damage .target-damage-application button[data-action=target-apply-healing]:hover {
  10325. --color-level-success: var(--bg3-healing) !important;
  10326. --color-level-success-border: color-mix(in srgb, var(--bg3-healing) 20%, white) !important;
  10327. }
  10328. [data-theme^=bg3].message .message-content .damage-application button[data-action=apply-healing] .fa-stack i.fa-plus {
  10329. --fa-inverse: black;
  10330. }
  10331. [data-theme^=bg3].message.chat-message {
  10332. --window-app-background: linear-gradient(
  10333. to bottom,
  10334. color-mix(in srgb, var(--player-color) 40%, transparent) 0,
  10335. transparent 40%
  10336. )
  10337. border-box,
  10338. var(--bg3-tooltip-window-background) padding-box,
  10339. linear-gradient(to right, var(--bg3-border-outer) 0%, var(--bg3-border-inner) 50%, var(--bg3-border-outer) 100%)
  10340. border-box;
  10341. background: var(--window-app-background);
  10342. border: 2px solid transparent !important;
  10343. box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset;
  10344. }
  10345. [data-theme^=bg3].message.chat-message[data-theme^=bg3-blue] {
  10346. --bg3-border-inner: #a16a37;
  10347. --bg3-border-outer: #4a2e18;
  10348. --bg3-border-internal: #304248;
  10349. --bg3-bg-inner: #182830;
  10350. --bg3-bg-outer: #151e29;
  10351. --bg3-border-background: linear-gradient(
  10352. to right,
  10353. var(--bg3-border-outer) 0%,
  10354. var(--bg3-border-inner) 50%,
  10355. var(--bg3-border-outer) 100%
  10356. );
  10357. --bg3-tooltip-window-background: linear-gradient(
  10358. to right,
  10359. var(--bg3-bg-outer) 0,
  10360. var(--bg3-bg-inner) 50%,
  10361. var(--bg3-bg-outer) 100%
  10362. );
  10363. background: linear-gradient(to bottom, color-mix(in srgb, var(--player-color) 40%, transparent) 0, transparent 40%) border-box, var(--bg3-tooltip-window-background) padding-box, linear-gradient(to right, var(--bg3-border-outer) 0%, var(--bg3-border-inner) 50%, var(--bg3-border-outer) 100%) border-box;
  10364. }
  10365. [data-theme^=bg3].message.chat-message[data-theme^=bg3-blue] .card-content hr {
  10366. border-color: var(--bg3-border-outer);
  10367. border: solid transparent;
  10368. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  10369. border-width: 0 0 2px;
  10370. border-image: linear-gradient(90deg, transparent, var(--bg3-border-internal) 50%, transparent) 1 repeat;
  10371. }
  10372. [data-theme^=bg3].message.chat-message[data-theme^=bg3-blue].dfce-cm-middle, [data-theme^=bg3].message.chat-message[data-theme^=bg3-blue].dfce-cm-bottom {
  10373. background: var(--bg3-tooltip-window-background) padding-box, linear-gradient(to right, var(--bg3-border-outer) 0%, var(--bg3-border-inner) 50%, var(--bg3-border-outer) 100%) border-box;
  10374. border-top-width: 1px !important;
  10375. }
  10376. [data-theme^=bg3].message.chat-message.dfce-cm-top {
  10377. border-bottom-width: 1px !important;
  10378. }
  10379. [data-theme^=bg3].message.chat-message.dfce-cm-middle, [data-theme^=bg3].message.chat-message.dfce-cm-bottom {
  10380. background: var(--bg3-tooltip-window-background) padding-box, linear-gradient(to right, var(--bg3-border-outer) 0%, var(--bg3-border-inner) 50%, var(--bg3-border-outer) 100%) border-box;
  10381. border-top-width: 1px !important;
  10382. }
  10383. [data-theme^=bg3].message.chat-message.dfce-cm-middle {
  10384. border-bottom-width: 1px !important;
  10385. }
  10386. [data-theme^=bg3].message.chat-message .message-header {
  10387. color: var(--bg3-text-1);
  10388. background: none;
  10389. }
  10390. [data-theme^=bg3].message.chat-message .card-content hr {
  10391. border: 1px solid var(--bg3-border-outer);
  10392. }
  10393. [data-theme^=bg3].message.chat-message[data-has-footer] {
  10394. padding-bottom: 0px;
  10395. }
  10396. [data-theme^=bg3].message.chat-message[data-has-footer] .pf2e.chat-card .card-footer {
  10397. position: relative;
  10398. padding: 5px 5px 5px 5px;
  10399. border-radius: 0px 0px 3px 3px;
  10400. border: none;
  10401. background: linear-gradient(to top, color-mix(in srgb, var(--bg3-ui-purple) 60%, transparent) 0, transparent 100%);
  10402. }
  10403. [data-theme^=bg3].message.chat-message[data-has-footer] .pf2e.chat-card .card-footer::before {
  10404. background: linear-gradient(to top, color-mix(in srgb, var(--bg3-text-3) 10%, transparent) 0, transparent 100%);
  10405. content: "";
  10406. position: absolute;
  10407. top: -25px;
  10408. left: 0;
  10409. width: 100%;
  10410. height: 100%;
  10411. overflow: visible;
  10412. pointer-events: none;
  10413. z-index: 0;
  10414. }
  10415. [data-theme^=bg3].message.chat-message .message-timestamp,
  10416. [data-theme^=bg3].message.chat-message .header-meta {
  10417. background: var(--app-background);
  10418. border: var(--app-border-width) solid var(--app-border-color);
  10419. text-shadow: var(--app-text-shadow);
  10420. border-radius: var(--border-radius);
  10421. box-shadow: var(--box-shadow);
  10422. color: var(--text-color-3);
  10423. background-color: color-mix(in srgb, var(--player-color) 33%, transparent);
  10424. border-color: color-mix(in srgb, var(--player-color) 50%, rgba(255, 255, 255, 0.5));
  10425. color: var(--bg3-text-1);
  10426. text-shadow: 0px 1px 1px black;
  10427. }
  10428. [data-theme^=bg3].message.chat-message .message-timestamp.rolltype.whisper,
  10429. [data-theme^=bg3].message.chat-message .header-meta.rolltype.whisper {
  10430. background-color: color-mix(in srgb, var(--bg3-alliance-companion-blue) 50%, transparent);
  10431. border-color: color-mix(in srgb, var(--bg3-alliance-companion-blue) 100%, rgba(255, 255, 255, 0.5));
  10432. }
  10433. [data-theme^=bg3].message.chat-message .message-timestamp.rolltype.blind,
  10434. [data-theme^=bg3].message.chat-message .header-meta.rolltype.blind {
  10435. background-color: color-mix(in srgb, var(--bg3-alliance-opposition-red) 50%, transparent);
  10436. border-color: color-mix(in srgb, var(--bg3-alliance-opposition-red) 100%, rgba(255, 255, 255, 0.5));
  10437. }
  10438. [data-theme^=bg3].message.chat-message .tags .tag.tag_transparent,
  10439. [data-theme^=bg3].message.chat-message .tags .tag option.tag_transparent {
  10440. background-color: color-mix(in srgb, var(--player-color) 20%, transparent);
  10441. box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--player-color) 50%, rgba(255, 255, 255, 0.5));
  10442. }
  10443. [data-theme^=bg3].message.chat-message .dice-tooltip .part-header {
  10444. border-color: var(--damage-color);
  10445. }
  10446. [data-theme^=bg3].message.chat-message .dice-tooltip .part-header .part-total {
  10447. border-color: var(--damage-color);
  10448. }
  10449. /* ----------------------------------------- */
  10450. /* Placeable HUD */
  10451. /* ----------------------------------------- */
  10452. [data-theme=bg3] [data-dorako-ui-scope=placeable-hud] {
  10453. --button-background: radial-gradient(circle, #363534 0, black 100%);
  10454. --button-border-color: #594537;
  10455. --button-hover-background: radial-gradient(circle, var(--bg3-alliance-opposition-red) 0, black 100%);
  10456. --button-focus-outline-color: #d3b87c;
  10457. --button-hover-border-color: #9a8860;
  10458. --button-toggle-border-color: #d3b87c;
  10459. --button-toggle-background: radial-gradient(circle, #0d3c48 0, black 100%);
  10460. --button-toggle-hover-background: radial-gradient(circle, var(--bg3-blue-light) 0, var(--bg3-blue) 100%);
  10461. }
  10462. /* ----------------------------------------- */
  10463. /* Controls */
  10464. /* ----------------------------------------- */
  10465. [data-dorako-ui-scope=controls][data-theme=bg3] {
  10466. --button-background: radial-gradient(circle, #363534 0, black 100%);
  10467. --button-border-color: #594537;
  10468. --button-hover-background: radial-gradient(circle, var(--bg3-alliance-opposition-red) 0, black 100%);
  10469. --button-focus-outline-color: #d3b87c;
  10470. --button-hover-border-color: #9a8860;
  10471. --box-shadow: 0px 0px 5px black, 0px 1px 2px black;
  10472. }
  10473. [data-dorako-ui-scope=players][data-theme=bg3] {
  10474. --app-background: var(--bg3-tooltip-window-background) padding-box,
  10475. linear-gradient(to right, var(--bg3-border-outer) 0%, var(--bg3-border-inner) 50%, var(--bg3-border-outer) 100%)
  10476. border-box;
  10477. --app-border-color: transparent;
  10478. --app-border-width: 2px;
  10479. box-shadow: 0px 0px 20px black, 0px 0px 10px black, 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset !important;
  10480. }
  10481. [data-dorako-ui-scope=players][data-theme=bg3]#players h3 {
  10482. margin: 3px 0px;
  10483. }
  10484. /* ----------------------------------------- */
  10485. /* TAH */
  10486. /* ----------------------------------------- */
  10487. [data-theme=bg3]#token-action-hud {
  10488. --button-background: radial-gradient(#363534 0, black 100%);
  10489. --button-border-color: #594537;
  10490. --button-hover-background: radial-gradient(var(--bg3-alliance-opposition-red) 0, black 100%);
  10491. --button-focus-outline-color: #d3b87c;
  10492. --button-hover-border-color: #9a8860;
  10493. }
  10494. [data-theme=bg3].locked-tooltip.tah-tooltip,
  10495. [data-theme=bg3].tah-tooltip,
  10496. [data-theme=bg3]#tooltip.active:has(.tah-tooltip-wrapper) {
  10497. --bg3-border-inner: #a16a37;
  10498. --bg3-border-outer: #4a2e18;
  10499. --bg3-border-internal: #304248;
  10500. --bg3-bg-inner: #182830;
  10501. --bg3-bg-outer: #151e29;
  10502. --bg3-border-background: linear-gradient(
  10503. to right,
  10504. var(--bg3-border-outer) 0%,
  10505. var(--bg3-border-inner) 50%,
  10506. var(--bg3-border-outer) 100%
  10507. );
  10508. --bg3-tooltip-window-background: linear-gradient(
  10509. to right,
  10510. var(--bg3-bg-outer) 0,
  10511. var(--bg3-bg-inner) 50%,
  10512. var(--bg3-bg-outer) 100%
  10513. );
  10514. background: var(--bg3-tooltip-window-background) padding-box, var(--bg3-border-background) border-box !important;
  10515. box-shadow: 0px 0px 20px black, 0px 0px 10px black, 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset !important;
  10516. }
  10517. [data-theme=bg3].locked-tooltip.tah-tooltip h3,
  10518. [data-theme=bg3].tah-tooltip h3,
  10519. [data-theme=bg3]#tooltip.active:has(.tah-tooltip-wrapper) h3 {
  10520. color: var(--bg3-text-1);
  10521. }
  10522. [data-theme=bg3].locked-tooltip.tah-tooltip strong,
  10523. [data-theme=bg3].tah-tooltip strong,
  10524. [data-theme=bg3]#tooltip.active:has(.tah-tooltip-wrapper) strong {
  10525. color: var(--bg3-text-2);
  10526. }
  10527. [data-theme=bg3].locked-tooltip.tah-tooltip hr,
  10528. [data-theme=bg3].tah-tooltip hr,
  10529. [data-theme=bg3]#tooltip.active:has(.tah-tooltip-wrapper) hr {
  10530. margin-left: -16px;
  10531. margin-right: -16px;
  10532. border-color: var(--bg3-border-outer);
  10533. border: solid transparent;
  10534. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  10535. border-width: 0 0 2px;
  10536. border-image: linear-gradient(90deg, transparent, var(--bg3-border-internal) 50%, transparent) 1 repeat;
  10537. width: auto;
  10538. }
  10539. /* ----------------------------------------- */
  10540. /* ITT */
  10541. /* ----------------------------------------- */
  10542. [data-theme=bg3]#pf2e-token-hud {
  10543. --bg3-border-inner: #a16a37;
  10544. --bg3-border-outer: #4a2e18;
  10545. --bg3-border-internal: #304248;
  10546. --bg3-bg-inner: #182830;
  10547. --bg3-bg-outer: #151e29;
  10548. --bg3-border-background: linear-gradient(
  10549. to right,
  10550. var(--bg3-border-outer) 0%,
  10551. var(--bg3-border-inner) 50%,
  10552. var(--bg3-border-outer) 100%
  10553. );
  10554. --bg3-tooltip-window-background: linear-gradient(
  10555. to right,
  10556. var(--bg3-bg-outer) 0,
  10557. var(--bg3-bg-inner) 50%,
  10558. var(--bg3-bg-outer) 100%
  10559. );
  10560. --app-border-color: transparent;
  10561. --app-border-width: 2px;
  10562. --color-primary-1: green;
  10563. --color-primary-2: var(--bg3-text-1);
  10564. --color-secondary-4: var(--bg3-bg-inner);
  10565. --color-secondary-5: var(--bg3-border-outer);
  10566. }
  10567. [data-theme=bg3]#pf2e-token-hud > div {
  10568. background: var(--bg3-tooltip-window-background) padding-box, var(--bg3-border-background) border-box !important;
  10569. box-shadow: 0px 0px 20px black, 0px 0px 10px black, 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset !important;
  10570. }
  10571. [data-theme=bg3]#pf2e-token-hud a:hover {
  10572. text-shadow: 0px 0px 5px rgba(255, 255, 255, 0.5);
  10573. }
  10574. [data-theme=bg3]#pf2e-token-hud .item-img.hover {
  10575. --color-primary-1: var(--bg3-text-1);
  10576. --color-primary-2: var(--bg3-accent-color-dark);
  10577. }
  10578. [data-theme=bg3]#pf2e-token-hud .inner .header {
  10579. z-index: 1;
  10580. }
  10581. [data-theme=bg3]#pf2e-token-hud .inner .header::before {
  10582. background: rgba(255, 255, 255, 0.1);
  10583. content: "";
  10584. position: absolute;
  10585. top: 0px;
  10586. left: 0px;
  10587. width: 100%;
  10588. height: 27px;
  10589. overflow: hidden;
  10590. pointer-events: none;
  10591. background: linear-gradient(to top, rgba(0, 0, 0, 0.33), transparent);
  10592. }
  10593. [data-theme=bg3]#pf2e-token-hud .inner .footer {
  10594. position: relative;
  10595. z-index: 1;
  10596. margin-left: -5px;
  10597. margin-right: -5px;
  10598. }
  10599. [data-theme=bg3]#pf2e-token-hud .inner .footer a {
  10600. z-index: 1;
  10601. }
  10602. [data-theme=bg3]#pf2e-token-hud .inner .footer::before {
  10603. background: rgba(255, 255, 255, 0.1);
  10604. content: "";
  10605. position: absolute;
  10606. bottom: 0px;
  10607. left: 0px;
  10608. width: 100%;
  10609. height: 24px;
  10610. overflow: hidden;
  10611. pointer-events: none;
  10612. background: linear-gradient(to bottom, rgba(0, 0, 0, 0.33), transparent);
  10613. }
  10614. [data-theme=bg3]#pf2e-token-hud .inner > hr {
  10615. margin-left: -5px;
  10616. margin-right: -5px;
  10617. border-color: var(--bg3-border-outer);
  10618. border: solid transparent;
  10619. border-image: linear-gradient(90deg, #f1edea, #d5cac1) 1 repeat;
  10620. border-width: 0 0 2px;
  10621. border-image: linear-gradient(90deg, transparent, var(--bg3-border-internal) 50%, transparent) 1 repeat;
  10622. width: auto;
  10623. }
  10624. [data-theme=bg3]#pf2e-token-hud .sidebar {
  10625. box-shadow: 0px 0px 20px black, 0px 0px 10px black, 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset !important;
  10626. }
  10627. [data-theme=bg3]#pf2e-token-hud .distance.free {
  10628. --app-background: var(--bg3-bg-outer);
  10629. --app-border-color: var(--bg3-border-inner);
  10630. }
  10631. [data-theme=bg3]#pf2e-token-hud .popup {
  10632. box-shadow: 0px 0px 30px black, 0px 0px 20px black, 0px 0px 10px black, 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset !important;
  10633. }
  10634. /* ----------------------------------------- */
  10635. /* Chatlog */
  10636. /* ----------------------------------------- */
  10637. [data-chat-interface-theme=bg3] {
  10638. --scrollbar-thumb-background: var(--bg3-scrollbar-thumb-background);
  10639. --scrollbar-thumb-border-color: var(--bg3-scrollbar-thumb-border-color);
  10640. --color-scrollbar-hover: var(--bg3-color-scrollbar-highlight);
  10641. }
  10642. [data-chat-interface-theme=bg3] #sidebar-tabs {
  10643. --button-hover-background: radial-gradient(circle, var(--bg3-alliance-opposition-red) 50%, black 100%);
  10644. --button-hover-border-color: #d3b87c;
  10645. }
  10646. [data-chat-interface-theme=bg3] #chat-log ~ * #dorako-rt-buttons button {
  10647. --button-toggle-background: radial-gradient(circle, #363534 0, black 100%);
  10648. --button-focus-outline-color: #d3b87c;
  10649. --button-toggle-border-color: #9a8860;
  10650. --button-toggle-hover-border-color: #9a8860;
  10651. }
  10652. [data-chat-interface-theme=bg3] #chat-log ~ * #dorako-rt-buttons button[data-id=publicroll] {
  10653. --button-hover-background: radial-gradient(circle, var(--bg3-alliance-ally-yellow) 0, black 100%);
  10654. }
  10655. [data-chat-interface-theme=bg3] #chat-log ~ * #dorako-rt-buttons button[data-id=gmroll] {
  10656. --button-hover-background: radial-gradient(circle, var(--bg3-alliance-companion-blue) 0, black 100%);
  10657. }
  10658. [data-chat-interface-theme=bg3] #chat-log ~ * #dorako-rt-buttons button[data-id=blindroll] {
  10659. --button-hover-background: radial-gradient(circle, var(--bg3-alliance-opposition-red) 0, black 100%);
  10660. }
  10661. [data-chat-interface-theme=bg3] #chat-log ~ * #dorako-rt-buttons button[data-id=selfroll] {
  10662. --button-hover-background: radial-gradient(circle, var(--bg3-alliance-ally-green) 0, black 100%);
  10663. }
  10664. [data-chat-interface-theme^=crb] #sidebar-tabs,
  10665. [data-chat-interface-theme^=crb] #chat-log ~ *,
  10666. [data-theme^=crb] {
  10667. --icon-border-color: var(--tertiary);
  10668. --scrollbar-thumb-background: var(--tertiary);
  10669. --scrollbar-thumb-border-color: color-mix(in srgb, var(--tertiary) 50%, black);
  10670. --color-scrollbar-hover: color-mix(in srgb, var(--tertiary) 50%, white);
  10671. --window-app-border-color: var(--tertiary);
  10672. --window-app-border-width: 1px;
  10673. --box-shadow: var(--glassy);
  10674. --accent-color: var(--tertiary);
  10675. --inline-box-shadow: none;
  10676. --inline-background: #ddd;
  10677. --inline-border-color: black;
  10678. --inline-text-color: black;
  10679. --inline-icon-color: var(--color-text-dark-inactive);
  10680. --input-box-shadow: none;
  10681. --input-border-color: var(--color-text-light-5);
  10682. --input-text-color: var(--color-text-dark-input);
  10683. --input-focus-text-color: var(--color-text-dark-input);
  10684. --input-background: rgba(255, 255, 255, 0.5);
  10685. --input-focus-outline-color: var(--primary-light);
  10686. --input-placeholder-color: rgba(0, 0, 0, 0.5);
  10687. --button-background: var(--app-background);
  10688. --button-border-color: var(--app-border-color);
  10689. --button-text-color: var(--text-color-3);
  10690. --button-focus-outline-color: var(--color-primary-1);
  10691. --button-hover-background: var(--color-primary-2);
  10692. --button-hover-border-color: var(--color-primary-1);
  10693. --button-hover-text-color: var(--text-color-1);
  10694. --button-disabled-background: var(--color-primary-5);
  10695. --button-disabled-border-color: var(--color-primary-4);
  10696. --button-toggle-border-color: var(--secondary-light);
  10697. --button-toggle-background: var(--secondary-dark);
  10698. --button-toggle-hover-background: var(--secondary-light);
  10699. --color-primary-1: var(--tertiary);
  10700. --color-primary-2: var(--primary-light);
  10701. --color-primary-3: var(--primary-dark);
  10702. --color-primary-3-75: color-mix(in srgb, var(--color-primary-3) 75%, transparent);
  10703. --color-primary-4-75: color-mix(in srgb, var(--color-primary-4) 75%, transparent);
  10704. --color-secondary-1: var(--secondary-light);
  10705. --color-secondary-2: var(--secondary);
  10706. --color-secondary-3: var(--secondary-dark);
  10707. --color-secondary-3-75: color-mix(in srgb, var(--color-secondary-3) 75%, transparent);
  10708. --color-border-light-1: #ddd;
  10709. --color-border-light-2: #999;
  10710. }
  10711. [data-chat-interface-theme^=crb] #chat-log ~ *,
  10712. [data-theme^=crb]:not([data-color-scheme]) {
  10713. --text-color-2: var(--color-text-light-highlight);
  10714. --text-color-3: var(--color-text-light-heading);
  10715. --input-text-color: black;
  10716. --input-focus-text-color: black;
  10717. --input-focus-outline-color: var(--tertiary);
  10718. --button-background: var(--glass-bg-light);
  10719. --app-background: var(--glass-bg);
  10720. --app-border-color: transparent;
  10721. --app-border-width: 0px;
  10722. --window-app-background: var(--glass-bg);
  10723. --window-app-box-shadow: var(--glassy), 0px 5px 30px black;
  10724. outline: none !important;
  10725. }
  10726. [data-chat-interface-theme^=crb] #chat-log ~ *#token-hud, [data-chat-interface-theme^=crb] #chat-log ~ *#tile-hud,
  10727. [data-theme^=crb]:not([data-color-scheme])#token-hud,
  10728. [data-theme^=crb]:not([data-color-scheme])#tile-hud {
  10729. --button-background: var(--glass-bg);
  10730. --input-text-color: var(--text-color-2);
  10731. }
  10732. [data-theme^=crb] button {
  10733. --text-color-1: white;
  10734. --text-color-2: var(--color-text-light-highlight);
  10735. --text-color-3: var(--color-text-light-heading);
  10736. }
  10737. [data-theme^=crb].app.window-app {
  10738. outline: 1px solid var(--gold-brown);
  10739. }
  10740. [data-theme^=crb].app.window-app.sidebar-popout {
  10741. outline: none;
  10742. }
  10743. [data-theme^=crb].app.window-app.journal-sheet.journal-entry {
  10744. --window-app-background: var(--glass-bg);
  10745. }
  10746. [data-theme^=crb]#controls, [data-theme^=crb]#navigation {
  10747. --button-background: var(--glass-bg);
  10748. }
  10749. [data-theme^=crb].sheet.journal-entry .journal-entry-content {
  10750. background-image: var(--sheet);
  10751. background-size: cover;
  10752. border: var(--window-app-border-width) solid;
  10753. border-color: var(--window-app-border-color);
  10754. box-shadow: 0px 0px 0px 1px var(--gold-brown);
  10755. border-bottom: unset;
  10756. border-right: unset;
  10757. margin: unset;
  10758. }
  10759. [data-theme^=crb].spellcasting-entry.preparation ol.spell-list > li .item-name .item-image, [data-theme^=crb].actor.sheet .item-image {
  10760. --box-shadow: 0px 0px 0px 1px var(--gold-brown);
  10761. }
  10762. [data-theme^=crb].chat-message {
  10763. outline: 1px solid var(--gold-brown);
  10764. }
  10765. [data-theme^=crb].chat-message[data-has-header] .message-header {
  10766. background-image: var(--sheet-light);
  10767. background-size: cover;
  10768. background-color: var(--header-color);
  10769. background-blend-mode: multiply;
  10770. border-bottom: 1px solid var(--tertiary);
  10771. box-shadow: 0px 1px 0px 0px var(--gold-brown);
  10772. margin-bottom: 5px;
  10773. padding-bottom: 5px;
  10774. }
  10775. [data-theme^=crb].chat-message[data-has-header][data-header-text-color-scheme=light] .message-header {
  10776. color: white !important;
  10777. text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5) !important;
  10778. }
  10779. [data-theme^=crb].chat-message[data-has-header][data-header-text-color-scheme=light] .message-header .message-sender:not([data-visibility=gm]) {
  10780. color: white !important;
  10781. }
  10782. [data-theme^=crb].chat-message[data-has-header][data-header-text-color-scheme=light] .message-header .header-meta {
  10783. background: rgba(255, 255, 255, 0.2);
  10784. border-color: rgba(255, 255, 255, 0.5);
  10785. text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
  10786. }
  10787. [data-theme^=crb].chat-message[data-has-header][data-header-text-color-scheme=dark] .message-header {
  10788. color: black !important;
  10789. text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5) !important;
  10790. }
  10791. [data-theme^=crb].chat-message[data-has-header][data-header-text-color-scheme=dark] .message-header .header-meta {
  10792. background: rgba(0, 0, 0, 0.2);
  10793. border-color: rgba(0, 0, 0, 0.5);
  10794. }
  10795. [data-theme^=crb].chat-message .card-content {
  10796. --app-border-color: var(--tertiary);
  10797. border-image-repeat: repeat;
  10798. border-image-slice: 11;
  10799. border-image-source: var(--ornamentation);
  10800. border-image-width: 14px;
  10801. border-style: double;
  10802. padding: 3px 10px;
  10803. font-weight: 500;
  10804. margin: 0px;
  10805. margin-top: 5px;
  10806. }
  10807. [data-theme^=crb].chat-message .card-content hr {
  10808. margin: 0px -10px;
  10809. border-bottom: none;
  10810. }
  10811. [data-theme^=crb].chat-message .card-footer {
  10812. border: none;
  10813. }
  10814. [data-theme^=crb].chat-message .card-footer span {
  10815. border-right: 1px solid gray;
  10816. padding-right: 5px;
  10817. }
  10818. [data-theme^=crb] hr {
  10819. border-top: none;
  10820. }
  10821. [data-theme^=crb]#hotbar .macro {
  10822. border: 1px solid black;
  10823. }
  10824. [data-theme^=crb].sidebar-popout {
  10825. background: var(--app-background) !important;
  10826. }
  10827. [data-theme^=crb].message.chat-message {
  10828. background: var(--window-app-background);
  10829. background-position: top;
  10830. background-size: cover;
  10831. }
  10832. [data-theme^=crb].message.chat-message.whisper {
  10833. background: var(--window-app-background);
  10834. background-color: var(--whisper-bg);
  10835. background-blend-mode: luminosity;
  10836. background-size: cover;
  10837. border-color: var(--tertiary);
  10838. }
  10839. [data-theme^=crb].message.chat-message.whisper.blind {
  10840. background: var(--window-app-background);
  10841. background-color: var(--blind-bg);
  10842. background-blend-mode: luminosity;
  10843. background-size: cover;
  10844. border-color: var(--tertiary);
  10845. }
  10846. [data-theme^=crb]#effects-panel .effect-item > .icon {
  10847. --box-shadow: var(--gold-and-glow);
  10848. --border-radius: 50%;
  10849. }
  10850. [data-theme^=crb]#effects-panel .effect-item > .icon.aura {
  10851. border-radius: 33%;
  10852. transform: scale(0.8);
  10853. }
  10854. /* ----------------------------------------- */
  10855. /* Modules */
  10856. /* ----------------------------------------- */
  10857. [data-theme^=crb]#token-action-hud button {
  10858. --button-background: var(--glass-bg);
  10859. }
  10860. [data-theme^=crb]#token-action-hud .hover > button {
  10861. --button-background: var(--button-hover-background);
  10862. }
  10863. [data-theme^=crb]#pf2e-token-hud {
  10864. --color-primary-2: var(--tertiary);
  10865. --color-secondary-4: var(--glass-bg-light);
  10866. }
  10867. [data-theme^=crb]#pf2e-token-hud hr {
  10868. display: none;
  10869. }
  10870. /* ----------------------------------------- */
  10871. /* Navigation */
  10872. /* ----------------------------------------- */
  10873. [data-dorako-ui-scope=navigation][data-theme^=crb] .scene {
  10874. --button-toggle-focus-outline-color: #d3b87c;
  10875. }
  10876. [data-dorako-ui-scope=navigation][data-theme^=crb] .scene:not(.gm) {
  10877. --button-toggle-background: var(--app-background);
  10878. --button-toggle-hover-background: var(--primary-light);
  10879. }
  10880. [data-dorako-ui-scope=navigation][data-theme^=crb] .scene.gm.active:not(.view) {
  10881. --button-toggle-focus-outline-color: transparent;
  10882. }
  10883. /* ----------------------------------------- */
  10884. /* Chatlog */
  10885. /* ----------------------------------------- */
  10886. [data-chat-interface-theme^=crb] {
  10887. --scrollbar-thumb-background: var(--tertiary);
  10888. --scrollbar-thumb-border-color: color-mix(in srgb, var(--tertiary) 50%, black);
  10889. --color-scrollbar-hover: color-mix(in srgb, var(--tertiary) 50%, white);
  10890. }
  10891. /* ----------------------------------------- */
  10892. /* Placeable HUD */
  10893. /* ----------------------------------------- */
  10894. [data-theme^=crb] [data-dorako-ui-scope=placeable-hud] {
  10895. --button-background: var(--glass-bg);
  10896. }
  10897. /* ----------------------------------------- */
  10898. /* Theme colors */
  10899. /* ----------------------------------------- */
  10900. :root {
  10901. --f2-color-warm-1: #ee9b3a;
  10902. --f2-color-warm-1-40: color-mix(in srgb, var(--color-warm-1) 40%, transparent);
  10903. --f2-color-warm-2: #c9593f;
  10904. --f2-color-warm-2-20: color-mix(in srgb, var(--color-warm-2) 20%, transparent);
  10905. --f2-color-warm-3: #5d142b;
  10906. --f2-color-warm-3-10: color-mix(in srgb, var(--color-warm-3) 10%, transparent);
  10907. --f2-color-warm-3-75: color-mix(in srgb, var(--color-warm-3) 75%, transparent);
  10908. --f2-color-warm-4: #420418;
  10909. --f2-color-warm-4-75: color-mix(in srgb, var(--color-warm-4) 75%, transparent);
  10910. --f2-color-warm-5: #26020d;
  10911. --f2-color-cool-1: #b1a0d4;
  10912. --f2-color-cool-2: #79689c;
  10913. --f2-color-cool-3: #584a75;
  10914. --f2-color-cool-3-75: color-mix(in srgb, var(--color-cool-3) 75%, transparent);
  10915. --f2-color-cool-4: #302831;
  10916. --f2-color-cool-5: #0b0a13;
  10917. --f2-color-cool-5-25: rgba(11, 10, 19, 0.25);
  10918. --f2-color-cool-5-50: rgba(11, 10, 19, 0.5);
  10919. --f2-color-cool-5-75: rgba(11, 10, 19, 0.75);
  10920. --f2-color-cool-5-90: rgba(11, 10, 19, 0.9);
  10921. --f2-color-light-1: #f7f3e8;
  10922. --f2-color-light-2: #efe6d8;
  10923. --f2-color-light-3: #e7d1b1;
  10924. --f2-color-light-4: #d0b8a3;
  10925. --f2-color-light-5: #9f8475;
  10926. --f2-color-light-disabled: #aaa;
  10927. --f2-color-level-error: #ce0707;
  10928. --f2-color-level-error-bg: rgba(105, 0, 8, 0.8);
  10929. --f2-color-level-error-border: #750003;
  10930. --f2-color-level-info: #59a1f6;
  10931. --f2-color-level-info-bg: rgba(47, 80, 132, 0.8);
  10932. --f2-color-level-info-border: #5c87b9;
  10933. --f2-color-level-success: #26b231;
  10934. --f2-color-level-success-bg: rgba(26, 107, 34, 0.8);
  10935. --f2-color-level-success-border: #1b8f23;
  10936. --f2-color-level-warning: #ee9b3a;
  10937. --f2-color-level-warning-bg: rgba(214, 150, 0, 0.8);
  10938. --f2-color-level-warning-border: #b18404;
  10939. --f2-color-level-green-bg: rgba(138, 211, 4, 0.4);
  10940. --f2-color-level-green-border: #8ad304;
  10941. --f2-color-level-yellow-bg: rgba(211, 192, 4, 0.4);
  10942. --f2-color-level-yellow-border: #d3c004;
  10943. --f2-color-level-orange-bg: rgba(211, 119, 4, 0.4);
  10944. --f2-color-level-orange-border: #d37704;
  10945. --f2-color-level-red-bg: rgba(211, 20, 4, 0.4);
  10946. --f2-color-level-red-border: #d31404;
  10947. --f2-scrollbar-thumb-background: #5d142b;
  10948. --f2-scrollbar-thumb-border-color: #8d151b;
  10949. }
  10950. /* ----------------------------------------- */
  10951. /* Map v1 styling to v2 values */
  10952. /* ----------------------------------------- */
  10953. [data-theme=foundry2] {
  10954. --color-shadow-primary: transparent;
  10955. --color-shadow-highlight: transparent;
  10956. --color-border-light-primary: var(--app-border-color);
  10957. --color-border-light-highlight: var(--app-border-color);
  10958. --color-underline-header: var(--color-primary-2);
  10959. --color-underline-active: var(--color-primary-1);
  10960. --color-text-dark-primary: var(--text-color-3);
  10961. --color-text-dark-secondary: var(--text-color-5);
  10962. }
  10963. /* ----------------------------------------- */
  10964. /* Light color scheme */
  10965. /* ----------------------------------------- */
  10966. [data-theme=foundry2][data-color-scheme=light] {
  10967. --window-app-background: color-mix(in srgb, var(--color-secondary-5-90) 90%, var(--color-primary-1));
  10968. --ornamentation: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' overflow='scroll'%3E%3Cstyle%3E.st1{stroke:wheat;stroke-miterlimit:10}.st1,.st2{fill:none}%3C/style%3E%3Cg opacity='1'%3E%3Cpath class='st1' d='M.5 20v-7'/%3E%3Cpath class='st2' d='M13 20v-7'/%3E%3Cpath class='st1' d='M13 .5h7'/%3E%3Cpath class='st2' d='M13 13h7'/%3E%3Cpath class='st1' d='M32.5 13v7'/%3E%3Cpath class='st2' d='M20 13v7'/%3E%3Cpath class='st1' d='M20 32.5h-7'/%3E%3Cpath class='st2' d='M20 20h-7'/%3E%3Cpath class='st1' d='M.5.5h3.1v3.1H.5zm3.1 3.1h3.1v3.1H3.6zm3.2 0h3.1v3.1H6.8zM3.6 6.8h3.1v3.1H3.6zm0 0H.5V13M13 .5H6.8v3.1M29.4.5h3.1v3.1h-3.1zm-3.1 3.1h3.1v3.1h-3.1zm0 3.2h3.1v3.1h-3.1zm-3.2-3.2h3.1v3.1h-3.1zm3.2 0V.5H20M32.5 13V6.8h-3.1M29.4 29.4h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M26.3 26.3h3.1v3.1h-3.1zm-3.2 0h3.1v3.1h-3.1zm3.2-3.2h3.1v3.1h-3.1z'/%3E%3Cpath class='st1' d='M29.4 26.3h3.1V20M20 32.5h6.3v-3.1'/%3E%3Cg%3E%3Cpath class='st1' d='M.5 29.4h3.1v3.1H.5zm3.1-3.1h3.1v3.1H3.6zm0-3.2h3.1v3.1H3.6zm3.2 3.2h3.1v3.1H6.8zM6.8 29.4v3.1H13M.5 20v6.3h3.1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  10969. }
  10970. [data-theme=foundry2][data-color-scheme=light].pf2e.item.sheet {
  10971. --color-border-medium: var(--color-secondary-3);
  10972. }
  10973. /* ----------------------------------------- */
  10974. /* DUI variables */
  10975. /* ----------------------------------------- */
  10976. [data-chat-interface-theme=foundry2] #sidebar-tabs,
  10977. [data-chat-interface-theme=foundry2] #chat-log ~ *,
  10978. [data-theme=foundry2] {
  10979. --color-primary-1: var(--f2-color-warm-1);
  10980. --color-primary-1-40: color-mix(in srgb, var(--color-primary-1) 40%, transparent);
  10981. --color-primary-2: var(--f2-color-warm-2);
  10982. --color-primary-2-20: color-mix(in srgb, var(--color-primary-2) 20%, transparent);
  10983. --color-primary-3: var(--f2-color-warm-3);
  10984. --color-primary-3-10: color-mix(in srgb, var(--color-primary-3) 10%, transparent);
  10985. --color-primary-3-75: color-mix(in srgb, var(--color-primary-3) 75%, transparent);
  10986. --color-primary-4: var(--f2-color-warm-4);
  10987. --color-primary-4-75: color-mix(in srgb, var(--color-primary-4) 75%, transparent);
  10988. --color-primary-5: var(--f2-color-warm-5);
  10989. --color-secondary-1: var(--f2-color-cool-1);
  10990. --color-secondary-2: var(--f2-color-cool-2);
  10991. --color-secondary-3: var(--f2-color-cool-3);
  10992. --color-secondary-3-75: color-mix(in srgb, var(--color-secondary-3) 75%, transparent);
  10993. --color-secondary-4: var(--f2-color-cool-4);
  10994. --color-secondary-5: var(--f2-color-cool-5);
  10995. --color-secondary-5-25: rgba(11, 10, 19, 0.25);
  10996. --color-secondary-5-50: rgba(11, 10, 19, 0.5);
  10997. --color-secondary-5-75: rgba(11, 10, 19, 0.75);
  10998. --color-secondary-5-90: rgba(11, 10, 19, 0.9);
  10999. --text-color-1: var(--f2-color-light-1);
  11000. --text-color-2: var(--f2-color-light-2);
  11001. --text-color-3: var(--f2-color-light-3);
  11002. --text-color-4: var(--f2-color-light-4);
  11003. --text-color-5: var(--f2-color-light-5);
  11004. --text-color-disabled: #aaa;
  11005. --icon-border-color: var(--color-primary-1);
  11006. --input-box-shadow: none;
  11007. --input-background: var(--color-secondary-4);
  11008. --input-border-color: var(--color-secondary-3);
  11009. --input-focus-text-color: var(--text-color-2);
  11010. --input-text-color: var(--text-color-3);
  11011. --input-placeholder-color: var(--text-color-4);
  11012. --input-text-selection-color: var(--color-secondary-3);
  11013. --input-focus-outline-color: var(--color-secondary-3);
  11014. --input-disabled-background: var(--color-secondary-5);
  11015. --input-disabled-border-color: var(--color-secondary-4);
  11016. --fieldset-border-color: var(--color-secondary-3);
  11017. --fieldset-background-color: transparent;
  11018. --fieldset-legend-color: var(--text-color-2);
  11019. --button-border-color: var(--color-secondary-3);
  11020. --app-border-width: 1px;
  11021. --button-background: var(--app-background);
  11022. --button-border-color: var(--app-border-color);
  11023. --button-text-color: var(--text-color-3);
  11024. --button-focus-outline-color: var(--color-primary-1);
  11025. --button-hover-background: var(--color-primary-2);
  11026. --button-hover-border-color: var(--color-primary-1);
  11027. --button-hover-text-color: var(--text-color-1);
  11028. --button-disabled-background: var(--color-primary-5);
  11029. --button-disabled-border-color: var(--color-primary-4);
  11030. --button-toggle-border-color: var(--color-secondary-2);
  11031. --button-toggle-background: var(--color-secondary-3-75);
  11032. --button-toggle-hover-background: var(--color-secondary-2);
  11033. --button-toggle-hover-border-color: var(--color-secondary-1);
  11034. --button-toggle-focus-outline-color: var(--color-primary-1);
  11035. --button-bright-text-color: var(--text-color-1);
  11036. --app-background: var(--color-secondary-5-90);
  11037. --app-border-color: var(--color-secondary-4);
  11038. --window-app-background: var(--color-secondary-5-90);
  11039. --window-app-border-color: var(--color-secondary-4);
  11040. --window-app-box-shadow: 0px 5px 20px 3px black, 0px 0px 50px 30px var(--color-primary-3-10),
  11041. 0px 0px 30px 20px var(--color-primary-2-20), 0px 0px 10px 05px var(--color-primary-1-40);
  11042. --accent-text-color: black;
  11043. --accent-color-light: color-mix(in srgb, var(--f2-color-warm-1) 80%, white);
  11044. --accent-color: var(--f2-color-warm-1);
  11045. --accent-color-dark: color-mix(in srgb, var(--f2-color-warm-1) 80%, black);
  11046. --inline-background: var(--color-secondary-4);
  11047. --inline-border-color: var(--color-secondary-3);
  11048. --inline-text-color: var(--text-color-2);
  11049. --inline-icon-color: var(--text-color-1);
  11050. --inline-box-shadow: 0px 1px 2px black;
  11051. }
  11052. /* ----------------------------------------- */
  11053. /* System variables */
  11054. /* ----------------------------------------- */
  11055. [data-theme=foundry2] {
  11056. --bg: var(--color-primary-3);
  11057. --text-dark: var(--text-color-2);
  11058. }
  11059. /* ----------------------------------------- */
  11060. /* Specifics */
  11061. /* ----------------------------------------- */
  11062. [data-theme=foundry2].message.chat-message {
  11063. --window-app-border-width: 1px;
  11064. --box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.5);
  11065. --window-app-border-color: var(--player-color);
  11066. --window-app-background: color-mix(in srgb, var(--player-color) 30%, var(--app-background));
  11067. background-position: top;
  11068. background-size: cover;
  11069. }
  11070. [data-theme=foundry2].message.chat-message hr {
  11071. border-top: 1px solid color-mix(in srgb, var(--player-color) 100%, transparent);
  11072. border-bottom: 1px solid color-mix(in srgb, var(--player-color) 30%, transparent);
  11073. }
  11074. [data-theme=foundry2].message.chat-message .message-timestamp,
  11075. [data-theme=foundry2].message.chat-message .header-meta {
  11076. background: var(--app-background);
  11077. border: var(--app-border-width) solid var(--app-border-color);
  11078. text-shadow: var(--app-text-shadow);
  11079. border-radius: var(--border-radius);
  11080. box-shadow: var(--box-shadow);
  11081. color: var(--text-color-3);
  11082. background-color: color-mix(in srgb, var(--player-color) 33%, transparent);
  11083. border: 1px solid color-mix(in srgb, var(--player-color) 50%, rgba(255, 255, 255, 0.5));
  11084. color: var(--text-color-1);
  11085. text-shadow: 0px 1px 1px black;
  11086. }
  11087. [data-theme=foundry2].message.chat-message .message-timestamp.blind,
  11088. [data-theme=foundry2].message.chat-message .header-meta.blind {
  11089. background-color: color-mix(in srgb, var(--blind-bg) 50%, transparent);
  11090. border: 1px solid color-mix(in srgb, var(--blind-bg) 66%, rgba(255, 255, 255, 0.5));
  11091. }
  11092. [data-theme=foundry2].message.chat-message .message-timestamp.whisper,
  11093. [data-theme=foundry2].message.chat-message .header-meta.whisper {
  11094. background-color: color-mix(in srgb, rgb(42, 113, 255) 33%, transparent);
  11095. border: 1px solid color-mix(in srgb, rgb(42, 113, 255) 50%, rgba(255, 255, 255, 0.5));
  11096. }
  11097. [data-theme=foundry2].window-app.sidebar-popout {
  11098. border: none;
  11099. }
  11100. [data-theme=foundry2].actor.sheet .crb-style .sheet-body {
  11101. --primary: var(--color-primary-2);
  11102. --secondary: var(--color-secondary-3);
  11103. --text-dark: var(--text-color-2);
  11104. --color-border-light-2: var(--color-secondary-4);
  11105. --color-border-light-primary: var(--color-primary-1);
  11106. --color-border-light-highlight: var(--color-primary-2);
  11107. --color-border-divider: var(--color-secondary-3);
  11108. --sub: var(--text-color-disabled);
  11109. --alt: var(--text-color-5);
  11110. --bg: var(--color-secondary-5-90);
  11111. }
  11112. [data-theme=foundry2].spellcasting-entry {
  11113. --primary: var(--color-primary-2);
  11114. --secondary: var(--color-secondary-3);
  11115. --text-dark: var(--text-color-2);
  11116. --color-border-divider: var(--color-secondary-3);
  11117. --sub: var(--text-color-disabled);
  11118. --alt: var(--text-color-5);
  11119. --bg: var(--color-secondary-5-90);
  11120. }
  11121. [data-theme=foundry2].actor.sheet .inventory .list-row .item-controls {
  11122. --secondary: var(--color-secondary-2);
  11123. }
  11124. [data-theme=foundry2] .tags .tag.tag_transparent,
  11125. [data-theme=foundry2] .tags .tag option.tag_transparent {
  11126. box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.2) inset;
  11127. background: var(--color-secondary-4);
  11128. color: var(--text-color-3);
  11129. text-shadow: none;
  11130. }
  11131. [data-theme=foundry2].sheet.kingdom-builder, [data-theme=foundry2].sheet.kingdom {
  11132. --primary: var(--color-primary-2);
  11133. --secondary: var(--color-secondary-3);
  11134. --text-dark: var(--text-color-2);
  11135. --color-border-divider: var(--color-secondary-3);
  11136. --sub: var(--text-color-disabled);
  11137. --alt: var(--text-color-5);
  11138. --alt-dark: var(--text-color-4);
  11139. --bg: var(--color-secondary-5-90);
  11140. --paper-bg: var(--color-secondary-4);
  11141. }
  11142. /* ----------------------------------------- */
  11143. /* Controls */
  11144. /* ----------------------------------------- */
  11145. /* ----------------------------------------- */
  11146. /* Navigation */
  11147. /* ----------------------------------------- */
  11148. [data-dorako-ui-scope=navigation][data-theme=foundry2] .scene:not(.gm) {
  11149. --button-toggle-background: var(--app-background);
  11150. --button-toggle-border-color: var(--color-secondary-4);
  11151. --button-toggle-hover-border-color: var(--color-primary-1);
  11152. --button-toggle-hover-background: var(--color-primary-2);
  11153. }
  11154. [data-dorako-ui-scope=navigation][data-theme=foundry2] .scene.gm {
  11155. --button-toggle-background: var(--color-secondary-3-75);
  11156. --button-toggle-border-color: var(--color-secondary-2);
  11157. --button-toggle-hover-border-color: var(--color-secondary-1);
  11158. --button-toggle-hover-background: var(--color-secondary-2);
  11159. }
  11160. [data-dorako-ui-scope=navigation][data-theme=foundry2] .scene.gm.active:not(.view) {
  11161. --button-toggle-focus-outline-color: transparent;
  11162. }
  11163. [data-chat-interface-theme=opaque] #chat-log ~ *,
  11164. [data-theme=opaque]:not([data-color-scheme]) {
  11165. --button-background: rgb(30, 30, 30);
  11166. --app-background: rgb(30, 30, 30);
  11167. --app-border-color: rgb(80, 80, 80);
  11168. --app-border-width: 1px;
  11169. --window-app-background: rgb(30, 30, 30);
  11170. --window-app-border-width: 1px;
  11171. --window-app-border-color: rgb(80, 80, 80);
  11172. --input-box-shadow: none;
  11173. --input-border-color: var(--button-border-color);
  11174. --input-text-color: black;
  11175. --input-focus-text-color: black;
  11176. --input-background: rgba(255, 255, 255, 0.5);
  11177. --input-focus-outline-color: var(--primary-light);
  11178. --input-placeholder-color: rgba(0, 0, 0, 0.5);
  11179. --color-primary-1: var(--tertiary);
  11180. --color-primary-2: var(--primary-light);
  11181. --color-primary-3: var(--primary-dark);
  11182. --color-primary-3-75: var(--color-primary-3);
  11183. --color-primary-4-75: var(--color-primary-4);
  11184. --color-secondary-1: var(--secondary-light);
  11185. --color-secondary-2: var(--secondary);
  11186. --color-secondary-3: var(--secondary-dark);
  11187. --color-secondary-3-75: var(--color-secondary-3);
  11188. --button-background: var(--app-background);
  11189. --button-border-color: var(--app-border-color);
  11190. --button-text-color: var(--text-color-3);
  11191. --button-focus-outline-color: var(--tertiary);
  11192. --button-hover-background: var(--primary-light);
  11193. --button-hover-border-color: var(--tertiary);
  11194. --button-hover-text-color: var(--text-color-1);
  11195. --button-disabled-background: var(--color-primary-5);
  11196. --button-disabled-border-color: var(--color-primary-4);
  11197. --button-bright-text-color: white;
  11198. --button-toggle-border-color: var(--secondary-light);
  11199. --button-toggle-hover-border-color: color-mix(in srgb, var(--secondary) 50%, white 50%);
  11200. --button-toggle-background: color-mix(in srgb, var(--secondary) 50%, black 50%);
  11201. --button-toggle-hover-background: var(--secondary-light);
  11202. --scrollbar-thumb-background: var(--bg3-scrollbar-thumb-background);
  11203. --scrollbar-thumb-border-color: var(--bg3-scrollbar-thumb-border-color);
  11204. --color-scrollbar-hover: var(--bg3-color-scrollbar-highlight);
  11205. /* Inline variables */
  11206. --inline-background: #303030;
  11207. --inline-border-color: #404040;
  11208. --inline-text-color: var(--text-color-2);
  11209. --inline-icon-color: var(--text-color-1);
  11210. --inline-box-shadow: 0px 1px 2px black;
  11211. --accent-color: var(--primary-light);
  11212. --icon-border-color: var(--tertiary);
  11213. --color-border-light-primary: var(--app-border-color);
  11214. --color-border-light-highlight: var(--app-border-color);
  11215. }
  11216. [data-chat-interface-theme=opaque] #chat-log ~ *#token-hud,
  11217. [data-theme=opaque]:not([data-color-scheme])#token-hud {
  11218. --input-text-color: var(--text-color-2);
  11219. }
  11220. [data-chat-interface-theme=opaque] #chat-log ~ *#token-hud .attribute i.fas,
  11221. [data-theme=opaque]:not([data-color-scheme])#token-hud .attribute i.fas {
  11222. color: var(--text-color-2);
  11223. }
  11224. [data-chat-interface-theme=opaque] #chat-log ~ *.sidebar-popout,
  11225. [data-theme=opaque]:not([data-color-scheme]).sidebar-popout {
  11226. background: var(--app-background);
  11227. border: var(--app-border-width);
  11228. border-color: var(--app-border-color);
  11229. }
  11230. /* ----------------------------------------- */
  11231. /* Controls */
  11232. /* ----------------------------------------- */
  11233. [data-dorako-ui-scope=controls][data-theme=opaque] {
  11234. --button-toggle-border-color: var(--secondary-light);
  11235. --button-toggle-hover-border-color: color-mix(in srgb, var(--secondary) 50%, white 50%);
  11236. --button-toggle-background: color-mix(in srgb, var(--secondary) 50%, black 50%);
  11237. --button-toggle-hover-background: var(--secondary-light);
  11238. }
  11239. /* ----------------------------------------- */
  11240. /* Chatlog */
  11241. /* ----------------------------------------- */
  11242. [data-chat-interface-theme=opaque] #sidebar-tabs {
  11243. --app-border-width: 1px solid;
  11244. --button-hover-background: var(--primary-light);
  11245. --button-hover-border-color: #d3b87c;
  11246. }
  11247. /* ----------------------------------------- */
  11248. /* Navigation */
  11249. /* ----------------------------------------- */
  11250. [data-dorako-ui-scope=navigation][data-theme=opaque] .scene {
  11251. --button-toggle-focus-outline-color: var(--discord-attention);
  11252. }
  11253. [data-dorako-ui-scope=navigation][data-theme=opaque] .scene:not(.gm) {
  11254. --button-toggle-border-color: var(--app-border-color);
  11255. --button-toggle-hover-border-color: color-mix(in srgb, var(--primary-light) 50%, white 50%);
  11256. --button-toggle-background: var(--app-background);
  11257. --button-toggle-hover-background: var(--primary-light);
  11258. }
  11259. [data-dorako-ui-scope=navigation][data-theme=opaque] .scene.gm {
  11260. --button-toggle-border-color: var(--secondary-light);
  11261. --button-toggle-hover-border-color: color-mix(in srgb, var(--secondary) 50%, white 50%);
  11262. --button-toggle-background: color-mix(in srgb, var(--secondary) 50%, black 50%);
  11263. --button-toggle-hover-background: var(--secondary-light);
  11264. }
  11265. [data-dorako-ui-scope=navigation][data-theme=opaque] .scene.gm.active:not(.view) {
  11266. --button-toggle-focus-outline-color: transparent;
  11267. }
  11268. :root {
  11269. --wotr-red-letter: #612e34;
  11270. --wotr-paper-inner: #fbf9f400;
  11271. --wotr-paper-outer: #8d8572;
  11272. --wotr-purple-bg: #5a475a;
  11273. --wotr-purple-border: #393748;
  11274. --wotr-blue-bg: #adafb1;
  11275. --wotr-yellow-bg: #e2d4b8;
  11276. --wotr-image-border: #343745;
  11277. --wotr-icon-orange: #8b4224;
  11278. --wotr-icon-purple: #58505e;
  11279. --wotr-icon-yellow: #7e5e3e;
  11280. --wotr-text-dark-blue: #333544;
  11281. --wotr-text-dark-brown: #3c3834;
  11282. --wotr-text-orange: #7e4a34;
  11283. --wotr-text-blue: #505b70;
  11284. --wotr-text-pale-purple: #4f4e62;
  11285. --wotr-text-detail: #625f56;
  11286. --wotr-button-text-disabled: #403a39;
  11287. --wotr-button-text: #a58975;
  11288. --wotr-button-background: #180d0f;
  11289. --wotr-button-active-bg: #4d2b46;
  11290. --wotr-button-active-text: #d3cace;
  11291. --wotr-alignment-good-bg: #e2e6ee;
  11292. --wotr-alignment-good-text: #535f74;
  11293. --wotr-alignment-neutral-bg: #d5d1c8;
  11294. --wotr-alignment-neutral-text: #575b5d;
  11295. --wotr-alignment-evil-bg: #d9ada4;
  11296. --wotr-alignment-evil-text: #7e4f40;
  11297. --wotr-experience: #e4dca4;
  11298. --wotr-health: #75e358;
  11299. --wotr-green-bg: #51805c;
  11300. --wotr-green-inner: #cbe9cb;
  11301. --wotr-brown-bg: #7a4c3e;
  11302. --wotr-brown-inner: #efc4b8;
  11303. --wotr-yellow-bg: #827d4b;
  11304. --wotr-yellow-inner: #f8f3cd;
  11305. }
  11306. [data-chat-interface-theme^=wotr] #sidebar-tabs,
  11307. [data-chat-interface-theme^=wotr] #chat-log ~ *,
  11308. [data-theme^=wotr] {
  11309. --color-border-highlight: transparent;
  11310. --color-border-dark-3: transparent;
  11311. }
  11312. [data-chat-interface-theme^=wotr] #sidebar-tabs,
  11313. [data-chat-interface-theme^=wotr] #chat-log ~ *,
  11314. [data-theme^=wotr] {
  11315. --icon-border-color: var(--wotr-image-border);
  11316. --scrollbar-thumb-background: var(--wotr-purple-bg);
  11317. --scrollbar-thumb-border-color: var(--wotr-purple-border);
  11318. --color-scrollbar-hover: color-mix(in srgb, var(--wotr-purple-bg) 50%, white);
  11319. --window-app-background: radial-gradient(
  11320. circle at top center,
  11321. #fbf9f444 0%,
  11322. #fbf9f444 40%,
  11323. #a8a29544 60%,
  11324. #a8a295 90%,
  11325. #8d8572 100%
  11326. ),
  11327. var(--sheet-light);
  11328. --window-app-box-shadow: 0px 4px 30px 8px black;
  11329. --window-app-border-color: transparent;
  11330. --window-app-border-width: 0px;
  11331. --box-shadow: none;
  11332. --accent-color: #4d2b46;
  11333. --inline-box-shadow: none;
  11334. --inline-background: var(--wotr-purple-bg);
  11335. --inline-border-color: var(--wotr-purple-border);
  11336. --inline-text-color: var(--wotr-button-active-text);
  11337. --inline-icon-color: var(--wotr-button-active-text);
  11338. --input-box-shadow: none;
  11339. --input-border-color: var(--color-text-light-5);
  11340. --input-text-color: var(--color-text-dark-input);
  11341. --input-focus-text-color: var(--color-text-dark-input);
  11342. --input-background: rgba(255, 255, 255, 0.5);
  11343. --input-focus-outline-color: var(--primary-light);
  11344. --input-placeholder-color: rgba(0, 0, 0, 0.5);
  11345. --button-background: var(--wotr-button-background);
  11346. --button-border-color: #442d29;
  11347. --button-text-color: var(--wotr-button-text);
  11348. --button-focus-outline-color: var(--wotr-purple-border);
  11349. --button-hover-background: var(--wotr-button-active-bg);
  11350. --button-hover-border-color: var(--wotr-button-active-bg);
  11351. --button-hover-text-color: var(--wotr-button-active-text);
  11352. --button-disabled-background: var(--wotr-button-background);
  11353. --button-disabled-border-color: #442d29;
  11354. --button-disabled-text-color: var(--wotr-button-text-disabled);
  11355. --button-toggle-border-color: var(--secondary-light);
  11356. --button-toggle-background: var(--secondary-dark);
  11357. --button-toggle-hover-background: var(--secondary-light);
  11358. --color-primary-1: #d3cace;
  11359. --color-primary-2: #4d2b46;
  11360. --color-primary-3: #442d29;
  11361. --color-primary-3-75: color-mix(in srgb, var(--color-primary-3) 75%, transparent);
  11362. --color-primary-4-75: color-mix(in srgb, var(--color-primary-4) 75%, transparent);
  11363. --color-secondary-1: var(--secondary-light);
  11364. --color-secondary-2: var(--secondary);
  11365. --color-secondary-3: var(--secondary-dark);
  11366. --color-secondary-3-75: color-mix(in srgb, var(--color-secondary-3) 75%, transparent);
  11367. --color-border-light-1: #ddd;
  11368. --color-border-light-2: #999;
  11369. --text-color-1: var(--wotr-text-dark-blue);
  11370. --text-color-2: var(--wotr-text-dark-brown);
  11371. --text-color-3: black;
  11372. --text-color-4: var(--wotr-text-detail);
  11373. --text-color-5: #65615a;
  11374. }
  11375. [data-chat-interface-theme^=wotr] #sidebar-tabs.actor.sheet .crb-style section.major > header,
  11376. [data-chat-interface-theme^=wotr] #chat-log ~ *.actor.sheet .crb-style section.major > header,
  11377. [data-theme^=wotr].actor.sheet .crb-style section.major > header {
  11378. font-variant: small-caps;
  11379. text-transform: lowercase;
  11380. font-size: 150%;
  11381. color: #3c3833;
  11382. }
  11383. [data-chat-interface-theme^=wotr] #sidebar-tabs.actor.sheet .crb-style section.major > header::first-letter,
  11384. [data-chat-interface-theme^=wotr] #chat-log ~ *.actor.sheet .crb-style section.major > header::first-letter,
  11385. [data-theme^=wotr].actor.sheet .crb-style section.major > header::first-letter {
  11386. bottom: 15px;
  11387. font-size: 150%;
  11388. text-transform: uppercase;
  11389. color: #612e34;
  11390. vertical-align: middle;
  11391. }
  11392. [data-chat-interface-theme^=wotr] #sidebar-tabs.actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute h3.modifier,
  11393. [data-chat-interface-theme^=wotr] #chat-log ~ *.actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute h3.modifier,
  11394. [data-theme^=wotr].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute h3.modifier {
  11395. color: var(--wotr-text-dark-blue);
  11396. }
  11397. [data-chat-interface-theme^=wotr] #sidebar-tabs.actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation,
  11398. [data-chat-interface-theme^=wotr] #chat-log ~ *.actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation,
  11399. [data-theme^=wotr].actor.sheet.character .crb-style .sheet-body .sheet-content .tab.character .attributes .attribute .abbreviation {
  11400. text-transform: uppercase;
  11401. color: var(--wotr-text-orange);
  11402. }
  11403. [data-chat-interface-theme^=wotr] #sidebar-tabs.window-app .window-header,
  11404. [data-chat-interface-theme^=wotr] #chat-log ~ *.window-app .window-header,
  11405. [data-theme^=wotr].window-app .window-header {
  11406. text-shadow: none;
  11407. }
  11408. [data-chat-interface-theme^=wotr] #sidebar-tabs.pf2e.item.sheet .sheet-header img,
  11409. [data-chat-interface-theme^=wotr] #chat-log ~ *.pf2e.item.sheet .sheet-header img,
  11410. [data-theme^=wotr].pf2e.item.sheet .sheet-header img {
  11411. background: rgba(6, 4, 3, 0.92);
  11412. border-image-source: url(../img/crayon-border.webp);
  11413. border-image-slice: 5 20 20 20 fill;
  11414. border-image-repeat: repeat repeat;
  11415. border-image-width: auto;
  11416. border-image-outset: 1px 2px 2px 2px;
  11417. border-radius: 0;
  11418. }
  11419. [data-chat-interface-theme^=wotr] #sidebar-tabs.sheet.journal-entry .journal-sidebar,
  11420. [data-chat-interface-theme^=wotr] #chat-log ~ *.sheet.journal-entry .journal-sidebar,
  11421. [data-theme^=wotr].sheet.journal-entry .journal-sidebar {
  11422. color: var(--wotr-text-dark-brown);
  11423. --color-text-light-7: var(--wotr-text-detail);
  11424. }
  11425. [data-chat-interface-theme^=wotr] #sidebar-tabs.sheet.journal-entry .pages-list .directory-item:not(.active) + .active,
  11426. [data-chat-interface-theme^=wotr] #chat-log ~ *.sheet.journal-entry .pages-list .directory-item:not(.active) + .active,
  11427. [data-theme^=wotr].sheet.journal-entry .pages-list .directory-item:not(.active) + .active {
  11428. background: rgba(87, 91, 93, 0.1333333333);
  11429. }
  11430. [data-chat-interface-theme^=wotr] #sidebar-tabs.sheet,
  11431. [data-chat-interface-theme^=wotr] #chat-log ~ *.sheet,
  11432. [data-theme^=wotr].sheet {
  11433. padding: 0px 10px;
  11434. border-radius: 25px;
  11435. }
  11436. [data-chat-interface-theme^=wotr] #sidebar-tabs.sheet::after, [data-chat-interface-theme^=wotr] #sidebar-tabs.sheet::before,
  11437. [data-chat-interface-theme^=wotr] #chat-log ~ *.sheet::after,
  11438. [data-chat-interface-theme^=wotr] #chat-log ~ *.sheet::before,
  11439. [data-theme^=wotr].sheet::after,
  11440. [data-theme^=wotr].sheet::before {
  11441. background-image: url(../img/wotr/wotr-paper-left.webp);
  11442. background-size: 100% 100%;
  11443. content: " ";
  11444. height: calc(100% + 20px);
  11445. position: absolute;
  11446. top: -10px;
  11447. left: -10px;
  11448. width: 5em;
  11449. z-index: -1;
  11450. }
  11451. [data-chat-interface-theme^=wotr] #sidebar-tabs.sheet::after,
  11452. [data-chat-interface-theme^=wotr] #chat-log ~ *.sheet::after,
  11453. [data-theme^=wotr].sheet::after {
  11454. left: unset;
  11455. right: -10px;
  11456. transform: scaleX(-1);
  11457. }
  11458. /* ----------------------------------------- */
  11459. /* Color definitions */
  11460. /* ----------------------------------------- */
  11461. /* Colors */
  11462. /* Global */
  11463. /* used for mini headers, alternate primary color */
  11464. /* compliments the primary color, usually used in combination */
  11465. /* for all other uses */
  11466. /* Lighter / Darker */
  11467. /* Text */
  11468. /* ----------------------------------------- */
  11469. /* Color schemes */
  11470. /* ----------------------------------------- */
  11471. /* Proficiency ranks */
  11472. /* Rarities */
  11473. /* Degrees of success */
  11474. /* Value adjustments (e.g. weak/elite) */
  11475. /* ----------------------------------------- */
  11476. /* CSS Custom Properties */
  11477. /* ----------------------------------------- */
  11478. :root {
  11479. /* Global */
  11480. --primary: #5e0000;
  11481. --system-primary: #5e0000;
  11482. --primary-light: #b10000;
  11483. --primary-dark: #380000;
  11484. --system-secondary: #171f69;
  11485. --secondary: #171f69;
  11486. --secondary-light: #2836b7;
  11487. --secondary-dark: #0d113a;
  11488. --tertiary: #e9d7a1;
  11489. --remaster: hsl(152, 87%, 15%);
  11490. --remaster-light: hsl(170, 96%, 19%);
  11491. --remaster-dark: hsl(153, 100%, 8%);
  11492. --rarity-common: #323232;
  11493. --rarity-uncommon: #98513d;
  11494. --rarity-rare: #002664;
  11495. --rarity-unique: #54166e;
  11496. --alt: #786452;
  11497. --alt-dark: #443730;
  11498. --bg: #f8f4f1;
  11499. --bg-dark: #e7d9cf;
  11500. --gold-brown: #956d58;
  11501. --sub: #605856;
  11502. --color-disabled: #ababab;
  11503. --blind-bg: #a57aa5;
  11504. --whisper-bg: #e3e3ff;
  11505. --inline-link-bg: #ddd;
  11506. --inline-repost-bg: #eaeaea;
  11507. --visibility-gm-bg: #e8e8ef;
  11508. --visibility-owner-bg: #ddebe1;
  11509. --blind-roll: #f5eaf5;
  11510. /* Lighter / Darker */
  11511. --light: #910000;
  11512. --dark: #2b0000;
  11513. --tertiary-dark: #dfc578;
  11514. --tertiary-light: #f3e9ca;
  11515. /* Text */
  11516. --body: var(--text-dark);
  11517. --color-text-trait: #f5efe0;
  11518. --text-dark: #1c1c1c;
  11519. --text-light: white;
  11520. /* Borders */
  11521. --color-border-trait: #d8c384;
  11522. --color-border-divider: #baa991;
  11523. /* Mats */
  11524. --mats-dark: #1c1c1c;
  11525. --mats-gold-dark: #dbc682;
  11526. --mats-gold-light: #e6d8a7;
  11527. --mats-green-light: #99aea1;
  11528. --mats-green: #3e644b;
  11529. --mats-green-dark: #233b2b;
  11530. /* Headers w/ boxes */
  11531. --header-color: var(--text-light);
  11532. --header-bg: var(--secondary);
  11533. /* Sidebar */
  11534. --sidebar-label: var(--tertiary-dark);
  11535. --sidebar-title: var(--tertiary);
  11536. /* App UI */
  11537. --glass-bg: rgba(20, 20, 20, 0.6);
  11538. --glass-bg-gold: rgba(103, 88, 60, 0.441);
  11539. --glass-bg-light: rgba(255, 255, 255, 0.1);
  11540. --glass-bg-dark: rgba(0, 0, 0, 0.7);
  11541. --gold-and-glow: 0 0 0 1px var(--tertiary), 0 0 0 2px var(--gold-brown), inset 0 0 3px rgba(255, 255, 255, 0.5);
  11542. --glassy: 0px 0px 3px 0px rgba(255, 255, 255, 0.4) inset, 0px 0px 2px 1px rgba(0, 0, 0, 1),
  11543. 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
  11544. --glassy-sharp: 0px 0px 0px 1px rgba(255, 255, 255, 0.4) inset, 0px 1px 5px 1px rgba(0, 0, 0, 0.8);
  11545. --glassy-sharp-inset: 0px 0px 0px 1px rgba(255, 255, 255, 0.4) inset, 0px 0px 5px 1px rgba(0, 0, 0, 0.8) inset;
  11546. --glassy-sharp-highlight: 0px 0px 0px 1px rgba(245, 222, 179, 0.7) inset, 0px 1px 5px 1px rgba(0, 0, 0, 0.8);
  11547. --sheet-light: url(../img/background-light.webp);
  11548. --sheet-dark: url(../img/background-dark4.webp);
  11549. --header: url(../img/red-header.webp);
  11550. --banner-top: url(../img/red-sidebar-top.webp);
  11551. --banner-bottom: url(../img/red-sidebar-bottom.webp);
  11552. --hotbar-width: unset;
  11553. /* Degrees of success */
  11554. --degree-success-critical: rgb(0, 128, 0);
  11555. --degree-success: rgb(0, 0, 255);
  11556. --degree-failure: rgb(255, 69, 0);
  11557. --degree-failure-critical: rgb(255, 0, 0);
  11558. /* Value adjustments (e.g. weak/elite) */
  11559. --adjusted-higher: #009988;
  11560. --adjusted-lower: #cc3311;
  11561. }
  11562. /* ----------------------------------------- */
  11563. /* DUI color variables */
  11564. /* ----------------------------------------- */
  11565. :root {
  11566. --color-primary-1: #ee9b3a;
  11567. --color-primary-1-40: color-mix(in srgb, var(--color-primary-1) 40%, transparent);
  11568. --color-primary-2: #c9593f;
  11569. --color-primary-2-20: color-mix(in srgb, var(--color-primary-2) 20%, transparent);
  11570. --color-primary-3: #5d142b;
  11571. --color-primary-3-10: color-mix(in srgb, var(--color-primary-3) 10%, transparent);
  11572. --color-primary-3-75: color-mix(in srgb, var(--color-primary-3) 75%, transparent);
  11573. --color-primary-4: #420418;
  11574. --color-primary-4-75: color-mix(in srgb, var(--color-primary-4) 75%, transparent);
  11575. --color-primary-5: #26020d;
  11576. --color-secondary-1: #b1a0d4;
  11577. --color-secondary-2: #79689c;
  11578. --color-secondary-3: #584a75;
  11579. --color-secondary-3-75: color-mix(in srgb, var(--color-secondary-3) 75%, transparent);
  11580. --color-secondary-4: #302831;
  11581. --color-secondary-5: #0b0a13;
  11582. --color-secondary-5-25: rgba(11, 10, 19, 0.25);
  11583. --color-secondary-5-50: rgba(11, 10, 19, 0.5);
  11584. --color-secondary-5-75: rgba(11, 10, 19, 0.75);
  11585. --color-secondary-5-90: rgba(11, 10, 19, 0.9);
  11586. --text-color-1: #f7f3e8;
  11587. --text-color-2: #efe6d8;
  11588. --text-color-3: #e7d1b1;
  11589. --text-color-4: #d0b8a3;
  11590. --text-color-5: #9f8475;
  11591. --text-color-disabled: #aaa;
  11592. --color-level-error: #ce0707;
  11593. --color-level-error-bg: rgba(105, 0, 8, 0.8);
  11594. --color-level-error-border: #750003;
  11595. --color-level-info: #59a1f6;
  11596. --color-level-info-bg: rgba(47, 80, 132, 0.8);
  11597. --color-level-info-border: #5c87b9;
  11598. --color-level-success: #26b231;
  11599. --color-level-success-bg: rgba(26, 107, 34, 0.8);
  11600. --color-level-success-border: #1b8f23;
  11601. --color-level-warning: #ee9b3a;
  11602. --color-level-warning-bg: rgba(214, 150, 0, 0.8);
  11603. --color-level-warning-border: #b18404;
  11604. --color-level-green-bg: rgba(138, 211, 4, 0.4);
  11605. --color-level-green-border: #8ad304;
  11606. --color-level-yellow-bg: rgba(211, 192, 4, 0.4);
  11607. --color-level-yellow-border: #d3c004;
  11608. --color-level-orange-bg: rgba(211, 119, 4, 0.4);
  11609. --color-level-orange-border: #d37704;
  11610. --color-level-red-bg: rgba(211, 20, 4, 0.4);
  11611. --color-level-red-border: #d31404;
  11612. --scrollbar-thumb-background: #5d142b;
  11613. --scrollbar-thumb-border-color: #8d151b;
  11614. }
  11615. /* ----------------------------------------- */
  11616. /* Damage colors */
  11617. /* ----------------------------------------- */
  11618. [data-color-scheme=dark] .damage {
  11619. --color-bg-acid: rgba(32, 194, 32, 0.125);
  11620. --color-bg-bleed: rgba(207, 28, 58, 0.125);
  11621. --color-bg-chaotic: rgba(221, 26, 221, 0.125);
  11622. --color-bg-cold: rgba(186, 186, 246, 0.125);
  11623. --color-bg-electricity: rgba(221, 167, 30, 0.125);
  11624. --color-bg-evil: rgba(153, 59, 220, 0.125);
  11625. --color-bg-fire: rgba(229, 93, 39, 0.125);
  11626. --color-bg-force: rgba(177, 77, 249, 0.125);
  11627. --color-bg-good: rgba(157, 115, 10, 0.125);
  11628. --color-bg-lawful: rgba(123, 85, 28, 0.125);
  11629. --color-bg-mental: rgba(87, 87, 219, 0.125);
  11630. --color-bg-physical: rgba(132, 132, 132, 0.125);
  11631. --color-bg-poison: rgba(147, 178, 93, 0.125);
  11632. --color-bg-sonic: rgba(28, 217, 217, 0.125);
  11633. --color-bg-spirit: rgba(147, 142, 189, 0.125);
  11634. --color-bg-vitality: rgba(255, 255, 224, 0.125);
  11635. --color-bg-void: rgb(81, 21, 78, 0.125);
  11636. --color-border-acid: #12a812;
  11637. --color-border-bleed: #d11c3b;
  11638. --color-border-chaotic: #d311d3;
  11639. --color-border-cold: #6464dd;
  11640. --color-border-electricity: yellow;
  11641. --color-border-evil: rgb(145, 63, 203);
  11642. --color-border-fire: #cd4a17;
  11643. --color-border-force: #9222e2;
  11644. --color-border-good: #dcb85f;
  11645. --color-border-lawful: #97743f;
  11646. --color-border-mental: rgb(82, 82, 209);
  11647. --color-border-physical: #939292;
  11648. --color-border-poison: #9aba64;
  11649. --color-border-sonic: rgb(30, 202, 202);
  11650. --color-border-spirit: #5a5585;
  11651. --color-border-vitality: #ffffe0;
  11652. --color-border-void: rgb(122, 38, 117);
  11653. --color-text-acid: #34aa34;
  11654. --color-text-bleed: #b0162f;
  11655. --color-text-chaotic: #b71ab7;
  11656. --color-text-cold: #6868e1;
  11657. --color-text-electricity: #e7b22b;
  11658. --color-text-evil: #836d91;
  11659. --color-text-fire: #b64214;
  11660. --color-text-force: #8321ca;
  11661. --color-text-good: #c79b2b;
  11662. --color-text-lawful: white;
  11663. --color-text-mental: #4c4cc8;
  11664. --color-text-physical: #bab9b9;
  11665. --color-text-poison: #657d3f;
  11666. --color-text-sonic: #21c2c2;
  11667. --color-text-spirit: #827dac;
  11668. --color-text-vitality: #ffffa0;
  11669. --color-text-void: rgb(122, 38, 117);
  11670. }
  11671. :root .damage.color.acid {
  11672. --damage-color: var(--color-border-acid);
  11673. }
  11674. :root .damage.color.bleed {
  11675. --damage-color: var(--color-border-bleed);
  11676. }
  11677. :root .damage.color.bludgeoning,
  11678. :root .damage.color.piercing,
  11679. :root .damage.color.slashing {
  11680. --damage-color: var(--color-border-physical);
  11681. }
  11682. :root .damage.color.chaotic {
  11683. --damage-color: var(--color-border-chaotic);
  11684. }
  11685. :root .damage.color.cold {
  11686. --damage-color: var(--color-border-cold);
  11687. }
  11688. :root .damage.color.electricity {
  11689. --damage-color: var(--color-border-electricity);
  11690. }
  11691. :root .damage.color.evil {
  11692. --damage-color: var(--color-border-evil);
  11693. }
  11694. :root .damage.color.fire {
  11695. --damage-color: var(--color-border-fire);
  11696. }
  11697. :root .damage.color.force {
  11698. --damage-color: var(--color-border-force);
  11699. }
  11700. :root .damage.color.good {
  11701. --damage-color: var(--color-border-good);
  11702. }
  11703. :root .damage.color.lawful {
  11704. --damage-color: var(--color-border-lawful);
  11705. }
  11706. :root .damage.color.mental {
  11707. --damage-color: var(--color-border-mental);
  11708. }
  11709. :root .damage.color.poison {
  11710. --damage-color: var(--color-border-poison);
  11711. }
  11712. :root .damage.color.sonic {
  11713. --damage-color: var(--color-border-sonic);
  11714. }
  11715. :root .damage.color.spirit {
  11716. --damage-color: var(--color-border-spirit);
  11717. }
  11718. :root .damage.color.vitality {
  11719. --damage-color: var(--color-border-vitality);
  11720. }
  11721. :root .damage.color.void {
  11722. --damage-color: var(--color-border-void);
  11723. }
  11724. /* ----------------------------------------- */
  11725. /* PF2e Dorako UI */
  11726. /* ----------------------------------------- */
  11727. .combat-sidebar li.combatant .token-image {
  11728. z-index: 0;
  11729. }
  11730. .combat-sidebar li.combatant .token-name {
  11731. z-index: 1;
  11732. }
  11733. .chat-message .message-content .damage-roll:not(:first-child) {
  11734. margin-top: 5px;
  11735. }
  11736. a.content-link,
  11737. [data-pf2-check],
  11738. a.entity-link,
  11739. [data-pf2-action],
  11740. span[data-pf2-effect-area],
  11741. a.inline-check .label,
  11742. a.inline-roll:not(.inline-result) {
  11743. font-weight: 400;
  11744. padding: 0px 4px;
  11745. text-shadow: none !important;
  11746. }
  11747. a.inline-check,
  11748. span[data-pf2-check],
  11749. span[data-pf2-effect-area].with-repost {
  11750. padding: 0px;
  11751. padding-left: 4px;
  11752. }
  11753. i[data-pf2-repost] {
  11754. top: 0px;
  11755. cursor: pointer;
  11756. }
  11757. .tah-tags-wrapper .tags,
  11758. [data-theme] .tags,
  11759. [data-dorako-ui-scope=limited] .tags,
  11760. [data-theme] .tags.paizo-style,
  11761. [data-dorako-ui-scope=limited] .tags.paizo-style {
  11762. gap: 1px;
  11763. }
  11764. .tah-tags-wrapper .tags tag,
  11765. .tah-tags-wrapper .tags .tag:not(.tag_transparent),
  11766. [data-theme] .tags tag,
  11767. [data-theme] .tags .tag:not(.tag_transparent),
  11768. [data-dorako-ui-scope=limited] .tags tag,
  11769. [data-dorako-ui-scope=limited] .tags .tag:not(.tag_transparent),
  11770. [data-theme] .tags.paizo-style tag,
  11771. [data-theme] .tags.paizo-style .tag:not(.tag_transparent),
  11772. [data-dorako-ui-scope=limited] .tags.paizo-style tag,
  11773. [data-dorako-ui-scope=limited] .tags.paizo-style .tag:not(.tag_transparent) {
  11774. border-radius: 0px;
  11775. box-shadow: unset;
  11776. border: 1px solid var(--tertiary);
  11777. outline: 1px solid var(--gold-brown);
  11778. padding: 0.33em 0.33em;
  11779. text-shadow: none;
  11780. }
  11781. .tah-tags-wrapper .tags tag:first-of-type,
  11782. .tah-tags-wrapper .tags .tag:first-child,
  11783. [data-theme] .tags tag:first-of-type,
  11784. [data-theme] .tags .tag:first-child,
  11785. [data-dorako-ui-scope=limited] .tags tag:first-of-type,
  11786. [data-dorako-ui-scope=limited] .tags .tag:first-child,
  11787. [data-theme] .tags.paizo-style tag:first-of-type,
  11788. [data-theme] .tags.paizo-style .tag:first-child,
  11789. [data-dorako-ui-scope=limited] .tags.paizo-style tag:first-of-type,
  11790. [data-dorako-ui-scope=limited] .tags.paizo-style .tag:first-child {
  11791. border-left-width: 1px;
  11792. }
  11793. .tah-tags-wrapper .tags tag:last-of-type,
  11794. .tah-tags-wrapper .tags .tag:last-child,
  11795. [data-theme] .tags tag:last-of-type,
  11796. [data-theme] .tags .tag:last-child,
  11797. [data-dorako-ui-scope=limited] .tags tag:last-of-type,
  11798. [data-dorako-ui-scope=limited] .tags .tag:last-child,
  11799. [data-theme] .tags.paizo-style tag:last-of-type,
  11800. [data-theme] .tags.paizo-style .tag:last-child,
  11801. [data-dorako-ui-scope=limited] .tags.paizo-style tag:last-of-type,
  11802. [data-dorako-ui-scope=limited] .tags.paizo-style .tag:last-child {
  11803. border-right-width: 1px;
  11804. }
  11805. [data-visibility]:not([data-visibility=all]) {
  11806. padding: unset;
  11807. }
  11808. .app.sheet.actor p,
  11809. .pf2e p {
  11810. font-weight: 400;
  11811. }
  11812. /* ----------------------------------------- */
  11813. /* .message-header fixes (all themes) */
  11814. /* ----------------------------------------- */
  11815. .chat-message .dmgBtn-container {
  11816. display: flex;
  11817. flex-direction: row;
  11818. }
  11819. .chat-message ul.notes {
  11820. padding: 0px;
  11821. }
  11822. /* ----------------------------------------- */
  11823. /* Settings */
  11824. /* ----------------------------------------- */
  11825. [data-theme] .tab.category.active[data-tab=pf2e-dorako-ux] h2,
  11826. [data-theme] .tab.category.active[data-tab=pf2e-dorako-ui] h2,
  11827. [data-theme] .form-group.dorako.settings-header {
  11828. background: var(--app-background);
  11829. border: var(--app-border-width) solid var(--app-border-color);
  11830. text-shadow: var(--app-text-shadow);
  11831. border-radius: var(--border-radius);
  11832. box-shadow: var(--box-shadow);
  11833. color: var(--text-color-3);
  11834. font-size: larger;
  11835. margin: 2px;
  11836. margin-bottom: 10px;
  11837. padding: 10px;
  11838. color: var(--text-color-2);
  11839. border-color: var(--color-secondary-1);
  11840. background: var(--color-secondary-2);
  11841. --box-shadow: 0px 1px 3px 1px black;
  11842. box-shadow: var(--box-shadow);
  11843. }
  11844. [data-theme] .tab.category.active[data-tab=pf2e-dorako-ux] h2 .notes,
  11845. [data-theme] .tab.category.active[data-tab=pf2e-dorako-ui] h2 .notes,
  11846. [data-theme] .form-group.dorako.settings-header .notes {
  11847. color: var(--text-color-3);
  11848. }
  11849. [data-theme] .tab.category.active[data-tab=pf2e-dorako-ux] h2,
  11850. [data-theme] .tab.category.active[data-tab=pf2e-dorako-ui] h2 {
  11851. font-size: var(--font-size-48);
  11852. text-align: center;
  11853. color: var(--text-color-2);
  11854. background: var(--color-primary-2);
  11855. border-color: var(--color-primary-1);
  11856. text-shadow: 0px 1px 0px var(--color-primary-3);
  11857. }
  11858. h3 {
  11859. border-bottom: none;
  11860. }
  11861. button > i {
  11862. margin-right: 0;
  11863. }
  11864. img {
  11865. border: none;
  11866. border-radius: 0px;
  11867. }
  11868. /*# sourceMappingURL=dorako-ui.css.map */