@charset "UTF-8";

/*
  GARDEN V9

  Color variables are defined here to be used throughout the application.
  these variables are scoped globally and can be used in any stylesheet
  as long as the data-theme attribute is set on the root element.
*/

:root {
  /* Base Colors */
  --black: 000, 000, 000; /* #000000 */
  --white: 255, 255, 255; /* #ffffff */

  --grey-100: 248, 249, 249; /* #f8f9f9 */
  --grey-200: 232, 234, 236; /* #e8eaec */
  --grey-300: 216, 220, 222; /* #d8dcde */
  --grey-400: 176, 184, 190; /* #b0b8be */
  --grey-500: 145, 156, 165; /* #919ca5 */
  --grey-600: 132, 143, 153; /* #848f99 */
  --grey-700: 092, 105, 112; /* #5c6970 */
  --grey-800: 057, 067, 075; /* #39434b */
  --grey-900: 041, 050, 057; /* #293239 */
  --grey-1000: 028, 034, 039; /* #1c2227 */
  --grey-1100: 021, 026, 030; /* #151a1e */
  --grey-1200: 010, 013, 014; /* #0a0d0e */

  --blue-100: 237, 247, 255; /* #edf7ff */
  --blue-200: 221, 236, 248; /* #ddecf8 */
  --blue-300: 204, 224, 241; /* #cce0f1 */
  --blue-400: 147, 188, 220; /* #93bcdc */
  --blue-500: 102, 160, 205; /* #66a0cd */
  --blue-600: 038, 147, 214; /* #2694d6 */
  --blue-700: 031, 115, 183; /* #1f73b7 */
  --blue-800: 019, 069, 109; /* #13456d */
  --blue-900: 015, 054, 085; /* #0f3655 */
  --blue-1000: 010, 035, 056; /* #0a2338 */
  --blue-1100: 006, 020, 032; /* #061420 */
  --blue-1200: 004, 013, 021; /* #040d15 */

  --red-100: 255, 242, 243; /* #fff2f3 */
  --red-200: 254, 227, 229; /* #fee3e5 */
  --red-300: 245, 213, 216; /* #f5d5d8 */
  --red-400: 242, 161, 168; /* #f2a1a8 */
  --red-500: 234, 120, 129; /* #ea7881 */
  --red-600: 235, 092, 105; /* #eb5c69 */
  --red-700: 205, 054, 066; /* #cd3642 */
  --red-800: 126, 029, 037; /* #7e1d25 */
  --red-900: 103, 018, 025; /* #671219 */
  --red-1000: 061, 020, 024; /* #3d1418 */
  --red-1100: 029, 016, 017; /* #1d1011 */
  --red-1200: 016, 011, 012; /* #100b0c */

  --yellow-100: 255, 243, 228; /* #fff3e4 */
  --yellow-200: 255, 230, 203; /* #ffe6cb */
  --yellow-300: 254, 214, 169; /* #fed6a9 */
  --yellow-400: 252, 163, 071; /* #fca347 */
  --yellow-500: 227, 130, 021; /* #e38215 */
  --yellow-600: 214, 115, 005; /* #d67305 */
  --yellow-700: 172, 089, 024; /* #ac5918 */
  --yellow-800: 103, 053, 021; /* #673515 */
  --yellow-900: 076, 044, 023; /* #4c2c17 */
  --yellow-1000: 045, 030, 021; /* #2d1e15 */
  --yellow-1100: 024, 018, 015; /* #18120f */
  --yellow-1200: 014, 012, 011; /* #0e0c0b */

  --green-100: 238, 248, 244; /* #eef8f4 */
  --green-200: 218, 238, 230; /* #daeee6 */
  --green-300: 202, 227, 217; /* #cae3d9 */
  --green-400: 148, 193, 176; /* #94c1b0 */
  --green-500: 078, 171, 137; /* #4eab89 */
  --green-600: 038, 161, 120; /* #26a178 */
  --green-700: 003, 127, 082; /* #037f52 */
  --green-800: 016, 075, 053; /* #104b35 */
  --green-900: 011, 059, 041; /* #0b3b29 */
  --green-1000: 012, 038, 028; /* #0c261c */
  --green-1100: 010, 021, 017; /* #0a1511 */
  --green-1200: 008, 013, 012; /* #080d0c */

  --kale-100: 236, 249, 249; /* #ecf9f9 */
  --kale-200: 218, 237, 237; /* #daeded */
  --kale-300: 203, 226, 225; /* #cbe2e1 */
  --kale-400: 151, 191, 191; /* #97bfbf */
  --kale-500: 107, 164, 165; /* #6ba4a5 */
  --kale-600: 074, 153, 153; /* #4a9999 */
  --kale-700: 064, 120, 122; /* #40787a */
  --kale-800: 022, 073, 079; /* #16494f */
  --kale-900: 006, 057, 064; /* #063940 */
  --kale-1000: 003, 037, 042; /* #03252a */
  --kale-1100: 006, 021, 023; /* #061517 */
  --kale-1200: 006, 014, 014; /* #060e0e */

  --fuschia-100: 251, 243, 248; /* #fbf3f8 */
  --fuschia-200: 247, 230, 241; /* #f7e6f1 */
  --fuschia-300: 242, 213, 231; /* #f2d5e7 */
  --fuschia-400: 227, 164, 204; /* #e3a4cc */
  --fuschia-500: 215, 125, 183; /* #d77db7 */
  --fuschia-600: 209, 106, 172; /* #d16aac */
  --fuschia-700: 179, 068, 150; /* #b34496 */
  --fuschia-800: 120, 017, 108; /* #78116c */
  --fuschia-900: 090, 013, 081; /* #5a0d51 */
  --fuschia-1000: 063, 009, 057; /* #3f0939 */
  --fuschia-1100: 049, 007, 044; /* #31072c */
  --fuschia-1200: 027, 004, 024; /* #1b0418 */

  --pink-100: 252, 243, 244; /* #fcf3f4 */
  --pink-200: 247, 229, 232; /* #f7e5e8 */
  --pink-300: 243, 214, 220; /* #f3d6dc */
  --pink-400: 229, 166, 180; /* #e5a6b4 */
  --pink-500: 217, 129, 147; /* #d98193 */
  --pink-600: 217, 107, 129; /* #d96b81 */
  --pink-700: 214, 032, 084; /* #d62054 */
  --pink-800: 117, 038, 061; /* #75263d */
  --pink-900: 086, 029, 046; /* #561d2e */
  --pink-1000: 060, 020, 031; /* #3c141f */
  --pink-1100: 046, 015, 024; /* #2e0f18 */
  --pink-1200: 023, 008, 012; /* #17080c */

  --crimson-100: 251, 243, 242; /* #fbf3f2 */
  --crimson-200: 247, 231, 228; /* #f7e7e4 */
  --crimson-300: 241, 215, 210; /* #f1d7d2 */
  --crimson-400: 226, 170, 160; /* #e2aaa0 */
  --crimson-500: 213, 134, 120; /* #d58678 */
  --crimson-600: 207, 116, 100; /* #cf7464 */
  --crimson-700: 190, 073, 056; /* #be4938 */
  --crimson-800: 129, 027, 018; /* #811b12 */
  --crimson-900: 097, 020, 013; /* #61140d */
  --crimson-1000: 068, 014, 009; /* #440e09 */
  --crimson-1100: 052, 011, 007; /* #340b07 */
  --crimson-1200: 028, 006, 004; /* #1c0604 */

  --orange-100: 253, 243, 237; /* #fdf3ed */
  --orange-200: 250, 231, 216; /* #fae7d8 */
  --orange-300: 247, 215, 190; /* #f7d7be */
  --orange-400: 237, 168, 117; /* #eda875 */
  --orange-500: 229, 128, 053; /* #e58035 */
  --orange-600: 213, 116, 040; /* #d57428 */
  --orange-700: 175, 086, 038; /* #af5626 */
  --orange-800: 105, 051, 023; /* #693317 */
  --orange-900: 077, 039, 017; /* #4d2711 */
  --orange-1000: 054, 026, 012; /* #361a0c */
  --orange-1100: 041, 020, 009; /* #291409 */
  --orange-1200: 021, 010, 004; /* #150a04 */

  --lemon-100: 255, 247, 212; /* #fff7d4 */
  --lemon-200: 255, 234, 151; /* #ffea97 */
  --lemon-300: 255, 220, 079; /* #ffdc4f */
  --lemon-400: 239, 171, 000; /* #efab00 */
  --lemon-500: 199, 145, 000; /* #c79100 */
  --lemon-600: 182, 133, 000; /* #b68500 */
  --lemon-700: 143, 105, 000; /* #8f6900 */
  --lemon-800: 086, 062, 000; /* #563e00 */
  --lemon-900: 063, 046, 000; /* #3f2e00 */
  --lemon-1000: 043, 032, 000; /* #2b2000 */
  --lemon-1100: 034, 024, 000; /* #221800 */
  --lemon-1200: 017, 012, 000; /* #110c00 */

  --lime-100: 236, 250, 231; /* #ecfae7 */
  --lime-200: 209, 243, 199; /* #d1f3c7 */
  --lime-300: 179, 237, 163; /* #b3eda3 */
  --lime-400: 079, 209, 043; /* #4fd12b */
  --lime-500: 069, 176, 037; /* #45b025 */
  --lime-600: 080, 159, 045; /* #509f2d */
  --lime-700: 061, 126, 025; /* #3d7e19 */
  --lime-800: 044, 073, 027; /* #2c491b */
  --lime-900: 032, 054, 020; /* #203614 */
  --lime-1000: 022, 037, 014; /* #16250e */
  --lime-1100: 017, 029, 010; /* #111d0a */
  --lime-1200: 009, 014, 005; /* #090e05 */

  --mint-100: 214, 255, 235; /* #d6ffeb */
  --mint-200: 154, 255, 206; /* #9affce */
  --mint-300: 010, 254, 137; /* #0afe89 */
  --mint-400: 000, 210, 109; /* #00d26d */
  --mint-500: 001, 177, 092; /* #01b15c */
  --mint-600: 022, 162, 096; /* #16a260 */
  --mint-700: 045, 126, 085; /* #2d7e55 */
  --mint-800: 027, 075, 051; /* #1b4b33 */
  --mint-900: 020, 055, 038; /* #143726 */
  --mint-1000: 014, 038, 026; /* #0e261a */
  --mint-1100: 011, 029, 020; /* #0b1d14 */
  --mint-1200: 005, 014, 010; /* #050e0a */

  --teal-100: 212, 254, 250; /* #d4fefa */
  --teal-200: 136, 253, 241; /* #88fdf1 */
  --teal-300: 011, 248, 225; /* #0bf8e1 */
  --teal-400: 003, 205, 184; /* #03cdb8 */
  --teal-500: 002, 173, 156; /* #02ad9c */
  --teal-600: 042, 157, 143; /* #2a9d8f */
  --teal-700: 054, 122, 116; /* #367a74 */
  --teal-800: 037, 072, 070; /* #254846 */
  --teal-900: 027, 053, 052; /* #1b3534 */
  --teal-1000: 018, 036, 035; /* #122423 */
  --teal-1100: 014, 028, 026; /* #0e1c1a */
  --teal-1200: 007, 013, 013; /* #070d0d */

  --azure-100: 239, 247, 254; /* #eff7fe */
  --azure-200: 217, 236, 252; /* #d9ecfc */
  --azure-300: 196, 224, 250; /* #c4e0fa */
  --azure-400: 130, 188, 244; /* #82bcf4 */
  --azure-500: 075, 159, 238; /* #4b9fee */
  --azure-600: 049, 145, 234; /* #3191ea */
  --azure-700: 039, 112, 195; /* #2770c3 */
  --azure-800: 035, 068, 107; /* #23446b */
  --azure-900: 026, 050, 080; /* #1a3250 */
  --azure-1000: 018, 034, 056; /* #122238 */
  --azure-1100: 014, 026, 042; /* #0e1a2a */
  --azure-1200: 007, 013, 020; /* #070d14 */

  --royal-100: 244, 245, 252; /* #f4f5fc */
  --royal-200: 231, 233, 248; /* #e7e9f8 */
  --royal-300: 216, 220, 244; /* #d8dcf4 */
  --royal-400: 172, 180, 231; /* #acb4e7 */
  --royal-500: 138, 150, 221; /* #8a96dd */
  --royal-600: 122, 136, 217; /* #7a88d9 */
  --royal-700: 076, 103, 211; /* #4c67d3 */
  --royal-800: 024, 051, 171; /* #1833ab */
  --royal-900: 018, 038, 128; /* #122680 */
  --royal-1000: 013, 026, 090; /* #0d1a5a */
  --royal-1100: 010, 020, 069; /* #0a1445 */
  --royal-1200: 005, 010, 037; /* #050a25 */

  --purple-100: 249, 243, 251; /* #f9f3fb */
  --purple-200: 242, 231, 246; /* #f2e7f6 */
  --purple-300: 233, 216, 241; /* #e9d8f1 */
  --purple-400: 208, 169, 224; /* #d0a9e0 */
  --purple-500: 187, 134, 211; /* #bb86d3 */
  --purple-600: 178, 118, 205; /* #b276cd */
  --purple-700: 146, 086, 177; /* #9256b1 */
  --purple-800: 088, 032, 154; /* #58209a */
  --purple-900: 065, 025, 115; /* #411973 */
  --purple-1000: 046, 017, 080; /* #2e1150 */
  --purple-1100: 035, 013, 063; /* #230d3f */
  --purple-1200: 018, 007, 032; /* #120720 */

  /* Internal Product Branding */
  --product-support: 000, 166, 086; /* #00a656 */
  --product-explore: 048, 169, 188; /* #30aabc */
  --product-gather: 246, 200, 190; /* #f6c8be */
  --product-guide: 235, 073, 097; /* #eb4962 */
  --product-chat: 247, 154, 062; /* #f79a3e */
  --product-talk: 239, 201, 061; /* #efc93d */
  --product-sell: 195, 143, 000; /* #c38f00 */

  /* External Product Branding */
  --product-twitter: 085, 172, 238; /* #55ACEE */
  --product-google: 220, 078, 065; /* #DC4E41 */

  /* Opacity */
  --opacity-100: 0.08;
  --opacity-200: 0.16;
  --opacity-300: 0.24;
  --opacity-400: 0.32;
  --opacity-500: 0.4;
  --opacity-600: 0.48;
  --opacity-700: 0.56;
  --opacity-800: 0.64;
  --opacity-900: 0.72;
  --opacity-1000: 0.8;
  --opacity-1100: 0.88;
  --opacity-1200: 0.96;

  --opacity-min: 0;
  --opacity-max: 1;
}

[data-theme="light"],
:root {
  /* Semantic Colors */
  --background-default: rgba(var(--white), var(--opacity-max));
  --background-raised: rgba(var(--white), var(--opacity-max));
  --background-recessed: rgba(var(--grey-100), var(--opacity-max));
  --background-subtle: rgba(var(--grey-100), var(--opacity-max));
  --background-emphasis: rgba(var(--grey-700), var(--opacity-max));
  --background-success: rgba(var(--green-100), var(--opacity-max));
  --background-warning: rgba(var(--yellow-100), var(--opacity-max));
  --background-danger: rgba(var(--red-100), var(--opacity-max));
  --background-primaryEmphasis: rgba(var(--blue-700), var(--opacity-max));
  --background-successEmphasis: rgba(var(--green-700), var(--opacity-max));
  --background-warningEmphasis: rgba(var(--yellow-700), var(--opacity-max));
  --background-dangerEmphasis: rgba(var(--red-700), var(--opacity-max));
  --background-disabled: rgba(var(--grey-700), var(--opacity-max));

  --foreground-default: rgba(var(--grey-900), var(--opacity-max));
  --foreground-subtle: rgba(var(--grey-700), var(--opacity-max));
  --foreground-onEmphasis: rgba(var(--white), var(--opacity-max));
  --foreground-primary: rgba(var(--blue-700), var(--opacity-max));
  --foreground-success: rgba(var(--green-700), var(--opacity-max));
  --foreground-warning: rgba(var(--yellow-700), var(--opacity-max));
  --foreground-danger: rgba(var(--red-700), var(--opacity-max));
  --foreground-successEmphasis: rgba(var(--green-900), var(--opacity-max));
  --foreground-warningEmphasis: rgba(var(--yellow-900), var(--opacity-max));
  --foreground-dangerEmphasis: rgba(var(--red-900), var(--opacity-max));
  --foreground-disabled: rgba(var(--grey-600), var(--opacity-max));

  --border-default: rgba(var(--grey-300), var(--opacity-max));
  --border-emphasis: rgba(var(--grey-600), var(--opacity-max));
  --border-subtle: rgba(var(--grey-200), var(--opacity-max));
  --border-success: rgba(var(--green-300), var(--opacity-max));
  --border-warning: rgba(var(--yellow-300), var(--opacity-max));
  --border-danger: rgba(var(--red-300), var(--opacity-max));
  --border-primaryEmphasis: rgba(var(--blue-700), var(--opacity-max));
  --border-successEmphasis: rgba(var(--green-700), var(--opacity-max));
  --border-warningEmphasis: rgba(var(--yellow-700), var(--opacity-max));
  --border-dangerEmphasis: rgba(var(--red-700), var(--opacity-max));
  --border-disabled: rgba(var(--grey-300), var(--opacity-max));

  /* Overlay */
  --overlay-light: rgba(var(--grey-700), var(--opacity-300));
  --overlay-medium: rgba(var(--grey-700), var(--opacity-600));
  --overlay-dark: rgba(var(--grey-700), var(--opacity-1000));

  /* Shadow */
  --shadow-small: rgba(var(--grey-1200), var(--opacity-200)) 0px 4px 8px 0px;
  --shadow-medium: rgba(var(--grey-1200), var(--opacity-200)) 0px 20px 24px 0px;
  --shadow-large: rgba(var(--grey-1200), var(--opacity-200)) 0px 20px 28px 0px;

  /* Focused */
  --focus-default: rgba(var(--blue-700), var(--opacity-100));
  --focus-focused: rgba(var(--blue-700), var(--opacity-200));
  --focus-active: rgba(var(--blue-700), var(--opacity-300));

  /* Links */
  --link-default: rgba(var(--blue-700), var(--opacity-max));
  --link-hover: rgba(var(--blue-800), var(--opacity-max));

  /* Tooltip */
  --tooltip-background: rgba(var(--grey-900), var(--opacity-max));
  --tooltip-border: rgba(var(--grey-900), var(--opacity-max));
  --tooltip-foreground: rgba(var(--white), var(--opacity-max));

  /* Custom Semantics */
  --product-accent: rgba(var(--kale-900), var(--opacity-max));
  --button-groupActive: rgba(var(--grey-200), var(--opacity-max));
  --background-sidepanel: rgba(var(--grey-100), var(--opacity-max));
  --overlay-legacy: rgba(var(--white), var(--opacity-600));

  /* Ticket Status */
  --background-statusDefault: var(--border-subtle);
  --background-statusNew: rgb(var(--yellow-400));
  --background-statusOpen: var(--background-dangerEmphasis);
  --background-statusPending: var(--background-primaryEmphasis);
  --background-statusHold: rgb(var(--grey-1000));
  --background-statusSolved: rgb(var(--grey-700));
  --background-statusSuspended: rgb(var(--grey-800));
  --background-statusClosed: rgb(var(--grey-200));

  --foreground-statusDefault: var(--foreground-subtle);
  --foreground-statusNew: rgb(var(--yellow-900));
  --foreground-statusOpen: var(--foreground-onEmphasis);
  --foreground-statusPending: var(--foreground-onEmphasis);
  --foreground-statusHold: var(--foreground-onEmphasis);
  --foreground-statusSolved: var(--foreground-onEmphasis);
  --foreground-statusSuspended: var(--foreground-onEmphasis);
  --foreground-statusClosed: rgb(var(--grey-800));

  /* Color scheme */
  --color-scheme: light;
}

[data-theme="dark"] {
  /* Semantic Colors */
  --background-default: rgba(var(--grey-1100), var(--opacity-max));
  --background-raised: rgba(var(--grey-1000), var(--opacity-max));
  --background-recessed: rgba(var(--grey-1200), var(--opacity-max));
  --background-subtle: rgba(var(--grey-1000), var(--opacity-max));
  --background-emphasis: rgba(var(--grey-600), var(--opacity-max));
  --background-success: rgba(var(--green-1000), var(--opacity-max));
  --background-warning: rgba(var(--yellow-1000), var(--opacity-max));
  --background-danger: rgba(var(--red-1000), var(--opacity-max));
  --background-primaryEmphasis: rgba(var(--blue-600), var(--opacity-max));
  --background-successEmphasis: rgba(var(--green-600), var(--opacity-max));
  --background-warningEmphasis: rgba(var(--yellow-600), var(--opacity-max));
  --background-dangerEmphasis: rgba(var(--red-600), var(--opacity-max));
  --background-disabled: rgba(var(--grey-500), var(--opacity-100));

  --foreground-default: rgba(var(--grey-300), var(--opacity-max));
  --foreground-subtle: rgba(var(--grey-500), var(--opacity-max));
  --foreground-onEmphasis: rgba(var(--grey-1100), var(--opacity-max));
  --foreground-primary: rgba(var(--blue-600), var(--opacity-max));
  --foreground-success: rgba(var(--green-400), var(--opacity-max));
  --foreground-warning: rgba(var(--yellow-400), var(--opacity-max));
  --foreground-danger: rgba(var(--red-400), var(--opacity-max));
  --foreground-successEmphasis: rgba(var(--green-300), var(--opacity-max));
  --foreground-warningEmphasis: rgba(var(--yellow-300), var(--opacity-max));
  --foreground-dangerEmphasis: rgba(var(--red-300), var(--opacity-max));
  --foreground-disabled: rgba(var(--grey-700), var(--opacity-max));

  --border-default: rgba(var(--grey-800), var(--opacity-max));
  --border-emphasis: rgba(var(--grey-600), var(--opacity-max));
  --border-subtle: rgba(var(--grey-900), var(--opacity-max));
  --border-success: rgba(var(--green-900), var(--opacity-max));
  --border-warning: rgba(var(--yellow-900), var(--opacity-max));
  --border-danger: rgba(var(--red-900), var(--opacity-max));
  --border-primaryEmphasis: rgba(var(--blue-600), var(--opacity-max));
  --border-successEmphasis: rgba(var(--green-600), var(--opacity-max));
  --border-warningEmphasis: rgba(var(--yellow-600), var(--opacity-max));
  --border-dangerEmphasis: rgba(var(--red-600), var(--opacity-max));
  --border-disabled: rgba(var(--grey-800), var(--opacity-max));

  /* Overlay */
  --overlay-light: rgba(var(--grey-500), var(--opacity-300));
  --overlay-medium: rgba(var(--grey-500), var(--opacity-600));
  --overlay-dark: rgba(var(--grey-500), var(--opacity-1000));

  /* Shadow */
  --shadow-small: rgba(var(--grey-1200), var(--opacity-1000)) 0px 4px 8px 0px;
  --shadow-medium: rgba(var(--grey-1200), var(--opacity-800)) 0px 20px 24px 0px;
  --shadow-large: rgba(var(--grey-1200), var(--opacity-1000)) 0px 20px 28px 0px;

  /* Focused */
  --focus-default: rgba(var(--blue-600), var(--opacity-100));
  --focus-focused: rgba(var(--blue-600), var(--opacity-200));
  --focus-active: rgba(var(--blue-600), var(--opacity-300));

  /* Links */
  --link-default: rgba(var(--blue-600), var(--opacity-max));
  --link-hover: rgba(var(--blue-500), var(--opacity-max));

  /* Tooltip */
  --tooltip-background: rgba(var(--grey-700), var(--opacity-max));
  --tooltip-border: rgba(var(--grey-700), var(--opacity-max));
  --tooltip-foreground: rgba(var(--white), var(--opacity-max));

  /* Custom Semantics */
  --product-accent: rgba(var(--kale-200), var(--opacity-max));
  --button-groupActive: rgba(var(--grey-600), var(--opacity-200));
  --background-sidepanel: rgba(var(--grey-1100), var(--opacity-max));
  --overlay-legacy: rgba(var(--grey-1100), var(--opacity-600));

  /* Ticket Status */
  --background-statusDefault: var(--border-subtle);
  --background-statusNew: rgb(var(--yellow-500));
  --background-statusOpen: var(--background-dangerEmphasis);
  --background-statusPending: var(--background-primaryEmphasis);
  --background-statusHold: rgb(var(--grey-100));
  --background-statusSolved: rgb(var(--grey-400));
  --background-statusSuspended: rgb(var(--grey-300));
  --background-statusClosed: rgb(var(--grey-800));

  --foreground-statusDefault: var(--foreground-subtle);
  --foreground-statusNew: var(--foreground-onEmphasis);
  --foreground-statusOpen: var(--foreground-onEmphasis);
  --foreground-statusPending: var(--foreground-onEmphasis);
  --foreground-statusHold: var(--foreground-onEmphasis);
  --foreground-statusSolved: var(--foreground-onEmphasis);
  --foreground-statusSuspended: var(--foreground-onEmphasis);
  --foreground-statusClosed: rgb(var(--grey-200));

  /* Color scheme */
  --color-scheme: dark;
}

/* BEGIN ./app/assets/stylesheets/application.scss */

/* BEGIN ./app/assets/stylesheets/configuration.reset.scss */
.clear {
  clear: both;
}

/* END ./app/assets/stylesheets/configuration.reset.scss */
/* BEGIN ./app/assets/stylesheets/reset.scss */
/**
  Reset originally based on

  → HTML5 ✰ Boilerplate

  and

  → html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline)
    v1.6.1 2010-09-17 | Authors: Eric Meyer & Richard Clark
    html5doctor.com/html-5-reset-stylesheet/
*/
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent;
}

/* no padding reset so cellpadding works in rendered emails */
td,
th {
  margin: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

ins {
  background-color: rgb(var(--lemon-200));
  color: var(--foreground-default);
  text-decoration: none;
}

mark {
  background-color: rgb(var(--lemon-200));
  color: var(--foreground-default);
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

/* tables still need cellspacing="0" in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid rgb(var(--grey-400));
  /* Grey-400 */
  margin: 1em 0;
  padding: 0;
}

input,
select {
  vertical-align: middle;
}

/* END RESET CSS */
/* some fonts code is originally from the YUI Library: developer.yahoo.com/yui/
   Refer to developer.yahoo.com/yui/3/cssfonts/ for font sizing percentages
*/

:root {
  --main-theme-color: var(--background-default);
}

body {
  font-size: 14px;
  line-height: 1.285;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

body,
strong,
em,
b,
i,
h1,
h2,
h3,
h4,
h5,
h6,
address,
label,
select,
input,
textarea,
button {
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen-Sans,
    Ubuntu,
    Cantarell,
    "Helvetica Neue",
    Arial,
    sans-serif;
}

label,
select,
input,
textarea,
button {
  font-size: 99%;
}

html[lang|="ja"] {
  font-size: 12px;
}

pre,
code,
kbd,
samp {
  font-family: Consolas, "Liberation Mono", Menlo, "Bitstream Vera Sans Mono", Courier, monospace;
}

/* Avoid zero-height body due to absolute positioning.
  Intended to fix the Edge driver used by our browser tests on Sauce Labs. */
html,
body {
  height: 100%;
  width: 100%;
}

body {
  background-color: var(--background-default);
}

/*
 * minimal base styles
 */
body,
select,
input,
textarea {
  background-color: var(--background-default);
  color: var(--foreground-default); /* rgb(var(--grey-800)) ( Grey-800 ) */
}

/* Headers (h1,h2,etc) have no default font-size or margin,
   you'll want to define those yourself. */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
}

/* always force a scrollbar in non-IE: */
html {
  overflow-y: scroll;
}

/* always needs specific treatment or it will be inaccessible */
a:hover,
a:active {
  outline: none;
}

ol {
  list-style-type: decimal;
}

/* Remove margins for navigation lists */
nav ul,
nav li {
  margin: 0;
}

small {
  font-size: 12px;
}

strong,
b,
th {
  font-weight: 600;
}

td,
td img {
  vertical-align: top;
}

sub {
  vertical-align: sub;
  font-size: 11px;
}

sup {
  vertical-align: super;
  font-size: 11px;
}

pre {
  padding: 15px;
  /* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */
  white-space: pre;
  /* CSS2 */
  white-space: pre-wrap;
  /* CSS 2.1 */
  white-space: pre-line;
  /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word;
  /* IE */
}

textarea {
  overflow: auto;
}

/* thnx ivannikolic! www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ */
/* align checkboxes, radios, text inputs with their label
   by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css  */
input[type="radio"] {
  vertical-align: text-bottom;
}

input[type="checkbox"] {
  vertical-align: bottom;
}

/* hand cursor on clickable input elements and all links */
a,
label,
input[type="button"],
input[type="submit"],
input[type="image"],
button {
  cursor: pointer;
}

/* webkit browsers add a 2px margin outside the chrome of form elements */
button,
input,
select,
textarea {
  margin: 0;
  border: 0;
}

/* colors for form validity */
input:invalid,
textarea:invalid {
  border-radius: 1px;
  box-shadow: 0 0 5px var(--border-dangerEmphasis);
}

.no-boxshadow input:invalid,
.no-boxshadow textarea:invalid {
  background-color: var(--background-subtle);
}

/* make buttons play nice in IE:
   www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ */
button {
  width: auto;
  overflow: visible;
}

/* general form styling */
.classic_input,
.ember-text-field,
.ember-text-area {
  width: inherit;
  border: 1px solid var(--border-default);
  border-radius: 2px;
  padding: 5px;
  background-color: var(--background-default);
  /* Focus & hover colors taken from Garden 2018-05-22 */
}
.classic_input:hover,
.ember-text-field:hover,
.ember-text-area:hover {
  border-color: var(--border-primaryEmphasis) !important;
}
.classic_input:focus,
.ember-text-field:focus,
.ember-text-area:focus {
  border-color: var(--border-primaryEmphasis) !important;
  box-shadow:
    var(--background-default) 0px 0px 0px 1px,
    var(--border-primaryEmphasis) 0px 0px 0px 3px !important;
  outline: thick none !important;
}

.link {
  color: var(--foreground-primary);
  cursor: pointer;
}

.link_light {
  color: var(--foreground-primary);
  cursor: pointer;
}
.link_light:hover,
.link_light:focus {
  text-decoration: underline;
}

a,
a:hover {
  text-decoration: none;
}

/* END ./app/assets/stylesheets/reset.scss */

/* icon sprites */
.current_collaborators .zd-tag-item.agent:after,
.user-picker-menu-base .zd-tag-item.agent:after,
.user-picker-menu .photo_badge.agent,
.ccs-menu .photo_badge.agent,
.requester-menu .photo_badge.agent,
.user_photo.agent .photo_badge,
.agent.user_assume_photo .photo_badge,
.section.ticket .notice .control,
.stacked_menu .section .task.complete .status,
.property_box .suggestions li.ui-menu-item.group .icon,
.zd-menu-item.group > .zd-menu-item-icon,
.zd-selectmenu-base.group .icon,
.ticket .property_box .requester.form_field.group-selection .ui-button-text,
.assignee_widget li.ui-menu-item.group .icon,
.assignee_widget.group-selection .ui-button-text,
.stacked_menu .section .task.started .status,
.section.ticket .notice .information,
.user_photo_editable .editable-icon,
.user_photo.shared .photo_badge,
.shared.user_assume_photo .photo_badge,
.user_photo.end_user .photo_badge,
.end_user.user_assume_photo .photo_badge,
.property_box .suggestions li.ui-menu-item.agent .icon,
.zd-menu-item.agent > .zd-menu-item-icon,
.zd-selectmenu-base.agent .icon,
.agent .icon,
.ticket .property_box .requester.form_field.agent-selection .ui-button-text,
.assignee_widget li.ui-menu-item.agent .icon,
.assignee_widget.agent-selection .ui-button-text,
.comment_input .requester-no-handle .icon-warning,
.comment_input .channelback-not-supported .icon-warning {
  background: url(/agent/assets/spritemaps/globals-sprites-4af556f6740f3234bcf2e6666f060a04.png) no-repeat;
}

.current_collaborators .zd-tag-item.agent:after,
.user-picker-menu-base .zd-tag-item.agent:after,
.user-picker-menu .photo_badge.agent,
.ccs-menu .photo_badge.agent,
.requester-menu .photo_badge.agent,
.user_photo.agent .photo_badge,
.agent.user_assume_photo .photo_badge {
  background-position: 0px 0px;
}

.section.ticket .notice .control {
  background-position: 0px -30px;
}

.stacked_menu .section .task.complete .status {
  background-position: 0px -60px;
}

.property_box .suggestions li.ui-menu-item.group .icon,
.zd-menu-item.group > .zd-menu-item-icon,
.zd-selectmenu-base.group .icon,
.ticket .property_box .requester.form_field.group-selection .ui-button-text,
.assignee_widget li.ui-menu-item.group .icon,
.assignee_widget.group-selection .ui-button-text {
  background-position: 0px -104px;
}

.stacked_menu .section .task.started .status {
  background-position: 0px -120px;
}

.section.ticket .notice .information {
  background-position: 0px -150px;
}

.user_photo_editable .editable-icon {
  background-position: 0px -250px;
}

.user_photo.shared .photo_badge,
.shared.user_assume_photo .photo_badge {
  background-position: 0px -417px;
}

.user_photo.end_user .photo_badge,
.end_user.user_assume_photo .photo_badge {
  background-position: 0px -435px;
}

.property_box .suggestions li.ui-menu-item.agent .icon,
.zd-menu-item.agent > .zd-menu-item-icon,
.zd-selectmenu-base.agent .icon,
.agent .icon,
.ticket .property_box .requester.form_field.agent-selection .ui-button-text,
.assignee_widget li.ui-menu-item.agent .icon,
.assignee_widget.agent-selection .ui-button-text {
  background-position: 0px -465px;
}

.comment_input .requester-no-handle .icon-warning,
.comment_input .channelback-not-supported .icon-warning {
  background-position: 0px -516px;
}

.chat .channel,
.facebook .channel,
.fb_private_message .channel,
.email .meta .channel,
.mail .profile .channel,
.sms .profile .channel,
.twitter .meta .channel,
.twitter .profile .channel,
.text_message .channel,
.voice .channel,
.voice_inbound .channel,
.voice_outbound .channel,
.comment_input .call-back .toggle .icon,
.voice_voicemail .channel {
  background: url(/agent/assets/spritemaps/channels-1c2a93e6a3dfb8b1f17e3cbfb04686d6.png) no-repeat;
}

.chat .channel {
  background-position: 0px -44px;
}

.facebook .channel,
.fb_private_message .channel {
  background-position: 0px -954px;
}

.email .meta .channel {
  background-position: 0px -1035px;
}

.mail .profile .channel {
  background-position: 0px -1031px;
}

.sms .profile .channel {
  background-position: 0px -1058px;
}

.twitter .meta .channel {
  background-position: 0px -1085px;
}

.twitter .profile .channel {
  background-position: 0px -1295px;
}

.text_message .channel,
.voice .channel {
  background-position: 0px -1322px;
}

.voice_inbound .channel {
  background-position: 0px -1377px;
}

.voice_outbound .channel,
.comment_input .call-back .toggle .icon {
  background-position: 0px -1484px;
}

.voice_voicemail .channel {
  background-position: 0px -1673px;
}

div.feature-notifications .right .actions .options-button .cog {
  background: url(/agent/assets/spritemaps/navigation-c26f8aaeb3de5adaec28f9199b89e429.png) no-repeat;
}

div.feature-notifications .right .actions .options-button.open .cog {
  background-position: 0px 0px;
}

div.feature-notifications .right .actions .options-button:hover .cog,
div.feature-notifications .right .actions .options-button:focus .cog {
  background-position: 0px -26px;
}

div.feature-notifications .right .actions .options-button .cog {
  background-position: 0px -52px;
}

/* BEGIN ./app/assets/stylesheets/mixins/autocomplete.scss */
.suggest {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  margin-top: 18px;
  background: var(--background-default);
  border: 1px solid var(--border-default);
  border-radius: 3px;
  box-shadow: var(--shadow-large);
  max-width: 300px;
  z-index: 10;
}

.suggest-ul {
  margin: 0px;
}

.scrollable-ul {
  position: relative;
  overflow: auto;
}

.suggest-li {
  padding: 5px 10px;
  border-bottom: 1px solid var(--border-default);
  line-height: 18px;
  font-weight: 600;
  font-size: 14px;
  line-height: 18px;
  border-left: 2px solid var(--background-default);
  display: block;
}

.suggest-li-focus {
  border-left: 2px solid rgb(var(--green-400));
}

.suggest-detail {
  color: rgb(var(--grey-700));
  font-weight: 400;
}

.info-message {
  font-weight: 600;
  position: relative;
  line-height: 1.42857;
  font-size: 14px;
  background-color: var(--background-default);
  color: var(--foreground-subtle);
  border-width: 1px;
  border-style: solid;
  border-image: initial;
  border-radius: 4px;
  border-color: var(--border-subtle);
  margin: 20px 20px 0px 20px;
  padding: 20px;
}

.info-message-paragraph {
  padding-bottom: 0px !important;
}

/* END ./app/assets/stylesheets/mixins/autocomplete.scss */
/* BEGIN ./app/assets/stylesheets/utilities.scss */
/*
 * Non-semantic helper classes
 */
/* Hide for both screenreaders and browsers
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden {
  display: none;
  visibility: hidden;
}

/* Hide only visually, but have it available for screenreaders
   www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden  */
.visuallyhidden {
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px);
}

/* Hide visually and from screenreaders, but maintain layout */
.invisible {
  visibility: hidden;
}

/* >> The Magnificent CLEARFIX: Updated to prevent margin-collapsing on child elements << j.mp/bestclearfix */
.clearfix:before,
.clearfix:after {
  content: "\0020";
  display: block;
  height: 0;
  visibility: hidden;
}

.clearfix:after {
  clear: both;
}

/* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
.clearfix {
  display: block;
}

.zd-svg-icon-26 {
  height: 26px;
  width: 26px;
}

.zd-svg-icon-16 {
  height: 16px;
  width: 16px;
}

.zd-svg-icon-14 {
  height: 14px;
  width: 14px;
}

.zd-svg-icon-12 {
  height: 12px;
  width: 12px;
}

.is-disabled {
  opacity: 0.25;
  pointer-events: none;
}

/* Garden component are 2px taller than the component we currently have in the branding header.
We need to offset them by 1px to center them as well as adding 10px spacing between them. */
.u-garden-in-header {
  margin: -1px 10px 0 0;
}
html[data-rtl-language="true"] .u-garden-in-header {
  margin: -1px 0 0 10px;
}

/* END ./app/assets/stylesheets/utilities.scss */
/* BEGIN ./app/assets/stylesheets/mixins.styles.scss */
/* BEGIN ./app/assets/stylesheets/mixins/styles/action_icon.scss */
.action_button {
  background-color: transparent;
  display: block;
  padding: 0 0 0 24px;
  margin-right: 10px;
  text-indent: 0;
  color: var(--foreground-default);
  white-space: nowrap;
  font-weight: 600;
  font-size: 12px;
  opacity: 0.6;
}
.action_button:hover {
  opacity: 1;
}

/* END ./app/assets/stylesheets/mixins/styles/action_icon.scss */
/* BEGIN ./app/assets/stylesheets/mixins/styles/attachments.scss */
/* <ul class="attachments"> */
/*   <li> */
/*     <a href="..." type="..." class="attachment"> */
/*        <span class="attachment-icon"></span>Attachment Name */
/*     </a> */
/*   </li> */
/*   ... */
/* </ul> */
ul.attachments {
  margin: 0 0 10px 0;
}
ul.attachments:empty {
  display: none;
}
ul.attachments li {
  display: inline-block;
  list-style-type: none;
  margin: 0 8px 8px 0;
  border-radius: 4px;
  background-color: var(--background-recessed);
  vertical-align: top;
}
ul.attachments li:last-child {
  margin-right: 0;
}
ul.attachments li .attachment {
  position: relative;
  display: inline-block;
  font-size: 12px;
  padding: 4px 8px;
}
ul.attachments li .attachment img {
  padding-top: 5px;
  max-height: 65px;
}
ul.attachments li .attachment i {
  margin-top: -1px;
  opacity: 0.2;
}
ul.attachments li a.attachment {
  background-color: transparent;
}
ul.attachments li span.attachment {
  color: var(--foreground-default);
}
ul.attachments li .delete,
ul.attachments li .deleting {
  background-color: transparent;
  border: none;
  width: 20px;
}
ul.attachments li .deleting,
ul.attachments li .uploading {
  background-image: url(/agent/assets/icons/spinners/small_spinner-f57d905b62b713e3324c733d4493bf5c.gif);
  display: inline-block;
}

.audits .attachments li {
  width: 96px;
  line-height: 16px;
  overflow: hidden;
}
.audits .attachments li a {
  word-wrap: break-word;
  width: 83px;
}

/* END ./app/assets/stylesheets/mixins/styles/attachments.scss */
/* BEGIN ./app/assets/stylesheets/mixins/styles/buttons.scss */
.c-btn {
  display: inline-block;
  transition:
    border-color 0.15s ease-in-out,
    box-shadow 0.1s ease-in-out,
    background-color 0.17s ease-in-out,
    color 0.15s ease-in-out;
  margin: 0;
  border: 1px solid var(--border-default);
  border-radius: 4px;
  background-color: var(--background-default);
  cursor: pointer;
  padding: 0 2.25em;
  min-width: 8.3334em;
  overflow: visible;
  vertical-align: middle;
  text-align: center;
  text-decoration: none;
  line-height: 2.34;
  white-space: nowrap;
  color: rgb(var(--grey-500));
  font-family: inherit;
  font-size: 12px;
  font-weight: 400;
  box-sizing: border-box;
  user-select: none;
  -webkit-touch-callout: none;
}

.c-btn::-moz-focus-inner {
  border: 0;
  padding: 0;
}

.c-btn--pill {
  border-radius: 100px;
}

.c-btn--medium {
  padding: 0 1.9286em;
  min-width: 8.5715em;
  line-height: 2.72;
  font-size: 14px;
}

.c-btn--large {
  padding: 0 1.9286em;
  min-width: 10.0001em;
  line-height: 3.43;
  font-size: 14px;
}

.c-btn--full {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.l-btn-group > .c-btn {
  margin-left: -1px;
  border-radius: 0;
}

.l-btn-group > .c-btn:first-of-type {
  margin-left: 0;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.l-btn-group > .c-btn:last-of-type {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.l-btn-group.is-rtl {
  direction: rtl;
}

.l-btn-group.is-rtl > .c-btn {
  margin-right: -1px;
  margin-left: 0;
  border-radius: 0;
}

.l-btn-group.is-rtl > .c-btn:first-of-type {
  margin-right: 0;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.l-btn-group.is-rtl > .c-btn:last-of-type {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.c-btn.is-hovered,
.c-btn:hover {
  background-color: var(--background-default);
  text-decoration: none;
  color: var(--foreground-default);
}

.c-btn:focus {
  outline: none;
}

.c-btn.is-focused {
  box-shadow: var(--shadow-large);
}

.c-btn.is-active,
.c-btn:active {
  background-color: var(--background-default);
  text-decoration: none;
  color: var(--foreground-default);
}

.c-btn.is-hovered.is-active,
.c-btn.is-hovered:active,
.c-btn:hover.is-active,
.c-btn:hover:active,
.l-btn-group > .c-btn.is-hovered.is-active,
.l-btn-group > .c-btn.is-hovered:active,
.l-btn-group > .c-btn:hover.is-active,
.l-btn-group > .c-btn:hover:active {
  box-shadow: none;
}

.c-btn.is-disabled.is-disabled,
.c-btn:disabled:disabled {
  border-color: transparent;
  box-shadow: none;
  background-color: rgb(var(--grey-300));
  cursor: default;
  color: var(--background-default);
}

.l-btn-group > .c-btn.is-focused {
  box-shadow: inset 0 0 0 3px var(--overlay-light);
}

.c-btn--basic {
  border-color: transparent;
  background-color: transparent;
}

.c-btn--basic.is-hovered,
.c-btn--basic:hover {
  background-color: var(--background-default);
}

.c-btn--basic.is-active,
.c-btn--basic:active {
  background-color: rgb(var(--grey-200));
}

.c-btn--primary {
  border-color: transparent;
  background-color: var(--foreground-default);
  color: var(--background-default);
}

.c-btn--primary.is-hovered,
.c-btn--primary:hover {
  background-color: var(--foreground-subtle);
  color: var(--background-default);
}

.c-btn--primary.is-active,
.c-btn--primary:active {
  background-color: var(--foreground-default);
  color: var(--background-default);
}

/* END ./app/assets/stylesheets/mixins/styles/buttons.scss */
/* BEGIN ./app/assets/stylesheets/mixins/styles/channels.scss */
.profile .channel {
  background: url(/agent/assets/tab-icons/support-7322a274c6a96a9669a77393840ea9b1.svg) 1px 0px / contain no-repeat;
}

.twitter .meta .channel {
  margin-top: -2px;
}

.mast .twitter .profile.ticket {
  background-color: rgb(var(--product-twitter));
  border: none;
}

.event.web .header .meta .channel {
  display: none;
}

.topic .channel {
  background: url(/agent/assets/tab-icons/support-7322a274c6a96a9669a77393840ea9b1.svg) 1px 0px / contain no-repeat;
}

.aeu .zd-svg-icon-16 {
  vertical-align: middle;
}

/* END ./app/assets/stylesheets/mixins/styles/channels.scss */
/* BEGIN ./app/assets/stylesheets/mixins/styles/forms.scss */
ul.highlighted,
button.highlighted,
input.highlighted {
  background-image: none !important;
  background-color: var(--background-default) !important;
}

textarea.highlighted {
  color: var(--foreground-success) !important;
}

.highlighted ul {
  background-color: var(--background-default) !important;
  background-image: none !important;
}

/* Glow */
.editable:focus,
.editable input[type="text"]:focus,
.focused,
.token_list.ui-state-focus,
.ui-selectmenu:focus,
.zd-state-focus .zd-selectmenu-base,
.zd-state-focus .zd-searchmenu-base {
  border-color: var(--border-primaryEmphasis) !important;
  box-shadow:
    var(--background-default) 0px 0px 0px 1px,
    var(--border-primaryEmphasis) 0px 0px 0px 3px;
  outline: thick none !important;
}

/* END ./app/assets/stylesheets/mixins/styles/forms.scss */
/* BEGIN ./app/assets/stylesheets/mixins/styles/labels.scss */
.ticket_status.new {
  background: var(--background-statusNew);
  color: var(--foreground-statusNew);
}

.ticket_status.open {
  background: var(--background-statusOpen);
  color: var(--foreground-statusOpen);
}

.ticket_status.pending {
  background: var(--background-statusPending);
  color: var(--foreground-statusPending);
}

.ticket_status.hold {
  background: var(--background-statusHold);
  color: var(--foreground-statusHold);
}

.ticket_status.solved {
  background: var(--background-statusSolved);
  color: var(--foreground-statusSolved);
}

.ticket_status.suspended {
  background: var(--background-statusSuspended);
  color: var(--foreground-statusSuspended);
}

.ticket_status.closed {
  background: var(--background-statusClosed);
  color: var(--foreground-statusClosed);
}

.sla-policy-metric-label {
  font-size: 14px;
  font-weight: normal;
  padding-left: 10px;
  vertical-align: middle;
}

.sla-policy-metric-action-label {
  display: inline;
}

.ticket_sla_label {
  border-radius: 3px;
  font-size: 10px;
  line-height: 10px;
  min-width: 30px;
  margin: 5px 0;
  padding: 5px 6px;
  text-align: center;
  vertical-align: middle;
}

.sla-policy-metric-action-label,
.ticket_sla_label {
  /* Overwrite default style */
  border-collapse: separate;
}
.sla-policy-metric-action-label.counting,
.ticket_sla_label.counting {
  color: var(--background-default);
}
.sla-policy-metric-action-label.counting.breached,
.ticket_sla_label.counting.breached {
  background-color: rgb(var(--red-600));
}
.sla-policy-metric-action-label.counting.not-breached,
.ticket_sla_label.counting.not-breached {
  background-color: rgb(var(--green-400));
}
.sla-policy-metric-action-label.counting.breached.not-almost-breached,
.ticket_sla_label.counting.breached.not-almost-breached {
  background-color: rgb(var(--red-600));
  color: var(--background-default);
}
.sla-policy-metric-action-label.counting.not-breached.almost-breached,
.ticket_sla_label.counting.not-breached.almost-breached {
  background-color: rgb(var(--yellow-500));
  color: rgb(var(--crimson-900));
}
.sla-policy-metric-action-label.counting.not-breached.not-almost-breached,
.ticket_sla_label.counting.not-breached.not-almost-breached {
  background-color: rgb(var(--teal-100));
  color: rgb(var(--teal-900));
}
.sla-policy-metric-action-label.paused,
.ticket_sla_label.paused {
  background-color: var(--background-default);
  border: 1px solid var(--border-default);
  /* Grey-300 */
}
.sla-policy-metric-action-label.paused.breached,
.ticket_sla_label.paused.breached {
  color: rgb(var(--red-600));
}
.sla-policy-metric-action-label.paused.not-breached,
.ticket_sla_label.paused.not-breached {
  color: rgb(var(--green-400));
}

.ticket_sla_label {
  display: table;
}
.ticket_sla_label svg {
  display: inline-block;
  margin: 0 2px;
}
.ticket_sla_label .pause-icon {
  background-position: center;
  background-repeat: no-repeat;
  height: 8px;
  min-width: 30px;
}
.ticket_sla_label.breached .pause-icon {
  background-image: url(/agent/assets/icons/ticket_views/pause_red-858007cc8e2cf25bd391b049eeb48f1c.svg);
}
.ticket_sla_label.not-breached .pause-icon {
  background-image: url(/agent/assets/icons/ticket_views/pause_green-56e0c3d8f9691ee0188b5c2255d9460e.svg);
}

.ticket_status_label,
.sla-policy-metric-action-label {
  padding: 2px 10px 1px 10px;
  font-size: 9px;
  white-space: nowrap;
  border-radius: 3px;
  background: var(--background-statusDefault);
  color: var(--foreground-statusDefault);
  min-height: 14px;
  font-weight: 600;
  display: inline-block;
  line-height: 16px;
}
.ticket_status_label.new,
.sla-policy-metric-action-label.new {
  background: var(--background-statusNew);
  color: var(--foreground-statusNew);
}
.ticket_status_label.open,
.sla-policy-metric-action-label.open {
  background: var(--background-statusOpen);
  color: var(--foreground-statusOpen);
}
.ticket_status_label.pending,
.sla-policy-metric-action-label.pending {
  background: var(--background-statusPending);
  color: var(--foreground-statusPending);
}
.ticket_status_label.hold,
.sla-policy-metric-action-label.hold {
  background: var(--background-statusHold);
  color: var(--foreground-statusHold);
}
.ticket_status_label.solved,
.sla-policy-metric-action-label.solved {
  background: var(--background-statusSolved);
  color: var(--foreground-statusSolved);
}
.ticket_status_label.suspended,
.sla-policy-metric-action-label.suspended {
  background: var(--background-statusSuspended);
  color: var(--foreground-statusSuspended);
}
.ticket_status_label.closed,
.sla-policy-metric-action-label.closed {
  background: var(--background-statusClosed);
  color: var(--foreground-statusClosed);
}
.ticket_status_label.compact,
.sla-policy-metric-action-label.compact {
  padding: 0;
  display: block;
  width: 15px;
  text-align: center;
  font-size: 9px;
  line-height: 15px;
}
.ticket_status_label.compact.suspended,
.sla-policy-metric-action-label.compact.suspended {
  color: transparent;
}
.ticket_status_label.small,
.sla-policy-metric-action-label.small {
  font-size: 9px;
}
.ticket_status_label.toolbar,
.sla-policy-metric-action-label.toolbar {
  padding: 2px 5px 3px 5px;
  font-size: 9px;
  text-transform: none;
  margin-right: 2px;
  text-shadow: none;
  line-height: 0;
  display: inline;
  position: relative;
  top: -1px;
  letter-spacing: 0;
  font-weight: 600;
}

.sla-policy-metric-action-label {
  font-size: 14px;
  font-weight: 400;
}
.sla-policy-metric-action-label.compact {
  font-size: 10px;
}
.sla-policy-metric-action-label.small {
  font-size: 11px;
}
.sla-policy-metric-action-label.toolbar {
  font-size: 10px;
  font-weight: 400;
}

/* END ./app/assets/stylesheets/mixins/styles/labels.scss */
/* BEGIN ./app/assets/stylesheets/mixins/styles/transforms.scss */
@keyframes opening-sequence {
  0% {
    top: 0;
    opacity: 0.2;
  }
  100% {
    top: 45px;
    opacity: 1;
  }
}

/* END ./app/assets/stylesheets/mixins/styles/transforms.scss */
/* END ./app/assets/stylesheets/mixins.styles.scss */
/* BEGIN ./app/assets/stylesheets/vendor_overrides.scss */

/* BEGIN ./app/assets/stylesheets/overrides/jquery-ui.scss */
/* Global */
.ui-widget,
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
  font-size: 14px;
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen-Sans,
    Ubuntu,
    Cantarell,
    "Helvetica Neue",
    Arial,
    sans-serif;
}

.ui-widget-content {
  background-color: var(--background-default);
  background-image: none;
}

.ui-widget-header {
  font-weight: 600;
  background-image: url(/agent/assets/jquery-ui/ui-bg_highlight-soft_75_cccccc_1x100-1aa3a91dcb0443e89c0f43e873a7f21f.png);
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
  background-color: var(--background-default);
  background-image: linear-gradient(var(--background-recessed), var(--background-default));
}

input:hover,
textarea:hover,
.token_list:hover {
  /* Color matches Garden, May 2018 */
  border-color: var(--border-primaryEmphasis);
}

.ui-state-hover a,
.ui-widget-content .ui-state-hover a,
.ui-state-focus a,
.ui-widget-content a.ui-state-focus {
  background: var(--background-subtle);
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
  background: var(--background-default);
}

.ui-widget-content li.ui-state-hover {
  border-color: var(--border-subtle);
}

/*.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { background-image: asset-url("jquery-ui/ui-bg_glass_65_ffffff_1x400-8d846ad5e87908e44b090f35b064bcae.png"); }*/
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
  background-image: none;
}

.ui-icon {
  background-image: url(/agent/assets/jquery-ui/ui-icons_222222_256x240-8ced4bdf3d981d15a4bee34c07b5c7dd.png);
}

.ui-widget-content .ui-icon {
  background-image: url(/agent/assets/jquery-ui/ui-icons_222222_256x240-8ced4bdf3d981d15a4bee34c07b5c7dd.png);
}

.ui-widget-header .ui-icon {
  background-image: url(/agent/assets/jquery-ui/ui-icons_222222_256x240-8ced4bdf3d981d15a4bee34c07b5c7dd.png);
}

.ui-state-default .ui-icon {
  background-image: url(/agent/assets/jquery-ui/ui-icons_888888_256x240-de7710ef5b1564742f84f45c94a45561.png);
}

.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
  background-image: url(/agent/assets/jquery-ui/ui-icons_454545_256x240-7a4f7deea000aaa438c1260579a322af.png);
}

.ui-state-active .ui-icon {
  background-image: url(/agent/assets/jquery-ui/ui-icons_454545_256x240-7a4f7deea000aaa438c1260579a322af.png);
}

.ui-state-highlight .ui-icon {
  background-image: url(/agent/assets/jquery-ui/ui-icons_2e83ff_256x240-cdcca460c9ad8e4c94b20eb266d315ae.png);
}

.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
  background-image: url(/agent/assets/jquery-ui/ui-icons_cd0a0a_256x240-f9180d20b5a4ca4f67a459ec87709b32.png);
}

.ui-widget-overlay {
  background-image: url(/agent/assets/jquery-ui/ui-bg_flat_0_aaaaaa_40x100-9cab5930328e2a69ef4bbf2c5dee1db1.png);
}

.ui-widget-shadow {
  background-image: url(/agent/assets/jquery-ui/ui-bg_flat_0_aaaaaa_40x100-9cab5930328e2a69ef4bbf2c5dee1db1.png);
}

/* Corner radius */
.ui-corner-tl {
  border-top-left-radius: 1px;
}

.ui-corner-tr {
  border-top-right-radius: 1px;
}

.ui-corner-bl {
  border-bottom-left-radius: 1px;
}

.ui-corner-br {
  border-bottom-right-radius: 1px;
}

.ui-corner-top {
  border-top-left-radius: 1px;
  border-top-right-radius: 1px;
}

.ui-corner-bottom {
  border-bottom-right-radius: 1px;
  border-bottom-left-radius: 1px;
}

.ui-corner-right {
  border-top-right-radius: 1px;
  border-bottom-right-radius: 1px;
}

.ui-corner-left {
  border-bottom-left-radius: 1px;
  border-top-left-radius: 1px;
}

.ui-corner-all {
  border-radius: 1px;
}

.ui-widget-content {
  border-top: none;
}

/* Menu */
.ui-menu {
  padding: 0;
}
.ui-menu .ui-icon {
  background-position-y: -17px;
  opacity: 0.4;
  top: 0.4em;
  left: 0.5em;
}
.ui-menu .ui-menu-item a {
  border: none;
}
.ui-menu .ui-menu-item a.ui-state-focus,
.ui-menu .ui-menu-item a.ui-state-active {
  margin: 0;
}
.ui-menu .ui-menu-item a.ui-state-focus {
  border: none;
  border-radius: 1;
}

.ui-button-text-only .ui-button-text {
  padding: 5px 0;
}

/* Selectmenu
-----------------------------------*/
.ui-selectmenu {
  position: relative;
  display: inline-block;
  height: 2em;
  line-height: 2em;
  overflow: hidden;
  text-decoration: none;
  vertical-align: middle;
}
.ui-selectmenu span.ui-selectmenu-status {
  height: 2em;
  line-height: 2em;
  padding: 0 8px;
}

.ui-selectmenu-icon {
  position: absolute;
  right: 6px;
  margin-top: -8px;
  top: 50%;
}

.ui-selectmenu-menu {
  padding: 0;
  margin: 0;
  list-style: none;
  position: absolute;
  top: 0;
  display: none;
  overflow: auto;
  z-index: 1005;
  box-shadow: var(--shadow-medium);
}

/* z-index: 1005 to make selectmenu work with dialog */
.ui-selectmenu-open {
  display: block;
  z-index: 1 !important;
}

.ui-selectmenu-open a {
  color: rgb(var(--grey-600)) !important;
}

.ui-selectmenu-menu-popup {
  margin-top: -1px;
}

.ui-selectmenu-menu-dropdown {
  margin: 0;
}

.ui-selectmenu-menu li {
  background-color: var(--background-default);
  padding: 0;
  margin: 0;
  display: block;
  border-top: 1px dotted transparent;
  border-bottom: 1px dotted transparent;
  border-right-width: 0 !important;
  border-left-width: 0 !important;
  font-weight: 400 !important;
}

.ui-selectmenu-menu li a,
.ui-selectmenu-status {
  line-height: 1.4em;
  display: block;
  padding: 0.2em 0.7em;
  outline: none;
  text-decoration: none;
}

.ui-selectmenu-menu li.ui-state-disabled a {
  cursor: default;
}

.ui-selectmenu-menu li.ui-selectmenu-hasIcon a,
.ui-selectmenu-hasIcon .ui-selectmenu-status {
  padding-left: 20px;
  position: relative;
  margin-left: 5px;
}

.ui-selectmenu-menu li .ui-icon,
.ui-selectmenu-status .ui-icon {
  position: absolute;
  top: 1em;
  margin-top: -8px;
  left: 0;
}

.ui-selectmenu-menu li span,
.ui-selectmenu-status span {
  display: block;
  margin-bottom: 0.2em;
}

.ui-selectmenu-menu li .ui-selectmenu-item-header {
  font-weight: 600;
}

.ui-selectmenu-menu li .ui-selectmenu-item-footer {
  opacity: 0.8;
}

/* for optgroups */
.ui-selectmenu-menu .ui-selectmenu-group {
  font-size: 14px;
}

.ui-selectmenu-menu .ui-selectmenu-group .ui-selectmenu-group-label {
  line-height: 1.4em;
  display: block;
  padding: 0.6em 0.5em 0;
  font-weight: 600;
}

.ui-selectmenu-menu .ui-selectmenu-group ul {
  margin: 0;
  padding: 0;
}

.ui-menu .ui-menu {
  margin-top: 0;
}

.ui-datepicker th {
  font-weight: 600;
}
.ui-datepicker td {
  padding: 3px;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  text-align: center;
  line-height: 1.8em;
  top: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
  visibility: hidden;
}
.ui-datepicker .ui-datepicker-prev.ui-state-hover,
.ui-datepicker .ui-datepicker-next.ui-state-hover {
  border: none;
}
.ui-datepicker .ui-datepicker-prev {
  left: 2px;
}
html[data-rtl-language="true"] .ui-datepicker .ui-datepicker-prev {
  left: auto;
  right: 2px;
}
.ui-datepicker .ui-datepicker-next {
  right: 2px;
}
html[data-rtl-language="true"] .ui-datepicker .ui-datepicker-next {
  left: 2px;
  right: auto;
}
.ui-datepicker .ui-datepicker-prev:after {
  content: "<";
}
.ui-datepicker .ui-datepicker-next:after {
  content: ">";
}
.ui-datepicker.ui-widget-content {
  width: auto;
  min-width: 17em;
  padding: 10px;
  background: var(--background-default);
  border: 1px solid var(--border-default);
  border-radius: 3px;
  box-shadow: var(--shadow-medium);
}
.ui-datepicker .ui-datepicker-header {
  background: var(--background-default);
  border: none;
}
.ui-datepicker .ui-datepicker-title {
  background: var(--background-default);
}
.ui-datepicker .ui-state-default {
  background: transparent;
  border: none;
  text-align: center;
  padding-top: 5px;
  padding-bottom: 5px;
}
.ui-datepicker .ui-datepicker-today a.ui-state-highlight {
  border-radius: 3px;
  background-color: rgb(var(--grey-200));
}
.ui-datepicker .ui-datepicker-current-day a.ui-state-active {
  border-radius: 3px;
  color: var(--background-default);
  background-color: rgb(var(--green-600));
}

[data-theme="dark"] .ui-datepicker .ui-datepicker-today a.ui-state-highlight {
  background-color: rgb(var(--grey-900));
}

[data-theme="dark"] .ui-datepicker .ui-datepicker-current-day a.ui-state-active {
  background-color: rgb(var(--green-500));
}

/* END ./app/assets/stylesheets/overrides/jquery-ui.scss */
/* BEGIN ./app/assets/stylesheets/overrides/bootstrap.scss */
a {
  color: var(--link-default);
}

a:hover {
  color: var(--link-hover);
}

.uneditable-input {
  width: inherit;
}

.clearfix {
  margin-bottom: 0;
}

p {
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen-Sans,
    Ubuntu,
    Cantarell,
    "Helvetica Neue",
    Arial,
    sans-serif;
}

/* Tooltip overrides */
.tooltip.in {
  opacity: 1;
}

.tooltip.top .tooltip-arrow {
  border-top-color: var(--tooltip-border);
}

.tooltip.right .tooltip-arrow {
  border-right-color: var(--tooltip-border);
}

.tooltip.bottom .tooltip-arrow {
  border-bottom-color: var(--tooltip-border);
}

.tooltip.left .tooltip-arrow {
  border-left-color: var(--tooltip-border);
}

.tooltip .tooltip-inner {
  background-color: var(--tooltip-background);
  color: var(--tooltip-foreground);
  padding: 5px 8px 6px 8px;
  max-width: 300px;
}
html[data-rtl-language="true"] .tooltip .tooltip-inner {
  text-align: right;
}

/* Popover overrides */
.popover-title {
  font-size: 14px;
  word-break: break-word;
  padding-top: 11px;
}

.popover-inner {
  padding: 0;
  background: none;
  border: 0;
  box-shadow: var(--shadow-large);
}
html[data-rtl-language="true"] .popover-inner {
  direction: rtl;
}

/* Nav overrides */
.nav-stacked {
  padding: 0 0 12px 0;
}
.nav-stacked > li {
  height: 26px;
}
.nav-stacked > li a {
  padding: 6px 10px;
  border-radius: 3px;
}
.nav-stacked > li a:hover {
  background-color: var(--background-recessed);
}
.nav-stacked > li.active a,
.nav-stacked > li.active a:hover {
  color: var(--foreground-default);
  background-color: rgb(var(--grey-200));
  box-shadow: 0 -1px 1px rgb(var(--grey-300));
  /* Grey-300 */
}

.close {
  opacity: 0.8;
}
.close:hover,
.close:focus {
  opacity: 0.9;
}

/* Modal overrides */
.modal p,
.modal label {
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen-Sans,
    Ubuntu,
    Cantarell,
    "Helvetica Neue",
    Arial,
    sans-serif;
}

.modal p {
  font-size: 14px;
  padding-bottom: 10px;
}
.modal p.secondary {
  color: rgb(var(--grey-700));
}
.modal p.secondary strong {
  color: var(--foreground-default);
  /* Grey-800 */
}

.modal h3 {
  font-size: 17px;
}

.modal.role-modal ul,
.modal.problem-solve-notice-modal ol {
  margin-left: 1.8em;
  list-style-type: decimal;
}

html[data-rtl-language="true"] .modal.role-modal ul,
html[data-rtl-language="true"] .modal.problem-solve-notice-modal ol {
  margin-left: 0;
  margin-right: 1.8em;
}

.modal.role-modal li {
  margin: 1em 0;
}

/* Allows buttons to be styled nicely in dropdowns */
.dropdown-menu {
  padding-top: 10px;
  padding-bottom: 10px;
  border-color: var(--overlay-light);
}
html[data-rtl-language="true"] .dropdown-menu {
  left: auto;
  right: 0;
}
.dropdown-menu li {
  text-align: left;
}
.dropdown-menu li.header {
  text-align: left;
  padding: 3px 15px;
  font-weight: 600;
}
.dropdown-menu li a {
  color: var(--foreground-default);
  padding: 7px 20px;
  font-size: 14px;
}
.dropdown-menu li a:hover {
  color: var(--foreground-default);
  background-color: var(--background-subtle);
}
.dropdown-menu li input[type="file"] {
  cursor: pointer;
}
.dropdown-menu li button,
.dropdown-menu li .button {
  display: block;
  padding: 3px 15px;
  clear: both;
  font-weight: 400;
  line-height: 18px;
  color: rgb(var(--blue-600));
  white-space: nowrap;
  text-align: left;
  background: none;
  cursor: pointer;
}
.dropdown-menu li button:hover,
.dropdown-menu li .button:hover {
  color: var(--foreground-default);
  text-decoration: none;
  background-color: var(--background-subtle);
}
.dropdown-menu li button {
  width: 100%;
}

/* Additional RTL overrides - Ensures proper positioning for right-to-left languages */
html[data-rtl-language="true"] .dropdown {
  direction: rtl;
}
html[data-rtl-language="true"] .dropdown#profile_menu {
  direction: ltr;
}

html[data-rtl-language="true"] .object_options .dropdown-menu.pull-right,
html[data-rtl-language="true"] .btn-group.open .dropdown-menu.pull-right {
  right: auto;
  left: 0;
}

html[data-rtl-language="true"] .modal-header .close {
  float: left;
}

html[data-rtl-language="true"] .bulk-footer .btn-group.ticket_submit_buttons .btn:last-of-type,
html[data-rtl-language="true"] .btn-group.ticket_submit_buttons > .dropdown-toggle {
  border-radius: 4px 0 0 4px;
}

html[data-rtl-language="true"] .btn-group.ticket_submit_buttons > .btn:first-child {
  float: right;
  border-radius: 0 4px 4px 0;
}

html[data-rtl-language="true"] .modal-footer .btn + .btn {
  margin-left: 0;
  margin-right: 5px;
}

.dropup [disabled="disabled"] {
  color: rgb(var(--grey-400));
  cursor: default;
}

.dropup [disabled="disabled"]:hover {
  color: rgb(var(--grey-400));
}

.btn i {
  margin-top: 1px;
}

.btn.active {
  box-shadow:
    inset var(--shadow-medium),
    var(--shadow-small);
}

.btn-group.open .btn.dropdown-toggle:not(.btn-inverse) {
  background-color: var(--background-default);
  border-color: var(--border-default);
}

html[data-rtl-language="true"] .pane.right .pagination {
  direction: ltr;
}

.pagination a {
  color: var(--foreground-default);
}
.pagination a:hover {
  color: rgb(var(--blue-600));
}

.pagination .active a {
  color: var(--foreground-default);
}

.pagination a:hover,
.pagination .active a {
  background-color: var(--background-subtle);
  /* Grey-100 */
}

/* base button */
.btn {
  display: inline-block;
  padding: 5px 10px 5px;
  margin-bottom: 0;
  font-size: 14px;
  line-height: 18px;
  color: var(--foreground-default);
  text-align: center;
  text-shadow: none !important;
  vertical-align: middle;
  cursor: pointer;
  background-color: var(--background-default);
  background-image: none;
  border: 1px solid var(--border-default);
  border-radius: 4px;
  box-shadow: none;
  white-space: nowrap;
  /* primary button */
  /* secondary block solid button */
  /* secondary round solid button */
  /* secondary round solid framed */
}
.btn:hover {
  background-color: var(--background-subtle);
  /* Grey-100 */
  border-color: rgb(var(--grey-400));
  /* Grey-400 */
  color: var(--foreground-default);
  box-shadow: inset 0 1px 0 var(--background-default);
}
.btn:active,
.btn.active {
  background-color: var(--background-subtle);
  /* Grey-100 */
  border-color: var(--border-emphasis);
  /* Grey-400 */
  color: var(--foreground-default);
  box-shadow: inset var(--shadow-medium);
}
.btn.disabled,
.btn[disabled] {
  background-color: var(--background-disabled) !important;
  border-color: var(--border-default) !important;
  color: var(--background-default) !important;
  opacity: 1;
  box-shadow: none;
}
.btn.btn-primary,
.btn.btn-inverse {
  background-color: var(--foreground-default);
  border: none;
  color: rgb(var(--grey-300));
  box-shadow: none;
}
[data-theme="dark"] .btn.btn-primary,
[data-theme="dark"] .btn.btn-inverse {
  color: rgb(var(--grey-900));
}
[data-theme="dark"] .btn.btn-primary:hover,
[data-theme="dark"] .btn.btn-inverse:hover {
  color: rgb(var(--white));
}
[data-theme="dark"] .btn.btn-primary {
  color: rgb(var(--black));
}
.btn.btn-primary:hover,
.btn.btn-inverse:hover {
  background-color: rgb(var(--grey-700));
  color: var(--background-default);
}
.btn.btn-primary:active,
.btn.btn-primary.active,
.btn.btn-inverse:active,
.btn.btn-inverse.active {
  background-color: var(--foreground-default);
  color: rgb(var(--grey-300));
}
.btn.btn-primary + .btn-inverse,
.btn.btn-inverse + .btn-inverse {
  border-left: 1px solid rgb(var(--grey-600));
}
html[data-rtl-language="true"] .btn.btn-primary + .btn-inverse,
html[data-rtl-language="true"] .btn.btn-inverse + .btn-inverse {
  border-left: none;
  border-right: 1px solid rgb(var(--grey-600));
}
.btn.btn-primary .caret,
.btn.btn-inverse .caret {
  background-image: url(/agent/assets/components/chevron-468062c2d29f955592b1b443cb017899.svg);
  border: none;
  height: 14px;
  margin: 0;
  top: auto;
  width: 14px;
}
.btn.btn-primary.green {
  background-color: rgb(var(--blue-600));
  /* Blue-600 */
  border-color: rgb(var(--blue-600));
  color: var(--background-default);
  box-shadow: none;
}
.btn.btn-primary.green:hover {
  background-color: rgb(var(--blue-500));
  /* Blue-500 */
  border-color: rgb(var(--blue-500));
  color: var(--background-default);
}
.btn.btn-primary.green:active,
.btn.btn-primary.green.active {
  background-color: rgb(var(--blue-600));
  border-color: rgb(var(--blue-600));
  color: var(--background-default);
}
.btn.btn-green {
  background-color: rgb(var(--blue-600));
  /* Blue-600 */
  border-color: rgb(var(--blue-600));
  color: var(--background-default);
  box-shadow: none;
}
.btn.btn-green:hover {
  background-color: rgb(var(--blue-500));
  /* Blue-500 */
  border-color: rgb(var(--blue-500));
  color: var(--background-default);
}
.btn.btn-green:active,
.btn.btn-green.active {
  background-color: rgb(var(--blue-600));
  border-color: rgb(var(--blue-600));
  color: var(--background-default);
}
.btn.btn-promo {
  box-shadow: none;
  background-color: rgb(var(--yellow-500));
  border-color: rgb(var(--yellow-500));
  color: var(--foreground-onEmphasis);
  font-size: 14px;
  font-weight: 600;
  padding: 10px 20px 10px 20px;
}
.btn.btn-promo:hover {
  background-color: rgb(var(--yellow-600));
  border-color: rgb(var(--yellow-600));
  color: var(--background-default);
}
.btn.btn-promo:active,
.btn.btn-promo.active {
  background-color: rgb(var(--yellow-700));
  border-color: rgb(var(--yellow-800));
  color: var(--background-default);
}
.btn.btn-warning {
  box-shadow: none;
  background-color: rgb(var(--yellow-500));
  border-color: rgb(var(--yellow-500));
  color: var(--foreground-onEmphasis);
  font-size: 14px;
  font-weight: 600;
  padding: 10px 20px 10px 20px;
}
.btn.btn-warning:hover {
  background-color: rgb(var(--yellow-600));
  border-color: rgb(var(--yellow-600));
  color: var(--background-default);
}
.btn.btn-warning:active,
.btn.btn-warning.active {
  background-color: rgb(var(--yellow-700));
  border-color: rgb(var(--yellow-800));
  color: var(--background-default);
}
.btn.btn-solid {
  background-color: var(--background-default);
  border-color: var(--border-default);
}
.btn.btn-round-solid {
  background-color: var(--background-default);
  border-color: var(--border-default);
  border-radius: 1000px;
}
.btn.btn-round {
  border-radius: 1000px;
}
.btn.medium {
  padding-right: 20px;
  padding-left: 20px;
}
.btn.large {
  font-size: 14px;
  font-weight: 600;
  padding: 10px 20px 10px 20px;
}
.btn.x-large {
  font-size: 15px;
  font-weight: 600;
  padding: 15px 30px 15px 35px;
}
.btn.disabled,
.btn[disabled] {
  background-color: var(--background-disabled) !important;
  border-color: var(--border-default) !important;
  color: var(--background-default) !important;
  opacity: 1;
  box-shadow: none;
}

.btn-group.open .dropdown-toggle:not(.btn-inverse) {
  background-color: var(--background-subtle) !important;
  box-shadow: inset var(--shadow-medium);
}

/* See below for RTL language positioning of these elements - LOCAL-567 */
.btn-group > .dropdown-toggle {
  box-shadow: none;
}

::placeholder {
  font-weight: 400;
}

code {
  color: var(--foreground-default);
}

.ticket_submit_buttons > .dropdown-toggle {
  margin-left: 0;
  /* Stop 1px of overlap from disappearing dividing line on hover */
}

/* END ./app/assets/stylesheets/overrides/bootstrap.scss */
/* END ./app/assets/stylesheets/vendor_overrides.scss */
/* BEGIN ./app/assets/stylesheets/screen.scss */
/* BEGIN ./app/assets/stylesheets/editable.scss */
/*
  Inline editable fields
*/
.editable {
  margin-top: -6px;
  margin-left: -5px;
}
.editable.textarea {
  padding: 5px;
  background: transparent;
  border: 1px solid transparent;
  line-height: 16px;
  white-space: pre-wrap;
  word-wrap: break-word;
  min-height: 16px;
  /* Stupid firefox */
}
.editable.textarea:not(.disabled):hover {
  border: 1px solid var(--border-subtle);
  background: var(--background-default);
  color: var(--foreground-default) !important;
}
.editable.textarea.disabled {
  color: var(--foreground-disabled) !important;
  background-color: var(--border-subtle);
}
.editable input[type="text"] {
  color: var(--foreground-subtle);
  display: block;
  resize: none;
  padding: 2px 5px 5px 5px;
  border: 1px solid transparent;
  background: transparent;
  box-shadow: none;
}
.editable input[type="text"]:hover {
  border: 1px solid var(--border-subtle);
}
.editable input[type="txt"].ui-state-disabled,
.editable input[type="text"].disabled {
  color: var(--foreground-default) !important;
  opacity: 1;
  background: transparent;
}
.editable input[type="text"].ui-state-disabled:hover,
.editable input[type="text"].disabled:hover {
  border: 1px solid transparent;
}

/* END ./app/assets/stylesheets/editable.scss */
/* BEGIN ./app/assets/stylesheets/app_new_install.scss */
.apps_nav_bar {
  position: relative;
  display: block;
}
.apps_nav_bar .tooltip-mask {
  position: fixed;
  opacity: 1;
  z-index: 999;
  cursor: default;
}
.apps_nav_bar #onboarding-tooltip {
  min-height: 20px;
  opacity: 1;
  padding: 15px 20px 18px;
  top: 50%;
  transform: translate(0, -50%);
  left: 100%;
  text-align: left;
  z-index: 1000;
}
.apps_nav_bar #onboarding-tooltip > h4 {
  word-wrap: break-word;
  overflow-wrap: break-word;
  margin: 3px 0;
}
.apps_nav_bar #onboarding-tooltip > p {
  margin: 0 !important;
  line-height: 20px;
}
.apps_nav_bar #onboarding-tooltip > .diamond {
  top: 0;
  bottom: 0;
  left: -6px;
  right: auto;
  margin: auto;
}
.apps_nav_bar #onboarding-tooltip > .close-tooltip {
  top: 15px;
  right: 20px;
}

/* END ./app/assets/stylesheets/app_new_install.scss */
/* BEGIN ./app/assets/stylesheets/layout.scss */
html,
body {
  overflow: hidden; /* Fallback for browsers w/o 'clip' support */
  overflow: clip; /* Chrome 90+, FF 81+  */
  /* https://developer.mozilla.org/en-US/docs/Web/CSS/overflow#browser_compatibility */
  cursor: auto;
}

ul {
  list-style: none;
}

#wrapper {
  background-color: var(--background-default);
  position: absolute;
  width: 100%;
  top: 0;
  bottom: 0;
}

#alert {
  display: none;
  height: 52px;
  line-height: 52px;
  background-color: var(--background-warning);
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
}
html[data-rtl-language="true"] #alert {
  direction: rtl;
}
#alert p {
  display: inline-block;
  vertical-align: middle;
  margin-left: 50px;
  margin-right: 200px;
}
html[data-rtl-language="true"] #alert p {
  margin-left: 200px;
  margin-right: 50px;
}
#alert .pagination {
  position: absolute;
  top: 0;
  right: 72px;
  margin-top: 10px;
}
html[data-rtl-language="true"] #alert .pagination {
  left: 72px;
  right: auto;
}
#alert .pagination a {
  user-select: none;
  cursor: default;
  color: var(--foreground-default);
  font-size: 12px;
  line-height: 32px;
}
#alert .pagination a:hover {
  background-color: inherit;
  cursor: default;
}
#alert .pagination a:focus {
  outline: none;
}
#alert .pagination li.enabled a:hover {
  background-color: var(--foreground-default);
  cursor: pointer;
}
#alert .close {
  position: absolute;
  top: 18px;
  right: 24px;
}
html[data-rtl-language="true"] #alert .close {
  left: 24px;
  right: auto;
}
#alert:before {
  position: absolute;
  top: 17px;
  left: 20px;
  bottom: 0;
  background-image: url(/agent/assets/icons/alerts/alert-2444146d6b59df69d30f8a8951865dab.png);
  background-repeat: no-repeat;
  background-size: 18px;
  padding-right: 36px;
  content: "";
}
html[data-rtl-language="true"] #alert:before {
  left: auto;
  padding-left: 36px;
  padding-right: 0;
}

#alert.visible {
  display: block;
}
/*
    alert component height: 52px
    back-to-onboarding-bar(btob) height: 50px
    sandbox-banner height: 28px
    if both alert and btob is visbile, set #wrapper top to 102px and #btob top to 52px
    if alert, btob and sandbox-banner are visbile, set #wrapper top to 130px and #btob top to 52px
    if only alert is visible, set #wrapper top to 52px and #btob top to 0px
    if only btob is visible, set #wrapper top to 50px
    if only sandbox-banner is not empty, set #wrapper top to 28px
    if none is visible, set #wrapper top to 0

    #sandbox-banner is only rendered in sandbox account, using :empty selector to check content
    The visible class is only added to #back-to-onboarding-bar when there is content in it.
    The visible class will be removed when #back-to-onboarding-bar is empty.
    The file that handle the 'visible' class is:
    lotus_react/src/Onboarding/BackToOnboardingBarContainer
    */
#alert.visible + #back-to-onboarding-bar.visible {
  top: 52px;
}
#alert.visible + #back-to-onboarding-bar + #sandbox-banner:empty + #wrapper {
  top: 52px;
}
#alert.visible + #back-to-onboarding-bar.visible + #sandbox-banner:empty + #wrapper {
  top: 102px;
}

/*
  auto-activation-countdown-banner, ctm-auto-activation-banner, and ctp-notice-banner component height: 52px
*/
#auto-activation-countdown-banner,
#ctm-auto-activation-banner,
#ctp-notice-banner {
  display: none;
  position: absolute;
  top: 0;
  width: 100%;
  height: 52px;
}
#auto-activation-countdown-banner.visible,
#ctm-auto-activation-banner.visible,
#ctp-notice-banner.visible {
  display: block;
}

/* wrapper offsets */
/*
  Current: 63 selectors (not 64 as when no banners are shown wrapper has a default, #wrapper { top: 0px })
  Next additional banner must have 127 (!!!) selectors

  Side note: As banners are getting added/deleted, I suggest we should plan to
  add a banner component manager in the future, otherwise with more banners co-existing
  this section will gain an additional 2^(number banners) + each subsequent banner offsets
  which may be overwhelming to read.
*/

/* various banner heights for maths:
52px:
#alert
#auto-activation-countdown-banner
#ctm-auto-activation-banner
#ctp-notice-banner
#sandbox-banner

50px:
#back-to-onboarding-bar
*/

#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 52px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 50px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 102px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 52px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 104px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 102px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 154px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 52px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 104px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 102px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 154px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 104px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 156px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 154px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 182px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 52px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 104px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 102px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 154px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 104px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 156px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 154px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 206px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 104px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 156px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 154px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 206px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 156px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 208px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 206px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 258px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 52px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 104px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 102px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 154px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 104px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 154px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 206px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 104px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 154px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 206px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 208px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 206px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 258px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 104px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 154px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 206px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 208px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 206px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 258px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 208px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 206px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 258px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:empty
  + #wrapper {
  top: 208px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 260px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:empty
  + #wrapper {
  top: 258px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty)
  + #wrapper {
  top: 310px;
}

/* NOTE: we don't handle other banners here because we will overlay preview banner
on top of all the other banners */
#wrapper.ticket-layout-preview,
#wrapper.ticket-test-app {
  top: 52px !important;
}

/* ctp-notice-banner offsets */
#alert.visible + #ctp-notice-banner.visible {
  top: 52px;
}

/* ctm-auto-activation-banner offsets */
#alert + #ctp-notice-banner.visible + #ctm-auto-activation-banner.visible {
  top: 52px;
}
#alert.visible + #ctp-notice-banner + #ctm-auto-activation-banner.visible {
  top: 52px;
}
#alert.visible + #ctp-notice-banner.visible + #ctm-auto-activation-banner.visible {
  top: 104px;
}

/* auto-activation-countdown-banner offsets */
#alert + #ctp-notice-banner + #ctm-auto-activation-banner.visible + #auto-activation-countdown-banner.visible {
  top: 52px;
}
#alert + #ctp-notice-banner.visible + #ctm-auto-activation-banner + #auto-activation-countdown-banner.visible {
  top: 52px;
}
#alert + #ctp-notice-banner.visible + #ctm-auto-activation-banner.visible + #auto-activation-countdown-banner.visible {
  top: 104px;
}
#alert.visible + #ctp-notice-banner + #ctm-auto-activation-banner + #auto-activation-countdown-banner.visible {
  top: 52px;
}
#alert.visible + #ctp-notice-banner + #ctm-auto-activation-banner.visible + #auto-activation-countdown-banner.visible {
  top: 104px;
}
#alert.visible + #ctp-notice-banner.visible + #ctm-auto-activation-banner + #auto-activation-countdown-banner.visible {
  top: 104px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible {
  top: 156px;
}

/* back-to-onboarding-bar offsets */
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible {
  top: 52px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible {
  top: 52px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible {
  top: 104px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible {
  top: 52px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible {
  top: 104px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible {
  top: 104px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible {
  top: 52px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible {
  top: 104px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible {
  top: 104px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible {
  top: 104px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible {
  top: 208px;
}

#back-to-onboarding-bar {
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 300;
}

#back-to-onboarding-bar.visible + #sandbox-banner:empty + #wrapper {
  top: 50px;
}

/* sandbox-banner offsets */
#sandbox-banner {
  position: absolute;
  width: 100%;
}

#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 50px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 52px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 102px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 52px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 102px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 104px;
}
#alert
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 154px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 52px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 102px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 104px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 154px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 104px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 154px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 156px;
}
#alert
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 206px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 52px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 102px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 104px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 154px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 104px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 154px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 206px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 104px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 154px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 206px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 156px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 206px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar
  + #sandbox-banner:not(:empty) {
  top: 208px;
}
#alert.visible
  + #ctp-notice-banner.visible
  + #ctm-auto-activation-banner.visible
  + #auto-activation-countdown-banner.visible
  + #back-to-onboarding-bar.visible
  + #sandbox-banner:not(:empty) {
  top: 258px;
}

.pane {
  display: block;
  position: absolute;
  overflow: auto;
  top: 0;
  bottom: 0;
}
.pane.left {
  left: 0;
  position: static;
  z-index: 3;
}
.pane.left footer {
  position: fixed;
  bottom: 0;
  left: 60px;
  right: 0;
  height: 49px;
  padding: 0;
}
.pane.left.allow-overflow {
  overflow: visible;
}
.pane.right {
  right: 0;
  overflow: hidden;
}
html[data-rtl-language="true"] .pane.right {
  left: 0;
  right: auto;
}
.pane.right .reset_order {
  margin-left: 20px;
  font-size: 14px;
  font-weight: 400;
}
html[data-rtl-language="true"] .pane.right .reset_order {
  margin-left: 0;
  margin-right: 20px;
}
.pane.right .learn_more {
  line-height: 28px;
  padding: 5px 15px;
}
.pane.right .learn_more:hover {
  text-decoration: underline;
}
.pane.right .customer_context_nav_tab {
  padding: 4px 10px 4px 0;
}

.pane.right.views {
  background: var(--main-theme-color);
}

#views_views-ticket-table:focus {
  outline: none;
}

[id="views_views-ticket-table"][tabindex="0"]:focus > [id^="views-ticket-table"][tabindex="-1"] {
  outline: 3px solid var(--border-primaryEmphasis);
  border-radius: 4px 4px 0px 0px;
}

.element-timing-sentinel {
  height: 0;
}

.bulk-footer {
  z-index: 1;
}

.modal-footer,
.bulk-footer {
  border-left: 1px solid var(--border-default);
  left: 390px !important;
  text-align: right;
}
html[data-rtl-language="true"] .modal-footer,
html[data-rtl-language="true"] .bulk-footer {
  text-align: left;
}
.modal-footer .controls-group,
.bulk-footer .controls-group {
  margin: 10px 8px 0 0;
}
.modal-footer .btn-inner-left,
.modal-footer .dropdown-toggle,
.bulk-footer .btn-inner-left,
.bulk-footer .dropdown-toggle {
  margin-right: 0;
}
.modal-footer .btn-group,
.bulk-footer .btn-group {
  display: inline-block;
}
html[data-rtl-language="true"] .modal-footer .btn-group,
html[data-rtl-language="true"] .bulk-footer .btn-group {
  float: left;
}
.modal-footer .btn-group .btn,
.bulk-footer .btn-group .btn {
  float: left;
}
.modal-footer .btn-group .btn:first-of-type,
.bulk-footer .btn-group .btn:first-of-type {
  border-radius: 4px 0px 0px 4px;
}
html[data-rtl-language="true"] .modal-footer .btn-group .btn:first-of-type,
html[data-rtl-language="true"] .bulk-footer .btn-group .btn:first-of-type {
  float: right;
  border-radius: 0px 4px 4px 0px;
}
.modal-footer .btn-group .btn:last-of-type,
.bulk-footer .btn-group .btn:last-of-type {
  border-radius: 0px 4px 4px 0px;
}
html[data-rtl-language="true"] .modal-footer .btn-group .btn:last-of-type,
html[data-rtl-language="true"] .bulk-footer .btn-group .btn:last-of-type {
  border-radius: 4px 0px 0px 4px;
}
.modal-footer .left,
.bulk-footer .left {
  float: left;
  text-align: left;
  width: 49%;
}
html[data-rtl-language="true"] .modal-footer .left,
html[data-rtl-language="true"] .bulk-footer .left {
  float: right;
  text-align: right;
}

.bulk-mode .pane.right.section {
  bottom: 50px;
}

.split_pane {
  z-index: 9;
  /* proper rendering of iframes for FF & IE */
}
html[data-rtl-language="true"] .split_pane.user_filters {
  direction: rtl;
}
.split_pane .split_pane > header .right {
  border-left: 1px solid var(--border-default);
}
.split_pane.user .pane.left,
.split_pane.organization .pane.left {
  z-index: inherit;
}
.split_pane.user .pane.left footer,
.split_pane.user .pane.left .footer,
.split_pane.organization .pane.left footer,
.split_pane.organization .pane.left .footer {
  z-index: 0;
}
.split_pane.filters .pane.left,
.split_pane.dashboard .pane.left,
.split_pane.search .pane.left,
.split_pane.ticket .pane.left,
.split_pane.user .pane.left,
.split_pane.organization .pane.left,
.split_pane.user_filters .pane.left,
.split_pane.incidents .pane.left,
.split_pane.admin .pane.left,
.split_pane.reporting .pane.left {
  overflow-x: hidden;
  width: 330px;
  color-scheme: var(--color-scheme);
}
.split_pane.filters .pane.right,
.split_pane.dashboard .pane.right,
.split_pane.search .pane.right,
.split_pane.ticket .pane.right,
.split_pane.user .pane.right,
.split_pane.organization .pane.right,
.split_pane.user_filters .pane.right,
.split_pane.incidents .pane.right,
.split_pane.admin .pane.right,
.split_pane.reporting .pane.right {
  left: 390px;
}
html:not([data-rtl-language="true"]) .split_pane.filters .pane.right.with_omnipanel_pane.is_viewing_ticket,
html:not([data-rtl-language="true"]) .split_pane.dashboard .pane.right.with_omnipanel_pane.is_viewing_ticket,
html:not([data-rtl-language="true"]) .split_pane.search .pane.right.with_omnipanel_pane.is_viewing_ticket,
html:not([data-rtl-language="true"]) .split_pane.ticket .pane.right.with_omnipanel_pane.is_viewing_ticket,
html:not([data-rtl-language="true"]) .split_pane.user .pane.right.with_omnipanel_pane.is_viewing_ticket,
html:not([data-rtl-language="true"]) .split_pane.organization .pane.right.with_omnipanel_pane.is_viewing_ticket,
html:not([data-rtl-language="true"]) .split_pane.user_filters .pane.right.with_omnipanel_pane.is_viewing_ticket,
html:not([data-rtl-language="true"]) .split_pane.incidents .pane.right.with_omnipanel_pane.is_viewing_ticket,
html:not([data-rtl-language="true"]) .split_pane.admin .pane.right.with_omnipanel_pane.is_viewing_ticket,
html:not([data-rtl-language="true"]) .split_pane.reporting .pane.right.with_omnipanel_pane.is_viewing_ticket {
  left: 368px;
}
html[data-rtl-language="true"] .split_pane.filters .pane.right.with_omnipanel_pane.is_viewing_ticket,
html[data-rtl-language="true"] .split_pane.dashboard .pane.right.with_omnipanel_pane.is_viewing_ticket,
html[data-rtl-language="true"] .split_pane.search .pane.right.with_omnipanel_pane.is_viewing_ticket,
html[data-rtl-language="true"] .split_pane.ticket .pane.right.with_omnipanel_pane.is_viewing_ticket,
html[data-rtl-language="true"] .split_pane.user .pane.right.with_omnipanel_pane.is_viewing_ticket,
html[data-rtl-language="true"] .split_pane.organization .pane.right.with_omnipanel_pane.is_viewing_ticket,
html[data-rtl-language="true"] .split_pane.user_filters .pane.right.with_omnipanel_pane.is_viewing_ticket,
html[data-rtl-language="true"] .split_pane.incidents .pane.right.with_omnipanel_pane.is_viewing_ticket,
html[data-rtl-language="true"] .split_pane.admin .pane.right.with_omnipanel_pane.is_viewing_ticket,
html[data-rtl-language="true"] .split_pane.reporting .pane.right.with_omnipanel_pane.is_viewing_ticket {
  right: 368px;
}
html[data-rtl-language="true"] .split_pane.filters .pane.right,
html[data-rtl-language="true"] .split_pane.dashboard .pane.right,
html[data-rtl-language="true"] .split_pane.search .pane.right,
html[data-rtl-language="true"] .split_pane.ticket .pane.right,
html[data-rtl-language="true"] .split_pane.user .pane.right,
html[data-rtl-language="true"] .split_pane.organization .pane.right,
html[data-rtl-language="true"] .split_pane.user_filters .pane.right,
html[data-rtl-language="true"] .split_pane.incidents .pane.right,
html[data-rtl-language="true"] .split_pane.admin .pane.right,
html[data-rtl-language="true"] .split_pane.reporting .pane.right {
  direction: rtl;
  left: 0;
  right: 390px;
}
.split_pane.filters header .pane.left,
.split_pane.dashboard header .pane.left,
.split_pane.search header .pane.left,
.split_pane.ticket header .pane.left,
.split_pane.user header .pane.left,
.split_pane.organization header .pane.left,
.split_pane.user_filters header .pane.left,
.split_pane.incidents header .pane.left,
.split_pane.admin header .pane.left,
.split_pane.reporting header .pane.left {
  height: 100%;
}
.split_pane.filters > header .pane.right,
.split_pane.filters > footer .pane.right,
.split_pane.dashboard > header .pane.right,
.split_pane.dashboard > footer .pane.right,
.split_pane.search > header .pane.right,
.split_pane.search > footer .pane.right,
.split_pane.ticket > header .pane.right,
.split_pane.ticket > footer .pane.right,
.split_pane.user > header .pane.right,
.split_pane.user > footer .pane.right,
.split_pane.organization > header .pane.right,
.split_pane.organization > footer .pane.right,
.split_pane.user_filters > header .pane.right,
.split_pane.user_filters > footer .pane.right,
.split_pane.incidents > header .pane.right,
.split_pane.incidents > footer .pane.right,
.split_pane.admin > header .pane.right,
.split_pane.admin > footer .pane.right,
.split_pane.reporting > header .pane.right,
.split_pane.reporting > footer .pane.right {
  left: 330px;
}
.split_pane.ticket .pane.left.with-omnipanel {
  width: 308px;
}
.split_pane.ticket .pane.left.with-omnipanel.with-full-width-footer {
  bottom: 50px;
}
.split_pane.user .pane.left,
.split_pane.organization .pane.left {
  bottom: 0;
}
.split_pane.user .pane.left footer,
.split_pane.organization .pane.left footer {
  right: auto;
}
.split_pane.ticket > header .pane.left,
.split_pane.user > header .pane.left,
.split_pane.incidents > header .pane.left,
.split_pane.organization > header .pane.left {
  overflow-y: hidden;
  width: auto;
}
.split_pane.ticket > header .pane.right,
.split_pane.user > header .pane.right,
.split_pane.incidents > header .pane.right,
.split_pane.organization > header .pane.right {
  left: auto;
}
.split_pane.filters > header .pane.right,
.split_pane.dashboard > header .pane.right,
.split_pane.user_filters > header .pane.right {
  left: 331px;
  overflow: visible;
}
html[data-rtl-language="true"] .split_pane.filters > header .pane.right,
html[data-rtl-language="true"] .split_pane.dashboard > header .pane.right,
html[data-rtl-language="true"] .split_pane.user_filters > header .pane.right {
  left: auto;
  right: 331px;
}
.split_pane.filters > header .pane.right.single,
.split_pane.dashboard > header .pane.right.single,
.split_pane.user_filters > header .pane.right.single {
  left: 0px;
}
html[data-rtl-language="true"] .split_pane.filters > header .pane.right.single,
html[data-rtl-language="true"] .split_pane.dashboard > header .pane.right.single,
html[data-rtl-language="true"] .split_pane.user_filters > header .pane.right.single {
  right: 0px;
}
.split_pane.filters > header .pane.left,
.split_pane.dashboard > header .pane.left,
.split_pane.user_filters > header .pane.left {
  border-right: 1px solid var(--border-default);
  overflow: visible;
}
html[data-rtl-language="true"] .split_pane.filters > header .pane.left,
html[data-rtl-language="true"] .split_pane.dashboard > header .pane.left,
html[data-rtl-language="true"] .split_pane.user_filters > header .pane.left {
  float: right;
  border-left: 1px solid var(--border-default);
  border-right: none;
}
.split_pane.dashboard .pane.right > div {
  height: 100%;
}
.split_pane.dashboard > header .pane.right {
  padding-left: 15px;
  padding-right: 10px;
}
html[data-rtl-language="true"] .split_pane.dashboard > header .pane.right {
  padding-left: 10px;
  padding-right: 15px;
}
.split_pane.dashboard > header .pane.right .left {
  float: left;
}
.split_pane.dashboard > header .pane.right .right {
  float: right;
}
.split_pane .ticket-resolution-footer {
  position: fixed;
  left: 390px;
  bottom: 0;
  right: 0;
  height: 49px;
  padding: 0;
  border-left: 1px solid var(--border-default);
}
html[data-rtl-language="true"] .split_pane .ticket-resolution-footer {
  direction: rtl;
  left: 0;
  right: 390px;
  right: 391px;
}
.split_pane .ticket-resolution-footer .ticket-resolution-footer-pane {
  min-width: 570px;
  width: 100%;
}
.split_pane.ticket > .pane.right {
  z-index: 6;
  bottom: 50px;
}
.split_pane.ticket > .pane.right .section .mast {
  position: relative;
  z-index: 2;
}
.split_pane.ticket .chat.chat-section {
  margin-top: 0;
  background-image: url(/agent/assets/bg_chrome_light-8ad87ce4d7d1b35a7ac300215194ecae.png);
  background-position: 0 0;
}
.split_pane.collapsible .scroll_content {
  overflow: auto;
  position: absolute;
  top: 41px;
  bottom: 0;
}
.split_pane.collapsible .pane.left {
  transition: width 0.3s ease 0.4s;
  border-right: 1px solid var(--border-default);
}
.split_pane.collapsible .pane.left .hide_when_collapsed {
  height: auto;
  transition:
    visibility 0s ease 0.4s,
    opacity 0.3s ease 0.4s;
  visibility: visible;
}
.split_pane.collapsible .pane.left .pin_control {
  margin: 9px;
  position: absolute;
  right: -4px;
  z-index: 3;
}
html[data-rtl-language="true"] .split_pane.collapsible .pane.left .pin_control {
  left: -4px;
  right: auto;
}
.split_pane.collapsible .pane.left .pin {
  display: none;
}
html[data-rtl-language="true"] .split_pane.collapsible .pane.left .pin {
  display: block;
}
html[data-rtl-language="true"] .split_pane.collapsible .pane.left .unpin {
  display: none;
}
html[data-rtl-language="true"] .split_pane.collapsible .pane.left {
  border-left: 1px solid var(--border-default);
  border-right: 0;
}
.split_pane.collapsible .pane.left .scroll_content {
  top: 50px;
  bottom: 0;
  left: 0;
  right: 0;
}
.split_pane.collapsible .pane.right {
  transition: all 0.3s ease 0.4s;
}
.split_pane.collapsible.collapsed .pane.left {
  width: 35px;
  overflow-y: hidden;
}
.split_pane.collapsible.collapsed .pane.left .hide_when_collapsed {
  opacity: 0;
}
.split_pane.collapsible.collapsed .pane.left .pin {
  display: block;
}
.split_pane.collapsible.collapsed .pane.left .unpin {
  display: none;
}
html[data-rtl-language="true"] .split_pane.collapsible.collapsed .pane.left .pin {
  display: none;
}
html[data-rtl-language="true"] .split_pane.collapsible.collapsed .pane.left .unpin {
  display: block;
}
.split_pane.collapsible.collapsed .pane.right {
  left: 95px !important;
}
html[data-rtl-language="true"] .split_pane.collapsible.collapsed .pane.right {
  left: 0 !important;
  right: 95px !important;
}
.split_pane.collapsible.collapsed.peeking .pane.left {
  overflow-y: auto;
  width: 330px;
  box-shadow: 1px 5px 3px 1px var(--border-default);
}
.split_pane.collapsible.collapsed.peeking .pane.left .hide_when_collapsed {
  opacity: 1;
}
.split_pane.collapsible.collapsed:not(.peeking) .pane.left .scroll_content {
  opacity: 0;
}
.split_pane.collapsible.collapsed:not(.peeking) .pane.left .hide_when_collapsed:not(.scroll_content) {
  visibility: hidden;
}
.split_pane.not_found .container {
  padding: 20px;
  max-width: 40em;
}
html[data-rtl-language="true"] .split_pane.not_found .container {
  direction: rtl;
}
.split_pane.not_found .header {
  display: inline-flex;
}
.split_pane.not_found .header .icon {
  width: 108px;
  min-width: 108px;
  height: 82px;
  margin-right: 2em;
}
html[data-rtl-language="true"] .split_pane.not_found .header .icon {
  margin-left: 2em;
  margin-right: 0;
}
.split_pane.not_found .header h1 {
  font-weight: 400;
  font-size: 28px;
  line-height: 1.2em;
  padding-top: 0;
  margin-top: 0;
  margin-bottom: 0.1em;
}
.split_pane.not_found .header h2 {
  font-weight: 400;
  font-size: 18px;
  line-height: 1.2em;
  margin-top: 0.1em;
  margin-bottom: 0;
}
.split_pane.not_found .footer {
  margin-top: 1em;
}
.split_pane.not_found .footer p {
  line-height: 1.2em;
  font-size: 14px;
  margin-bottom: 0.4em;
}

.main_panes > header,
.main_panes > footer,
.main_panes > .pane,
.workspace > header,
.workspace > footer,
.workspace > .pane {
  left: 60px;
  position: absolute;
  right: 0;
}
.main_panes > header .apps-button,
.main_panes > footer .apps-button,
.main_panes > .pane .apps-button,
.workspace > header .apps-button,
.workspace > footer .apps-button,
.workspace > .pane .apps-button {
  display: none;
}
.main_panes > header .apps-button.available,
.main_panes > footer .apps-button.available,
.main_panes > .pane .apps-button.available,
.workspace > header .apps-button.available,
.workspace > footer .apps-button.available,
.workspace > .pane .apps-button.available {
  display: block;
}
.main_panes > header.section.aux-content,
.main_panes > footer.section.aux-content,
.main_panes > .pane.section.aux-content,
.workspace > header.section.aux-content,
.workspace > footer.section.aux-content,
.workspace > .pane.section.aux-content {
  width: 330px;
}
.main_panes > header.section.text,
.main_panes > footer.section.text,
.main_panes > .pane.section.text,
.workspace > header.section.text,
.workspace > footer.section.text,
.workspace > .pane.section.text {
  width: 290px;
  padding: 10px 20px;
  text-shadow: 0px 1px 2px var(--background-default);
}
.main_panes > header.section.text h1,
.main_panes > footer.section.text h1,
.main_panes > .pane.section.text h1,
.workspace > header.section.text h1,
.workspace > footer.section.text h1,
.workspace > .pane.section.text h1 {
  font-size: 15px;
  margin-bottom: 10px;
  font-weight: 400;
}
.main_panes > header.section.text p,
.main_panes > footer.section.text p,
.main_panes > .pane.section.text p,
.workspace > header.section.text p,
.workspace > footer.section.text p,
.workspace > .pane.section.text p {
  margin-bottom: 10px;
}

html[data-rtl-language="true"] .main_panes > header,
html[data-rtl-language="true"] .main_panes > .pane,
html[data-rtl-language="true"] .workspace > header,
html[data-rtl-language="true"] .workspace > .pane {
  left: 0;
  right: 60px;
}

html[data-rtl-language="true"] .main_panes > .pane.left,
html[data-rtl-language="true"] .workspace > .pane.left {
  left: auto;
}

.main_panes > header,
.main_panes > footer,
.workspace > header,
.workspace > footer {
  z-index: 10;
}

.main_panes > header,
.workspace > header {
  background-color: var(--background-subtle);
  min-height: 49px;
  top: 50px;
  border-top: 1px transparent solid;
  border-bottom: 1px var(--border-default) solid;
  margin-bottom: 2px;
}
.main_panes > header h1,
.workspace > header h1 {
  font-size: 15px;
  color: var(--foreground-default);
  /* Grey-800 */
  margin: 0;
}
.main_panes > header h1 button,
.workspace > header h1 button {
  line-height: 20px;
  padding: 0;
  margin: -3px 30px 0 0;
}
.main_panes > header h1.left,
.workspace > header h1.left {
  float: left;
}
.main_panes > header a.right,
.workspace > header a.right {
  float: right;
  margin: 10px;
}
.main_panes > header .pane,
.workspace > header .pane {
  padding: 4px 0;
  overflow: hidden;
}
.main_panes > header .pane .btn,
.workspace > header .pane .btn {
  height: 28px;
  background-color: var(--background-subtle);
  /* Grey-100; */
  border: 1px solid var(--border-default);
  box-shadow: none;
  box-sizing: border-box;
  padding: 4px 12px;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Overwrite the outline:0 rule in vendor.css for .btn.active */
.main_panes > header .pane .btn,
.workspace > header .pane .btn.active:focus-visible {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.main_panes > header .pane .btn,
.workspace > header .pane :focus:not(:focus-visible) {
  outline: none;
}
.main_panes > header .pane .btn:active,
.main_panes > header .pane .btn.active,
.main_panes > header .pane .btn:hover,
.workspace > header .pane .btn:active,
.workspace > header .pane .btn.active,
.workspace > header .pane .btn:hover {
  background-color: var(--button-groupActive);
  /* Grey-200; */
}
.main_panes > header .pane .btn-group,
.workspace > header .pane .btn-group {
  padding: 6px 0 6px 10px;
}
html[data-rtl-language="true"] .main_panes > header .pane .btn-group,
html[data-rtl-language="true"] .workspace > header .pane .btn-group {
  padding: 6px 10px 6px 0;
}
.main_panes > header .pane .btn-group span:first-of-type,
.workspace > header .pane .btn-group span:first-of-type {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
html[data-rtl-language="true"] .main_panes > header .pane .btn-group span:first-of-type.btn,
html[data-rtl-language="true"] .workspace > header .pane .btn-group span:first-of-type.btn {
  float: right;
  border-radius: 0 4px 4px 0;
}
.main_panes > header .pane .btn-group span:last-of-type,
.workspace > header .pane .btn-group span:last-of-type {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
html[data-rtl-language="true"] .main_panes > header .pane .btn-group span:last-of-type.btn,
html[data-rtl-language="true"] .workspace > header .pane .btn-group span:last-of-type.btn {
  float: right;
  border-radius: 4px 0 0 4px;
}
html[data-rtl-language="true"] .main_panes > header .pane .btn-group span:last-of-type.btn.ticket_status_label,
html[data-rtl-language="true"] .workspace > header .pane .btn-group span:last-of-type.btn.ticket_status_label {
  border-radius: 4px;
}
.main_panes > header .pane .btn-group .btn:nth-child(-n + 2),
.workspace > header .pane .btn-group .btn:nth-child(-n + 2) {
  max-width: 30%;
}
html[data-rtl-language="true"] .main_panes > header .pane .btn-group .btn:nth-child(-n + 2),
html[data-rtl-language="true"] .workspace > header .pane .btn-group .btn:nth-child(-n + 2) {
  float: right;
  margin-left: 0;
  margin-right: -1px;
}
html[data-rtl-language="true"] .main_panes > header .pane .btn-group .btn:first-of-type,
html[data-rtl-language="true"] .workspace > header .pane .btn-group .btn:first-of-type {
  border-radius: 0 4px 4px 0;
}
html[data-rtl-language="true"] .main_panes > header .pane .btn-group .btn:last-of-type,
html[data-rtl-language="true"] .workspace > header .pane .btn-group .btn:last-of-type {
  border-radius: 4px 0 0 4px;
  margin-left: 0;
  margin-right: -1px;
}
.main_panes > header .pane .btn-group .btn.incidents,
.workspace > header .pane .btn-group .btn.incidents {
  color: var(--foreground-danger);
  font-weight: 600;
}
.main_panes > header .pane .btn-group .msg,
.workspace > header .pane .btn-group .msg {
  float: left;
  margin: 7px 0 0 12px;
  font-size: 12px;
  color: var(--foreground-subtle);
}
html[data-rtl-language="true"] .main_panes > header .pane .btn-group .msg,
html[data-rtl-language="true"] .workspace > header .pane .btn-group .msg {
  float: right;
  margin: 7px 12px 0 0;
}
.main_panes > header .pane .btn-group .msg a,
.workspace > header .pane .btn-group .msg a {
  border-bottom: 1px dotted var(--border-primaryEmphasis);
  border-radius: 0;
}

.main_panes > footer,
.workspace > footer {
  bottom: 0;
  height: 49px;
  padding: 0;
  z-index: 6;
}
.main_panes > footer button + button,
.workspace > footer button + button {
  margin-left: 0;
}

.main_panes footer .pane,
.workspace footer .pane {
  overflow: visible !important;
}

.main_panes > .ah-rollout-banner-visible ~ .pane,
.workspace > .ah-rollout-banner-visible ~ .pane {
  top: 148px;
}

.main_panes > .pane,
.workspace > .pane {
  top: 101px;
}
.workspace > .pane.custom-object-record {
  top: 50px;
  overflow: hidden;
}
.main_panes > .pane.left,
.workspace > .pane.left {
  background-color: var(--background-sidepanel);
}
.main_panes > .pane.left .action_button,
.workspace > .pane.left .action_button {
  padding: 5px;
}
.main_panes > .pane.right,
.workspace > .pane.right {
  border-left: 1px solid var(--border-default);
}
.main_panes > .pane.right.views {
  border-left: 0;
}
html[data-rtl-language="true"] .main_panes > .pane.right,
html[data-rtl-language="true"] .workspace > .pane.right {
  border-left: 0;
  border-right: 1px solid var(--border-default);
}
.main_panes > .pane.right.admin #admin_content,
.workspace > .pane.right.admin #admin_content {
  height: 100%;
  width: 100%;
}
.main_panes > .pane.right.admin .switch-to-classic,
.workspace > .pane.right.admin .switch-to-classic {
  padding: 40px;
}
.main_panes > .pane.right.admin .switch-to-classic h2,
.workspace > .pane.right.admin .switch-to-classic h2 {
  margin-bottom: 20px;
}
.main_panes > .pane.right.admin .switch-to-classic .columnbox,
.workspace > .pane.right.admin .switch-to-classic .columnbox {
  border-top: dotted 1px var(--border-default);
  /* Grey-400 */
  border-bottom: dotted 1px var(--border-default);
  /* Grey-400 */
  padding: 30px 100px 30px 2px;
  position: relative;
}
.main_panes > .pane.right.admin .switch-to-classic .columnbox h4,
.workspace > .pane.right.admin .switch-to-classic .columnbox h4 {
  margin-right: 10%;
}
.main_panes > .pane.right.admin .switch-to-classic .columnbox button,
.workspace > .pane.right.admin .switch-to-classic .columnbox button {
  position: absolute;
  right: 0px;
  top: 30px;
  padding: 10px;
  margin-right: 20px;
}
.main_panes > .pane.right.admin .switch-to-classic .column,
.workspace > .pane.right.admin .switch-to-classic .column {
  display: inline-block;
  vertical-align: top;
}
.main_panes > .pane.right.admin .switch-to-classic .link,
.workspace > .pane.right.admin .switch-to-classic .link {
  cursor: default;
  margin: 25px 0px 30px;
}

.main_panes.dashboard > .pane.right,
.workspace.dashboard > .pane.right {
  border-left: 1px var(--border-default) solid;
}
html[data-rtl-language="true"] .main_panes.dashboard > .pane.right,
html[data-rtl-language="true"] .workspace.dashboard > .pane.right {
  border-left: 0;
  border-right: 1px var(--border-default) solid;
}

.main_panes > header h1,
.workspace > header h1,
.pane > header h1 {
  height: 20px;
  padding: 12px 15px 10px 15px;
  line-height: 22px;
}
html[data-rtl-language="true"] .main_panes > header h1,
html[data-rtl-language="true"] .workspace > header h1,
html[data-rtl-language="true"] .pane > header h1 {
  direction: rtl;
}
.main_panes > header h1 > button,
.workspace > header h1 > button,
.pane > header h1 > button {
  float: right;
}
html[data-rtl-language="true"] .main_panes > header h1 > button,
html[data-rtl-language="true"] .workspace > header h1 > button,
html[data-rtl-language="true"] .pane > header h1 > button {
  float: left;
}

.pane.right > header h1 {
  padding-left: 30px;
}
html[data-rtl-language="true"] .pane.right > header h1 {
  padding-right: 30px;
}

.workspace .chat-section {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  background-color: var(--background-default);
}

.main_panes.flush_top > .pane {
  top: 50px;
}

.filter-grid-list div.scroll_content {
  top: 41px;
}

.filter-grid-list.mode-notice div.scroll_content {
  top: 104px;
}

.user .scroll_content,
.organization .scroll_content {
  position: absolute;
  top: 148px;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: auto;
}

html[data-rtl-language="true"] .organization .scroll_content {
  direction: rtl;
  right: 10px;
}

.user .devices.scroll_content {
  top: 117px;
}

.collapsible.filters .pane.left .pin_control,
.collapsible.user_filters .pane.left .pin_control {
  margin-top: 23px;
  margin-right: 25px;
  transition: right 0.2s ease 0.4s;
}
html[data-rtl-language="true"] .collapsible.filters .pane.left .pin_control,
html[data-rtl-language="true"] .collapsible.user_filters .pane.left .pin_control {
  margin-left: 25px;
  margin-right: 9px;
  transition: left 0.2s ease 0.4s;
}

.collapsible.filters.collapsed .pane.left .pin_control,
.collapsible.user_filters.collapsed .pane.left .pin_control {
  right: -19px;
}
html[data-rtl-language="true"] .collapsible.filters.collapsed .pane.left .pin_control,
html[data-rtl-language="true"] .collapsible.user_filters.collapsed .pane.left .pin_control {
  left: -19px;
  right: auto;
}

.collapsible.filters.collapsed.peeking .pane.left .pin_control,
.collapsible.user_filters.collapsed.peeking .pane.left .pin_control {
  right: -4px;
}
html[data-rtl-language="true"] .collapsible.filters.collapsed.peeking .pane.left .pin_control,
html[data-rtl-language="true"] .collapsible.user_filters.collapsed.peeking .pane.left .pin_control {
  left: -4px;
  right: auto;
}

section.user_filters .user-filter-title {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
}

section.user_filters.previewing .right header h1 {
  margin-right: 415px;
}

section.filters header,
section.user_filters header,
section.incidents header {
  background-color: transparent;
  border-width: 0;
}

section.filters .editor-toggle,
section.user_filters .editor-toggle,
section.incidents .editor-toggle {
  width: 100%;
}

section.filters .left header h1,
section.user_filters .left header h1,
section.incidents .left header h1 {
  font-size: 14px;
  color: var(--foreground-default);
  font-weight: 600;
  border-bottom: 1px solid var(--border-default);
  padding: 24px 0 5px 0;
  margin: 0 30px;
}
html[data-rtl-language="true"] section.filters .left header h1,
html[data-rtl-language="true"] section.user_filters .left header h1,
html[data-rtl-language="true"] section.incidents .left header h1 {
  direction: rtl;
}

section.filters .left header .action_button,
section.user_filters .left header .action_button,
section.incidents .left header .action_button {
  margin-top: -4px;
  margin-right: 15px;
}
html[data-rtl-language="true"] section.filters .left header .action_button,
html[data-rtl-language="true"] section.user_filters .left header .action_button,
html[data-rtl-language="true"] section.incidents .left header .action_button {
  margin-left: 15px;
  margin-right: 0;
}

section.user_filters .user_filter_footer {
  bottom: 0;
  position: fixed;
  background-color: var(--background-sidepanel);
  width: 320px;
}

section.user_filters .user_filter_list {
  margin-bottom: 65px;
}

section.filters .right header,
section.user_filters .right header,
section.incidents .right header {
  padding-right: 30px;
}
html[data-rtl-language="true"] section.filters .right header,
html[data-rtl-language="true"] section.user_filters .right header,
html[data-rtl-language="true"] section.incidents .right header {
  padding-left: 30px;
  padding-right: 0;
}
section.filters .right header .origin,
section.user_filters .right header .origin,
section.incidents .right header .origin {
  margin: 30px 0px 5px 0;
}
html[data-rtl-language="true"] section.filters .right header .origin,
html[data-rtl-language="true"] section.user_filters .right header .origin,
html[data-rtl-language="true"] section.incidents .right header .origin {
  float: left;
}
section.filters .right header h1,
section.user_filters .right header h1,
section.incidents .right header h1 {
  font-size: 20px;
  color: var(--foreground-default);
  font-weight: 600;
  padding-top: 27px;
  padding-bottom: 5px;
  margin-right: 160px;
  white-space: nowrap;
}
html[data-rtl-language="true"] section.filters .right header h1,
html[data-rtl-language="true"] section.user_filters .right header h1,
html[data-rtl-language="true"] section.incidents .right header h1 {
  direction: rtl;
  margin-left: 160px;
  margin-right: 0;
}
section.filters .right header .skill-view-description,
section.filters .right header .header-count,
section.user_filters .right header .skill-view-description,
section.user_filters .right header .header-count,
section.incidents .right header .skill-view-description,
section.incidents .right header .header-count {
  margin-left: 30px;
  font-size: 14px;
  line-height: 18px;
  font-weight: 400;
  color: rgb(var(--grey-600));
}
html[data-rtl-language="true"] section.filters .right header .skill-view-description,
html[data-rtl-language="true"] section.filters .right header .header-count,
html[data-rtl-language="true"] section.user_filters .right header .skill-view-description,
html[data-rtl-language="true"] section.user_filters .right header .header-count,
html[data-rtl-language="true"] section.incidents .right header .skill-view-description,
html[data-rtl-language="true"] section.incidents .right header .header-count {
  margin-left: 0;
  margin-right: 30px;
}
section.filters .right header .skill-view-description,
section.user_filters .right header .skill-view-description,
section.incidents .right header .skill-view-description {
  margin-top: 10px;
}
section.filters .right header .object_options_btn,
section.user_filters .right header .object_options_btn,
section.incidents .right header .object_options_btn {
  position: relative;
  width: 30px;
  height: 30px;
}
section.filters .right header .object_options_btn:after,
section.user_filters .right header .object_options_btn:after,
section.incidents .right header .object_options_btn:after {
  content: "";
  position: absolute;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid rgb(var(--grey-800));
  /* Grey-800 */
  top: 11px;
  left: 10px;
}

section.filters .object_options,
section.incidents .object_options {
  float: right;
  margin: 30px 0px 5px 10px;
}
html[data-rtl-language="true"] section.filters .object_options,
html[data-rtl-language="true"] section.incidents .object_options {
  float: left;
  margin: 30px 10px 5px 4px;
}
section.filters .object_options .menu,
section.incidents .object_options .menu {
  margin-top: 0;
}

section.user_filters .editing-actions {
  top: 30px;
  right: 30px;
}
html[data-rtl-language="true"] section.user_filters .editing-actions {
  left: 30px;
  right: auto;
}
section.user_filters .editing-actions > .btn-group,
section.user_filters .editing-actions > .btn {
  margin: 0 0 0 7px;
}
html[data-rtl-language="true"] section.user_filters .editing-actions > .btn-group,
html[data-rtl-language="true"] section.user_filters .editing-actions > .btn {
  float: right;
  margin: 0 7px 0 0;
}

section.user_filters .filter-export {
  top: 30px;
  right: 30px;
}
html[data-rtl-language="true"] section.user_filters .filter-export {
  left: 30px;
  right: auto;
}

section.user_filters .filter-editor.popover {
  top: 90px;
}

section.user_filters .filter-grid-list aside {
  border-top: 1px solid var(--border-default);
}

.pane.right .filter-grid-list footer {
  position: absolute;
  background: none;
  border-width: 0;
  height: auto;
  bottom: auto;
  left: auto !important;
}
html[data-rtl-language="true"] .pane.right .filter-grid-list footer {
  left: 75px !important;
}
.pane.right .filter-grid-list footer .dropdown-menu {
  margin: 0;
}
.pane.right .filter-grid-list footer .controls-group {
  margin: 0;
}

.pane.center {
  display: flex;
  justify-content: center;
  align-items: center;
}

html[data-rtl-language="true"] section.bulk-mode .pane.right .filter-grid-list footer,
html[data-rtl-language="true"] section.organization .pane.right .filter-grid-list footer {
  left: 70px !important;
}

.bulk-mode .pane.right.section {
  bottom: 0;
}

.organization .pane.right .filter-grid-list footer {
  right: 70px;
  top: -101px;
}

.user .pane.right .filter-grid-list footer {
  right: 70px;
  top: -139px;
}

.filters .pane.right .filter-grid-list footer,
.user_filters .pane.right .filter-grid-list footer {
  right: 70px;
  top: -50px;
}

.filters .pane.right .filter-grid-list footer.refresh-ticket-list-bulk-footer,
.user_filters .pane.right .filter-grid-list footer.refresh-ticket-list-bulk-footer {
  right: 70px;
  top: -82px;
}

.filters .pane.right .filter-grid-list.suspended footer,
.user_filters .pane.right .filter-grid-list.suspended footer {
  right: 30px;
}

.incidents .pane.right .filter-grid-list footer {
  right: 30px;
  top: -50px;
}

.dashboard .pane.right .filter-grid-list footer {
  right: 30px;
  /* Added this specific value to match the margin of Play button on dashbaord */
  /* play button screenshot: https://drive.google.com/file/d/16lZOXriQGUwRWcYqP85OXpGy4hjfJ2i-/view */
  top: -43px;
}

.l-mt-1 {
  margin-top: 1px;
}

/* END ./app/assets/stylesheets/layout.scss */
/* BEGIN ./app/assets/stylesheets/working.scss */

.ticket-working-spinner {
  z-index: 10;
  position: absolute;
  top: 100px;
  left: 60px;
  width: 100%;
  height: 100%;
  color: var(--foreground-primary);
  background-color: var(--overlay-legacy);
}

@keyframes zd-loader--spinner__length {
  0% {
    stroke-dasharray: 0 250;
  }
  13% {
    stroke-dasharray: 2 250;
  }
  26% {
    stroke-dasharray: 13 250;
  }
  53% {
    stroke-dasharray: 86 250;
  }
  58% {
    stroke-dasharray: 90 250;
  }
  66% {
    stroke-dasharray: 86 250;
  }
  68% {
    stroke-dasharray: 83 250;
  }
  69% {
    stroke-dasharray: 79 250;
  }
  73% {
    stroke-dasharray: 70 250;
  }
  74% {
    stroke-dasharray: 62 250;
  }
  76% {
    stroke-dasharray: 58 250;
  }
  78% {
    stroke-dasharray: 47 250;
  }
  79% {
    stroke-dasharray: 37 250;
  }
  83% {
    stroke-dasharray: 23 250;
  }
  84% {
    stroke-dasharray: 16 250;
  }
  88% {
    stroke-dasharray: 10 250;
  }
  89% {
    stroke-dasharray: 7 250;
  }
  98% {
    stroke-dasharray: 1 250;
  }
  100% {
    stroke-dasharray: 0 250;
  }
}

@keyframes zd-loader--spinner__rotation {
  0% {
    transform: rotate(-90deg);
  }
  8% {
    transform: rotate(-81deg);
  }
  36% {
    transform: rotate(-30deg);
  }
  41% {
    transform: rotate(-18deg);
  }
  43% {
    transform: rotate(-13deg);
  }
  44% {
    transform: rotate(-8deg);
  }
  48% {
    transform: rotate(0deg);
  }
  55% {
    transform: rotate(22deg);
  }
  63% {
    transform: rotate(53deg);
  }
  71% {
    transform: rotate(97deg);
  }
  73% {
    transform: rotate(112deg);
  }
  74% {
    transform: rotate(129deg);
  }
  76% {
    transform: rotate(138deg);
  }
  78% {
    transform: rotate(159deg);
  }
  79% {
    transform: rotate(180deg);
  }
  81% {
    transform: rotate(190deg);
  }
  83% {
    transform: rotate(207deg);
  }
  84% {
    transform: rotate(221deg);
  }
  86% {
    transform: rotate(226deg);
  }
  88% {
    transform: rotate(235deg);
  }
  90% {
    transform: rotate(243deg);
  }
  100% {
    transform: rotate(270deg);
  }
}

.ticket-working-spinner svg {
  --spinner-dimension: 160px;
  position: absolute;
  top: 30%;
  left: calc(50% - (var(--spinner-dimension) / 2));
  width: var(--spinner-dimension);
  height: var(--spinner-dimension);
}

.ticket-working-spinner circle {
  transform: translateZ(0); /* trigger GPU acceleration */
  transform-origin: center;
  animation-name: zd-loader--spinner__length, zd-loader--spinner__rotation;
  animation-duration: 1250ms;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

.working .icon-loading-spinner {
  display: inline-block;
  vertical-align: baseline;
  height: 13px;
}

.working .empty_set {
  display: none;
}

.loading-audits {
  position: absolute;
  top: 10px;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 10;
  background-color: var(--background-default);
}

.icon-loading-spinner {
  width: 50px;
  background: url(/agent/assets/icons/spinners/dotted_bar-b0db0a3419081443c8a7ae0747b9937d.gif) no-repeat 10px 3px;
  display: none;
}
.icon-loading-spinner.audits {
  display: block;
  margin: auto;
  margin-top: 360px;
}

.loading-user-properties {
  position: absolute;
  top: 10px;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 10;
  background-color: var(--background-default);
}

.icon-loading-spinner.user-properties {
  display: block;
  margin: auto;
  margin-top: 360px;
}
/* END ./app/assets/stylesheets/working.scss */
/* BEGIN ./app/assets/stylesheets/property_box.scss */
.left.pane.ticket-sidebar.section {
  overflow: visible;
  z-index: 9;
  /* .pane.right is 8 */
}

.left.pane h2 {
  color: rgb(var(--grey-700));
  margin: 8px 0 -13px 19px;
  display: inline-block;
  width: 300px;
  font-size: 12px;
  font-weight: 400;
}

.left.pane .log {
  color: var(--foreground-default);
  font-size: 12px;
  line-height: 20px;
  margin: 10px 0 8px 23px;
  float: left;
  width: 300px;
}
html[data-rtl-language="true"] .left.pane .log {
  direction: rtl;
  float: right;
  margin: 10px 23px 8px 0;
}
.left.pane .log > span {
  color: var(--foreground-subtle);
  padding-right: 3px;
  font-weight: 400;
}
.left.pane .log div {
  display: inline;
}

.left.pane .sidebar_box_container {
  overflow-y: auto;
  overflow-x: hidden;
  padding-bottom: 74px;
  box-sizing: border-box;
  position: relative;
  height: 100%;
}

.left.pane .customer_context {
  background: var(--background-default);
}

.customer_context.app.pane {
  position: absolute;
  top: 101px;
  right: 0;
  bottom: 50px;
  left: auto;
  width: 370px;
  box-sizing: border-box;
  border-left: 1px solid var(--border-emphasis);
  background-color: var(--background-default);
}
html[data-rtl-language="true"] .customer_context.app.pane {
  border-left: 0px;
  border-right: 1px solid var(--border-emphasis);
}

.main_panes .with_customer_context_pane {
  right: 370px;
}
html[data-rtl-language="true"] .main_panes .with_customer_context_pane.pane.right {
  left: 370px;
}

.omnipanel.app.pane {
  position: absolute;
  top: 101px;
  right: 0;
  bottom: 0;
  left: auto;
  z-index: 6;
  width: calc(360px + 48px);
  border-left: 1px solid var(--border-default);
  overflow: visible;
  box-sizing: border-box;
}
.omnipanel.app.pane.is_viewing_ticket {
  bottom: 50px;
}
html[data-rtl-language="true"] .omnipanel.app.pane {
  direction: rtl;
  border-right: 1px solid var(--border-default);
}
.omnipanel.app.pane.only_selector {
  pointer-events: none;
}

.omnipanel.app.pane.only_selector .omnipanel-selector {
  pointer-events: auto;
}

.omnipanel.app.pane.collapsed,
html[data-rtl-language="true"] .omnipanel.app.pane.collapsed {
  width: 48px;
  border-width: 0;
}

/* Targets the Omnipanel app pane with Flexible Layout enabled */
.main_panes.flexible_layout .omnipanel.app.pane {
  width: auto;
}

/* Targets the Omnipanel > Apps > App Container with Flexible Layout enabled */
/* This will match the exact width of the non Flexible Layout implementation when resize has not started or has been reset */
.main_panes.flexible_layout .with_omnipanel .workspace.apps .app_container {
  width: calc(100% + 1px);
}

/* Targets the Conversation Log */
html:not([data-rtl-language="true"]) .hiddenscroll .main_panes .with_omnipanel_pane,
html:not([data-rtl-language="true"]) .hiddenscroll .main_panes .with_apps_pane.with_omnipanel_pane,
html:not([data-rtl-language="true"]) .hiddenscroll .main_panes .with_customer_context_pane.with_omnipanel_pane {
  right: calc(360px + 48px);
}

/* Targets the Conversation Log */
html:not([data-rtl-language="true"]) .visiblescroll .main_panes .with_omnipanel_pane,
html:not([data-rtl-language="true"]) .visiblescroll .main_panes .with_apps_pane.with_omnipanel_pane,
html:not([data-rtl-language="true"]) .visiblescroll .main_panes .with_customer_context_pane.with_omnipanel_pane {
  right: calc(380px + 48px);
}

/* Targets the Conversation Log in User Workspace */
html:not([data-rtl-language="true"]) .main_panes.user .with_omnipanel_pane,
html:not([data-rtl-language="true"]) .main_panes.user .with_apps_pane.with_omnipanel_pane,
html:not([data-rtl-language="true"]) .main_panes.user .with_customer_context_pane.with_omnipanel_pane {
  right: calc(360px + 48px);
}

/* Targets the Conversation Log in Organization Workspace */
html:not([data-rtl-language="true"]) .main_panes.organization .with_omnipanel_pane,
html:not([data-rtl-language="true"]) .main_panes.organization .with_apps_pane.with_omnipanel_pane,
html:not([data-rtl-language="true"]) .main_panes.organization .with_customer_context_pane.with_omnipanel_pane {
  right: calc(360px + 48px);
}

/* Targets the Conversation Log with Flexible Layout enabled */
html:not([data-rtl-language="true"]) .main_panes.flexible_layout .with_omnipanel_pane,
html:not([data-rtl-language="true"]) .main_panes.flexible_layout .with_apps_pane.with_omnipanel_pane,
html:not([data-rtl-language="true"]) .main_panes.flexible_layout .with_customer_context_pane.with_omnipanel_pane {
  right: auto;
}

/* Targets the Conversation Log (RTL) */
html[data-rtl-language="true"] .hiddenscroll .main_panes .pane.with_omnipanel_pane.right,
html[data-rtl-language="true"] .hiddenscroll .main_panes .pane.with_apps_pane.with_omnipanel_pane.right,
html[data-rtl-language="true"] .hiddenscroll .main_panes .pane.with_customer_context_pane.with_omnipanel_pane.right {
  left: calc(360px + 48px);
}

/* Targets the Conversation Log (RTL) */
html[data-rtl-language="true"] .visiblescroll .main_panes .pane.with_omnipanel_pane.right,
html[data-rtl-language="true"] .visiblescroll .main_panes .pane.with_apps_pane.with_omnipanel_pane.right,
html[data-rtl-language="true"] .visiblescroll .main_panes .pane.with_customer_context_pane.with_omnipanel_pane.right {
  left: calc(380px + 48px);
}

/* Targets the Conversation Log (RTL) with Flexible Layout enabled */
html[data-rtl-language="true"] .main_panes.flexible_layout .with_omnipanel_pane.right,
html[data-rtl-language="true"] .main_panes.flexible_layout .with_apps_pane.with_omnipanel_pane.right,
html[data-rtl-language="true"] .main_panes.flexible_layout .with_customer_context_pane.with_omnipanel_pane.right {
  left: auto;
}

html:not([data-rtl-language="true"]) .main_panes .with_omnipanel_pane.isViewingTicket,
html:not([data-rtl-language="true"]) .main_panes .with_apps_pane.with_omnipanel_pane.isViewingTicket,
html:not([data-rtl-language="true"]) .main_panes .with_customer_context_pane.with_omnipanel_pane.isViewingTicket {
  left: 368px;
}
html[data-rtl-language="true"] .main_panes .pane.with_omnipanel_pane.isViewingTicket.right,
html[data-rtl-language="true"] .main_panes .pane.with_apps_pane.with_omnipanel_pane.isViewingTicket.right,
html[data-rtl-language="true"] .main_panes .pane.with_customer_context_pane.with_omnipanel_pane.isViewingTicket.right {
  right: 368px;
}

html:not([data-rtl-language="true"]) .main_panes .with_omnipanel_pane.with_omnipanel_selector_only,
html:not([data-rtl-language="true"]) .main_panes .with_apps_pane.with_omnipanel_pane.with_omnipanel_selector_only,
html:not([data-rtl-language="true"])
  .main_panes
  .with_customer_context_pane.with_omnipanel_pane.with_omnipanel_selector_only {
  right: 48px;
}
html[data-rtl-language="true"] .main_panes .pane.with_omnipanel_pane.with_omnipanel_selector_only.right,
html[data-rtl-language="true"] .main_panes .pane.with_apps_pane.with_omnipanel_pane.with_omnipanel_selector_only.right,
html[data-rtl-language="true"]
  .main_panes
  .pane.with_customer_context_pane.with_omnipanel_pane.with_omnipanel_selector_only.right {
  left: 48px;
}

.main_panes .ticket-app-sidebar {
  width: 360px;
  position: absolute;
  top: 101px;
  right: 0;
  bottom: 49px;
  left: -100vw;
  overflow: hidden;
  border-left: 1px var(--border-default) solid;
  border-right: none;
  box-sizing: border-box;
}

.visiblescroll .main_panes .ticket-app-sidebar {
  width: 380px;
}

.visiblescroll.os-mac .main_panes .ticket-app-sidebar {
  width: 376px;
}

html[data-rtl-language="true"] .main_panes .ticket-app-sidebar {
  border-left: none;
  border-right: 1px var(--border-default) solid;
}
.main_panes .ticket-app-sidebar .ember-view {
  display: flex;
  height: 100%;
  overflow: hidden;
}

.main_panes .with_omnipanel .ticket-app-sidebar {
  width: 360px;
  right: 48px;
}
.visiblescroll .main_panes .with_omnipanel .ticket-app-sidebar {
  width: 380px;
}
.main_panes.flexible_layout .ticket-app-sidebar {
  visibility: hidden;
}
html[data-rtl-language="true"] .main_panes .ticket-app-sidebar {
  direction: rtl;
  right: 0;
}

.main_panes .ticket-app-sidebar.active {
  left: auto;
}
html[data-rtl-language="true"] .main_panes .ticket-app-sidebar.active {
  left: 0px;
}
html[data-rtl-language="true"] .main_panes .with_omnipanel .ticket-app-sidebar.active {
  left: 48px;
}

.omnipanel-selector-container {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
}

html:not([data-rtl-language="true"]) .omnipanel-selector-container {
  left: 0;
}

html[data-rtl-language="true"] .omnipanel-selector-container {
  right: 0;
}

.collapsed > .omnipanel-selector-container {
  width: 48px;
}

.omnipanel-selector {
  order: 1;
  padding: 8px;
  width: 48px;
  min-width: 48px;
  box-shadow: inset 1px 0 0 0 var(--border-default); /* Garden grey-300 */
  box-sizing: border-box;
}

html[data-rtl-language="true"] .omnipanel-selector {
  box-shadow: inset -1px 0 0 0 var(--border-default); /* Garden grey-300 */
}

.with_omnipanel .workspace.apps,
.with_omnipanel .workspace.apps:not(.ticket_edit_or_app) {
  z-index: 6;
  width: 360px;
  background-color: var(--background-default);
}

.with_omnipanel .workspace.apps .app_container {
  width: 336px;
}

html:not([data-rtl-language="true"]) .with_omnipanel .workspace.apps,
html:not([data-rtl-language="true"]) .with_omnipanel .workspace.apps:not(.ticket_edit_or_app) {
  right: 48px;
}

html[data-rtl-language="true"] .with_omnipanel .workspace.apps,
html[data-rtl-language="true"] .with_omnipanel .workspace.apps:not(.ticket_edit_or_app) {
  margin-left: 48px;
  left: 0;
}

.form_field {
  position: relative;
  float: left;
  width: 100%;
  margin: 0;
}
html[data-rtl-language="true"] .form_field {
  float: right;
}
.form_field--narrow {
  position: relative;
  float: left;
  width: 47%;
  margin-right: 6%;
  /* general sibling selector (~) instead of adjacent sibling selector (~) */
  /* because type and priority can be separated by invisible ticket fields */
}
html[data-rtl-language="true"] .form_field--narrow {
  margin-left: 6%;
  margin-right: 0;
}
html[data-rtl-language="true"] .form_field--narrow.react-select-presentational-view {
  margin-right: 6%;
  margin-left: 0;
}
.form_field--narrow ~ .form_field--narrow {
  margin-right: 0;
}
html[data-rtl-language="true"] .form_field--narrow ~ .form_field--narrow {
  margin-left: 0;
}
.form_field label {
  font-size: 12px;
  font-weight: 600;
  color: var(--foreground-default);
  float: none;
  margin: 4px 0 6px 0;
  text-align: left;
  z-index: 0;
}
html[data-rtl-language="true"] .form_field label {
  text-align: right;
}
.form_field label .info {
  float: right;
  width: auto;
  margin: 0;
  padding-top: 1px;
}
html[data-rtl-language="true"] .form_field label .info {
  float: left;
}
.form_field label,
.form_field select {
  display: block;
}
.sidebar_box_container .flex-label {
  display: flex;
  justify-content: space-between;
}
.sidebar_box_container .flex-label > div {
  font-size: 12px;
  margin: 4px 0 6px 0;
}
.sidebar_box_container label {
  display: inline-block;
}
.form_field .token_list {
  min-height: 22px;
  width: 274px;
}
.form_field .ui-button input,
.form_field .token_list input {
  outline: none;
}
.form_field input,
.form_field textarea {
  box-shadow: none;
  padding: 3px;
  min-height: 18px;
  box-sizing: border-box;
}
html[data-rtl-language="true"] .form_field input,
html[data-rtl-language="true"] .form_field textarea {
  text-align: right;
  margin-left: 7px;
  margin-right: 0;
}
.form_field input .highlightable,
.form_field textarea .highlightable {
  background-color: transparent;
  background-image: none;
}
div .form_field input[type="checkbox"],
div .form_field textarea[type="checkbox"] {
  display: inline-block;
  height: auto;
  margin: 5px 7px 5px 0;
  width: auto;
}
div .form_field input[type="checkbox"] + label,
div .form_field textarea[type="checkbox"] + label {
  display: inline-block;
  line-height: 11px;
}
html[data-rtl-language="true"] .form_field input {
  text-align: right;
  margin-left: 7px;
  margin-right: 0;
}
.form_field > input,
.form_field textarea,
.form_field .token_list,
.form_field .zd-menu-list-holder {
  display: block;
  background-image: linear-gradient(var(--background-recessed), var(--background-default));
}
.form_field > input,
.form_field textarea {
  border-radius: 2px;
}
.form_field textarea {
  resize: vertical;
}
.form_field .tagger_value {
  text-align: left;
}

.property_box {
  position: relative;
  float: left;
  margin: 8px;
  margin-bottom: 1px;
  width: 284px;
  background: var(--background-default);
  padding: 10px 13px 10px 15px;
  border: 1px var(--border-default) solid;
  border-radius: 5px;
}
.property_box.ticket_properties {
  /* This is needed so that tooltips placed to the side of fields can have their z-index take precedence over the main pain. */
  position: static;
}
.property_box .ui-button-text {
  padding-left: 0.7em;
}
.property_box div.form_field {
  margin-bottom: 8px;
}
html[data-rtl-language="true"] .property_box div.form_field {
  direction: rtl;
}
.property_box .suggestions {
  clear: left;
  border-top: 1px solid var(--border-emphasis);
  position: absolute;
  z-index: 10000;
}
.property_box .suggestions li.ui-menu-item {
  position: relative;
}
.property_box .suggestions li.ui-menu-item .icon {
  position: absolute;
  top: 7px;
  left: 7px;
  width: 16px;
  height: 16px;
}
.property_box .suggestions li.ui-menu-item a {
  color: var(--foreground-default);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  border: none;
  background-repeat: no-repeat;
  background-position: 3px 4px;
}
.property_box .suggestions li.ui-menu-item a.ui-state-focus {
  background-color: var(--border-subtle);
}
.property_box .suggestions li.ui-menu-item a span.postscript {
  color: var(--foreground-subtle);
  font-size: 12px;
  padding-left: 6px;
}
.property_box .suggestions li.ui-menu-item.group > a,
.property_box .suggestions li.ui-menu-item.agent > a {
  padding-left: 27px;
}
.property_box .suggestions.ios-style {
  height: auto;
  max-height: 200px;
}
.property_box .checkbox-field {
  margin-top: 3px;
}
.property_box .checkbox-field + .checkbox-field {
  margin-top: -4px;
}
.property_box.ticket_properties .tooltip.inside {
  position: fixed;
  top: auto !important;
  bottom: 2px;
  left: 82px !important;
}
.property_box.ticket_properties .tooltip.inside .tooltip-inner {
  max-width: none;
  width: 278px;
  padding: 14px 0;
  text-align: center;
}

::placeholder {
  color: rgb(var(--grey-600));
}

html[lang|="ja"] .left.pane .log {
  font-size: 12px;
}

.ticket-sidebar {
  display: flex;
  flex-direction: column;

  /* Convert ticket fields to flex box */
  /* Don't flex children of ticket fields except sidebar box sidebar_box_container. */
  /* We do this because the legacy code has not been converted to flexbox */
  /* and sidebar_box_container should fill up remaining space. */
}
.ticket-sidebar.higher-index:hover {
  /* Indexes in Lotus are in a total mess so we are unable to add */
  /* a hover card to the sidebar without it being belove the toolbar. */
  /* But changing the sidebar index to a higher index will block the */
  /* popovers that show up when you hover over the toolbar tabs. */
  /* So what we need to do is change the z-index temporarly while */
  /* we're hovering over the sidebar. */
  z-index: 11 !important;
}
.ticket-sidebar .ticket_fields,
.ticket-sidebar .customer_context {
  display: flex;
  flex: 1;
  flex-direction: column;
  overflow: auto;
}
.ticket-sidebar .ticket_fields.show.react_sidebar > div {
  height: 100%;
}
.ticket-sidebar .ticket_fields.show,
.ticket-sidebar .customer_context.show {
  display: flex;
}
.ticket-sidebar .ticket_fields.hide,
.ticket-sidebar .customer_context.hide {
  display: none;
}
.ticket-sidebar .ticket_fields > * {
  flex: none;
}
.ticket-sidebar .ticket_fields .sidebar_box_container {
  flex: auto;
}
.ticket-sidebar .property_box {
  background: inherit;
  border: none;
  margin: 0;
  padding: 22px 31px 20px 31px;
  width: 268px;
  border-bottom: 1px solid var(--border-subtle);
  /* Grey-200 */
  border-radius: 0px;
}
.ticket-sidebar .property_box.ticket_properties {
  padding: 8px 31px 20px 31px;
}
.ticket-sidebar .property_box > .ember-view:has(.react-wrapper):not(:has(.ember-view *)) {
  display: none !important;
}
.ticket-sidebar .ticket_fields.with_omnipanel .property_box,
.ticket-sidebar .ticket_fields.with_omnipanel .property_box.ticket_properties {
  padding-left: 20px;
  padding-right: 20px;
}
.ticket-sidebar .ticket_fields.with_omnipanel .property_box:first-child {
  padding-top: 20px;
}
.ticket-sidebar .form_field > input,
.ticket-sidebar .form_field textarea {
  border: 1px solid var(--border-default);
  border-radius: 2px;
  padding: 5px;
}
.ticket-sidebar .form_field > input:focus,
.ticket-sidebar .form_field textarea:focus {
  border-color: rgb(var(--blue-600)) !important;
  box-shadow: 0 0 0 3px var(--border-primaryEmphasis) !important;
  outline: thick none !important;
}
.ticket-sidebar .form_field > input,
.ticket-sidebar .form_field textarea,
.ticket-sidebar .form_field .token_list,
.ticket-sidebar .form_field .zd-menu-list-holder {
  background-image: none;
}
.ticket-sidebar .zd-selectmenu-base,
.ticket-sidebar .zd-tag-menu-root {
  background-image: none;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-thumb {
  background-color: var(--border-default);
  border-radius: 8px;
}

::-webkit-scrollbar-thumb {
  background-color: var(--border-subtle);
  border-radius: 8px;
}

::-webkit-scrollbar-track {
  background: var(--background-default);
}
section.organization > .pane.left.section::-webkit-scrollbar-track {
  background: var(--background-subtle);
}
section.user > .pane.left.section::-webkit-scrollbar-track {
  background: var(--background-subtle);
}

/* END ./app/assets/stylesheets/property_box.scss */
/* BEGIN ./app/assets/stylesheets/zd_menu.scss */
.zd-menu-item > a .zd-aux {
  color: rgb(var(--grey-600)); /* Gray-600 */
  font-size: 12px;
}

.zd-state-hover .zd-icon-arrow-down {
  border-top-color: var(--border-subtle);
}

.zd-menu-list-holder {
  width: 100% !important;
}

/*
zd-selectmenu-focus-proxy input elements should be technically visible in order
to be able to gain focus. They need to be focused to prevent key inputs staying
on the contenteditable element instead of the button of the target dropdown.
*/
.zd-selectmenu-focus-proxy {
  opacity: 0.01;
}

/********************************************/
.zd-menu-item.brand > .zd-menu-item-icon {
  top: 6px;
  left: 6px;
  height: 30px;
  width: 30px;
  text-align: center;
  overflow: hidden;
  border-radius: 4px;
}
.zd-menu-item.brand > .zd-menu-item-icon + a {
  padding-left: 44px;
}
html[data-rtl-language="true"] .zd-menu-item.brand > .zd-menu-item-icon + a {
  padding-left: 0;
  padding-right: 44px;
}

.brand .zd-menu-item > a {
  padding: 12px 8px 12px 6px;
}

.zd-menu-item.group > a,
.zd-menu-item.agent > a {
  padding-left: 27px;
}

.zd-menu-item span.suspended {
  color: var(--background-warningEmphasis);
}

.zd-selectmenu-base .icon {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  overflow: hidden;
  border-radius: 4px;
  width: 20px;
  height: 18px;
}
.zd-selectmenu-base .icon > img {
  max-height: 100%;
}

.zd-state-disabled .zd-selectmenu-base {
  cursor: default;
}

.brand-widget .zd-selectmenu-base {
  height: 33px;
  padding-left: 6px;
}
.brand-widget .zd-selectmenu-base .icon {
  width: 30px;
  height: 30px;
  margin-right: 8px;
}

.zd-selectmenu-base.group .icon {
  margin: 3px 0 0 4px;
}

.zd-selectmenu-base.agent .icon {
  margin: 3px 0 0 4px;
}

.zd-tag-menu-root {
  min-height: 28px;
}

.zd-tag-menu-root .zd-tag-editor-holder input {
  box-shadow: none !important;
}

.zd-tag-item a {
  color: var(--foreground-default);
}

.zd-tag-item.zd-item-focus a {
  color: var(--background-default);
}

.zd-tag-menu-root .zd-state-disabled {
  border-color: var(--background-default);
}

.zd-combo-selectmenu .zd-highlight,
.zd-selectmenu .zd-highlight,
.zd-searchmenu .zd-highlight {
  font-weight: 600 !important;
  /* Highlight color is DARKER than the darkest text color in our palette
     because agents need strong contrast here to effectively scan results
     in the macro menu when typing to filter their macros.
     This color is based on Gray-800 in the 2018 palette, but darker.
   */
  color: var(--foreground-default) !important;
  background-color: transparent;
}

/******** Requester Field *********/
.agent .zd-searchmenu-base {
  padding-left: 27px !important;
  background-repeat: no-repeat;
}

.agent .zd-searchmenu .zd-menu-item > a {
  padding-left: 27px !important;
  padding-right: 2px !important;
}

.agent .zd-searchmenu-root .icon {
  position: absolute;
  top: 7px;
  left: 9px;
  width: 20px;
  height: 18px;
}

.zd-search-item-aux {
  padding-right: 6px;
}
html[data-rtl-language="true"] .zd-search-item-aux {
  padding-left: 6px;
  padding-right: 0;
}

.brand-widget .zd-menu-item {
  white-space: nowrap;
}

/*** font overrides ***/
.zd-selectmenu-root,
.zd-searchmenu-root,
.zd-combo-selectmenu-root {
  font-size: 12px;
  color: var(--foreground-default);
}

.zd-combo-selectmenu .zd-searchmenu-base {
  font-size: 14px !important;
  color: var(--foreground-default);
}

.zd-searchmenu-base {
  font-size: 14px;
  color: var(--foreground-default);
}

.zd-menu-item {
  font-size: 14px;
  color: var(--foreground-default);
}

.zd-selectmenu-base-content {
  font-size: 14px;
  color: var(--foreground-default);
}

[data-theme="dark"] .zd-selectmenu-base-content {
  color: rgba(var(--white));
}

[data-theme="dark"] .zd-tag-item {
  background-color: rgba(var(--grey-800));
  color: var(--foreground-default);
}

/*** search control overrides ***/
.zd-state-search.zd-searchmenu-root:after,
.zd-state-search.zd-combo-selectmenu-root:after {
  content: "";
  position: absolute;
  right: 8px;
  top: 50%;
  margin-top: -8px;
  width: 16px;
  height: 16px;
  background: var(--background-default)
    url(/agent/assets/icons/spinners/dotted_bar-b0db0a3419081443c8a7ae0747b9937d.gif) no-repeat 0 6px/16px;
}
html[data-rtl-language="true"] .zd-state-search.zd-searchmenu-root:after,
html[data-rtl-language="true"] .zd-state-search.zd-combo-selectmenu-root:after {
  left: 8px;
  right: auto;
}

.zd-state-search .zd-searchmenu-base {
  padding-right: 28px !important;
}
html[data-rtl-language="true"] .zd-state-search .zd-searchmenu-base {
  padding-left: 28px;
  padding-right: 0 !important;
}

.zd-tag-menu-root .zd-menu-list-holder {
  width: 100% !important;
}

/*** tags overrides ***/
.zd-tag-menu-root {
  box-shadow: none;
}

.zd-tag-editor-holder input {
  background-color: transparent;
  margin-left: 1px;
}

/*
Hide the UL empty list positioned above the input
field so that it does not overlap it. This is important to properly calculate
the visibility of the input element. The positioning logic samples two specific
points (with vertical coordinates 1px off the top of the input and 2px off
the bottom) to determine whether and how we should call scrollIntoView on the
input element
*/
.zd-state-zero .zd-menu-list-holder {
  display: none;
}

.highlight_update .zd-menu-list-holder {
  background-color: transparent;
  background-image: none;
}

.zd-combo-selectmenu .zd-highlight,
.zd-selectmenu .zd-highlight,
.zd-searchmenu .zd-highlight,
.zd-menu-item.autocomplete-label:first-child {
  font-weight: 600;
}

.zd-tag-menu-root .zd-tag-editor-holder,
.zd-tag-menu-root .zd-searchmenu-root,
.zd-tag-menu-root input {
  height: 1px;
}

.zd-tag-menu-root .zd-searchmenu-base {
  position: absolute;
}

.zd-tag-menu-root.zd-state-focus .zd-tag-editor-holder,
.zd-tag-menu-root.zd-state-focus .zd-searchmenu-root,
.zd-tag-menu-root.zd-state-focus input,
.zd-tag-menu-root.zd-state-zero .zd-tag-editor-holder,
.zd-tag-menu-root.zd-state-zero .zd-searchmenu-root,
.zd-tag-menu-root.zd-state-zero input {
  height: 22px;
}

.zd-tag-menu-root.zd-state-focus .zd-tag-editor-holder,
.zd-tag-menu-root.zd-state-zero .zd-tag-editor-holder {
  display: block;
}

.zd-tag-menu-root.zd-state-focus .zd-searchmenu-base,
.zd-tag-menu-root.zd-state-zero .zd-searchmenu-base {
  position: static;
  display: block;
}

.zd-tag-menu-root.zd-state-disabled .zd-tag-editor-holder {
  display: none;
}

.form_field .zd-tag-item {
  word-break: break-word;
}

/* END ./app/assets/stylesheets/zd_menu.scss */
/* BEGIN ./app/assets/stylesheets/areas/_ticketing.scss */
.auto-answer__event {
  display: flex;
  flex-direction: row;
}

.auto-answer__icon {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
}

.auto-answer__spacer {
  width: 20px;
  max-width: 20px;
  min-width: 20px;
}

.auto-answer__body {
  width: 100%;
}

.auto-answer__body-spacer {
  height: 10px;
}

.auto-answer__title-row {
  display: flex;
  align-items: baseline;
}

.auto-answer__title-row-spacer {
  width: 5px;
}

.auto-answer__title {
  font-weight: 600;
  font-size: 14px;
  max-width: 400px;
  overflow: hidden;
}

.auto-answer__title-link {
  overflow: hidden;
  width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--foreground-default);
  /* Grey-800 */
}

.auto-answer__title-link:hover {
  color: var(--foreground-default);
  /* Grey-800 */
}

.auto-answer__timestamp {
  font-size: 12px;
  color: rgb(var(--grey-400));
  /* Grey-400 */
}

.auto-answer__content {
  position: relative;
  border: 1px solid var(--border-default);
  /* Grey-300 */
  padding: 20px;
  border-radius: 5px;
  background: var(--background-default);
  transition: 0.6s ease-in-out;
}

.auto-answer__content-solved,
.auto-answer__content-unsolved {
  border: 1px solid rgb(var(--lemon-200));
  background-color: rgb(var(--lemon-100));
  padding: 20px;
  border-radius: 5px;
}

.auto-answer__content-header {
  color: rgb(var(--grey-700));
  padding: 0 5px 0 0;
}

/* Send Events */
.auto-answer-send__title-row {
  display: flex;
  justify-content: flex-start;
  align-items: baseline;
}

.auto-answer-send__title-and-address {
  display: flex;
  align-items: baseline;
}

.auto-answer-send__address {
  font-size: 12px;
  color: rgb(var(--grey-400));
  /* Grey-400 */
}

.auto-answer__article-suggestions {
  list-style: disc;
  margin-left: 1.8em;
}
html[data-rtl-language="true"] .auto-answer__article-suggestions {
  margin-left: 0;
  margin-right: 1.8em;
}

.auto-answer__available-item {
  margin-top: 10px;
  color: var(--foreground-primary);
  align-items: flex-end;
}

.auto-answer__unavailable-item {
  margin-top: 10px;
  color: var(--foreground-primary);
}

.auto-answer__article-suggestion {
  display: inline-flex;
  align-items: center;
  font-size: 14px;
}

.auto-answer__permission-denied {
  color: var(--foreground-subtle);
  white-space: nowrap;
}

.auto-answer__lock {
  margin-right: 2px;
  width: 14px;
  height: 14px;
}

.auto-answer__tooltip-row {
  display: inline-flex;
  align-items: center;
  height: 20px;
  position: relative;
}

.auto_answer__position--lotus {
  margin: 0 16px 16px 16px;
}

.auto_answer__checking-permissions {
  background: url(/agent/assets/icons/spinners/loading_2x_ff-5a32811d96bf097f7015d132aba9765f.gif) transparent no-repeat;
  width: 175px;
  height: 175px;
  margin: 25px auto 0 auto;
}

.auto-answer__permissions .garden-tooltip {
  position: absolute;
  z-index: 1;
  left: -3px;
  top: 125%;
  width: 150px;
  visibility: hidden;
  line-height: normal;
}

.auto-answer__permissions--edit-mode .garden-tooltip {
  left: 1px;
}

.auto-answer__permissions:hover .garden-tooltip {
  visibility: visible;
}

.auto-answer__content-header-row {
  display: flex;
  justify-content: space-between;
}

.auto-answer__show-irrelevant-li {
  list-style-type: none;
  display: flex;
  margin-left: -23px;
  position: relative;
  align-items: center;
}

.auto-answer__irrelevant-explanation {
  margin-top: 20px;
  max-width: 520px;
}

/* We have outdated garden CSS, and the new CSS doesn't position its contents properly */
.c-btn-new {
  transition:
    border-color 0.25s ease-in-out,
    box-shadow 0.1s ease-in-out,
    background-color 0.25s ease-in-out,
    color 0.25s ease-in-out;
  margin: 0;
  border: 1px solid var(--border-primaryEmphasis);
  /* blue-400 border for outline buttons */
  border-radius: 4px;
  background-color: transparent;
  cursor: pointer;
  padding: 0 2.25em;
  min-width: 8.3334em;
  overflow: visible;
  text-decoration: none;
  line-height: 2.34;
  white-space: nowrap;
  color: var(--foreground-primary);
  /* Blue-600 */
  font-size: 12px;
  font-weight: 400;
  max-height: 30px;
  max-width: 150px;
}

.c-btn-new.is-hovered,
.c-btn-new:hover {
  border-color: transparent;
  background-color: var(--focus-focused);
  /* Blue-400 */
  text-decoration: none;
  color: var(--background-default);
}

.auto-answer__util-break-out-of-height {
  height: 0;
}

.auto-answer__available-item .auto-answer__enduser-activity-description {
  background-color: rgb(var(--kale-400));
  border-radius: 10px;
  cursor: default;
}

.auto-answer__enduser-activity {
  margin-left: 5px;
}

.auto-answer__enduser-activity .garden-tooltip {
  position: absolute;
  z-index: 1;
  visibility: hidden;
  top: 150%;
  padding: 1em;
  left: 0px;
  width: 150px;
  line-height: normal;
}

.auto-answer__enduser-activity:hover .garden-tooltip {
  visibility: visible;
}

.auto-answer__irrelevant-article-title {
  text-decoration: line-through;
}

.auto-answer--checkbox-margin {
  margin-left: 5px;
}

.auto-answer--edit-mode {
  max-width: unset;
  padding: 0 10px;
  outline: none;
}

.auto-answer__onboarding-message {
  margin-bottom: 5px;
}

.auto_answer__bot-left,
.auto_answer__bot-left *,
.auto_answer__bot-right,
.auto_answer__bot-right * {
  transition:
    height 0.5s,
    rx 0.5s,
    transform 0.5s;
}

/* SAD */
.js-answer-bot-sad .auto_answer__bot-left {
  transform: translate(7px, 17px) rotate(-30deg);
}

.js-answer-bot-sad .auto_answer__bot-right {
  transform: translate(29px, 15px) rotate(30deg);
}

.js-answer-bot-sad .auto_answer__bot-eye-bottom {
  transform: translate(0px, 1px) scale(1);
}

.js-answer-bot-sad .auto_answer__bot-eye-top {
  transform: translate(0px, 1px) scale(1, 0.1);
}

/* HAPPY */
.js-answer-bot-happy .auto_answer__bot-left {
  transform: translate(8px, 15px) rotate(0deg);
}

.js-answer-bot-happy .auto_answer__bot-right {
  transform: translate(27px, 15px) rotate(0deg);
}

.js-answer-bot-happy .auto_answer__bot-eye-bottom {
  transform: translate(0px, 1px) scale(1, 0.1);
}

.js-answer-bot-happy .auto_answer__bot-eye-top {
  transform: translate(0px, 1px) scale(1);
}

/* Look at Improve Answers */
.js-answer-bot[data-improve="true"] .auto_answer__bot-left {
  transform: translate(12px, 23px) rotate(0deg);
}

.js-answer-bot[data-improve="true"] .auto_answer__bot-right {
  transform: translate(31px, 23px) rotate(0deg);
}

/* BLINK */
.js-answer-bot-blink .auto_answer__bot-left {
  transform: translate(7px, 19px);
}

.js-answer-bot-blink .auto_answer__bot-right {
  transform: translate(28px, 19px);
}

.js-answer-bot-blink .auto_answer__bot-eye-top,
.js-answer-bot-blink .auto_answer__bot-eye-bottom {
  transform: translate(0px, 1px) scale(1, 0.1);
}

/* REGULAR */
.js-answer-bot-idle .auto_answer__bot-left {
  transform: translate(7px, 19px);
}

.js-answer-bot-idle .auto_answer__bot-right {
  transform: translate(28px, 19px);
}

.js-answer-bot-idle .auto_answer__bot-eye-top,
.js-answer-bot-idle .auto_answer__bot-eye-bottom {
  transform: translate(0px, 1px) scale(1, 1);
}

@keyframes auto-answer__onboarding-dismiss-animation {
  0% {
    opacity: 0.6;
    visibility: visible;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}

.is-dismissed {
  animation: auto-answer__onboarding-dismiss-animation 0.6s ease-in-out forwards;
}

.auto-answer__onboarding-dismiss {
  width: 14px;
  height: 14px;
  position: relative;
  top: 2px;
  color: var(--foreground-subtle);
}

.rapid-resolve__event {
  display: flex;
  flex-direction: row;
}

.rapid-resolve__icon img {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--border-default);
  border-radius: 5px;
  width: 40px;
}

/* BEGIN ./app/assets/stylesheets/components/knowledge_event.scss */
.knowledge-event__event {
  display: flex;
  flex-direction: row;
}

.knowledge-event__icon {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--border-default);
  border-radius: 5px;
}

.knowledge-event__avatar-body-spacer {
  width: 20px;
  max-width: 20px;
  min-width: 20px;
}

.knowledge-event__body {
  width: 100%;
}

.knowledge-event__body-spacer {
  height: 10px;
}

.knowledge-event__title-row {
  display: flex;
  align-items: baseline;
}

.knowledge-event__title-row-spacer {
  width: 5px;
}

.knowledge-event__title {
  font-weight: 600;
  font-size: 14px;
  max-width: 400px;
  overflow: hidden;
}

.knowledge-event__title-link {
  overflow: hidden;
  width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--foreground-default);
  /* Grey-800 */
}

.knowledge-event__timestamp {
  font-size: 12px;
  color: rgb(var(--grey-400));
  /* Grey-400 */
}

.knowledge-event__content {
  background-color: var(--background-default);
  border: none;
  padding: 0;
  border-radius: 3px;
}

/* END ./app/assets/stylesheets/components/knowledge_event.scss */
.rounded-box-avatar {
  width: 40px;
  height: 40px;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rounded-box-avatar__thumbnail-container {
  display: flex;
  transition: background-color 0.3s;
  border-radius: 50%;
  box-sizing: border-box;
  margin: 0;
  position: relative;
}

.rounded-box-avatar__img {
  transition: all 0.3s;
  border-radius: 50%;
  background-clip: content-box;
  width: 100%;
  height: 100%;
  vertical-align: bottom;
}

.rounded-box-avatar__thumbnail-container--xs {
  width: 24px;
  height: 24px;
}

.rounded-box-avatar__thumbnail-container--sm {
  width: 32px;
  height: 32px;
}

.rounded-box-avatar__thumbnail-container--md {
  width: 40px;
  height: 40px;
}

.rounded-box-avatar__thumbnail-container--lg {
  width: 50px;
  height: 50px;
}

/* BEGIN ./app/assets/stylesheets/components/macro_preview.scss */
.macro-preview-enabled .zd-menu-item.zd-leaf {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: center;
}

.macro-preview-enabled .zd-menu-item.zd-leaf > a {
  max-width: 90%;
}

.macro-preview__preview-icon {
  width: 28px;
  height: 28px;
  margin: -4px;
  opacity: 0;
  border: 1px solid rgb(var(--grey-500));
  /* Grey-500 */
  border-radius: 4px;
  background: transparent url("/agent/assets/icons/eye-aacba239f06e63f01c1bbe9b7b7acb8b.svg") center/contain no-repeat;
  background-size: auto;
  outline: 0;
}

.macro-preview-enabled .zd-item-focus > .macro-preview__preview-icon {
  opacity: 0.4;
}

.macro-preview-enabled .macro-preview__preview-icon:hover {
  opacity: 0.66;
}

.macro-preview__description-tooltip {
  padding: 20px !important;
  min-width: 200px;
  max-width: 400px;
  position: fixed;
  flex-direction: column;
  justify-content: center;
  font-size: 2em;
  /* 1 higher than the macro menu's z-index */
  z-index: 10001;
}
html[data-rtl-language="true"] .macro-preview__description-tooltip {
  direction: rtl;
}

.macro-preview__description-tooltip .macro-preview__description-title,
.macro-preview__description-tooltip .macro-preview__description,
.macro-preview__description-tooltip .macro-preview__keyboard-shortcut {
  font-size: 1em;
  line-height: normal;
}

.macro-preview__description-tooltip .macro-preview__description-title {
  padding-bottom: 1.25em;
}

.macro-preview__description-tooltip .macro-preview__description {
  word-wrap: break-word;
}

.macro-preview__description-tooltip .macro-preview__keyboard-shortcut {
  padding-top: 1.25em;
}

.macro-preview__description-tooltip .macro-preview__keyboard-shortcut kbd {
  padding: 0 0 0 30px;
  font-family: inherit;
}
html[data-rtl-language="true"] .macro-preview__description-tooltip .macro-preview__keyboard-shortcut kbd {
  padding: 0 30px 0 0;
}

/* END ./app/assets/stylesheets/components/macro_preview.scss */
/* END ./app/assets/stylesheets/areas/_ticketing.scss */
/* BEGIN ./app/assets/stylesheets/areas/ipm.scss */
div.feature-notifications {
  user-select: none;
  cursor: default;
  /* must be under tooltips, modals, and their backdrops */
  z-index: 990;
  right: 7px;
  left: auto;
  top: 52px;
  bottom: auto;
  margin-top: 0;
  overflow: visible;
  width: 520px;
}
html[data-rtl-language="true"] div.feature-notifications {
  left: 7px;
  right: auto;
  margin: 0 -280px 0 0;
}
div.feature-notifications .modal-header {
  padding: 11px 15px;
}
div.feature-notifications .modal-header h5 {
  display: inline-block;
  margin-left: 10px;
  font-weight: 600;
}
html[data-rtl-language="true"] div.feature-notifications .modal-header h5 {
  margin-left: 0;
  margin-right: 10px;
}
html[data-rtl-language="true"] div.feature-notifications .modal-header h5 .close {
  float: left;
}
div.feature-notifications .modal-header .paginate {
  display: inline-block;
  margin-top: 2px;
  /* same as '.modal-header .close' */
  margin-right: 15px;
  color: rgb(var(--grey-500));
  /* Grey-500 */
}
html[data-rtl-language="true"] div.feature-notifications .modal-header .paginate {
  float: left;
  margin-left: 15px;
  margin-right: 0;
}
div.feature-notifications .modal-header .paginate span {
  padding: 0 2px;
}
div.feature-notifications .modal-body {
  padding: 18px 24px;
}
div.feature-notifications .modal-body .body {
  padding-top: 8px;
  padding-bottom: 8px;
}
div.feature-notifications .left {
  float: left;
  width: 150px;
  height: 150px;
  overflow: hidden;
  position: relative;
  /* image corner */
}
html[data-rtl-language="true"] div.feature-notifications .left {
  float: right;
}
div.feature-notifications .left::after {
  border-radius: 20px;
  display: block;
  position: absolute;
  border: 10px solid var(--background-default);
  top: -10px;
  bottom: -10px;
  left: -10px;
  right: -10px;
  content: "";
}
div.feature-notifications .right {
  float: right;
  width: 300px;
  position: relative;
  padding-bottom: 30px;
  min-height: 120px;
}
html[data-rtl-language="true"] div.feature-notifications .right {
  float: left;
}
div.feature-notifications .right .actions {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 28px;
}
div.feature-notifications .right .actions .options-button {
  float: right;
  cursor: pointer;
  margin-top: 4px;
}
html[data-rtl-language="true"] div.feature-notifications .right .actions .options-button {
  float: left;
}
div.feature-notifications .right .actions .options-button .cog {
  height: 24px;
  width: 24px;
  display: inline-block;
}
div.feature-notifications .right .actions .options-button:hover .caret,
div.feature-notifications .right .actions .options-button:focus .caret {
  opacity: 0.65;
}
div.feature-notifications .right .actions .options-button .caret {
  margin-top: 10px;
  margin-left: -2px;
}
div.feature-notifications .options {
  display: none;
  position: absolute;
  right: 11px;
  bottom: -60px;
  border: 1px solid var(--border-default);
  background-color: var(--background-default);
  padding: 10px 0px;
  border-radius: 4px;
}
html[data-rtl-language="true"] div.feature-notifications .options {
  left: 11px;
  right: auto;
}
div.feature-notifications .options.show {
  display: block;
}
div.feature-notifications .options .feature-notifications-toggle {
  color: var(--foreground-default);
  display: block;
  padding: 5px 50px 5px 20px;
  position: relative;
  transition: background-color 0.125s ease 0s;
}
html[data-rtl-language="true"] div.feature-notifications .options .feature-notifications-toggle {
  padding: 5px 20px 5px 50px;
}
div.feature-notifications .options .feature-notifications-toggle:hover {
  background-color: rgb(var(--grey-200));
}
div.feature-notifications .options .feature-notifications-toggle.current .zd-svg-icon-ok {
  opacity: 0.85;
}
div.feature-notifications .options .feature-notifications-toggle .zd-svg-icon-ok {
  position: absolute;
  right: 15px;
  top: 5px;
  opacity: 0;
}
html[data-rtl-language="true"] div.feature-notifications .options .feature-notifications-toggle .zd-svg-icon-ok {
  left: 15px;
  right: auto;
}
div.feature-notifications .learn-more,
div.feature-notifications .call-to-action {
  display: none;
  margin-bottom: 10px;
}
div.feature-notifications .learn-more.visible,
div.feature-notifications .call-to-action.visible {
  display: inline-block;
}

/* END ./app/assets/stylesheets/areas/ipm.scss */
/* BEGIN ./app/assets/stylesheets/areas/device_list.scss */
/* See below for RTL language positioning of these elements - LOCAL-822 */
.device_list {
  padding: 0 30px;
  /* This is the default twitter bootstrap style. */
  /* Someone has undone it, and therefore, it must be re-done here :( */
  /* Overriding some styles from elsewhere in the app :( */
}
html[data-rtl-language="true"] .device_list {
  direction: rtl;
}
.device_list .btn-group {
  display: inline-block;
}
.device_list h4.list-heading {
  border-bottom: 0;
  padding: 0;
}
.device_list .heading {
  float: left;
  padding: 16px 10px 10px 0;
  max-width: 72%;
  margin-left: 0;
}
html[data-rtl-language="true"] .device_list .heading {
  float: right;
  text-align: right;
  padding: 16px 0 10px 10px;
}
.device_list .heading p {
  color: rgb(var(--grey-700));
}
.device_list .email_notifications {
  margin-left: 0;
  padding: 16px 0 10px 10px;
  text-align: right;
}
.device_list .email_notifications h4,
.device_list .email_notifications .btn-group {
  display: inline-block;
}
html[data-rtl-language="true"] .device_list .email_notifications .list-heading {
  position: absolute;
  left: 115px;
}
.device_list .email_notifications .btn-group {
  margin-left: 7px;
  margin-top: -3px;
  float: right;
}
html[data-rtl-language="true"] .device_list .email_notifications .btn-group {
  float: left;
}
.device_list .email_notifications .btn-group .btn {
  line-height: 12px;
}
.device_list .email_notifications .btn-group .caret {
  margin-top: 4px;
}
.device_list .email_notifications .btn {
  margin-bottom: 6px;
}
.device_list .filter_tickets {
  border-top: 0;
  margin-left: 0;
}
.device_list .filter_tickets th:first-child {
  padding-left: 0;
}
.device_list .filter_tickets th:first-child,
.device_list .filter_tickets td:first-child {
  padding-left: 0;
  padding: 5px;
}
.device_list .filter_tickets .disabled span {
  color: rgb(var(--grey-400));
  /* Grey-400 */
}
.device_list .filter_tickets input {
  margin: 0;
  width: 95%;
}
.device_list .filter_tickets .user_token_list {
  padding-top: 15px;
}
html[data-rtl-language="true"] .device_list .filter_tickets .user_token_list {
  direction: rtl;
}
.device_list .filter_tickets .no_tokens_message td {
  padding: 12px;
  color: rgb(var(--grey-600));
}
.device_list h4.list-heading:first-child {
  padding-left: 0;
}
html[data-rtl-language="true"] .device_list h4.list-heading:first-child {
  padding-right: 0;
}

/* END ./app/assets/stylesheets/areas/device_list.scss */
/* BEGIN ./app/assets/stylesheets/areas/user_token_list.scss */
.user_token_list {
  padding-top: 15px;
}

/* END ./app/assets/stylesheets/areas/user_token_list.scss */
/* BEGIN ./app/assets/stylesheets/areas/nav_bar.scss */
#main_navigation {
  background-color: rgb(var(--kale-700));
  /* Kale-700 */
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 60px;
  z-index: 10;
}
html[data-rtl-language="true"] #main_navigation {
  left: auto;
  right: 0;
}
#main_navigation .product_icon {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: transparent;
  margin: 15px 0 20px 18px;
  outline: none;
  width: 60px;
  height: 50px;
  margin: 0px;
  color: rgb(var(--green-400));
  fill: var(--background-default);
}
#main_navigation .product_icon svg {
  width: 26px;
  height: 26px;
}
#main_navigation .apps_nav_bar .toolbar_link img {
  height: 30px;
  width: 30px;
  background-color: rgb(var(--grey-200));
  border-radius: 4px;
  object-fit: cover;
}
#main_navigation .apps_nav_bar .toolbar_link.js-nav-bar-apps-tray__toggle svg {
  margin: 0;
}
#main_navigation .toolbar_link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 50px;
  color: var(--background-default);
  background-color: transparent;
  cursor: pointer;
  margin: 0;
  outline: none;
}
#main_navigation .toolbar_link.dashboard {
  margin-top: 24px;
}
#main_navigation .toolbar_link.admin {
  margin-bottom: 24px;
}
#main_navigation .toolbar_link.active-product-link {
  background-color: rgb(var(--kale-400));
  /* Kale-400 */
}
#main_navigation .toolbar_link.active-product-link > svg {
  opacity: 1;
}
#main_navigation .toolbar_link.active svg.app_icon {
  background-color: rgb(var(--kale-400));
  /* Kale-400 */
  fill: var(--background-default);
  opacity: 1;
}
#main_navigation .toolbar_link:not(.active):hover svg.app_icon {
  fill: var(--background-default);
}
#main_navigation .toolbar_link svg {
  height: 26px;
  width: 26px;
  opacity: 0.5;
}
#main_navigation .toolbar_link svg.app_icon {
  width: 18px;
  height: 18px;
  padding: 6px;
  border-radius: 4px;
  background-color: var(--background-default);
  fill: var(--background-default);
}
#main_navigation .toolbar_link:hover,
#main_navigation .toolbar_link:focus {
  color: var(--background-default);
}
#main_navigation .toolbar_link:hover > svg,
#main_navigation .toolbar_link:focus > svg {
  opacity: 1;
}
#main_navigation .toolbar_link:hover:not(.active) svg.app_icon,
#main_navigation .toolbar_link:focus:not(.active) svg.app_icon {
  background-color: var(--background-default);
}
#main_navigation .active-nav-tab {
  color: rgb(var(--grey-600));
}
#main_navigation .create {
  margin-top: -2px;
}
#main_navigation .create.dropdown .dropdown-menu {
  margin: -68px 0 0 62px;
}
#main_navigation a.custom {
  background-image: none;
  display: block;
  margin: 6px 0;
  text-align: center;
}
#main_navigation a.custom img {
  height: 35px;
  max-width: 85%;
}

.sub_nav {
  font-size: 12px;
  white-space: nowrap;
  margin: 0;
  width: auto;
}
.sub_nav .content .editable {
  margin-left: 0;
}
.sub_nav a {
  padding: 2px 3px 4px 6px;
  margin-right: 10px;
  font-weight: 400;
}
.sub_nav a.active {
  color: rgb(var(--grey-600));
  border-bottom: 1px solid var(--border-default);
  background: var(--background-default);
}

.main-nav.tooltip.right {
  margin-left: 4px;
}

.main-nav.tooltip.in {
  transition-delay: 450ms;
  opacity: 1;
}

.main-nav.tooltip.right .tooltip-arrow {
  width: 9px;
  height: 9px;
  background: rgb(var(--grey-800));
  /* Grey-800 */
  border: none;
  margin-left: 2px;
  transform: rotate(45deg);
  transform-origin: 50% 50% 0;
  z-index: 1;
  top: 52%;
}

.main-nav.tooltip .tooltip-inner {
  background-color: var(--tooltip-background);
  /* Grey-800 */
  padding: 5px 8px 6px 8px;
  max-width: 300px;
  z-index: 2;
  position: relative;
  font-size: 13px;
}

#z-icon {
  color: var(--background-default);
  opacity: 0.3;
  padding: 12px 0;
  margin: 0 auto;
  width: 26px;
  height: 26px;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  pointer-events: none;
}

/* END ./app/assets/stylesheets/areas/nav_bar.scss */
/* BEGIN ./app/assets/stylesheets/areas/keyboard_shortcuts.scss */
.keyboardshortcuts-modal {
  display: none;
  width: 826px;
  margin: -350px 0 0 -380px;
}
.keyboardshortcuts-modal .modal-body {
  max-height: none;
}
html[data-rtl-language="true"] .keyboardshortcuts-modal .modal-body.row {
  margin-left: 0;
  margin-right: -20px;
}
html[data-rtl-language="true"] .keyboardshortcuts-modal .modal-body.row > div {
  float: right;
  margin-left: 0;
  margin-right: 20px;
}
.keyboardshortcuts-modal h4 {
  font-size: 15px;
  color: var(--foreground-default);
  /* Grey-800 */
  border-bottom: 1px solid rgb(var(--grey-400));
  /* Grey-400 */
  padding: 0 0 3px 0;
  line-height: 19px;
  margin: 0 0 15px 0;
}
.keyboardshortcuts-modal h5 {
  line-height: 16px;
  font-weight: 400;
  font-style: italic;
  margin-bottom: 5px;
  color: rgb(var(--grey-600));
}
.keyboardshortcuts-modal ul {
  margin: 0 0 15px 0;
  /* Needed to override specificity of another RTL style */
}
html[data-rtl-language="true"] .keyboardshortcuts-modal ul {
  margin-right: 0;
}
.keyboardshortcuts-modal ul li {
  margin: 4px 0 7px;
  color: var(--foreground-default);
  /* Grey-800 */
}
.keyboardshortcuts-modal ul li dt {
  display: inline-block;
  min-width: 100px;
  /* Keyboard combinations stay in the same order in RTL */
}
html[data-rtl-language="true"] .keyboardshortcuts-modal ul li dt {
  direction: ltr;
}
.keyboardshortcuts-modal ul li dd {
  display: inline-block;
}
.keyboardshortcuts-modal ul li kbd {
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen-Sans,
    Ubuntu,
    Cantarell,
    "Helvetica Neue",
    Arial,
    sans-serif;
  border-radius: 3px;
  box-shadow:
    0 0 0 var(--background-default),
    0 1px 0 rgb(var(--grey-400));
  /* Grey-400 */
  background-image: linear-gradient(rgb(var(--grey-100)), rgb(var(--grey-200)));
  /* Grey-100, Grey-200 */
  display: inline-block;
  font-size: 11px;
  font-weight: 400;
  line-height: 11px;
  text-align: center;
  padding: 4px 5px;
  margin-right: 3px;
  background-color: rgb(var(--grey-200));
  /* Grey-200 */
  min-width: 12px;
  border: 1px solid rgb(var(--grey-400));
  /* Grey-400 */
}
html[data-rtl-language="true"] .keyboardshortcuts-modal ul li kbd {
  margin-left: 3px;
  margin-right: 0;
}
.keyboardshortcuts-modal ul li kbd:last-of-type {
  margin-right: 8px;
}
html[data-rtl-language="true"] .keyboardshortcuts-modal ul li kbd:last-of-type {
  margin-right: 3px;
}
html[data-rtl-language="true"] .keyboardshortcuts-modal ul li kbd:first-of-type {
  margin-left: 8px;
}
.keyboardshortcuts-modal ul li kbd[title] {
  cursor: help;
}
.keyboardshortcuts-modal footer img {
  height: 16px;
  vertical-align: middle;
}
.keyboardshortcuts-modal footer img.sproutcore {
  margin-top: -4px;
}

.modal-footer .left {
  margin-top: 0.4em;
}
.modal-footer .left input[type="checkbox"] {
  display: inline;
}
.modal-footer .left label {
  user-select: none;
  cursor: default;
  display: inline;
  line-height: 1.7em;
}

/* END ./app/assets/stylesheets/areas/keyboard_shortcuts.scss */
/* BEGIN ./app/assets/stylesheets/areas/agent_forwarding.scss */
.agent_forwarding_modal {
  width: 600px;
}
.agent_forwarding_modal .modal-body {
  text-align: center;
  padding-left: 40px;
}
.agent_forwarding_modal .fowarding_number_wrapper {
  background-color: var(--background-default);
  float: left;
  position: relative;
}
html[data-rtl-language="true"] .agent_forwarding_modal .fowarding_number_wrapper {
  float: right;
}
.agent_forwarding_modal .fowarding_number_wrapper .country-select {
  position: absolute;
  width: 42px;
  text-align: center;
  left: 1px;
  margin-top: 1px;
  /* Firefox */
}
.agent_forwarding_modal .fowarding_number_wrapper .country-select .zd-selectmenu-base {
  margin: 0px;
  border: none;
  text-align: center;
}
.agent_forwarding_modal .fowarding_number_wrapper .country-select .zd-selectmenu-base-content {
  padding-right: 12px;
}
.agent_forwarding_modal .fowarding_number_wrapper .country-select .zd-selectmenu-base-arrow {
  right: 1px;
}
.agent_forwarding_modal .fowarding_number_wrapper .dialed-number {
  padding-left: 45px;
  padding-bottom: 7px;
  /* Ensures that phone number remains LTR for RTL languages */
}
html[data-rtl-language="true"] .agent_forwarding_modal .fowarding_number_wrapper .dialed-number {
  direction: ltr;
  text-align: left;
}
.agent_forwarding_modal .fowarding_number_wrapper .ember-view .ember-text-field {
  padding-bottom: 7px;
}

/* END ./app/assets/stylesheets/areas/agent_forwarding.scss */
/* BEGIN ./app/assets/stylesheets/areas/macros.scss */
/******** Macro View ******/
.macro-selector {
  border-radius: 4px;
  display: inline-block;
  height: 30px;
  margin: 7px 0 0 10px;
  width: 300px;
}
.macro-selector .zd-menu-back-link {
  position: relative;
}
.macro-selector .zd-menu-back-link-title {
  display: block;
  padding: 12px 40px;
  text-align: center;
  font-weight: bold;
  line-height: 18px;
}
.macro-selector .zd-icon-arrow-left-wrapper {
  display: inline-block;
  position: absolute;
  height: 20px;
  left: 18px;
  top: 10px;
  width: 20px;
  border-radius: 20px;
  cursor: pointer;
}
.macro-selector .zd-icon-arrow-left-wrapper:hover {
  background-color: var(--background-default);
}
.macro-selector .zd-icon-arrow-left-wrapper .zd-icon-arrow-left {
  top: 4px;
  left: 4px;
}
html[data-rtl-language="true"] .macro-selector {
  margin: 7px 10px 0 0;
}
.macro-selector:hover .zd-selectmenu-base-content {
  color: var(--foreground-default);
}
.macro-selector .zd-combo-selectmenu {
  border-radius: 4px;
}
.macro-selector .zd-combo-selectmenu.zd-state-open:before {
  background-color: var(--foreground-subtle);
  mask-image: url(/agent/assets/icons/14-search-599c46b6cd535f40fe5cdba8a66b8ffc.svg);
  content: "";
  display: inline-block;
  height: 14px;
  margin: 10px 0 0 10px;
  position: absolute;
  width: 14px;
  z-index: 1000;
}
html[data-rtl-language="true"] .macro-selector .zd-combo-selectmenu.zd-state-open:before {
  margin: 10px 10px 0 0;
}
.macro-selector .zd-icon-arrow-left {
  background-color: var(--foreground-subtle);
  mask-image: url(/agent/assets/icons/14-previous-481b84bbefaf9ae5985621948643ed49.svg);
  border: none;
  height: 12px;
  margin: 0;
  left: 18px;
  top: 33%;
  width: 12px;
}
html[data-rtl-language="true"] .macro-selector .zd-icon-arrow-left {
  left: auto;
  right: 18px;
}
.macro-selector .zd-icon-arrow-right {
  background-color: var(--foreground-subtle);
  mask-image: url(/agent/assets/icons/14-next-87fb986b97d0c8d484eddba9000fb5ed.svg);
  border: none;
  height: 12px;
  margin: 0;
  right: 18px;
  top: 33%;
  width: 12px;
}
.macro-selector .zd-menu-back-link {
  border-bottom: solid 1px var(--border-default);
}
.macro-selector .zd-menu-item > a {
  /* This override is to allow the search result highlighting to contrast more. */
  /* Menu text should normally be Gray-800. This is Gray-700. */
  /* Compare to .zd-highlight color. */
  color: var(--foreground-subtle) !important;
}
.macro-selector .zd-menu-item {
  font-size: 14px;
  padding: 10px 20px;
}
.macro-selector .zd-menu-item:first-child {
  border-top: none;
}
.macro-selector .zd-menu-item:first-child:not(.zd-menu-label) {
  margin-top: 10px;
}
.macro-selector .zd-menu-item:last-child {
  margin-bottom: 10px;
}
.macro-selector .zd-menu-item > a {
  padding: 0;
}
.macro-selector .zd-menu-item.zd-menu-back-link > a {
  color: var(--foreground-default);
  /* Grey-800 */
  padding-left: 15px;
}
html[data-rtl-language="true"] .macro-selector .zd-menu-item.zd-menu-back-link > a {
  padding-left: 0;
  padding-right: 15px;
}
.macro-selector .zd-menu-label {
  border-top: solid 1px var(--border-default);
  padding-bottom: 8px;
  padding-top: 20px;
}
.macro-selector .zd-menu-label:not(:first-child) {
  margin-top: 10px;
}
.macro-selector .zd-menu-label > a {
  color: var(--foreground-subtle);
  font-size: 12px;
  letter-spacing: 1.6px;
}
.macro-selector .zd-menu-root {
  border-color: var(--border-default);
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  box-shadow: var(--shadow-large);
  height: 340px !important;
  width: 400px !important;
}
html[data-rtl-language="true"] .macro-selector .zd-menu-root {
  margin-left: -100px;
}
.macro-selector .zd-menu-root.zd-menu-autofit-mode {
  height: auto;
  max-height: 340px;
}
.macro-selector .zd-searchmenu-base {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  font-size: 14px;
  height: 35px;
  text-indent: 24px;
}
.macro-selector .zd-selectmenu-base {
  border-radius: 4px;
  height: 35px;
}
.macro-selector .zd-selectmenu-base-arrow {
  background-color: var(--foreground-subtle);
  mask-image: url(/agent/assets/icons/14-chevron-c17f2575323bf5fb21969e6559921db2.svg);
  border: none;
  height: 14px;
  margin: 0;
  top: auto;
  width: 14px;
}
.macro-selector .zd-selectmenu-base .zd-selectmenu-base-content .icon {
  background-color: var(--foreground-subtle);
  mask-image: url(/agent/assets/icons/14-macro-ea85525491f257b1d20fa597326857da.svg);
  height: 14px;
  margin: 0 5px;
  width: 14px;
}
.macro-selector .zd-selectmenu-base-content {
  color: var(--foreground-default);
  /* Grey-800 */
  font-size: 14px;
}
.macro-selector .zd-selectmenu-root,
.macro-selector .zd-searchmenu-root,
.macro-selector .zd-combo-selectmenu-root {
  font-size: 14px;
}
.macro-selector .zd-state-position-up .zd-menu-root {
  border-bottom-width: 1px;
  margin-bottom: -1px;
}

/* END ./app/assets/stylesheets/areas/macros.scss */
/* BEGIN ./app/assets/stylesheets/areas/ticket_properties.scss */
.form_field input[type="checkbox"] {
  position: relative;
  top: 2px;
}

.form_field .requester_name {
  width: 284px;
  text-align: left;
}

.form_field .requester_search {
  width: 282px;
  height: auto;
}
.form_field .requester_search .ui-button-text {
  padding: 0 !important;
}
.form_field .requester_search input.search_field {
  border: none;
  height: 14px;
}

.form_field .collaborator_suggestions {
  clear: left;
}

.react_problem_id {
  position: relative;
  float: left;
  width: 100%;
}
html[data-rtl-language="true"] .react_problem_id {
  float: right;
}

.form_field.problem_id select {
  width: 284px;
}

.form_field.requester .zd-searchmenu-base {
  height: 36px;
  border-color: var(--border-default);
  border-radius: 2px;
  line-height: 22px;
  padding-left: 33px !important;
}
html[data-rtl-language="true"] .form_field.requester .zd-searchmenu-base {
  padding-left: 0 !important;
  padding-right: 33px !important;
}

.form_field.requester .zd-state-focus .zd-searchmenu-base {
  font-weight: 600;
}

.form_field.requester .zd-state-open .zd-searchmenu-base {
  border-radius: 2px 2px 0 0;
}

.form_field.requester .zd-searchmenu-root .icon {
  position: absolute;
  overflow: hidden;
  top: 6px;
  left: 6px;
  width: 24px;
  height: 24px;
}
html[data-rtl-language="true"] .form_field.requester .zd-searchmenu-root .icon {
  left: auto;
  right: 6px;
}
.form_field.requester .zd-searchmenu-root .icon img {
  width: 24px;
  height: 24px;
  background-color: var(--background-default);
}

html[data-rtl-language="true"] .requester.v2 .zd-searchmenu-root .icon {
  left: 254px;
  right: auto;
}

html[data-rtl-language="true"] .requester.v2 .zd-searchmenu-base {
  text-align: right;
  padding-left: 0 !important;
  padding-right: 33px;
}

.current_collaborators .zd-tag-menu-root,
.user-picker-menu-base .zd-tag-menu-root {
  min-height: 30px;
  background-color: var(--background-default);
}

.current_collaborators .zd-menu-list-holder,
.user-picker-menu-base .zd-menu-list-holder {
  padding-top: 5px;
}

.current_collaborators .zd-menu-list-holder,
.current_collaborators .zd-searchmenu-base,
.current_collaborators .zd-searchmenu,
.user-picker-menu-base .zd-menu-list-holder,
.user-picker-menu-base .zd-searchmenu-base,
.user-picker-menu-base .zd-searchmenu {
  background-color: transparent;
}

.current_collaborators .zd-searchmenu-base,
.user-picker-menu-base .zd-searchmenu-base {
  height: 24px;
}

.current_collaborators .zd-state-focus .zd-searchmenu-base,
.user-picker-menu-base .zd-state-focus .zd-searchmenu-base {
  font-weight: 600;
}
.current_collaborators .zd-state-focus .zd-searchmenu-base::placeholder {
  font-weight: 400;
}

.current_collaborators .zd-menu-item-icon,
.user-picker-menu-base .zd-menu-item-icon {
  left: 0px;
  top: 0px;
  width: 24px;
  height: 24px;
  border-radius: 3px 0 0 3px;
}
html[data-rtl-language="true"] .current_collaborators .zd-menu-item-icon,
html[data-rtl-language="true"] .user-picker-menu-base .zd-menu-item-icon {
  left: auto;
  right: 7px;
}
.current_collaborators .zd-menu-item-icon img,
.user-picker-menu-base .zd-menu-item-icon img {
  width: 24px;
  height: 24px;
}
.current_collaborators .zd-menu-item-icon.has-photo,
.user-picker-menu-base .zd-menu-item-icon.has-photo {
  top: 0px;
  left: 0px;
  width: 24px;
  height: 24px;
}
html[data-rtl-language="true"] .current_collaborators .zd-menu-item-icon.has-photo,
html[data-rtl-language="true"] .user-picker-menu-base .zd-menu-item-icon.has-photo {
  left: auto;
  right: 0px;
}
.current_collaborators .zd-menu-item-icon.has-photo img,
.user-picker-menu-base .zd-menu-item-icon.has-photo img {
  width: 24px;
  height: 24px;
}

.current_collaborators .zd-tag-item,
.user-picker-menu-base .zd-tag-item {
  padding: 5px 17px 6px 29px;
}
.current_collaborators .zd-tag-item .zd-menu-item-icon,
.user-picker-menu-base .zd-tag-item .zd-menu-item-icon {
  overflow: hidden;
}
.current_collaborators .zd-tag-item a,
.user-picker-menu-base .zd-tag-item a {
  font-size: 12px;
}
.current_collaborators .zd-tag-item.agent,
.user-picker-menu-base .zd-tag-item.agent {
  padding-right: 38px;
}
html[data-rtl-language="true"] .current_collaborators .zd-tag-item.agent,
html[data-rtl-language="true"] .user-picker-menu-base .zd-tag-item.agent {
  padding: 5px 29px 6px 38px;
}
.current_collaborators .zd-tag-item.agent:after,
.user-picker-menu-base .zd-tag-item.agent:after {
  content: "";
  display: block;
  position: absolute;
  right: 18px;
  top: 5px;
  width: 14px;
  height: 14px;
}
html[data-rtl-language="true"] .current_collaborators .zd-tag-item.agent:after,
html[data-rtl-language="true"] .user-picker-menu-base .zd-tag-item.agent:after {
  left: 18px;
  right: auto;
}

.current_collaborators .zd-tag-close,
.user-picker-menu-base .zd-tag-close {
  top: 2px;
  right: 2px;
}
html[data-rtl-language="true"] .current_collaborators .zd-tag-close,
html[data-rtl-language="true"] .user-picker-menu-base .zd-tag-close {
  left: 2px;
  right: auto;
}

.current_collaborators .zd-tag-item {
  border-radius: 15px;
  padding: 0 17px 0 29px;
}
html[data-rtl-language="true"] .current_collaborators .zd-tag-item {
  padding: 0 29px 0 17px;
}
.current_collaborators .zd-tag-item .zd-menu-item-icon {
  overflow: visible;
}
.current_collaborators .zd-tag-item .has-photo {
  top: 1px;
}
.current_collaborators .zd-tag-item .avatar-badge {
  position: relative;
  top: 4px;
  right: 0px;
  margin-left: 5px;
}
html[data-rtl-language="true"] .current_collaborators .zd-tag-item .avatar-badge {
  left: 0px;
  right: auto;
  margin-left: 2px;
  margin-right: 5px;
}
.current_collaborators .zd-tag-item .round-avatar {
  position: relative;
  top: -1px;
}
.current_collaborators .zd-tag-item a {
  position: inherit;
  line-height: 23px;
  /* vertically center */
  padding-right: 3px;
  /* pad away from close 'x' */
}

.user-picker-menu .zd-menu-autofit-mode.zd-menu-root,
.ccs-menu .zd-menu-autofit-mode.zd-menu-root,
.requester-menu .zd-menu-autofit-mode.zd-menu-root {
  max-height: 10000px;
}

.user-picker-menu .zd-menu-panel-root .zd-menu-panel-holder,
.ccs-menu .zd-menu-panel-root .zd-menu-panel-holder,
.requester-menu .zd-menu-panel-root .zd-menu-panel-holder {
  max-height: 10000px;
}

.user-picker-menu .zd-menu-footer,
.ccs-menu .zd-menu-footer,
.requester-menu .zd-menu-footer {
  border-top: 1px solid var(--border-default);
  height: 39px;
  position: absolute;
  left: 0;
  right: 0;
  padding-left: 15px;
  line-height: 30px;
  background-color: var(--background-subtle);
  /* Grey-100 */
  bottom: 0px;
}
html[data-rtl-language="true"] .user-picker-menu .zd-menu-footer,
html[data-rtl-language="true"] .ccs-menu .zd-menu-footer,
html[data-rtl-language="true"] .requester-menu .zd-menu-footer {
  padding-left: 0;
  padding-right: 15px;
}

.user-picker-menu .zd-menu-root.zd-menu-panel-root,
.ccs-menu .zd-menu-root.zd-menu-panel-root,
.requester-menu .zd-menu-root.zd-menu-panel-root {
  overflow: hidden;
  padding-bottom: 40px;
}

.user-picker-menu .add-user,
.ccs-menu .add-user,
.requester-menu .add-user {
  line-height: 36px;
  color: rgb(var(--grey-600));
  /* Grey-600 */
}
html[data-rtl-language="true"] .user-picker-menu .add-user,
html[data-rtl-language="true"] .ccs-menu .add-user,
html[data-rtl-language="true"] .requester-menu .add-user {
  direction: rtl;
  float: right;
}
.user-picker-menu .add-user:hover,
.ccs-menu .add-user:hover,
.requester-menu .add-user:hover {
  color: rgb(var(--blue-600));
}

.user-picker-menu em,
.ccs-menu em,
.requester-menu em {
  font-weight: 600;
  color: var(--foreground-default);
  font-style: normal;
}

.user-picker-menu .zd-menu-item-icon,
.ccs-menu .zd-menu-item-icon,
.requester-menu .zd-menu-item-icon {
  left: 15px;
  width: 32px;
  height: 32px;
  border-radius: 3px;
  overflow: hidden;
}

.user-picker-menu .zd-menu-item,
.ccs-menu .zd-menu-item,
.requester-menu .zd-menu-item {
  padding-left: 47px;
  min-height: 47px;
  position: relative;
}
.user-picker-menu .zd-menu-item img,
.ccs-menu .zd-menu-item img,
.requester-menu .zd-menu-item img {
  width: 32px;
  height: 32px;
}

.user-picker-menu .photo_badge,
.ccs-menu .photo_badge,
.requester-menu .photo_badge {
  position: absolute;
  top: 27px;
  left: 37px;
  width: 14px;
  height: 14px;
}
.user-picker-menu .photo_badge.agent,
.ccs-menu .photo_badge.agent,
.requester-menu .photo_badge.agent {
  border: 3px solid var(--background-default);
  border-radius: 10px;
}

.user-picker-menu .zd-menu-item > a,
.ccs-menu .zd-menu-item > a,
.requester-menu .zd-menu-item > a {
  padding: 5px 15px 6px 41px;
}
html[data-rtl-language="true"] .user-picker-menu .zd-menu-item > a,
html[data-rtl-language="true"] .ccs-menu .zd-menu-item > a,
html[data-rtl-language="true"] .requester-menu .zd-menu-item > a {
  padding: 5px 41px 6px 15px;
}

.user-picker-menu .round-avatar,
.ccs-menu .round-avatar,
.requester-menu .round-avatar {
  position: absolute;
  left: 15px;
  top: 8px;
}
html[data-rtl-language="true"] .user-picker-menu .round-avatar,
html[data-rtl-language="true"] .ccs-menu .round-avatar,
html[data-rtl-language="true"] .requester-menu .round-avatar {
  left: auto;
  right: 15px;
}

.user-picker-menu .zd-menu-footer,
.ccs-menu .zd-menu-footer,
.requester-menu .zd-menu-footer {
  cursor: pointer;
}

.user-picker-menu .zd-menu-item,
.requester-menu .zd-menu-item {
  padding-left: 15px;
}
html[data-rtl-language="true"] .user-picker-menu .zd-menu-item,
html[data-rtl-language="true"] .requester-menu .zd-menu-item {
  padding-left: 0;
  padding-right: 15px;
}
.user-picker-menu .zd-menu-item a,
.requester-menu .zd-menu-item a {
  display: inline-block;
}
.user-picker-menu .zd-menu-item img,
.requester-menu .zd-menu-item img {
  width: auto;
  height: auto;
}

html[data-rtl-language="true"] .user-picker-menu .zd-menu-item {
  padding-left: 0;
  padding-right: 47px;
}

html[data-rtl-language="true"] .user-picker-menu .photo_badge.agent {
  left: auto;
  right: 30px;
}

html[data-rtl-language="true"] .user-picker-menu .zd-menu-item > a {
  padding: 5px 10px 6px 15px;
}

.ticket .form_field.highlight_update:not(.fr-focus).checkbox-field,
.ticket .form_field.highlight_update:not(.fr-focus).requester .zd-searchmenu-base,
.ticket .form_field.highlight_update:not(.fr-focus).problem_id .zd-searchmenu-base,
.ticket .form_field.highlight_update:not(.fr-focus) .zd-tag-menu-root,
.ticket .form_field.highlight_update:not(.fr-focus) .zd-selectmenu-base,
.ticket .form_field.highlight_update:not(.fr-focus) .ui-state-default,
.ticket .form_field.highlight_update:not(.fr-focus) textarea,
.ticket .form_field.highlight_update:not(.fr-focus) > input:not([type="checkbox"]) {
  background-color: var(--background-subtle);
  background-image: none;
  box-shadow: 0 0 0 2px var(--border-primaryEmphasis) !important;
  border-color: transparent;
  border-radius: 2px;
}
.ticket .form_field .suggestions {
  width: 282px;
}
.ticket .form_field .suggestions li.disabled {
  background-color: var(--background-recessed);
  cursor: default;
}
.ticket .form_field .suggestions a {
  padding: 5px 0.4em;
  line-height: 1.3em;
  color: rgb(var(--grey-600));
  /* Grey-600 */
}
.ticket .form_field .suggestions a span {
  color: rgb(var(--grey-400));
}
.ticket .form_field .suggestions a span.suspended {
  color: var(--border-warningEmphasis);
}
.ticket .form_field .zd-state-disabled .zd-selectmenu-base,
.ticket .form_field.ui-state-disabled .token_list,
.ticket .form_field textarea[disabled],
.ticket .form_field input[disabled] {
  cursor: default;
  border-color: var(--border-default);
  background: transparent;
  background-image: none;
}
.ticket .form_field.missing-field-value-warning .zd-selectmenu-base {
  background-image: url(/agent/assets/icons/alerts/warning-5ff93c60eef34c857fdb50ffe8b10d0f.png);
  background-size: 16px;
  background-position-x: calc(100% - 5px);
  background-position-y: 50%;
  background-repeat: no-repeat;
}
.ticket .form_field .zd-state-disabled .zd-selectmenu-base-arrow {
  opacity: 0.2;
}
.ticket .form_field.ui-state-disabled {
  opacity: 1;
}
.ticket .form_field.ui-state-disabled input {
  background: transparent;
  background-image: none !important;
}

.ticket .property_box .delim {
  border-bottom: 1px dotted var(--border-default);
  margin-bottom: 4px;
  padding-bottom: 10px;
}

.ticket .property_box .fields_loading {
  text-align: center;
}

.ticket .property_box .requester.form_field button .ui-button-text {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: 7px 7px;
}

.ticket .property_box .requester.form_field.agent-selection .ui-button-text {
  padding-left: 27px !important;
}

.ticket .property_box .requester.form_field.group-selection .ui-button-text {
  padding-left: 27px !important;
}

.notification {
  padding: 8px 10px;
  text-align: center;
  border: 1px solid;
  border-width: 1px 0;
  margin: 8px 9px 2px 9px;
  width: 293px;
}
.notification.error {
  background-color: var(--background-default);
  border-color: var(--border-dangerEmphasis);
  color: var(--foreground-danger);
}
.notification.error ul {
  margin-left: 0;
}
.notification.error h1 {
  display: none;
}
.notification h4 {
  display: none;
}
.notification p {
  font-size: 14px;
  margin-top: 3px;
}

.collisionnotification-viewing {
  border-color: rgb(var(--azure-400));
  background-color: rgb(var(--azure-300));
  color: rgb(var(--lime-600));
}

.collisionnotification-updated {
  border-color: rgb(var(--azure-400));
  background-color: rgb(var(--azure-300));
  color: rgb(var(--azure-800));
  cursor: pointer;
}
.collisionnotification-updated p.btn {
  font-weight: 600;
  margin: 8px 0 2px 0;
  color: var(--foreground-default);
  /* Grey-800 */
}

/* Style updates for new styling of notifications */
.notification.v2 {
  background-color: var(--background-default);
  border: 1px solid rgb(var(--grey-200));
  /* Grey-200 */
  border-radius: 4px;
  color: var(--foreground-default);
  padding: 15px;
  text-align: left;
  width: 237px;
  margin: 30px 0 0 30px;
}
html[data-rtl-language="true"] .notification.v2 {
  text-align: right;
}
.notification.v2 h4,
.notification.v2 p {
  margin: 0 0 15px 25px;
}
html[data-rtl-language="true"] .notification.v2 h4,
html[data-rtl-language="true"] .notification.v2 p {
  margin: 0 25px 15px 0;
}
.notification.v2 h4 {
  display: block;
  font-size: 12px;
  position: relative;
}
.notification.v2 h4:before {
  background-image: url(/agent/assets/icons/alerts/warning-5ff93c60eef34c857fdb50ffe8b10d0f.png);
  content: "";
  display: block;
  height: 16px;
  margin-right: 10px;
  position: absolute;
  right: 100%;
  width: 16px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .notification.v2 h4:before {
    background-image: url(/agent/assets/icons/alerts/warning_2X-63561a77513cf5df464bfd2572676a82.png);
    background-size: 16px 16px;
  }
}
html[data-rtl-language="true"] .notification.v2 h4:before {
  margin-left: 10px;
  margin-right: 0;
  left: 100%;
  right: auto;
}
.notification.v2 .btn {
  background-color: var(--background-default);
  background-image: none;
  border-color: var(--border-default);
  border-radius: 15px;
  box-shadow: none;
  font-size: 11px;
  margin: 0 0 0 25px;
  padding: 6px 20px 4px;
  text-shadow: none;
}
html[data-rtl-language="true"] .notification.v2 .btn {
  margin: 0 25px 0 0;
}
.notification.v2 .btn:hover {
  background-color: rgb(var(--grey-100));
  /* Grey-100; */
  transition: none;
}
.notification.v2 .btn:focus {
  background-color: rgb(var(--grey-100));
  /* Grey-100; */
}

section.ticket .for_save {
  color: var(--foreground-subtle);
  /* enable if not conditioned on assignability, or if assignable: */
}
section.ticket .for_save:not(.if-assignable),
section.ticket .for_save.assignable {
  display: inline-block;
  color: var(--foreground-subtle);
}
html[data-rtl-language="true"] section.ticket .for_save {
  float: left;
}

/* END ./app/assets/stylesheets/areas/ticket_properties.scss */
/* BEGIN ./app/assets/stylesheets/areas/assignee_widget.scss */
.assignee_widget li.ui-menu-item {
  position: relative;
}
.assignee_widget li.ui-menu-item .icon {
  position: absolute;
  top: 7px;
  left: 7px;
  width: 16px;
  height: 16px;
}
.assignee_widget li.ui-menu-item a {
  color: var(--foreground-default);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  border: none;
  background-repeat: no-repeat;
  background-position: 3px 4px;
}
.assignee_widget li.ui-menu-item a.ui-state-focus {
  background-color: rgb(var(--grey-100));
  /* Grey-100 */
}
.assignee_widget li.ui-menu-item a span.postscript {
  color: rgb(var(--grey-400));
  font-size: 12px;
  padding-left: 6px;
}
.assignee_widget li.ui-menu-item.group > a,
.assignee_widget li.ui-menu-item.agent > a {
  padding-left: 27px;
}

.assignee_widget button .ui-button-text {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: 7px 7px;
}

.assignee_widget.agent-selection .ui-button-text {
  padding-left: 27px !important;
}

.assignee_widget.group-selection .ui-button-text {
  padding-left: 27px !important;
}

/* END ./app/assets/stylesheets/areas/assignee_widget.scss */
/* BEGIN ./app/assets/stylesheets/areas/atwho_autocomplete.scss */
/* Note: Like the rest of the Rich Text Editor, does NOT flip for RTL. */
/* We start with what used to be a vendor file, at.scss, from the "aj.js" (aka atwho) package. */
/* Note: Vendor overrides are not a super great pattern in CSS. */
/* Here, we opt instead to own the styles ourselves. */
/* We are using a forked version after all… */
.atwho-view {
  margin-top: 18px;
  position: absolute;
  top: 0;
  left: 0;
  min-width: 120px;
  max-width: 30%;
  padding: 0;
  z-index: 11110 !important;
  display: none;
  /* Match Garden menu patterns */
  border: 1px solid rgb(var(--grey-400));
  background: var(--background-default);
  border-radius: 4px;
  box-shadow: var(--shadow-large);
  color: var(--foreground-default);
}

.atwho-view .atwho-header .small {
  color: var(--foreground-subtle);
  float: right;
  padding-top: 2px;
  margin-right: -5px;
  font-size: 12px;
  font-weight: normal;
}

.atwho-view .atwho-header:hover {
  cursor: default;
}

.atwho-view .cur {
  background: var(--background-subtle) none;
  box-shadow:
    inset 0 3px 0 var(--border-primaryEmphasis),
    inset 0 -3px 0 var(--border-primaryEmphasis);
}

.atwho-view .cur small {
  color: var(--background-default);
}

.atwho-view strong {
  /* Matches highlight color used elsewhere (e.g. zd-highlight). */
  /* Darker than usual palette for contrast. */
  color: var(--foreground-default);
  /* 600 is as heavy as we go */
  font-weight: 600;
  /* Because some parts are already bold and fairly dark: */
  text-decoration: underline;
}

.atwho-view-ul {
  list-style: none;
  padding: 8px 0;
  margin: 0;
  max-height: 250px;
  overflow-y: auto;
  overflow-x: hidden;
}
html[data-rtl-language="true"] .atwho-view-ul {
  /* This, and the increased specificity, are needed */
  /* thanks to a global RTL rule that sets margin right on ul elements. */
  margin-right: 0;
}

.atwho-view-ul > li {
  display: block;
  padding: 0;
  cursor: pointer;
}

.atwho-view a {
  display: block;
  color: inherit !important;
}

.support-atwho__item {
  height: 37px;
  padding: 8px 20px;
}

.support-atwho__item--person {
  padding: 8px 16px 8px 12px;
}

.support-atwho__person-text {
  display: block;
  padding: 2px 0 0 12px;
}

.support-atwho__person-email {
  color: rgb(var(--grey-600));
  font-size: 12px;
}

/* Emoji variant of results */
.support-atwho__item--emoji {
  height: 30px;
  position: relative;
}

.support-atwho__emoji {
  position: absolute;
  display: block;
  top: 12px;
  left: 12px;
  font-size: 22px;
  line-height: 24px;
  height: 24px;
  width: 24px;
}

.support-atwho__emoji-name {
  display: block;
  padding: 6px 0 0 28px;
}

/* Placeholder variant for {{curent_user.name}} etc. */
.support-atwho__placeholder-code {
  display: block;
  font-weight: 600;
}

.support-atwho__placeholder-name {
  display: block;
}

/* Loading item */
.support-atwho__item--loading {
  display: block;
  height: auto;
  padding: 8px 16px;
  color: rgb(var(--grey-600));
  cursor: default;
}

/* Define some classes just for within atwho menus */
.atwho-view .truncate {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.atwho-view .round-avatar {
  float: left;
}
.atwho-view .avatar-offset {
  margin-top: 2px;
}

/* END ./app/assets/stylesheets/areas/atwho_autocomplete.scss */
/* BEGIN ./app/assets/stylesheets/areas/ticket_markdown.scss */
.deskzen-editor--rich-text-comment,
.markdown_formatting,
.markdown_preview,
.event .comment {
  word-wrap: break-word;
  font-size: 14px;
  line-height: 20px;
  /* This is when the paragraph is indented */
}
.deskzen-editor--rich-text-comment.deskzen-editor--rich-text-comment ul,
.deskzen-editor--rich-text-comment.deskzen-editor--rich-text-comment ol,
.markdown_formatting.deskzen-editor--rich-text-comment ul,
.deskzen-editor--rich-text-comment.markdown_preview ul,
.event .deskzen-editor--rich-text-comment.comment ul,
.markdown_formatting.deskzen-editor--rich-text-comment ol,
.deskzen-editor--rich-text-comment.markdown_preview ol,
.event .deskzen-editor--rich-text-comment.comment ol {
  margin: 0px 15px;
}
.deskzen-editor--rich-text-comment.deskzen-editor--rich-text-comment ul li,
.deskzen-editor--rich-text-comment.deskzen-editor--rich-text-comment ol li,
.markdown_formatting.deskzen-editor--rich-text-comment ul li,
.deskzen-editor--rich-text-comment.markdown_preview ul li,
.event .deskzen-editor--rich-text-comment.comment ul li,
.markdown_formatting.deskzen-editor--rich-text-comment ol li,
.deskzen-editor--rich-text-comment.markdown_preview ol li,
.event .deskzen-editor--rich-text-comment.comment ol li {
  margin: 0;
}
.deskzen-editor--rich-text-comment.markdown_formatting ul,
.deskzen-editor--rich-text-comment.markdown_preview ul,
.event .deskzen-editor--rich-text-comment.comment ul,
.deskzen-editor--rich-text-comment.markdown_formatting ol,
.deskzen-editor--rich-text-comment.markdown_preview ol,
.event .deskzen-editor--rich-text-comment.comment ol,
.markdown_formatting.markdown_formatting ul,
.markdown_preview ul,
.event .comment ul,
.markdown_formatting.markdown_formatting ol,
.markdown_preview ol,
.event .comment ol {
  margin: -8px 0 15px 15px;
}
.event .comment ul,
.event .comment ol {
  margin-right: 15px;
}
.deskzen-editor--rich-text-comment.markdown_formatting ul li,
.deskzen-editor--rich-text-comment.markdown_preview ul li,
.event .deskzen-editor--rich-text-comment.comment ul li,
.deskzen-editor--rich-text-comment.markdown_formatting ol li,
.deskzen-editor--rich-text-comment.markdown_preview ol li,
.event .deskzen-editor--rich-text-comment.comment ol li,
.markdown_formatting.markdown_formatting ul li,
.markdown_preview ul li,
.event .comment ul li,
.markdown_formatting.markdown_formatting ol li,
.markdown_preview ol li,
.event .comment ol li {
  margin: 10px 0;
}
.deskzen-editor--rich-text-comment p,
.deskzen-editor--rich-text-comment blockquote p,
.deskzen-editor--rich-text-comment ul li,
.deskzen-editor--rich-text-comment ol li,
.deskzen-editor--rich-text-comment ul li p,
.deskzen-editor--rich-text-comment ol li p,
.markdown_formatting p,
.markdown_preview p,
.event .comment p,
.markdown_formatting blockquote p,
.markdown_preview blockquote p,
.event .comment blockquote p,
.markdown_formatting ul li,
.markdown_preview ul li,
.event .comment ul li,
.markdown_formatting ol li,
.markdown_preview ol li,
.event .comment ol li,
.markdown_formatting ul li p,
.markdown_preview ul li p,
.event .comment ul li p,
.markdown_formatting ol li p,
.markdown_preview ol li p,
.event .comment ol li p {
  font-size: 14px;
  line-height: 20px;
}
.deskzen-editor--rich-text-comment p,
.markdown_formatting p,
.markdown_preview p,
.event .comment p {
  margin: 0 0 16px 0;
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen-Sans,
    Ubuntu,
    Cantarell,
    "Helvetica Neue",
    Arial,
    sans-serif;
}
.deskzen-editor--rich-text-comment div.zd-comment div:not(.signature) p,
.markdown_formatting div.zd-comment div:not(.signature) p,
.markdown_preview div.zd-comment div:not(.signature) p,
.event .comment div.zd-comment div:not(.signature) p {
  margin: 0;
}
.deskzen-editor--rich-text-comment h1,
.deskzen-editor--rich-text-comment h2,
.deskzen-editor--rich-text-comment h3,
.deskzen-editor--rich-text-comment h4,
.deskzen-editor--rich-text-comment h5,
.deskzen-editor--rich-text-comment h6,
.markdown_formatting h1,
.markdown_preview h1,
.event .comment h1,
.markdown_formatting h2,
.markdown_preview h2,
.event .comment h2,
.markdown_formatting h3,
.markdown_preview h3,
.event .comment h3,
.markdown_formatting h4,
.markdown_preview h4,
.event .comment h4,
.markdown_formatting h5,
.markdown_preview h5,
.event .comment h5,
.markdown_formatting h6,
.markdown_preview h6,
.event .comment h6 {
  color: var(--foreground-default);
  /* Grey-800 */
  font-weight: 600;
  margin: 5px 0 5px;
  text-transform: none;
}
.deskzen-editor--rich-text-comment h1,
.markdown_formatting h1,
.markdown_preview h1,
.event .comment h1 {
  font-size: 23px;
  margin: 5px 0 15px;
  line-height: 27px;
}
.deskzen-editor--rich-text-comment h2,
.markdown_formatting h2,
.markdown_preview h2,
.event .comment h2 {
  font-size: 20px;
  margin: 5px 0 10px;
  line-height: 23px;
}
.deskzen-editor--rich-text-comment h3,
.markdown_formatting h3,
.markdown_preview h3,
.event .comment h3 {
  font-size: 17px;
  line-height: 21px;
}
.deskzen-editor--rich-text-comment h4,
.markdown_formatting h4,
.markdown_preview h4,
.event .comment h4 {
  font-size: 15px;
  line-height: 19px;
}
.deskzen-editor--rich-text-comment h5,
.markdown_formatting h5,
.markdown_preview h5,
.event .comment h5 {
  font-size: 14px;
  line-height: 20px;
}
.deskzen-editor--rich-text-comment h6,
.markdown_formatting h6,
.markdown_preview h6,
.event .comment h6 {
  font-size: 14px;
  line-height: 20px;
  color: rgb(var(--grey-600));
  /* Grey-600 */
}
.deskzen-editor--rich-text-comment blockquote,
.markdown_formatting blockquote,
.markdown_preview blockquote,
.event .comment blockquote {
  padding-left: 10px;
  border-left: 2px solid rgb(var(--grey-400));
  /* Grey-400 */
  margin: 0 0 16px 0;
}
html[data-rtl-language="true"] .deskzen-editor--rich-text-comment blockquote,
html[data-rtl-language="true"] .markdown_formatting blockquote,
html[data-rtl-language="true"] .markdown_preview blockquote,
html[data-rtl-language="true"] .event .comment blockquote,
.event html[data-rtl-language="true"] .comment blockquote {
  padding-left: 0;
  padding-right: 10px;
  border-left: 0;
  border-right: 2px solid rgb(var(--grey-400));
  /* Grey-400 */
}
.deskzen-editor--rich-text-comment blockquote p,
.markdown_formatting blockquote p,
.markdown_preview blockquote p,
.event .comment blockquote p {
  color: rgb(var(--grey-600));
  font-weight: 400;
}
.deskzen-editor--rich-text-comment blockquote li,
.markdown_formatting blockquote li,
.markdown_preview blockquote li,
.event .comment blockquote li {
  color: rgb(var(--grey-600));
}
.deskzen-editor--rich-text-comment ul,
.markdown_formatting ul,
.markdown_preview ul,
.event .comment ul {
  padding-left: 15px;
  list-style: disc;
}
.event .comment ul {
  padding-right: 15px;
}
.deskzen-editor--rich-text-comment ul li,
.markdown_formatting ul li,
.markdown_preview ul li,
.event .comment ul li {
  font-size: 14px;
}
.deskzen-editor--rich-text-comment ul li p,
.markdown_formatting ul li p,
.markdown_preview ul li p,
.event .comment ul li p {
  margin: 0;
}
.deskzen-editor--rich-text-comment ol,
.markdown_formatting ol,
.markdown_preview ol,
.event .comment ol {
  padding-left: 15px;
}
.event .comment ol {
  padding-right: 15px;
}
.deskzen-editor--rich-text-comment ol li,
.markdown_formatting ol li,
.markdown_preview ol li,
.event .comment ol li {
  font-size: 14px;
}
.deskzen-editor--rich-text-comment ol li p,
.markdown_formatting ol li p,
.markdown_preview ol li p,
.event .comment ol li p {
  margin: 0;
}
.deskzen-editor--rich-text-comment img,
.markdown_formatting img,
.markdown_preview img,
.event .comment img {
  /* This will stop huge images being so huge, and */
  /* instead scale to the size of the container. */
  max-width: 100%;
}

/* <code/> is labeled as "code fragment" in the UI */
.deskzen-editor--rich-text-comment code,
  .markdown_formatting code,
  .markdown_preview code,
  .event .comment code,
  .zd-comment.zd-comment-pre-styled code /* EM-5185 */ {
  margin: 0 2px;
  padding: 0 5px;
  white-space: pre-wrap;
  border: 1px solid rgb(var(--grey-200));
  /* Grey-200 */
  background-color: rgb(var(--grey-100));
  /* Grey-100 */
  border-radius: 3px;
  font-family: Consolas, "Liberation Mono", Menlo, "Bitstream Vera Sans Mono", Courier, monospace;
}

/* Preformatted text <pre/> is labeled as "code block" in the UI */
.deskzen-editor--rich-text-comment pre,
  .markdown_formatting pre,
  .markdown_preview pre,
  .event .comment pre,
  .zd-comment.zd-comment-pre-styled pre /* EM-5185 */ {
  background-color: rgb(var(--grey-100));
  /* Grey-100 */
  border: 1px solid rgb(var(--grey-400));
  /* Grey-400 */
  line-height: 19px;
  padding: 6px 10px;
  border-radius: 3px;
  margin: 15px 0;
  white-space: pre-wrap;
}

html[data-rtl-language="true"] .deskzen-editor--rich-text-comment pre,
html[data-rtl-language="true"] .markdown_formatting pre,
html[data-rtl-language="true"] .markdown_preview pre,
html[data-rtl-language="true"] .event .comment pre,
.event html[data-rtl-language="true"] .comment pre {
  direction: ltr;
  text-align: left;
}
.deskzen-editor--rich-text-comment pre code,
.markdown_formatting pre code,
.markdown_preview pre code,
.event .comment pre code {
  font-family: Consolas, "Liberation Mono", Menlo, "Bitstream Vera Sans Mono", Courier, monospace;
  background: none;
  white-space: pre-wrap;
  word-break: break-word;
  border: 0;
  margin: 0;
  padding: 0;
}
.deskzen-editor--rich-text-comment pre p,
.markdown_formatting pre p,
.markdown_preview pre p,
.event .comment pre p {
  margin: 0;
}

.rich_text .event .comment blockquote {
  margin: 0;
}
.rich_text .event .comment blockquote p {
  margin: 0;
}

.comment_input .btn.markdown_preview_toggle {
  float: right;
  margin-right: 0;
}
html[data-rtl-language="true"] .comment_input .btn.markdown_preview_toggle {
  float: left;
  margin-left: 0;
}
.comment_input .btn.markdown_preview_toggle.active:after {
  content: none;
}

.markdown_preview {
  border: 1px solid var(--border-default);
  border-bottom: none !important;
  border-radius: 3px 3px 0 0 !important;
  min-height: 38px;
  padding: 7px 8px 10px 8px !important;
  margin: 0 !important;
}

.markdown_info {
  border: 1px solid var(--border-default);
  border-top: 1px dotted var(--border-default);
  border-radius: 0 0 3px 3px;
  padding: 7px 8px;
  margin-bottom: 5px;
  background-color: rgb(var(--grey-100));
  /* Grey-100 */
  color: rgb(var(--grey-600));
}

html[lang|="ja"] .markdown_formatting p,
html[lang|="ja"] .markdown_preview p,
html[lang|="ja"] .event .comment p,
.event html[lang|="ja"] .comment p,
html[lang|="ja"] .markdown_preview p,
html[lang|="ja"] .event .comment * {
  font-family: inherit;
}

/* END ./app/assets/stylesheets/areas/ticket_markdown.scss */
/* BEGIN ./app/assets/stylesheets/areas/ticket_conversation.scss */
/* Toggle tab-list based on viewport width */
@media (max-width: 955px) {
  .pane:not(.with_apps_pane):not(.with_customer_context_pane) .conversation .c-tab__list__dropdown {
    display: block;
  }
  .pane:not(.with_apps_pane):not(.with_customer_context_pane) .conversation .c-tab__list {
    display: none;
  }
}

@media (max-width: 1325px) {
  .with_customer_context_pane .conversation .c-tab__list__dropdown,
  .with_apps_pane .conversation .c-tab__list__dropdown {
    display: block;
  }
  .with_customer_context_pane .conversation .c-tab__list,
  .with_apps_pane .conversation .c-tab__list {
    display: none;
  }
}

@media (min-width: 956px) {
  .pane:not(.with_apps_pane):not(.with_customer_context_pane) .conversation .c-tab__list__dropdown {
    display: none;
  }
  .pane:not(.with_apps_pane):not(.with_customer_context_pane) .conversation .c-tab__list {
    display: block;
  }
}

@media (min-width: 1326px) {
  .with_customer_context_pane .conversation .c-tab__list__dropdown,
  .with_apps_pane .conversation .c-tab__list__dropdown {
    display: none;
  }
  .with_customer_context_pane .conversation .c-tab__list,
  .with_apps_pane .conversation .c-tab__list {
    display: block;
  }
}

.section.ticket {
  position: absolute;
  top: 0;
  bottom: 0px;
  left: 0;
  right: 0;
  overflow: auto;
  color-scheme: var(--color-scheme);
}
.section.ticket .pane_body {
  margin-top: 19px;
}
.use_standalone_composer .section.ticket .pane_body {
  margin-top: 12px;
}
html[data-rtl-language="true"] .section.ticket .pane_body {
  direction: rtl;
}
.section.ticket .polaris-filter-and-notices {
  margin-top: 0;
  transition: all 0.5s ease 0s;
  opacity: 100;
}
.section.ticket .polaris-filter-and-notices.collapse {
  top: 60px;
  opacity: 0;
}
.section.ticket .polaris-filter-and-notices .notice {
  margin-top: 0;
  margin-bottom: 3px;
}
.section.ticket .tab-controls-container {
  border-bottom: 1px solid var(--border-default);
  display: flex;
}
.section.ticket .tab-controls-container.polaris-filter {
  margin-top: -7px;
}
.section.ticket .conversation-nav {
  display: flex;
  left: 77px;
  float: left;
  padding-bottom: 7px;
}
html[data-rtl-language="true"] .section.ticket .conversation-nav {
  left: auto;
  right: 77px;
  float: right;
}
.section.ticket .conversation-nav:after {
  content: "";
  color: var(--border-default);
  /* Grey-300 */
  display: table-cell;
  padding: 3px 0 0 30px;
  border-right: 1px solid var(--border-default);
  width: 1px;
  height: 16px;
}
html[data-rtl-language="true"] .section.ticket .conversation-nav:after {
  padding: 3px 30px 0 0;
  border-left: 1px solid var(--border-default);
  border-right: none;
}
.section.ticket .conversation-nav .dropdown-toggle:after {
  content: "";
  background-color: var(--foreground-default);
  mask-image: url(/agent/assets/icons/14-chevron-c17f2575323bf5fb21969e6559921db2.svg);
  border: none;
  height: 14px;
  margin: 0;
  opacity: 0.4;
  top: auto;
  width: 14px;
  display: inline-block;
}
.section.ticket .event-history.conversation {
  display: none;
}
.section.ticket .event-history.events {
  display: table-cell;
  padding-left: 119px;
  padding-bottom: 7px;
  color: var(--foreground-subtle);
}
html[data-rtl-language="true"] .section.ticket .event-history.events {
  padding-left: 0;
  padding-right: 119px;
}
.section.ticket .event-nav {
  display: table;
  position: relative;
  left: 88px;
}
html[data-rtl-language="true"] .section.ticket .event-nav {
  left: auto;
  right: 88px;
}
.section.ticket .event-nav .c-tab__list {
  padding-left: 30px;
  position: relative;
  border-bottom: none;
}
html[data-rtl-language="true"] .section.ticket .event-nav .c-tab__list {
  padding-left: 0;
  padding-right: 30px;
}
.section.ticket .event-nav .c-tab__list__item.allEvents {
  position: absolute;
  right: 30px;
  bottom: 0px;
  background: var(--background-default);
  margin-right: 0;
}
.section.ticket .event-nav .c-tab__list__item.allEvents:hover,
.section.ticket .event-nav .c-tab__list__item.allEvents.is-selected {
  bottom: -1px;
}
html[data-rtl-language="true"] .section.ticket .event-nav .c-tab__list__item.allEvents {
  left: 30px;
  right: auto;
}
.section.ticket .event-nav .c-tab__list__item.privateComments[data-count="0"],
.section.ticket .event-nav .c-tab__list__item.publicComments[data-count="0"] {
  display: none;
}
.section.ticket .event-nav .c-tab__list__item.privateConversation[data-count="0"],
.section.ticket .event-nav .c-tab__list__item.publicConversation[data-count="0"] {
  display: none;
}
.section.ticket .event-nav .c-tab__list__dropdown {
  padding-bottom: 7px;
  padding-left: 30px;
}
.section.ticket .event-nav .c-tab__list__dropdown .c-tab__pill {
  display: inline-block;
  color: var(--background-default);
  background-color: var(--background-primaryEmphasis);
  border-color: var(--border-primaryEmphasis);
}
.section.ticket .event-nav .c-tab__list__dropdown .dropdown-toggle:after {
  content: "";
  background-color: var(--foreground-default);
  mask-image: url(/agent/assets/icons/14-chevron-c17f2575323bf5fb21969e6559921db2.svg);
  border: none;
  height: 14px;
  margin: 0;
  opacity: 0.4;
  top: auto;
  width: 14px;
  display: inline-block;
}
.section.ticket .event-nav.events {
  display: none;
}
.section.ticket .event-container {
  position: relative;
}
html[data-rtl-language="true"] .section.ticket .event-container .body,
html[data-rtl-language="true"] .section.ticket .event-container .header {
  right: 55px;
}
.section.ticket.new_ticket {
  padding: 10px 20px 0;
}
.section.ticket.new_ticket .event {
  border: none;
  padding: 0;
}
.section.ticket.new_ticket label {
  text-align: left;
  font-weight: 600;
  margin: 12px 0 6px 0;
}
html[data-rtl-language="true"] .section.ticket.new_ticket label {
  text-align: right;
}
.section.ticket.new_ticket .header label {
  float: left;
  margin: 0;
  padding: 5px 5px 5px 0;
}
html[data-rtl-language="true"] .section.ticket.new_ticket .header label {
  float: right;
  padding: 5px 0 5px 5px;
}
.section.ticket.new_ticket textarea {
  box-sizing: border-box;
  margin-bottom: 6px;
  width: 100%;
}
.section.ticket.new_ticket input {
  text-align: left;
}
html[data-rtl-language="true"] .section.ticket.new_ticket input {
  text-align: right;
}
.section.ticket.new_ticket input[type="file"] {
  width: auto;
}
.section.ticket .notice {
  border-bottom: 1px dotted var(--border-subtle);
  line-height: 18px;
  padding: 10px 29px;
  margin: -19px -12px 20px -12px;
  background: var(--background-default);
  /* TODO Is this in use? */
}
.section.ticket .notice.satisfaction a.btn {
  color: var(--foreground-default);
  /* Grey-800 */
  font-weight: bold;
}
.section.ticket .notice .incorrect-prediction {
  float: right;
}
.section.ticket .notice p.pre {
  color: var(--foreground-default);
  /* Grey-800 */
  margin: 3px 0 3px 0;
  font-size: 14px;
}
.section.ticket .notice p.pre .rating {
  margin-left: 0px;
}
.section.ticket .notice .rating {
  color: var(--background-default);
  margin-left: 3px;
  padding: 4px 8px;
  border-radius: 3px;
  background-color: var(--background-successEmphasis);
}
.section.ticket .notice .rating.poor {
  background-color: var(--background-dangerEmphasis);
}
.section.ticket .notice td .rating {
  margin-left: 0px;
}
.section.ticket .notice .rating-predicted {
  margin-left: 5px;
}
.section.ticket .notice a {
  color: var(--foreground-primary);
  text-decoration: none;
}
html[data-rtl-language="true"] .section.ticket .notice a {
  direction: ltr;
  unicode-bidi: bidi-override;
}
.section.ticket .notice h4 {
  font-size: inherit;
}
.section.ticket .notice .information {
  margin: 15px 0 0 0;
  padding: 0 0 0 29px;
  min-height: 19px;
}
.section.ticket .notice .toggle {
  cursor: pointer;
}
.section.ticket .notice .control {
  float: right;
  margin-top: 4px;
  text-indent: -2000px;
  width: 10px;
  height: 10px;
  transform: rotate(180deg);
}
.section.ticket .notice .content {
  display: none;
}
.section.ticket .satisfaction {
  line-height: 30px;
  position: relative;
}
.section.ticket .satisfaction .pre {
  color: var(--foreground-default);
  /* Grey-800 */
  margin: 6px 0 3px 13px;
  font-size: 14px;
}
.section.ticket .satisfaction .sat-label {
  display: inline-block;
  color: var(--foreground-default);
  /* Grey-800 */
  font-weight: bold;
  margin-right: 20px;
}
html[data-rtl-language="true"] .section.ticket .satisfaction .sat-label {
  margin-left: 20px;
  margin-right: 0;
}
.section.ticket .satisfaction .row-fluid [class*="span"] {
  min-height: 25px;
}
.section.ticket .satisfaction .contextual-tooltip {
  margin-left: 4px;
}
html[data-rtl-language="true"] .section.ticket .satisfaction .contextual-tooltip {
  margin-left: 0;
  margin-right: 4px;
}
.section.ticket .satisfaction .contextual-tooltip .tip {
  right: 0;
}
.section.ticket .audits {
  font-size: 14px;
}
.section.ticket .audits.reversed {
  display: flex;
  flex-direction: column-reverse;
  border-top: none;
}
.section.ticket .audits > :first-child,
.section.ticket .audits.reversed .event {
  border-top: none;
}
.section.ticket .audits:not(.show-audits) .client,
.section.ticket .audits:not(.show-audits) .via,
.section.ticket .audits:not(.show-audits) .make-private {
  display: none;
}
.section.ticket .audits:not(.show-audits) .twitter:hover {
  background-color: var(--background-subtle);
  /* Grey-100 */
}
.section.ticket .audits:not(.show-audits) .twitter:hover .twitter-action.follow,
.section.ticket .audits:not(.show-audits) .twitter:hover .twitter-action.unfollow {
  visibility: visible;
}
.section.ticket .audits:not(.show-audits) .twitter:hover .tweet-footer-right {
  display: inline-block;
}
.section.ticket .email-deliverability-warnings {
  display: inline-block;
  margin-bottom: 10px;
}
.section.ticket .email-deliverability-warnings .warning-icon {
  width: 16px;
  height: 16px;
}
.section.ticket .email-deliverability-warnings .warning-icon path {
  stroke: var(--border-warningEmphasis);
}
.section.ticket .email-deliverability-warnings .warning-icon circle {
  fill: var(--background-warningEmphasis);
}
.section.ticket .email-deliverability-warnings .warning-text {
  position: relative;
  top: -1px;
}

.probability-bar {
  display: inline-block;
  width: 30px;
  height: 12px;
  background-color: rgb(var(--grey-200));
  /* Grey-200 */
  vertical-align: middle;
  line-height: 1;
  position: relative;
  border-radius: 3px;
  overflow: hidden;
  margin: 0px 5px 3px 0px;
}
html[data-rtl-language="true"] .probability-bar {
  margin: 0px 0px 3px 5px;
}
.probability-bar.left {
  margin-left: 0px;
}
.probability-bar .radius,
.probability-bar .radius-l,
.probability-bar .radius-r {
  display: inline-block;
  position: absolute;
  width: 3px;
  height: 100%;
  background-color: transparent;
}
.probability-bar .radius-l {
  left: 0;
  border-radius: 3px 0px 0px 3px;
}
.probability-bar .radius-r {
  right: 0;
  border-radius: 0px 3px 3px 0px;
}
.probability-bar .probability-bar-value {
  display: inline-block;
  width: 0%;
  height: 100%;
}
.probability-bar .probability-bar-value--00 {
  background-color: #da3517;
}
.probability-bar .probability-bar-value--10 {
  background-color: #ea5c24;
}
.probability-bar .probability-bar-value--20 {
  background-color: #ed8721;
}
.probability-bar .probability-bar-value--30 {
  background-color: #fdb83a;
}
.probability-bar .probability-bar-value--40 {
  background-color: #f9d748;
}
.probability-bar .probability-bar-value--50 {
  background-color: #ccd344;
}
.probability-bar .probability-bar-value--60 {
  background-color: #abc93f;
}
.probability-bar .probability-bar-value--70 {
  background-color: #90bc24;
}
.probability-bar .probability-bar-value--80 {
  background-color: #77b212;
}
.probability-bar .probability-bar-value--90 {
  background-color: #60a308;
}

.probability-bar--working {
  background: url(/agent/assets/icons/spinners/dotted_bar-b0db0a3419081443c8a7ae0747b9937d.gif) no-repeat 7px 3px;
  background-size: 16px 6px;
}
.probability-bar--working .probability-bar-value {
  visibility: hidden;
}

.prediction-survey__wrap {
  position: relative;
}

.prediction-survey__toggle {
  position: absolute;
  right: 0px;
  top: -26px;
}
html[data-rtl-language="true"] .prediction-survey__toggle {
  left: 0px;
  right: auto;
}

.prediction-survey__inner textarea {
  margin: 10px 0px;
}

.prediction-survey__send {
  float: right;
  min-width: 70px;
}

.prediction-survey__working {
  display: none;
  float: right;
  margin-right: 8px;
}
.prediction-survey__working--saving {
  display: inline-block;
}
.prediction-survey__working__text {
  margin: 5px;
  font-size: 12px;
  font-weight: 600;
  color: rgb(var(--kale-700));
  /* Kale-700 */
  text-align: center;
}
.prediction-survey__working__loader {
  background: url(/agent/assets/icons/spinners/dotted_bar-b0db0a3419081443c8a7ae0747b9937d.gif) no-repeat 7px 3px;
  background-size: 16px 6px;
  display: inline-block;
  width: 25px;
  height: 10px;
}

.event {
  border-left: 2px solid transparent;
  border-top: 1px solid rgb(var(--grey-200));
  padding: 24px 0 12px 0;
  position: relative;
  box-sizing: border-box;
}
.event.regular:hover .header .meta .comment_menu .dropdown-menu {
  visibility: visible;
}
.event.regular:hover .header .meta .comment_menu .dropdown-toggle {
  border-color: var(--border-default);
}
.event.regular:hover .header .meta .comment_menu .dropdown-toggle .arrow_down {
  visibility: visible;
}
.event.collapse-signatures .comment .zd-comment:not(.zd-comment-pre-styled) .signature,
.event.collapse-signatures .comment .signature {
  position: relative;
  display: none;
  flood-color: var(--foreground-default);
  /* Grey-800 */
  margin-top: 20px;
}
.event.collapse-signatures .comment .zd-comment:not(.zd-comment-pre-styled) .signature.expanded,
.event.collapse-signatures .comment .signature.expanded {
  display: block;
}
.event.collapse-signatures .comment .collapse-signature {
  display: block;
  width: 15px;
  height: 15px;
  margin-top: 10px;
  border-radius: 2px;
}
.event.collapse-signatures .comment .collapse-signature:before {
  content: "...";
  display: block;
  width: 15px;
  height: 15px;
  line-height: 7px;
  text-align: center;
  cursor: pointer;
  font-size: 14px;
}
.event.collapse-signatures .comment .collapse-signature:hover {
  background-color: rgb(var(--grey-300));
  /* Grey-300 */
}
.event .user_photo,
.event .user_assume_photo {
  position: absolute;
  left: 16px;
}
html[data-rtl-language="true"] .event .user_photo,
html[data-rtl-language="true"] .event .user_assume_photo {
  left: auto;
  right: 16px;
}
.event .user_photo .agent,
.event .user_assume_photo .agent {
  position: relative;
  top: -15px;
  left: 29px;
}
.event .content {
  margin: 0 20px 0 75px;
}
.new_ticket .event .content {
  margin: 0 0 0 75px;
}
html[data-rtl-language="true"] .event .content {
  margin: 0 75px 0 20px;
}
.event .body {
  line-height: 18px;
}
.event .body .client,
.event .body > .via {
  font-size: 12px;
  color: rgb(var(--grey-600));
  margin-bottom: 16px;
}
.event .body .client ul,
.event .body > .via ul {
  margin: 0;
}
.event .comment {
  position: relative;
  overflow: auto;
}
.event .comment .zd-comment:not(.zd-comment-pre-styled) .signature {
  margin-top: 14px;
}
.event .comment .zd-comment:not(.zd-comment-pre-styled) table {
  border-collapse: collapse;
  font-size: 1em;
  width: 100%;
}
.event .comment .zd-comment:not(.zd-comment-pre-styled) table td,
.event .comment .zd-comment:not(.zd-comment-pre-styled) table th {
  padding: 5px;
  border: 1px solid var(--border-default);
  vertical-align: top;
}
.event .comment .zd-comment.zd-comment-pre-styled:after {
  content: "";
  clear: both;
  display: block;
}
.event .comment .zd-comment.zd-comment-pre-styled img {
  /* Allows images to resize proportionally */
  object-fit: contain;
  max-width: 100%;
  max-height: 100%;
  height: auto;
}
.event .comment .zd-comment.zd-comment-pre-styled span {
  line-height: normal;
}
.event .comment .zd-comment.zd-comment-pre-styled table td {
  /* Restore default table behavior */
  vertical-align: middle;
  /* Prevents images inside TD to be resized by other TD with undefined width. */
}
.event .comment .zd-comment.zd-comment-pre-styled table td img {
  max-width: none;
}
.event .comment .zd-comment.zd-comment-pre-styled table[height="100%"] {
  height: initial;
}
.event .comment .zd-comment.zd-comment-pre-styled table[align="left"] {
  float: none;
}
.event .comment .zd-comment.zd-comment-pre-styled sup {
  vertical-align: initial;
  font-size: 10px;
}
.event .comment .zd-comment.zd-comment-pre-styled p {
  /* Avoid MsoListParagraph's bullets to be "text-indent:-.25in;" */
  text-indent: 0 !important;
  /* Same as "View original" HTML version (overrides $paragraph-margin) */
  margin: 0 0 9px 0;
}

.event .header {
  padding: 0 0 2px 0;
  font-size: 12px;
}
.event .header:not(.comment-actions):not(.bulk-comment.content.header) {
  max-width: calc(100% - 90px);
}
.event .header .actor {
  display: flex;
  /* Required for parentheses to display propertly in RTL languages */
}
.event .header .actor a {
  display: inline-block;
}
.event .header .actor time {
  color: rgb(var(--grey-600));
  margin: 0 0 0 5px;
  padding-top: 2px;
}
html[data-rtl-language="true"] .event .header .actor time {
  margin: 1px 5px 0 0;
}
.event .header .actor .assign_to {
  display: inline-block;
  padding-left: 4px;
  padding-top: 2px;
}
html[data-rtl-language="true"] .event .header .actor .assign_to {
  padding-left: 0;
  padding-right: 4px;
}
.event .header .actor .name {
  font-weight: 600;
  font-size: 14px;
  max-width: 400px;
  overflow: hidden;
  display: inline-block;
}
.event .header .actor .name a {
  overflow: hidden;
  width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--foreground-default);
  /* Grey-800 */
}
.event.email .header .meta .comment_menu .dropdown-toggle {
  margin-top: -2px;
}
.event .header .meta {
  display: inline-block;
  position: absolute;
  right: 16px;
  top: 18px;
}
html[data-rtl-language="true"] .event .header .meta {
  left: 16px;
  right: auto;
}
.event .header .meta .comment_menu {
  display: inline-block;
  margin-left: 12px;
  position: relative;
  vertical-align: middle;
}
html[data-rtl-language="true"] .event .header .meta .comment_menu {
  margin-left: 0;
  margin-right: 12px;
}
.event .header .meta .comment_menu .dropdown-toggle {
  border-color: var(--background-default);
  padding: 2px 2px;
  line-height: 1;
  outline: none;
}
.event .header .meta .comment_menu .dropdown-toggle .arrow_down {
  visibility: hidden;
  display: inline-block;
  content: "";
  width: 8px;
  height: 4px;
  margin: 6px 5px;
  background: url(/agent/assets/components/ico_arrow-d3aeac90571f859f6c801b3d5f2d6fb3.png) no-repeat center center;
  border: 0;
}
.event .header .meta .comment_menu .dropdown-menu {
  margin-top: 5px;
  width: auto;
  right: 0;
  left: auto;
  z-index: 1001;
  visibility: hidden;
}
html[data-rtl-language="true"] .event .header .meta .comment_menu .dropdown-menu {
  left: 0;
  right: auto;
}
.event .header .meta .comment_menu .dropdown-menu li.divider {
  margin-bottom: 10px;
  background-color: rgb(var(--grey-200));
  /* Grey-200 */
  height: 2px;
}
.event .header .meta .comment_menu .icon.untrusted_flag {
  background: url(/agent/assets/components/warning-0b0fe4b9f3fb5e51e847e786823e28fe.svg) no-repeat;
  display: inline-block;
  height: 20px;
  width: 20px;
  background-size: 16px;
}
.event .header .meta .comment_menu .flags .flag {
  position: relative;
}
.event .header .meta .comment_menu .flags .flag a {
  padding: 10px 20px;
  margin: 0;
  white-space: normal;
}
.event .header .meta .comment_menu .flags .flag .icon {
  position: absolute;
  left: 20px;
  top: 15px;
}
html[data-rtl-language="true"] .event .header .meta .comment_menu .flags .flag .icon {
  left: auto;
  right: 14px;
}
.event .header .meta .comment_menu .flags .flag .reason {
  margin-left: 20px;
  font-size: 13px;
  margin-top: 4px;
  width: auto;
  word-wrap: break-word;
}
html[data-rtl-language="true"] .event .header .meta .comment_menu .flags .flag .reason {
  margin-left: 0;
  margin-right: 20px;
}
.event .header .meta .comment_menu .flags .flag .reason:after {
  content: "";
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url(/agent/assets/components/external-link-317df3880636286b779f02c6e8d1cbc8.svg) no-repeat bottom;
  background-size: 11px;
}
.event .header .meta .comment_menu .flags .flag .links a {
  margin-left: 10px;
  margin-right: 10px;
  padding-left: 10px;
  padding-right: 10px;
}
.event .header .meta .channel {
  display: inline-block;
  width: 24px;
  right: 14px;
  height: 21px;
  opacity: 0.4;
  vertical-align: middle;
}
html[data-rtl-language="true"] .event .header .meta .channel {
  left: 14px;
  right: auto;
}
.event .header > span {
  margin-right: 4px;
}
html[data-rtl-language="true"] .event .header > span {
  margin-right: 0;
  margin-left: 4px;
  float: right;
}
.event .recipients {
  color: rgb(var(--grey-600));
  margin-bottom: 10px;
}
.event .recipients a {
  color: rgb(var(--grey-600));
  text-decoration: underline;
}
.event .recipients .recipient-list {
  margin-bottom: 2px;
}
.event .recipients span {
  display: inline-block;
}
.event .recipients .cc-recipients {
  display: none;
}
.event .recipients .cc-recipients .cc-header {
  display: inline-block;
  vertical-align: top;
}
.event .recipients .cc-recipients ul {
  display: inline-block;
  margin-left: 0;
}
html[data-rtl-language="true"] .event .recipients .cc-recipients ul {
  margin-left: auto;
  margin-right: 0;
}
.event .recipients .cc-recipients ul li {
  margin-bottom: 2px;
}
.event .audit-events {
  margin: 0 0 16px 0;
  background: rgb(var(--grey-100));
  border-radius: 5px;
  padding: 8px 14px;
}
html[data-rtl-language="true"] .event .audit-events {
  direction: rtl;
}
.event .audit-events li {
  list-style-type: none;
  line-height: 17px;
  padding: 6px 0;
}
.event .audit-events li .event_share {
  display: none;
}
.event .audit-events li .event_change {
  opacity: 0.3;
}
.event .audit-events li.Notification .event_change,
.event .audit-events li.SmsNotification .event_change,
.event .audit-events li.Cc .event_change,
.event .audit-events li.SmsEvent .event_change,
.event .audit-events li.Push .event_change,
.event .audit-events li.Tweet .event_change,
.event .audit-events li.FollowerNotification .event_change {
  display: none;
}
.event .audit-events li.Notification .event_share,
.event .audit-events li.SmsNotification .event_share,
.event .audit-events li.Cc .event_share,
.event .audit-events li.SmsEvent .event_share,
.event .audit-events li.Push .event_share,
.event .audit-events li.Tweet .event_share,
.event .audit-events li.FollowerNotification .event_share {
  display: inline-block;
}
.event .audit-events li .via {
  color: rgb(var(--grey-600));
}
.event .audit-events .info {
  padding-left: 19px;
  margin-top: -18px;
}
html[data-rtl-language="true"] .event .audit-events .info {
  padding-left: 0;
  padding-right: 19px;
}
.event .audit-events .info label {
  font-weight: 600;
  color: var(--foreground-default);
  display: inline;
  cursor: default;
}
.event del,
.event .previous-value {
  color: rgb(var(--grey-600));
}
.event .truncation-message {
  font-style: italic;
}
.event .outer-player-container {
  display: flex;
  min-height: 40px;
  margin-bottom: 20px;
}
html[data-rtl-language="true"] .event .outer-player-container {
  direction: rtl;
}
.event .player-loading {
  background: url(/agent/assets/icons/spinners/dotted_bar-b0db0a3419081443c8a7ae0747b9937d.gif) no-repeat;
  background-size: 35px 12px;
  width: 271px;
  background-position: left center;
  height: 40px;
}
html[data-rtl-language="true"] .event .player-loading {
  background-position: right center;
}
.event .hidden {
  display: none !important;
}
.event .player-container {
  display: flex;
  align-items: center;
  justify-content: left;
}
.event .recording_not_available {
  background-color: rgb(var(--grey-100));
  /* Grey-100 */
  color: rgb(var(--grey-500));
  display: flex;
  align-items: center;
  text-align: center;
  min-width: 271px;
  min-height: 40px;
}
.event .recording_not_available span {
  flex: 1;
  padding-left: 12px;
  padding-right: 12px;
  text-transform: lowercase;
}
.event .delete-recording {
  color: rgb(var(--red-400));
  margin-left: 20px;
}
.event .delete-recording:hover {
  text-decoration: underline;
}
.event .call_statistics {
  margin-top: 5px;
  margin-bottom: 20px;
}
.event .call_statistics h4 {
  text-decoration: underline;
  font-size: 14px;
}
.event .call_statistics dt,
.event .call_statistics dd {
  display: inline;
}
.event .call_statistics dd {
  margin-left: 0;
}
.event .call_statistics dd:after {
  content: "\a";
  white-space: pre;
}
html[data-rtl-language="true"] .event .call_statistics h4 {
  text-decoration: underline;
  font-size: 14px;
  direction: rtl;
}
html[data-rtl-language="true"] .event .call_statistics dl {
  overflow: hidden;
}
html[data-rtl-language="true"] .event .call_statistics dt,
html[data-rtl-language="true"] .event .call_statistics dd {
  margin-top: 0.5em;
}
html[data-rtl-language="true"] .event .call_statistics dt {
  clear: both;
  float: right;
  width: auto;
}
html[data-rtl-language="true"] .event .call_statistics dd {
  float: right;
  margin-right: 0.5em;
  width: auto;
}
.event.is-new {
  background-color: var(--background-subtle);
  border-left-color: rgb(var(--blue-400));
}
.event.is-new .is_new_flag {
  color: rgb(var(--blue-400));
  line-height: 20px;
  padding: 0 0 0 5px;
}
html[data-rtl-language="true"] .event.is-new .is_new_flag {
  padding: 0 5px 0 0;
}
.event:not(.is-public) .comment {
  background-color: rgb(var(--lemon-100));
  border: 1px solid rgb(var(--lemon-200));
  padding: 12px 16px 14px;
  margin-bottom: 16px;
  border-radius: 3px;
  color: var(--foreground-default);
  /* Grey-800 */
}
.event:not(.is-public) .comment .zd-comment {
  margin-bottom: 0px;
}
.event .attachments-container {
  margin-top: 16px;
}

/* END ./app/assets/stylesheets/areas/ticket_conversation.scss */
/* BEGIN ./app/assets/stylesheets/areas/users.scss */
.user_photo_editable .dropdown-menu {
  margin: 5px 0 0 0;
}

.user_photo,
.user_assume_photo {
  position: relative;
  float: left;
}
html[data-rtl-language="true"] .user_photo,
html[data-rtl-language="true"] .user_assume_photo {
  float: right;
}
.user_photo .profile,
.user_assume_photo .profile {
  width: 40px;
  height: 40px;
  border-radius: 4px;
}
.user_photo.large-photo,
.large-photo.user_assume_photo {
  margin: 0px;
}
.user_photo.large-photo .profile,
.large-photo.user_assume_photo .profile {
  width: 55px;
  height: 55px;
}
.user_photo.large-photo .photo_badge,
.large-photo.user_assume_photo .photo_badge {
  top: 47px;
  left: 44px;
}
.user_photo .photo_badge,
.user_assume_photo .photo_badge {
  border: 3px solid var(--background-default);
  border-radius: 10px;
  display: none;
  position: absolute;
  top: 33px;
  left: 30px;
  width: 14px;
  height: 14px;
}
html[data-rtl-language="true"] .user_photo .photo_badge,
html[data-rtl-language="true"] .user_assume_photo .photo_badge {
  left: auto;
  right: 30px;
}
.user_photo.agent .photo_badge,
.agent.user_assume_photo .photo_badge {
  display: block;
}
.user_photo.shared .photo_badge,
.shared.user_assume_photo .photo_badge {
  display: block;
}
.user_photo.end_user .photo_badge,
.end_user.user_assume_photo .photo_badge {
  display: block;
}

html[data-rtl-language="true"] .items .user_photo .photo_badge,
html[data-rtl-language="true"] .items .user_assume_photo .photo_badge {
  left: -10px;
}

.user_assume_photo {
  padding: 5px 20px 0 10px;
  height: 100px;
}
.user_assume_photo .profile {
  width: 70px;
  height: 70px;
  border-radius: 4px;
}

.user_photo_editable .editable-indicator,
.user_photo_editable .loading-indicator {
  margin-top: 6px;
}

.user_photo_editable .editable-indicator,
.user_photo_editable .editable-background,
.user_photo_editable .loading-indicator,
.user_photo_editable .loading-background {
  position: absolute;
  top: -3px;
  left: 0;
  width: 40px;
  height: 40px;
  border-radius: 4px;
}

.user_photo_editable .editable-background {
  background-color: var(--background-default);
  opacity: 0.5;
}

.user_photo_editable .loading-background {
  background-color: var(--background-default);
  border: 1px solid var(--border-default);
}

.user_photo_editable .editable-indicator {
  display: none;
}

.user_photo_editable .editable-icon {
  position: absolute;
  top: 7px;
  left: 8px;
  width: 26px;
  height: 26px;
}

.user_photo_editable .loading-icon {
  position: absolute;
  top: 12px;
  left: 12px;
  width: 18px;
  height: 18px;
  background: url(/agent/assets/icons/spinners/small_spinner-f57d905b62b713e3324c733d4493bf5c.gif);
  background-color: transparent;
  background-repeat: no-repeat;
}

.user_photo_editable .dropdown-menu {
  border-radius: 4px;
  margin: 5px 0 0 0;
}
.user_photo_editable .dropdown-menu::after {
  background-color: var(--background-default);
  border-left: 1px solid var(--border-default);
  border-top: 1px solid var(--border-default);
  content: "";
  display: inline-block;
  height: 6px;
  left: 16px;
  position: absolute;
  top: -4px;
  transform: rotate(45deg);
  width: 6px;
}
.user_photo_editable .dropdown-menu li {
  position: relative;
  overflow: hidden;
}
.user_photo_editable .dropdown-menu li button {
  width: 100%;
}
.user_photo_editable .dropdown-menu li input {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 60px;
  opacity: 0;
}

.user_photo_editable a:hover .editable-indicator {
  display: block;
}

.user_photo.loading .loading-container,
.loading.user_assume_photo .loading-container {
  display: block;
}

.details.property_box:not(.customer_record) {
  width: 292px;
  padding: 15px 10px 14px 10px;
}

.details.property_box.customer_record {
  padding-top: 5px;
}

.details.property_box label {
  color: var(--foreground-subtle);
  font-size: 12px;
  cursor: default;
  width: 68px;
  float: left;
  text-align: right;
  padding-right: 17px;
  overflow: hidden;
  white-space: normal;
  padding-top: 1px;
  font-weight: 400;
}
html[data-rtl-language="true"] .details.property_box label {
  float: right;
  text-align: left;
  padding-left: 17px;
  padding-right: 0;
}
.details.property_box label.custom-field-label {
  float: none;
  margin: 4px 0 6px 0;
  text-align: left;
  z-index: 0;
  width: auto;
}

.details.property_box .no_tags {
  left: 105px;
  position: absolute;
  color: var(--foreground-subtle);
}

.details.property_box .command {
  color: var(--foreground-subtle);
  cursor: pointer;
}
.details.property_box .command:hover {
  color: rgb(var(--blue-600));
}

.details.property_box .display_phone {
  cursor: default;
  text-transform: lowercase;
}
.organization-memberships.value .no-wrap.item,
.organization-memberships.value .no-wrap {
  white-space: normal;
  text-overflow: none;
  margin-bottom: 5px;
}
.details.property_box .item {
  color: var(--foreground-default);
  margin-bottom: 2px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  position: relative;
  min-height: 15px;
}
.details.property_box .item div {
  cursor: pointer;
  position: relative;
}
html[data-rtl-language="true"] .details.property_box .item div[dir="ltr"] {
  text-align: right;
}
.details.property_box .item div.command {
  color: var(--foreground-default);
}
.details.property_box .item div:hover {
  color: var(--foreground-default);
}
.details.property_box .item div:hover:after {
  border-top-color: var(--foreground-default);
}
.details.property_box .item div .email-text {
  position: relative;
  padding: 4px 14px 4px 0px;
  display: inline-block;
  width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html[data-rtl-language="true"] .details.property_box .item div .email-text {
  direction: ltr;
  text-align: right;
  padding: 4px 0 4px 14px;
}
.details.property_box .item div .email-text:after {
  position: absolute;
  right: 0px;
  top: 2px;
  width: 20px;
  height: 20px;
  background: url(/agent/assets/components/icon-dropdown-6176ed1a90dd5199213878451019d061.svg) no-repeat;
  content: "";
  display: inline-block;
  opacity: 1;
  transition: opacity 0.25s ease 0s;
}
[data-theme="dark"] .details.property_box .item div .email-text:after {
  background: url(/agent/assets/components/icon-dropdown-dark-33b0749244eb4259098e48a0dfe96cfd.svg) no-repeat;
}
html[data-rtl-language="true"] .details.property_box .item div .email-text:after {
  display: none;
}
.details.property_box .item div .email-text:hover:after {
  transition: opacity 0.25s ease 0s;
  opacity: 0.3;
}
html[data-rtl-language="true"] .details.property_box .item div .email-text:hover:after {
  display: none;
}
html[data-rtl-language="true"] .details.property_box .item div .email-text:before {
  position: absolute;
  left: -5px;
  top: 2px;
  width: 20px;
  height: 20px;
  background: url(/agent/assets/components/icon-dropdown-6176ed1a90dd5199213878451019d061.svg) no-repeat;
  content: "";
  display: inline-block;
  opacity: 1;
  transition: opacity 0.25s ease 0s;
}

[data-theme="dark"] html[data-rtl-language="true"] .details.property_box .item div .email-text:before {
  background: url(/agent/assets/components/icon-dropdown-dark-33b0749244eb4259098e48a0dfe96cfd.svg) no-repeat;
}
html[data-rtl-language="true"] .details.property_box .item div .email-text:hover:before {
  transition: opacity 0.25s ease 0s;
  opacity: 0.3;
}
.details.property_box .item div .email-text.editable:after {
  background: none;
}
.details.property_box .item div .phone-text {
  position: relative;
  padding: 4px 14px 4px 0px;
  display: inline-block;
  width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html[data-rtl-language="true"] .details.property_box .item div .phone-text {
  padding: 4px 0 4px 14px;
}
.details.property_box .item div .phone-text:after {
  position: absolute;
  right: 0px;
  top: 2px;
  width: 20px;
  height: 20px;
  background: url(/agent/assets/components/icon-dropdown-6176ed1a90dd5199213878451019d061.svg) no-repeat;
  content: "";
  display: inline-block;
  opacity: 0.3;
  transition: opacity 0.25s ease 0s;
}
[data-theme="dark"] .details.property_box .item div .phone-text:after {
  background: url(/agent/assets/components/icon-dropdown-dark-33b0749244eb4259098e48a0dfe96cfd.svg) no-repeat;
}
html[data-rtl-language="true"] .details.property_box .item div .phone-text:after {
  display: none;
}
.details.property_box .item div .phone-text:hover:after {
  transition: opacity 0.25s ease 0s;
  opacity: 0.3;
}
html[data-rtl-language="true"] .details.property_box .item div .phone-text:hover:after {
  display: none;
}
html[data-rtl-language="true"] .details.property_box .item div .phone-text:before {
  position: absolute;
  left: 0px;
  top: 2px;
  width: 20px;
  height: 20px;
  background: url(/agent/assets/components/icon-dropdown-6176ed1a90dd5199213878451019d061.svg) no-repeat;
  content: "";
  display: inline-block;
  opacity: 1;
  transition: opacity 0.25s ease 0s;
}

[data-theme="dark"] html[data-rtl-language="true"] .details.property_box .item div .phone-text:before {
  background: url(/agent/assets/components/icon-dropdown-dark-33b0749244eb4259098e48a0dfe96cfd.svg) no-repeat;
}
html[data-rtl-language="true"] .details.property_box .item div .phone-text:hover:before {
  transition: opacity 0.25s ease 0s;
  opacity: 0.3;
}
.details.property_box .item div .phone-text.editable:after {
  background: none;
}

.details.property_box .email,
.details.property_box .phone {
  overflow: visible;
  width: auto;
}
.details.property_box .email .invalid-text-border,
.details.property_box .phone .invalid-text-border {
  border: 1px solid var(--border-dangerEmphasis);
}

.details.property_box .email.item:not(.verified) .unverified {
  position: absolute;
  top: 4px;
  right: -15px;
  width: 14px;
  height: 14px;
  background: url(/agent/assets/icons/icon-unverified-729a823728f5191191a3311836478d54.svg) no-repeat;
}
html[data-rtl-language="true"] .details.property_box .email.item:not(.verified) .unverified {
  left: -15px;
  right: auto;
}

.details.property_box .phone.item:not(.verified) .unverified {
  position: absolute;
  top: 4px;
  right: -15px;
  width: 14px;
  height: 14px;
  background: url(/agent/assets/icons/icon-unverified-729a823728f5191191a3311836478d54.svg) no-repeat;
}
html[data-rtl-language="true"] .details.property_box .phone.item:not(.verified) .unverified {
  left: -15px;
  right: auto;
}

.details.property_box .undeliverable,
.details.property_box .partner-address,
.details.property_box .soft-bouncing,
.details.property_box .example-address,
.details.property_box .mailer-daemon {
  position: absolute;
  top: 4px;
  right: -15px;
  width: 14px;
  height: 14px;
  background: url(/agent/assets/icons/icon-unverified-729a823728f5191191a3311836478d54.svg) no-repeat;
}

.details.property_box .custom-checkbox {
  float: left;
  margin: 4px 5px 0px 0px;
}
html[data-rtl-language="true"] .details.property_box .custom-checkbox {
  float: right;
  margin: 4px 0 0 5px;
}

.details.property_box .value {
  text-align: left;
  float: left;
  width: 195px;
  position: relative;
  border-radius: 2px;
  /* Ensures that phone number remains LTR for RTL languages */
}
html[data-rtl-language="true"] .details.property_box .value {
  text-align: right;
}
html[data-rtl-language="true"] .details.property_box .value:not(.textarea) {
  direction: rtl;
  float: right;
}
html[data-rtl-language="true"] .details.property_box .value.forwarding_number {
  direction: ltr;
  text-align: right;
}
.details.property_box .value.groups {
  margin-top: -6px;
  margin-left: -5px;
  padding: 5px;
  border: 1px solid var(--border-default);
}
.details.property_box .value.groups.disabled {
  cursor: not-allowed;
}
.details.property_box .value.groups:not(.disabled):hover {
  border-color: var(--border-default);
}
.details.property_box .value.groups div {
  text-overflow: ellipsis;
  overflow: hidden;
}
.details.property_box .value.custom-field-value {
  border: 1px solid var(--border-default);
  float: left;
  cursor: text;
  width: 272px;
  margin: 0px;
}
.details.property_box .value.custom-field-value.select {
  width: 282px;
  margin: 0px;
}
.details.property_box .value.custom-field-value.date {
  width: 282px;
}
.details.property_box .value.custom-field-value.date input {
  width: 277px;
  padding: 5px 0px 5px 5px;
}
.details.property_box .value input[type="checkbox"] {
  margin: 7px 0 6px 5px;
}
.details.property_box .value .primary {
  font-weight: 400;
}
.details.property_box .value select {
  width: 207px;
}
.details.property_box .value.select {
  margin-top: -4px;
  margin-left: -5px;
  width: 208px;
}
.details.property_box .value.select .zd-state-default .zd-searchmenu-base,
.details.property_box .value.select .zd-state-disabled .zd-searchmenu-base {
  border-color: var(--background-default) !important;
  color: var(--foreground-default);
}
.details.property_box .value.select .zd-state-default .zd-selectmenu-base,
.details.property_box .value.select .zd-state-disabled .zd-selectmenu-base {
  border-color: transparent;
  background-color: transparent;
}
.details.property_box .value.select.zd-state-disabled .zd-tag-menu-root,
.details.property_box .value.select.zd-state-disabled .zd-tag-item,
.details.property_box .value.select.zd-state-disabled a {
  cursor: not-allowed;
}
.details.property_box .value.select.zd-state-disabled .zd-tag-menu-root.zd-state-hover {
  border-color: transparent !important;
}
.details.property_box .value.select.zd-state-disabled .zd-tag-menu-root .zd-tag-editor-holder {
  display: none;
}
.details.property_box .value.select .zd-state-disabled .zd-searchmenu-base {
  background-color: var(--background-default);
}
.details.property_box .value.select .zd-selectmenu-base {
  background-image: none;
}
.details.property_box .value.select .zd-state-hover .zd-selectmenu-base,
.details.property_box .value.select .zd-state-hover .zd-searchmenu-base {
  border-color: var(--border-subtle);
}
.details.property_box .value.select .zd-tag-menu-root {
  border-color: var(--border-subtle);
  background-color: transparent;
}
.details.property_box .value.select .zd-tag-menu-root.zd-state-hover {
  border-color: var(--border-subtle);
}
.details.property_box .value.select .zd-tag-menu-root.zd-state-focus {
  border-color: var(--border-subtle) !important;
  box-shadow:
    var(--background-default) 0px 0px 0px 1px,
    var(--border-primaryEmphasis) 0px 0px 0px 3px !important;
  outline: thick none !important;
}
.details.property_box .value.select .ui-state-default:not(.ui-state-active):not(.ui-state-hover) {
  border: 1px solid var(--border-subtle);
}
.details.property_box .value.select .ui-state-default:not(.ui-state-active):not(.ui-state-hover) .ui-icon {
  background-image: none;
}
.details.property_box .value.select .ui-selectmenu span.ui-selectmenu-status,
.details.property_box .value.select .ui-selectmenu-menu li a {
  padding-left: 5px;
}
.details.property_box .value.select .ui-widget {
  font-size: 14px;
  background: var(--background-default);
  color: var(--foreground-default);
}
.details.property_box .value .token_list {
  margin: -6px 0 0 -5px;
  border: 1px solid var(--border-subtle);
  width: 196px;
  padding: 4px 4px 1px 4px;
  background: none;
  position: relative;
}
.details.property_box .value .token_list .tagSearch input {
  background: var(--background-default);
}
.details.property_box .value .suggestions {
  width: 204px;
}
.details.property_box .value .ui-selectmenu:not(.ui-state-active):hover,
.details.property_box .value .token_list:hover {
  border-color: var(--border-subtle);
}

.details.property_box .organization-memberships {
  min-height: 25px;
}
.details.property_box .organization-memberships .item ~ .add-organization {
  display: inline-block;
  margin-top: 10px;
}
.details.property_box .organization-memberships .link {
  border-bottom: 1px dotted;
}

.details.property_box .agent_forwarding .link {
  border-bottom: 1px dotted;
}

.details.property_box .agent_forwarding.property .value .flag-icon {
  margin-top: 2px;
  margin-right: 4px;
}

.details.property_box .link-mode {
  cursor: pointer;
  color: var(--foreground-primary);
  border-width: 0;
  box-shadow: none;
  outline-width: 0;
  padding: 4px 0 !important;
  position: relative;
}
.details.property_box .link-mode:hover {
  text-decoration: underline;
}

.details.property_box .make-direct {
  margin: -10px 0 10px 86px;
}

.details.property_box .edit-mode {
  padding: 4px 2px !important;
}

.details.property_box .identity-field {
  padding: 4px;
  border-radius: 0px;
  width: 192px;
  border-color: var(--border-success);
}
.details.property_box .identity-field:focus {
  box-shadow:
    0 1px 3px var(--overlay-light) inset,
    0 0 2px var(--border-success);
}
.details.property_box .identity-field.twitter {
  width: 176px;
}

.details.property_box [disabled],
.details.property_box .ui-state-disabled,
.details.property_box .disabled {
  opacity: 1 !important;
  color: var(--foreground-disabled) !important;
  cursor: not-allowed !important;
}
.details.property_box [disabled] .token_list,
.details.property_box .ui-state-disabled .token_list,
.details.property_box .disabled .token_list {
  border: 1px solid transparent !important;
}
.details.property_box [disabled] .tagSearch,
.details.property_box .ui-state-disabled .tagSearch,
.details.property_box .disabled .tagSearch {
  display: none;
}

.details.property_box .shared_comments:not(.is_shared) {
  display: none;
}

.details.property_box .property {
  padding: 4px 0;
  min-height: 22px;
  width: 100%;
}
html[data-rtl-language="true"] .details.property_box .property {
  direction: rtl;
}
.details.property_box .property.identities {
  padding: 0;
  display: block;
}
.details.property_box .property::after {
  display: block;
  clear: both;
  content: "";
}
.details.property_box .property.delim {
  border-bottom: 1px solid var(--border-subtle);
  margin-bottom: 13px;
  padding-bottom: 10px;
}
.details.property_box .property.identities .value {
  margin-bottom: 5px;
}
.details.property_box .property.identities .identity-field,
.details.property_box .property.identities .identity-twitter-label {
  position: relative;
  top: -6px;
}
.details.property_box .property.identities .email .identity-field {
  top: 0;
  width: 90%;
}

.zd-selectmenu.locales .zd-menu-root,
.zd-selectmenu.locales .zd-menu-list-holder {
  width: auto !important;
  min-width: 206px;
  max-width: 360px;
}

.zd-selectmenu.locales .zd-menu-item {
  padding-right: 10px;
}

.people_form {
  width: 475px;
}
.people_form .modal-body div {
  margin-bottom: 12px;
}
.people_form .modal-body div p {
  width: 310px;
  margin-top: 7px;
  color: rgb(var(--grey-600));
  float: right;
}
html[data-rtl-language="true"] .people_form .modal-body div p {
  float: left;
  margin-right: 10px;
}
.people_form label span {
  width: 105px;
  display: inline-block;
  text-align: right;
  padding-right: 20px;
  margin-top: 6px;
  color: var(--foreground-default);
}
html[data-rtl-language="true"] .people_form label span {
  float: right;
  text-align: left;
  padding-left: 20px;
  padding-right: 0;
}
.people_form input {
  width: 300px;
  float: right;
}
.people_form .input {
  width: 312px;
  float: right;
}
html[data-rtl-language="true"] .people_form .input.field-note {
  float: left;
  text-align: right;
}
.people_form .input.dropdown {
  margin-bottom: 0px;
}
.people_form .input.dropdown .zd-selectmenu {
  margin-bottom: 0px;
}
.people_form select {
  z-index: 10000;
}

.property_alert {
  margin: 8px;
  margin-bottom: 1px;
  text-align: center;
}

.two-factor-authentication h3 {
  margin-bottom: 25px;
}

.two-factor-authentication #qrcode {
  margin-left: 10px;
  float: right;
}

.two-factor-authentication #qrcode-container {
  min-height: 147px;
}

.two-factor-authentication #two-factor-phone-form {
  margin-bottom: 25px;
}

.two-factor-authentication #two-factor-setup p {
  margin-top: 10px;
  padding: 0;
}

.two-factor-modal {
  width: 500px;
  height: 400px;
}
html[data-rtl-language="true"] .two-factor-modal {
  direction: rtl;
}
.two-factor-modal p {
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 30px;
  color: rgb(var(--grey-600));
}
.two-factor-modal b {
  color: var(--foreground-default);
  /* Grey-800 */
}
.two-factor-modal a#turn-off-two-factor {
  margin-left: 134px;
}
.two-factor-modal #two-factor-setup {
  margin-bottom: 20px;
}
.two-factor-modal #two-factor-setup button {
  width: 240px;
  height: 50px;
  margin-left: 115px;
  margin-bottom: 20px;
  font-size: 14px;
  color: rgb(var(--grey-600));
}
html[data-rtl-language="true"] .two-factor-modal #two-factor-setup button {
  margin-right: 115px;
  margin-left: auto;
}
.two-factor-modal #qrcode {
  margin-left: 177px;
  margin-bottom: 60px;
  min-height: 118px;
}
html[data-rtl-language="true"] .two-factor-modal #qrcode {
  margin-right: 177px;
  margin-left: auto;
}
.two-factor-modal #two-factor-form {
  text-align: center;
}
.two-factor-modal #two-factor-form input[type="text"],
.two-factor-modal #two-factor-form input[type="tel"] {
  font-size: 50px;
  padding: 10px;
  text-align: center;
  height: auto;
  width: 300px;
}
.two-factor-modal #two-factor-form input[type="tel"] {
  width: 400px;
}
.two-factor-modal #two-factor-actions {
  position: absolute;
  bottom: 15px;
  right: 15px;
}
html[data-rtl-language="true"] .two-factor-modal #two-factor-actions {
  left: 15px;
  right: auto;
}
.two-factor-modal #two-factor-actions button {
  float: right;
  width: 120px;
  height: 40px;
  margin-left: 15px;
}
html[data-rtl-language="true"] .two-factor-modal #two-factor-actions button {
  float: left;
  margin-right: 15px;
  margin-left: auto;
}
.two-factor-modal #two-factor-actions #next {
  background-color: var(--foreground-default);
  /* Grey-800 */
}

.details.property_box label.switch-label {
  padding: 0;
  width: 100%;
}
html[data-rtl-language="true"] .details.property_box label.switch-label {
  padding-left: 0;
}

.explore-user-seat-section .switch-container,
.connect-user-seat-section .switch-container,
.voice-user-seat-section .switch-container {
  float: right;
  margin-right: 7px;
  overflow: hidden;
}
html[data-rtl-language="true"] .explore-user-seat-section .switch-container,
html[data-rtl-language="true"] .connect-user-seat-section .switch-container,
html[data-rtl-language="true"] .voice-user-seat-section .switch-container {
  float: left;
  margin-left: 7px;
  margin-right: 0;
}

.zopim-agent-section .switch-container {
  float: right;
  margin-right: 7px;
}
html[data-rtl-language="true"] .zopim-agent-section .switch-container {
  float: left;
  margin-left: 7px;
  margin-right: 0;
}

.zopim-agent-section .zopim-chat-label {
  margin-top: 6px;
}

.zopim-agent-section .zopim-chat-disabled-text {
  line-height: 31px;
  color: rgb(var(--grey-400));
  /* Grey-400 */
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.zopim-agent-section .zopim-agent-content .textarea {
  width: 195px;
}

.zopim-agent-section .loader {
  background: url(/agent/assets/icons/spinners/dotted_bar-b0db0a3419081443c8a7ae0747b9937d.gif) no-repeat center center;
  width: 40px;
  height: 30px;
}

.zopim-agent-section .loading-message {
  padding-left: 45px;
}

.jGrowl .jGrowl-notification.ui-state-error .zopim-agent-error .close_btn {
  float: none;
  padding: 4px 20px 5px 20px;
}

.jGrowl .jGrowl-notification.ui-state-error.generic .jGrowl-message,
.jGrowl .jGrowl-notification.ui-state-notice .jGrowl-message,
.jGrowl .jGrowl-notification.ui-state-alert .jGrowl-message {
  overflow-wrap: break-word;
}

.tooltip-inner {
  text-align: left;
}
.tooltip-inner .title {
  color: var(--tooltip-foreground);
  font-weight: 600;
}

/* END ./app/assets/stylesheets/areas/users.scss */
/* BEGIN ./app/assets/stylesheets/areas/ticket_comment_input.scss */
.pane_body:not(.rich_text) .comment_input {
  padding: 0 0 12px 0;
}

.comment_input.event {
  border-left-width: 0;
}

.comment_input {
  border-top: none;
  /* Public/Private reply tabs */
}
.comment_input .header {
  padding: 0 0 8px 0;
}
.comment_input .content .body {
  margin-top: 10px;
}
.comment_input.event .content {
  margin: 0 20px 0 77px;
}
html[data-rtl-language="true"] .comment_input.event .content {
  margin: 0 77px 0 20px;
}
.comment_input.event .user_photo {
  left: 18px;
}
html[data-rtl-language="true"] .comment_input.event .user_photo {
  right: 18px;
}
.comment_input .hint {
  color: rgb(var(--grey-600));
  font-size: 12px;
  line-height: 22px;
  height: 24px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  top: 1px;
  left: 4px;
  position: relative;
}
html[data-rtl-language="true"] .comment_input .hint {
  float: right;
  left: 0px;
  right: 4px;
  border-left: 0;
}
.comment_input .twitter-handle-picker {
  padding: 10px 0px;
  margin-bottom: 30px;
}
.comment_input .twitter-handle-picker label {
  font-size: 11px;
  color: rgb(var(--grey-600));
  margin: 7px 7px 0px 0;
  text-align: left;
  float: left;
}
html[data-rtl-language="true"] .comment_input .twitter-handle-picker label {
  margin: 7px 0 0px 7px;
  text-align: right;
  float: right;
}
.comment_input .twitter-handle-picker .zd-selectmenu-root {
  width: 250px;
  float: left;
}
html[data-rtl-language="true"] .comment_input .twitter-handle-picker .zd-selectmenu-root {
  float: right;
}
.comment_input .twitter-handle-picker .zd-selectmenu-root .twitter-avatar {
  width: 20px;
  height: 20px;
  margin-right: 5px;
  float: left;
  border-radius: 2px;
}
html[data-rtl-language="true"] .comment_input .twitter-handle-picker .zd-selectmenu-root .twitter-avatar {
  float: right;
  margin-left: 5px;
  margin-right: 0;
}
.comment_input .twitter-handle-picker .zd-selectmenu-root .twitter-avatar.default {
  opacity: 0.4;
  display: inline-block;
  background: url(/agent/assets/channels/twitter-cb686057e945259807e705beec57dba8.svg) center/contain no-repeat;
}
.comment_input .twitter-handle-picker .zd-selectmenu-root span {
  line-height: 20px;
}
html[data-rtl-language="true"] .comment_input .twitter-handle-picker .zd-selectmenu-root span.name {
  float: right;
}
.comment_input .twitter-handle-picker .zd-selectmenu-root span.handle {
  color: rgb(var(--grey-400));
  margin-left: 5px;
}
html[data-rtl-language="true"] .comment_input .twitter-handle-picker .zd-selectmenu-root span.handle {
  margin-left: 0;
  margin-right: 5px;
}
.comment_input .requester-no-handle,
.comment_input .channelback-not-supported {
  color: var(--foreground-subtle);
  margin: 10px 0;
  line-height: 18px;
}
.comment_input .requester-no-handle .icon-warning,
.comment_input .channelback-not-supported .icon-warning {
  display: inline-block;
  height: 16px;
  width: 16px;
  vertical-align: top;
}
.comment_input .call-back {
  margin-left: 5px;
}
html[data-rtl-language="true"] .comment_input .call-back {
  float: left;
  margin-left: 0;
  margin-right: 5px;
}
.comment_input .call-back .toggle {
  background: rgb(var(--grey-100));
  border: solid var(--border-default) 1px;
  border-radius: 3px;
  cursor: pointer;
  padding: 3px 5px 4px 3px;
  float: left;
}
.comment_input .call-back .toggle .icon {
  height: 23px;
  width: 23px;
  float: left;
  margin-top: -3px;
  margin-bottom: -3px;
}
html[data-rtl-language="true"] .comment_input .call-back .toggle .icon {
  float: right;
}
.comment_input .call-back .toggle .caret {
  margin-top: 8px;
}
.comment_input .call-back .dropdown {
  background: var(--background-default);
  border: solid var(--border-default) 1px;
  border-radius: 5px;
  margin-top: 32px;
  position: absolute;
  right: 15px;
  padding: 10px;
  z-index: 2000000;
  display: none;
}
html[data-rtl-language="true"] .comment_input .call-back .dropdown {
  left: 15px;
  right: auto;
}
.comment_input .call-back .dropdown.open {
  display: block;
}
.comment_input .call-back .dropdown .number.option {
  padding: 5px;
  cursor: pointer;
  color: var(--foreground-primary);
  background: var(--background-default);
  display: block;
  /* Ensures that phone numbers are still rendered left-to-right */
}
html[data-rtl-language="true"] .comment_input .call-back .dropdown .number.option {
  direction: ltr;
}
.comment_input.bulk-comment .hint {
  display: none;
}
.comment_input.is-public .hint.reply {
  display: block;
}
.comment_input:not(.is-public) .hint.note {
  display: block;
}
.comment_input .checkbox-field {
  display: inline-block;
  position: relative;
  top: 2px;
}
.comment_input textarea {
  padding: 8px;
  width: 100%;
  min-height: 60px;
  height: 60px;
  box-sizing: border-box;
  box-shadow: none;
  color: var(--foreground-default);
  /* Grey-800 */
  font-size: 14px;
}
.comment_input .counter,
.comment_input .counter_normal,
.comment_input .counter_exceeded {
  position: absolute;
  margin-top: 4px;
  right: 22px;
  font-size: 15px;
  font-weight: 600;
}
.comment_input .comment-twitter-identity {
  position: absolute;
  padding: 7px;
  font-size: 14px;
  color: var(--foreground-default);
  /* Grey-800 */
  margin-top: 2px;
  line-height: 17px;
}
.comment_input .counter_normal {
  color: rgb(var(--grey-400));
  /* Grey-400 */
}
.comment_input .counter_exceeded {
  color: var(--foreground-dangerEmphasis);
}
.comment_input .comment_bar {
  background-color: rgb(var(--grey-100));
  /* Grey-100 */
  border: solid var(--border-default) 1px;
  border-top: none;
  padding: 7px;
  margin-bottom: 10px;
}
.comment_input .comment_bar .twitter_counter {
  float: right;
  position: relative;
  right: 0;
  color: var(--foreground-default);
  margin-top: 0px;
}
html[data-rtl-language="true"] .comment_input .comment_bar .twitter_counter {
  float: left;
  left: 0;
  right: auto;
}
.comment_input .comment_bar .twitter_counter.counter_exceeded {
  color: var(--foreground-dangerEmphasis);
}
.comment_input .comment_bar label {
  float: left;
}
html[data-rtl-language="true"] .comment_input .comment_bar label {
  float: right;
}
.comment_input .comment_bar label .checkbox {
  display: inline-block;
}
.comment_input .options {
  font-size: 14px;
  margin-top: 5px;
  vertical-align: middle;
}
.comment_input .options .channel_options {
  float: left;
  width: 70%;
}
.comment_input .options .channel_options .checkbox {
  display: inline-block;
}
.comment_input .options .channel_back {
  width: 200px;
  display: inline-block;
}
.comment_input .options label {
  width: auto;
  color: var(--foreground-default);
  /* Grey-800 */
}
.comment_input:not(.is-public) textarea {
  background: rgb(var(--lemon-100));
  border: 1px solid rgb(var(--lemon-200));
}
.comment_input .btn {
  background: rgb(var(--grey-100));
  border-radius: 3px;
  border: 1px solid var(--border-default);
  color: var(--foreground-default);
  font-size: 12px;
  float: left;
  margin-right: 5px;
  position: relative;
  padding: 3px 9px;
  box-shadow: none;
  text-shadow: none;
  /* .comment_input .btn.active, the active old-style public/private tab */
}
.comment_input .btn .icon {
  display: inline-block;
  /* icon pngs are 18x18 with extra padding but the .icon element can't be that big. */
  height: 14px;
  width: 16px;
  margin: 0 4px -1px -3px;
  background: transparent none no-repeat top left;
}
html[data-rtl-language="true"] .comment_input .btn .icon {
  margin: 0 -3px -1px 4px;
}
.comment_input .btn .icon.twitter {
  background-image: url(/agent/assets/legacy/twitter_black-711e4c7cbec9c708b18d7fc126c7f167.png);
}
.comment_input .btn .icon.facebook {
  background-image: url(/agent/assets/legacy/facebook_black-0602064c8cdda9d489600d11c3ff5145.png);
}
.comment_input .btn.active {
  background-color: rgb(var(--grey-800));
  padding: 4px 10px;
  border: none;
  color: var(--background-default);
}
.comment_input .btn.active .icon.twitter {
  background-image: url(/agent/assets/legacy/twitter_white-2cafef0c047f5eccd1b50224587db867.png);
}
.comment_input .btn.active .icon.facebook,
.comment_input .btn.active .icon.fb_private_message {
  background-image: url(/agent/assets/legacy/facebook_white-17f74d9c63d7ac4544993c720e31e241.png);
}
.comment_input .btn.active:after {
  content: " ";
  position: absolute;
  height: 0;
  width: 0;
  border: 10px solid transparent;
  border-top-color: var(--border-default);
  margin-left: -10px;
  margin-top: -5px;
  left: 50%;
  top: 100%;
}
.comment_input .btn.active.private_note {
  background-color: rgb(var(--lemon-200));
  color: rgb(var(--lemon-100));
  /* Grey-800 */
}
.comment_input .btn.active.private_note:after {
  border: none;
}

.comment_input_wrapper {
  min-height: 140px;
}

.hide-comment-box .comment_input_wrapper {
  min-height: 0px;
}

.add_comment_attachments,
.add_comment_attachment_buttons {
  clear: right;
  float: right;
}
html[data-rtl-language="true"] .add_comment_attachments,
html[data-rtl-language="true"] .add_comment_attachment_buttons {
  clear: left;
  float: left;
}

.add_comment_attachments ul.attachments li {
  display: block;
  margin-right: 0;
}
.add_comment_attachments ul.attachments li .attachment {
  background-color: transparent;
  display: block;
  margin-right: 25px;
}
html[data-rtl-language="true"] .add_comment_attachments ul.attachments li .attachment {
  margin-left: 25px;
  margin-right: 0;
}
.add_comment_attachments ul.attachments li button,
.add_comment_attachments ul.attachments li .uploading {
  float: right;
  margin-top: -23px;
  margin-right: 5px;
  background: transparent;
}
html[data-rtl-language="true"] .add_comment_attachments ul.attachments li button,
html[data-rtl-language="true"] .add_comment_attachments ul.attachments li .uploading {
  float: left;
  margin-left: 5px;
  margin-right: 0;
}

.add_comment_attachments .uploading {
  float: right;
  background: no-repeat;
  background-image: url(/agent/assets/icons/spinners/small_spinner-f57d905b62b713e3324c733d4493bf5c.gif);
  padding-left: 20px;
}
html[data-rtl-language="true"] .add_comment_attachments .uploading {
  float: left;
  padding: 0;
  padding-right: 20px;
  background-position-x: right;
}

.add_comment_attachment_buttons {
  color: rgb(var(--blue-600));
  margin-bottom: 8px;
}
.add_comment_attachment_buttons .separator {
  display: inline-block;
  width: 15px;
}
.add_comment_attachment_buttons .fileinput-button {
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  position: relative;
  line-height: 16px;
  border: none;
  background: none;
  border-bottom: 1px dotted rgb(var(--blue-600));
  padding: 0;
}
.add_comment_attachment_buttons .fileinput-button .ui-button-text {
  padding: 0;
}
.add_comment_attachment_buttons .fileinput-button input {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  border: solid transparent;
  direction: ltr;
  cursor: pointer;
  opacity: 0;
}
.add_comment_attachment_buttons .fileinput-button ~ .fileinput-button {
  margin-left: 15px;
}

.twitter-select-menu .twitter-avatar {
  margin-top: 5px;
  width: 30px;
  height: 30px;
  margin-right: 5px;
  border-radius: 2px;
}
.twitter-select-menu .twitter-avatar.default {
  opacity: 0.4;
  display: inline-block;
  background: url(/agent/assets/channels/twitter-cb686057e945259807e705beec57dba8.svg) center/contain no-repeat;
}

.twitter-select-menu span {
  margin-top: 5px;
  width: 140px;
  font-size: 12px;
  position: absolute;
}
.twitter-select-menu span.handle {
  font-size: 10px;
  color: rgb(var(--grey-400));
  top: 20px;
}

/* END ./app/assets/stylesheets/areas/ticket_comment_input.scss */
/* BEGIN ./app/assets/stylesheets/areas/ticket_comment_rich_text.scss */
/*
 *  Matches normal comment area, which gets style from a gem
 */
.rich_text pre * {
  font-family: Consolas, "Liberation Mono", Menlo, "Bitstream Vera Sans Mono", Courier, monospace !important;
}

.rich_text .add_comment_attachments {
  display: none;
}

.rich_text .comment_input_wrapper {
  min-height: 0px;
}

.rich_text .comment_input .hint {
  display: none !important;
}

.rich_text .comment_input .content .body {
  margin-top: 0;
}

.rich_text .editor {
  margin: 0px 0px 14px 0;
  position: relative;
}
.rich_text .editor .rich-text-comment {
  min-height: 200px;
  padding: 8px 8px 47px 8px;
  margin-bottom: 10px;
  border: 1px solid var(--border-default);
  border-radius: 5px;
  color: var(--foreground-default);
  /* Grey-800 */
  cursor: text;
  transition: min-height linear 0.1s;
}
.rich_text .editor .toolbar {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 38px;
  border-top: 1px solid var(--border-default);
}
.rich_text .editor .menu {
  position: absolute;
  bottom: 38px;
  display: inline-block;
}

.rich_text .controls {
  font-size: 13px;
  margin-left: 1px;
  position: relative;
  z-index: 1;
}

/* comment page overrides */
.rich_text .comment-actions .btn {
  border-bottom-color: transparent;
  border-bottom-style: solid;
  border-bottom-width: 3px;
  border-radius: 0px;
  border-top: none;
  border-right: none;
  border-left: none;
  margin-right: 25px;
  padding: 0 0 5px 0;
  background: none;
  box-shadow: none;
  font-size: 14px;
}
html[data-rtl-language="true"] .rich_text .comment-actions .btn {
  margin-left: 25px;
  margin-right: 0;
}
.rich_text .comment-actions .btn:after {
  display: block;
  visibility: hidden;
  line-height: 0;
  font-weight: bold;
  content: attr(data-text);
}
.rich_text .comment-actions .btn:hover {
  color: rgb(var(--grey-600));
}
.rich_text .comment-actions .btn.active {
  border-bottom-color: rgb(var(--blue-600));
  /* Blue-600 */
  color: rgb(var(--grey-800));
  font-weight: 600;
}
.rich_text .comment-actions .btn.active:hover {
  color: var(--foreground-default);
  /* Grey-800 */
}
.rich_text .comment_input .header {
  padding: 0;
}
.rich_text .comment_input .header .call-back .toggle {
  background: none;
  border: none;
  border-radius: 0;
}
.rich_text .comment_input .header .call-back .toggle .caret {
  background: url(/agent/assets/icons/14-chevron-c17f2575323bf5fb21969e6559921db2.svg) 0 3px / contain;
  content: " ";
  top: 6px;
  width: 11px;
  height: 11px;
  position: absolute;
  right: 10px;
  border-radius: 2px;
  display: inline-block;
  margin: 0;
  border: none;
}
html[data-rtl-language="true"] .rich_text .comment_input .header .call-back .toggle .caret {
  left: 10px;
  right: auto;
}
.rich_text .comment_input .header .active.private_note {
  background: none;
}

.rich_text .comment_input:not(.is-public) .deskzen-editor--rich-text-container {
  background: rgb(var(--lemon-100));
  border: 1px solid rgb(var(--lemon-200));
}

.rich_text .comment_input.is-public .deskzen-editor--rich-text-container {
  border-top-left-radius: 0;
}

.new_ticket:not(.first_comment_private) #email-ccs-editor-bar .deskzen-editor--email-ccs-top {
  margin-top: 5px;
}
#email-ccs-editor-bar .deskzen-editor--email-ccs-top,
.rich_text .comment_input .deskzen-editor--email-ccs-top {
  border-radius: 0 3px 0 0 !important;
  border: 1px solid var(--border-default);
  border-bottom: none;
  padding: 10px;
  overflow: hidden;
  max-height: 500px;
  opacity: 1;
  transition:
    max-height 0.2s,
    opacity 0.4s,
    padding 0.4s,
    border 0.4s;
}
.rich_text .comment_input .deskzen-editor--email-ccs-top .email-user-menu {
  width: 100%;
}

.rich_text .comment_input .deskzen-editor--email-ccs-bottom {
  border-radius: 0 0 3px 3px !important;
}

.rich_text .comment_input:not(.is-public) .deskzen-editor--email-ccs-top {
  border: none;
  max-height: 0 !important;
  opacity: 0;
  padding: 0;
}

.rich_text .comment_input:not(.is-public) .deskzen-editor--email-ccs-bottom {
  border-radius: 3px !important;
}

.rich_text .empty .editor .rich-text-comment {
  padding: 8px;
  min-height: inherit;
}
.rich_text .empty .editor .rich-text-comment:before {
  content: attr(data-placeholder);
  color: var(--foreground-subtle);
}

.rich_text .empty .editor .toolbar,
.rich_text .empty .editor .menu {
  display: none;
}

.rich_text .new_ticket .content {
  margin: 10px 0 0 0;
}

.rich_text .new_ticket .btn {
  display: none;
}

.rich_text .new_ticket .rich-text-comment {
  border-radius: 2px;
}

.rich_text img[data-emoji-id] {
  height: 1.2em;
  width: 1.2em;
  margin-top: -0.2em;
  vertical-align: middle;
}

.rich_text img[data-loading] {
  display: none;
}

.rich_text .image-load-spinner {
  height: 200px;
  width: 350px;
  background-repeat: no-repeat;
  background-position-x: 166px;
  background-position-y: 90px;
  background-color: rgb(var(--grey-100));
  /* Grey-100 */
  border: 1px solid var(--border-default);
  background-image: url(/agent/assets/icons/spinners/small_spinner-f57d905b62b713e3324c733d4493bf5c.gif);
}

.event:not(.is-public) .zd-comment {
  margin-bottom: 12px;
}

/* Ticket Page Overrides */
.rich_text .header .icon.twitter {
  display: none;
}

.rich_text .twitter_counter {
  color: var(--foreground-default);
  position: absolute;
  bottom: -92px;
  right: 20px;
  z-index: 10;
}

.new_ticket .editor {
  margin: 0px 0px 14px 0 !important;
  min-height: 160px;
}

.rich_text .comment_input {
  padding: 0 0 12px 0;
}

.deskzen-editor--toolbar .deskzen-editor--discovery li.active button {
  color: rgb(var(--blue-600));
}

.deskzen-editor--toolbar .deskzen-editor--apps li svg {
  fill: rgb(var(--grey-800));
  /* Grey-800 */
  fill-opacity: 0.4;
}
.deskzen-editor--toolbar .deskzen-editor--apps li.active {
  background-color: rgb(var(--grey-200));
  /* Grey-200 */
  border-radius: 2px;
  box-shadow: 0px 0px 0px 1px rgb(var(--grey-300));
  /* Grey-300 */
}
.deskzen-editor--toolbar .deskzen-editor--apps li.active svg {
  fill-opacity: 0.8;
}
.deskzen-editor--toolbar .deskzen-editor--apps li:hover svg {
  fill-opacity: 0.8;
}
.deskzen-editor--toolbar .deskzen-editor--apps li .deskzen-editor--discovery-svg {
  pointer-events: none;
  opacity: 0.4;
}
.deskzen-editor--toolbar .deskzen-editor--apps li.hover .deskzen-editor--discovery-svg {
  pointer-events: none;
  opacity: 0.8;
}
.deskzen-editor--toolbar .deskzen-editor--apps li.active .deskzen-editor--discovery-svg {
  pointer-events: none;
  opacity: 1;
}

.deskzen-editor--toolbar .deskzen-editor--group.deskzen-editor--discovery {
  float: right;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  /* We want to overwrite the default .deskzen-editor--group behavior */
  /* and remove the border-left from the group since the discovery */
  /* icon is right aligned */
  border-left: 0;
}
html[data-rtl-language="true"] .deskzen-editor--toolbar .deskzen-editor--group.deskzen-editor--discovery {
  float: left;
  left: 0;
  right: auto;
}

.deskzen-editor--plaintext-box {
  margin-bottom: 140px;
}
.deskzen-editor--plaintext-box .disabled > a:hover {
  color: currentColor;
}

.section.ticket .deskzen-editor--item input[type="file"] {
  height: 26px;
  width: 26px;
}

div.deskzen-editor--drop-indicators .drop-indicator-inline {
  top: 115px;
  left: 420px;
}

div.deskzen-editor--drop-indicators .drop-indicator-attach {
  bottom: 80px;
  left: 420px;
  height: 170px;
}

.deskzen-editor--toolbar {
  box-sizing: border-box;
}

#editor-tooltip input {
  box-shadow: none !important;
}

div#editor-tooltip {
  z-index: 1100;
}

.deskzen-editor--menu a:focus {
  outline: none;
}

.deskzen-editor--drop-indicators.no-inline-attachments div.drop-indicator-attach {
  top: 115px;
}

.comment_input
  .deskzen-editor--attachments
  .deskzen-editor--attachment:not(.deskzen-editor--image)
  .deskzen-editor--corner {
  background-color: var(--background-default);
}

.comment_input.is-public
  .deskzen-editor--attachments
  .deskzen-editor--attachment:not(.deskzen-editor--image)
  .deskzen-editor--corner {
  background-color: var(--background-default);
}
.rich_text .comment_input .deskzen-editor--talk-callback-view {
  border-bottom: 3px solid transparent;
}
.new-editor-app-notify:after {
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 2px;
  position: absolute;
  background: rgb(var(--blue-600));
  margin: 2px -6px;
}

#new-app-tooltip {
  padding: 20px;
  width: 250px;
}

#discovery-app-tooltip {
  width: 255px;
  padding: 16px 18px 18px 18px;
}
html[data-rtl-language="true"] #discovery-app-tooltip {
  direction: rtl;
}
#discovery-app-tooltip a {
  color: rgb(var(--blue-600));
}
#discovery-app-tooltip span.close {
  top: 4px;
  right: 4px;
  width: auto;
}
html[data-rtl-language="true"] #discovery-app-tooltip span.close {
  left: 4px;
  right: auto;
}

#discovery-app-tooltip .close {
  top: 8px;
  right: 8px;
}

div.deskzen-editor--drop-indicators {
  z-index: 10;
}

/* Tooltip alignment */
.deskzen-editor--toolbar #editor-app-discovery:hover {
  color: rgb(var(--grey-600));
}

.deskzen-editor--toolbar #editor-app-discovery:hover:after {
  transform: translateX(0%);
  right: 1px;
}

html[data-rtl-language="true"] .deskzen-editor--toolbar #editor-app-discovery:hover:after {
  right: auto;
  left: 1px;
}

.deskzen-editor--toolbar.sticky {
  z-index: 1;
  margin-top: 1px;
}
/* END ./app/assets/stylesheets/areas/ticket_comment_rich_text.scss */
/* BEGIN ./app/assets/stylesheets/areas/ticket_merge.scss */
.merge-holder {
  overflow-y: auto;
  max-height: 90vh;
  width: 660px;
  margin-left: -330px;
}
.merge-holder .modal-body {
  max-height: none;
  overflow-x: hidden;
}
.merge-holder p.option {
  padding-bottom: 0;
}
.merge-holder label {
  padding-top: 6px;
  font-size: 14px;
  line-height: 18px;
  float: none;
  width: auto;
  text-align: left;
  color: inherit;
}
.merge-holder h3,
.merge-holder h4,
.merge-holder h5,
.merge-holder h6 {
  line-height: 18px;
}
.merge-holder .merge_window {
  width: 630px;
  background-color: var(--background-recessed);
  color: var(--foreground-default);
}
.merge-holder .merge_window h2 {
  margin: 0 0 10px 0;
  padding: 0;
  font-size: 23px;
  font-weight: 400;
}
.merge-holder .merge_window .review {
  background-color: var(--background-warning);
  border: 1px solid var(--border-warning);
  border-radius: 4px;
  margin-bottom: 10px;
  font-size: 14px;
}
.merge-holder .merge_window .review p {
  margin: 7px;
  padding: 0;
  text-align: center;
  color: var(--foreground-subtle);
}
.merge-holder .merge_window .option {
  height: 30px;
  margin: 0;
  text-align: center;
  cursor: default;
}
.merge-holder .merge_window .option hr {
  background-color: var(--border-default);
  color: var(--border-default);
  height: 1px;
  border: none;
  margin-top: 35px;
  margin-bottom: -8px;
}
.merge-holder .merge_window .option .border {
  padding: 10px 15px;
  background-color: var(--background-recessed);
}
.merge-holder .merge_window .option .text {
  font-style: italic;
  background-color: var(--background-emphasis);
  padding: 7px 9px;
  color: var(--background-default);
  border-radius: 15px;
}
.merge-holder .merge_window .ticket_badge {
  font-size: 12px;
  width: 80px;
  margin-bottom: 5px;
  text-align: center;
  color: var(--background-default);
  float: left;
  display: block;
  margin-right: 10px;
  background-color: var(--background-emphasis);
  border-radius: 2px;
  padding: 3px;
  line-height: 14px;
}
html[data-rtl-language="true"] .merge-holder .merge_window .ticket_badge {
  float: right;
  margin-left: 10px;
  margin-right: 0;
}
.merge-holder .merge_window .ticket_date {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--foreground-subtle);
  display: block;
}
.merge-holder .merge_window .winner_selector {
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 160px;
}
.merge-holder .merge_window .user_card,
.merge-holder .merge_window .ticket_card {
  border: 5px solid var(--background-default);
  padding: 12px;
  box-shadow: 1px 1px 1px 1px var(--border-default);
}
.merge-holder .merge_window .user_card img,
.merge-holder .merge_window .ticket_card img {
  float: left;
  margin-right: 10px;
  height: 48px;
  width: 48px;
}
.merge-holder .merge_window .user_card a,
.merge-holder .merge_window .user_card h3,
.merge-holder .merge_window .ticket_card a,
.merge-holder .merge_window .ticket_card h3 {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 2px;
  display: block;
}
.merge-holder .merge_window .user_card {
  width: 245px;
  height: 51px;
  margin: 0 20px 20px 0;
}
.merge-holder .merge_window .ticket_card .card_header h3 {
  margin: 5px 0 0 70px;
  font-size: 15px;
  color: var(--foreground-default);
  /* Grey-800 */
}
.merge-holder .merge_window .ticket_card .card_body {
  margin: 15px 0 0 75px;
  padding-top: 10px;
  border-top: 1px solid var(--border-subtle);
}
.merge-holder .merge_window label {
  display: block;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 8px;
}
html[data-rtl-language="true"] .merge-holder .merge_window label {
  text-align: right;
}
.merge-holder .merge_window form p {
  color: var(--foreground-subtle);
}
.merge-holder .merge_window form .button {
  margin-left: 8px;
}
html[data-rtl-language="true"] .merge-holder .merge_window form .button {
  margin-left: 0;
  margin-right: 8px;
}
.merge-holder .merge_window form input[type="text"] {
  width: 244px;
}
.merge-holder .merge_window form textarea {
  font-size: 14px;
  margin: 10px 0;
  resize: vertical;
  min-height: 60px;
}
.merge-holder .merge_window #user_loser {
  padding: 12px 20px 20px 20px;
}
.merge-holder .merge_window #user_loser .user_card {
  margin: 0 auto;
}
.merge-holder .merge_window #user_winner {
  padding: 60px 0 20px 20px;
}
.merge-holder .merge_window #user_winner #winner_suggestions .user_card {
  float: left;
}
.merge-holder .merge_window #ticket_loser {
  padding: 12px 20px 20px 20px;
}
.merge-holder .merge_window #ticket_winner {
  padding: 60px 20px 20px 20px;
}
.merge-holder .merge_window #ticket_winner .confirm {
  margin-top: 20px;
  float: right;
}
.merge-holder .merge_window #ticket_winner h4 {
  color: var(--foreground-subtle);
  margin-top: 5px;
  font-weight: 400;
}
.merge-holder .merge_window #ticket_winner #suggestion_columns .column {
  width: 100%;
  float: left;
  padding-left: 0;
  margin: 0;
  max-height: 200px;
  overflow-y: auto;
}
.merge-holder .merge_window #ticket_winner #suggestion_columns .column:first-child {
  padding-right: 4%;
  padding-left: 0;
}
.merge-holder .merge_window #ticket_winner #suggestion_columns .column ul li {
  list-style-type: none;
  margin: 15px 0 0 0;
  font-size: 14px;
  display: inline-block;
  width: 46%;
  margin-right: 3%;
}
.merge-holder .merge_window #ticket_winner #suggestion_columns .column ul li:first-child {
  margin-top: 10px;
}
.merge-holder .merge_window #ticket_winner #suggestion_columns .column ul li a {
  display: block;
  margin-left: 70px;
  font-size: 12px;
}
html[data-rtl-language="true"] .merge-holder .merge_window #ticket_winner #suggestion_columns .column ul li a {
  margin-left: 0;
  margin-right: 70px;
}
.merge-holder .merge_window #ticket_winner #winner_suggestions {
  margin-top: 10px;
}
.merge-holder #confirm_user_merge #user_loser {
  background-position: 0 224px;
}
.merge-holder #confirm_user_merge #user_winner {
  padding: 60px 20px 20px 20px;
}
.merge-holder #confirm_user_merge #user_winner .user_card {
  float: none;
  margin: 0 auto;
  border: 3px solid var(--border-successEmphasis);
  padding: 14px;
  box-shadow: none;
}
.merge-holder #confirm_user_merge #user_winner .button {
  float: right;
  margin: 20px 0 0 0;
}
.merge-holder .user_card h3,
.merge-holder .user_card span {
  display: block;
  float: left;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 180px;
}
.merge-holder .wait-note {
  min-width: 300px;
  font-size: 15px;
  font-weight: 600;
  color: var(--foreground-subtle);
  padding: 30px;
  text-align: center;
}
.merge-holder .user-merge-autocompleter {
  margin: 10px 0;
  width: 256px;
  display: inline-block;
}

/* END ./app/assets/stylesheets/areas/ticket_merge.scss */
/* BEGIN ./app/assets/stylesheets/areas/ticket_footer.scss */
.ticket .ticket-resolution-footer {
  background: var(--background-default);
  height: 49px;
  padding: 0;
  border-top: 1px solid var(--border-default);
  border-left: 1px solid var(--border-default);
}
html[data-rtl-language="true"] .ticket .ticket-resolution-footer {
  border-left: none;
  border-right: 1px solid var(--border-default);
}
.ticket .ticket-resolution-footer .action_buttons {
  float: left;
  width: 210px;
}
html[data-rtl-language="true"] .ticket .ticket-resolution-footer .action_buttons {
  float: right;
}
.ticket .ticket-resolution-footer .action {
  margin-left: 5px;
}
html[data-rtl-language="true"] .ticket .ticket-resolution-footer .action {
  float: left;
}
.ticket .ticket-resolution-footer .post-save-actions {
  float: right;
}
html[data-rtl-language="true"] .ticket .ticket-resolution-footer .post-save-actions {
  float: left;
}
.ticket .ticket-resolution-footer .post-save-actions .dropdown-container {
  padding: 0;
  border-width: 0;
}
.ticket .ticket-resolution-footer .post-save-actions .dropdown-toggle:after {
  background-color: var(--foreground-default);
  mask-image: url(/agent/assets/icons/14-chevron-c17f2575323bf5fb21969e6559921db2.svg);
  border: none;
  height: 14px;
  margin: 0;
  opacity: 0.4;
  width: 14px;
  content: "";
  display: inline-block;
}
.ticket .ticket-resolution-footer .post-save-actions.dropup .dropdown-toggle:after {
  border-top: 0;
}
.ticket .ticket-resolution-footer .post-save-actions.dropdown .dropdown-toggle:after {
  border-bottom: 0;
}

/* END ./app/assets/stylesheets/areas/ticket_footer.scss */
/* BEGIN ./app/assets/stylesheets/areas/dashboard.scss */
.dashboard .right {
  overflow: hidden;
}

.dashboard .dashboard-top-panel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 141px;
  overflow: hidden;
}
html[data-rtl-language="true"] .dashboard .dashboard-top-panel {
  direction: rtl;
}

.dashboard .filter-grid-list {
  top: 141px;
}

h2.list-heading {
  white-space: nowrap;
  padding: 12px 0 9px 15px;
  line-height: 18px;
  font-size: 14px;
  background-color: var(--background-default);
  border-bottom: 1px solid var(--border-default);
  margin-bottom: 1px;
}
html[data-rtl-language="true"] h2.list-heading {
  direction: rtl;
  padding: 12px 15px 9px 0;
}
h2.list-heading .link {
  font-size: 12px;
  font-weight: 400;
  border-bottom: 1px dotted;
  margin-left: 3px;
}
h4.list-heading {
  white-space: nowrap;
  padding: 12px 0 9px 15px;
  font-size: 14px;
  background-color: var(--background-default);
  border-bottom: 1px solid var(--border-default);
  margin-bottom: 1px;
}
html[data-rtl-language="true"] h4.list-heading {
  direction: rtl;
  padding: 12px 15px 9px 0;
}
h4.list-heading .link {
  font-size: 12px;
  font-weight: 400;
  border-bottom: 1px dotted;
  margin-left: 3px;
}

/* END ./app/assets/stylesheets/areas/dashboard.scss */
/* BEGIN ./app/assets/stylesheets/areas/dashboard_activities.scss */
.activities {
  margin: 5px 15px 5px 15px;
  word-wrap: break-word;
}
html[data-rtl-language="true"] .activities {
  direction: rtl;
}
.activities h2 {
  line-height: 36px;
  font-size: 14px;
}
.activities h2,
.activities .activities-title .no-updates {
  margin-left: 0px;
}
.activities h2.activities-title {
  color: var(--foreground-default);
  margin: 0;
  float: none;
  display: block;
  font-size: 14px;
  font-weight: 600;
}
.activities h4 {
  line-height: 36px;
  font-size: 14px;
}
.activities h4,
.activities .no-updates {
  margin-left: 0px;
}
.activities .wrapper {
  margin-bottom: 15px;
}
.activities .item {
  margin-bottom: 5px;
  background-color: var(--background-default);
  border: 1px solid var(--border-default);
  /* Grey-300 */
  border-radius: 6px;
  position: relative;
  padding: 13px;
  cursor: pointer;
}
.activities .item:hover {
  border-color: rgb(var(--green-400));
}
.activities .description {
  margin-left: 35px;
  line-height: 16px;
  color: rgb(var(--grey-700));
}
html[data-rtl-language="true"] .activities .description {
  margin-left: 0;
  margin-right: 35px;
}
.activities .description strong {
  color: var(--foreground-default);
  /* Grey-800 */
}
.activities .comment_value {
  margin: 5px 0 0 35px;
  color: rgb(var(--grey-600));
  line-height: 16px;
}
html[data-rtl-language="true"] .activities .comment_value {
  margin: 5px 35px 0 0;
}
.activities time {
  display: block;
  font-size: 12px;
  color: rgb(var(--grey-400));
  /* Grey-400 */
  margin-left: 35px;
  margin-top: 5px;
}
html[data-rtl-language="true"] .activities time {
  margin-left: 0;
  margin-right: 35px;
}
.activities .profile {
  width: 25px;
  height: 25px;
  float: left;
  margin-top: 2px;
  border-radius: 4px;
}
html[data-rtl-language="true"] .activities .profile {
  float: right;
}

/* END ./app/assets/stylesheets/areas/dashboard_activities.scss */
/* BEGIN ./app/assets/stylesheets/areas/dashboard_indicators.scss */
.indicators {
  min-width: 100000px;
  background-color: var(--background-sidepanel);
  border-bottom: 1px solid var(--border-default);
  /* Grey-300 */
}
.indicators .stats-group {
  margin: 10px 0 20px 15px;
  float: left;
}
html[data-rtl-language="true"] .indicators .stats-group {
  margin: 10px 15px 20px 0;
  float: right;
}
.indicators .stats-group + .stats-group {
  margin-left: 20px;
}
html[data-rtl-language="true"] .indicators .stats-group + .stats-group {
  float: right;
  margin-left: 0;
  margin-right: 20px;
}
.indicators h2 {
  font-size: 12px;
  font-weight: 600;
  line-height: 22px;
}
.indicators h2 > span {
  color: var(--foreground-subtle);
  font-weight: 400;
}
.indicators h4 {
  font-size: 12px;
  font-weight: 600;
  line-height: 22px;
}
.indicators h4 > span {
  color: var(--foreground-subtle);
  font-weight: 400;
}
.indicators ul {
  margin: 0;
  float: left;
  overflow: auto;
  padding: 0;
  background-color: var(--background-default);
  border: 1px solid var(--border-default);
  border-radius: 4px;
}
html[data-rtl-language="true"] .indicators ul {
  margin-right: 0;
}
.indicators li {
  padding: 6px 3px;
  min-width: 77px;
  font-size: 14px;
  text-align: center;
  float: left;
}
html[data-rtl-language="true"] .indicators li {
  float: right;
}
.indicators li.clickable {
  cursor: pointer;
}
.indicators li.active {
  background-color: var(--background-warning);
}
.indicators li:not(.hidden) + li {
  border-left: 1px solid var(--border-default);
}
html[data-rtl-language="true"] .indicators li:not(.hidden) + li {
  border-left: 0;
  border-right: 1px solid var(--border-default);
}
.indicators .cell-value {
  font-size: 15px;
  font-weight: 600;
  color: var(--foreground-default);
  /* Grey-800 */
  line-height: 16px;
}
.indicators .cell-title {
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 400;
  color: var(--foreground-subtle);
}

/* END ./app/assets/stylesheets/areas/dashboard_indicators.scss */
/* BEGIN ./app/assets/stylesheets/areas/launchpad.scss */
.buy_now_btn {
  margin-top: 5px;
  font-size: 14px;
}

.stacked_menu {
  padding: 15px;
}
html[data-rtl-language="true"] .stacked_menu {
  direction: rtl;
}
.stacked_menu .section {
  margin-bottom: 25px;
}
.stacked_menu .section.info {
  font-weight: 600;
}
.stacked_menu .section.info .title {
  margin-bottom: 0;
}
.stacked_menu .section .title {
  font-weight: 600;
  margin-bottom: 15px;
  margin-left: 7px;
}
html[data-rtl-language="true"] .stacked_menu .section .title {
  margin-left: 0;
  margin-right: 7px;
}
.stacked_menu .section ul {
  margin-left: 0;
}
html[data-rtl-language="true"] .stacked_menu .section ul {
  margin-right: 0;
}
.stacked_menu .section ul li:first-of-type {
  border-top: 1px solid rgb(var(--grey-400));
  /* Grey-400 */
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.stacked_menu .section ul li:last-of-type {
  border-bottom-color: rgb(var(--grey-400));
  /* Grey-400 */
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}
.stacked_menu .section .task {
  background-color: var(--background-default);
  color: var(--foreground-default);
  /* Grey-800 */
  border: 1px solid rgb(var(--grey-400));
  /* Grey-400 */
  border-top: none;
  border-bottom-color: rgb(var(--grey-200));
  /* Grey-200 */
  padding: 13px 0;
  padding-left: 15px;
}
html[data-rtl-language="true"] .stacked_menu .section .task {
  padding-left: 0;
  padding-right: 15px;
}
.stacked_menu .section .task:hover,
.stacked_menu .section .task.active {
  background-color: rgb(var(--grey-100));
  cursor: pointer;
}
.stacked_menu .section .task.active {
  font-weight: 600;
  padding-left: 11px;
  border-left: 5px solid #99cc99;
}
html[data-rtl-language="true"] .stacked_menu .section .task.active {
  padding-left: 0;
  padding-right: 11px;
  border-left: 1px solid rgb(var(--grey-400));
  /* Grey-400 */
  border-right: 5px solid #99cc99;
}
.stacked_menu .section .task.skipped {
  text-decoration: line-through;
}
.stacked_menu .section .task .status {
  width: 26px;
  height: 26px;
  float: right;
  margin-right: 10px;
  margin-top: -5px;
}
html[data-rtl-language="true"] .stacked_menu .section .task .status {
  float: left;
  margin-left: 10px;
  margin-right: 0;
}
.stacked_menu .section .task.complete,
.stacked_menu .section .task.skipped {
  color: rgb(var(--grey-500));
  /* Grey-500 */
}
.stacked_menu .section .task.disabled {
  background-color: var(--background-default);
  cursor: default;
}
.stacked_menu .section .task.settings {
  padding: 0;
}
.stacked_menu .section .task.settings a {
  padding: 13px 0 13px 15px;
  color: var(--foreground-default);
  /* Grey-800 */
  width: 280px;
  display: block;
}

header.sub-nav .learn_more {
  color: rgb(var(--blue-600)) !important;
  float: right !important;
  padding-right: 0px !important;
}
header.sub-nav .learn_more:hover {
  text-decoration: none;
  color: rgb(var(--blue-800)) !important;
}

.tooltips.dark,
.tooltip-mask {
  background-color: rgba(var(--black), var(--opacity-300));
  opacity: 0;
  transition: opacity 0.5s ease 0s;
}
.tooltips.dark.solid,
.tooltip-mask.solid {
  opacity: 1;
}

.tooltips,
.tooltip-mask {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  z-index: 999;
}

#reporting-tooltip,
#onboarding-tooltip,
.buy-now-experiment-popup {
  position: absolute;
  background-color: rgb(var(--grey-900));
  width: 260px;
  padding: 15px 20px;
  border-radius: 5px;
  z-index: 1000;
  box-shadow: var(--shadow-small);
  cursor: default;
  opacity: 0;
}
#reporting-tooltip .diamond,
#onboarding-tooltip .diamond,
.buy-now-experiment-popup .diamond {
  position: absolute;
  height: 15px;
  width: 15px;
  background-color: rgb(var(--grey-900));
  transform: rotate(45deg);
}
#reporting-tooltip a.close-tooltip,
#onboarding-tooltip a.close-tooltip,
.buy-now-experiment-popup a.close-tooltip {
  color: rgb(var(--grey-500));
  font-size: 15px;
  position: absolute;
  right: 13px;
  top: 14px;
}
html[data-rtl-language="true"] #reporting-tooltip a.close-tooltip,
html[data-rtl-language="true"] #onboarding-tooltip a.close-tooltip,
html[data-rtl-language="true"] .buy-now-experiment-popup a.close-tooltip {
  left: 13px;
  right: auto;
}
#reporting-tooltip a.close-tooltip:hover,
#onboarding-tooltip a.close-tooltip:hover,
.buy-now-experiment-popup a.close-tooltip:hover {
  color: rgb(var(--grey-300));
}
#reporting-tooltip h4,
#onboarding-tooltip h4,
.buy-now-experiment-popup h4 {
  margin: 3px 5px;
  font-weight: 600;
  font-size: 17px;
  color: rgb(var(--grey-200));
  /* Grey-200 */
}
#reporting-tooltip p,
#onboarding-tooltip p,
.buy-now-experiment-popup p {
  margin: 10px 5px;
  font-size: 14px;
  color: rgb(var(--grey-200));
}
#reporting-tooltip p:last-of-type,
#onboarding-tooltip p:last-of-type,
.buy-now-experiment-popup p:last-of-type {
  margin-bottom: 40px;
}
#reporting-tooltip .navigation,
#onboarding-tooltip .navigation,
.buy-now-experiment-popup .navigation {
  width: 100%;
  height: 40px;
  background-color: rgb(var(--grey-900));
  position: absolute;
  left: 0px;
  bottom: 0px;
  text-align: center;
  border-radius: 0px 0px 5px 5px;
}
#reporting-tooltip .navigation .page,
#onboarding-tooltip .navigation .page,
.buy-now-experiment-popup .navigation .page {
  font-style: italic;
  color: rgb(var(--grey-600));
  font-weight: 600;
  line-height: 43px;
}
#reporting-tooltip .navigation button,
#onboarding-tooltip .navigation button,
.buy-now-experiment-popup .navigation button {
  float: right;
  margin-right: 15px;
  position: relative;
  top: 8px;
  padding: 2px 20px;
}
html[data-rtl-language="true"] #reporting-tooltip .navigation button,
html[data-rtl-language="true"] #onboarding-tooltip .navigation button,
html[data-rtl-language="true"] .buy-now-experiment-popup .navigation button {
  float: left;
  margin-left: 15px;
  margin-right: 0px;
}

#onboarding-tooltip {
  left: 415px;
  top: 205px;
}

#reporting-tooltip {
  right: 20px;
  top: 160px;
}
#reporting-tooltip .diamond {
  top: -6px;
  right: 40px;
}

#reporting-video-tutorial {
  position: absolute;
  width: 960px;
  height: 540px;
  margin: auto;
  z-index: 1000;
  left: 50%;
  top: 50%;
  margin-left: -480px;
  margin-top: -270px;
  background-color: rgb(var(--grey-200));
  /* Grey-200 */
  opacity: 0;
}
#reporting-video-tutorial .close-video {
  cursor: pointer;
  position: absolute;
  border-radius: 50%;
  height: 31px;
  right: -15px;
  top: -15px;
  width: 31px;
  background-color: rgb(var(--grey-600));
  font-size: 25px;
  line-height: 32px;
  text-align: center;
  color: var(--background-default);
  z-index: 1000;
  font-weight: 600;
}

.launchpad_content {
  /* proper rendering of iframes in FF & IE */
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: var(--background-recessed);
}
.launchpad_content > div {
  padding: 5px 15px;
}
.launchpad_content .iframe {
  width: 100%;
  height: 100%;
}

.launchpad_content {
  overflow: auto;
  margin-top: 15px;
}
.launchpad_content p {
  margin-bottom: 20px;
}
.launchpad_content .add_agents .agent_list {
  margin-bottom: 5px;
  padding: 7px 10px;
}
.launchpad_content .add_agents .hint {
  font-size: 12px;
  margin-left: 3px;
}
.launchpad_content .add_agents .btn-info {
  margin-top: 20px;
}
.launchpad_content .launchpad-task {
  text-align: center;
  padding: 25px 0px 0px 0px;
  margin: auto;
}
.launchpad_content .launchpad-task a:hover {
  text-decoration: underline;
}
.launchpad_content .launchpad-task h3 {
  margin: -8px 0px 20px 0px;
  font-size: 17px;
  color: var(--foreground-default);
  /* Grey-800 */
}
.launchpad_content .launchpad-task p {
  width: 63.5%;
  margin: 20px auto 15px;
  color: var(--foreground-default);
  /* Grey-800 */
}
.launchpad_content .launchpad-task p .learn-more {
  text-decoration: underline;
}
.launchpad_content .launchpad-task hr {
  background-color: rgb(var(--grey-200));
  /* Grey-200 */
  width: 70%;
  border: none;
  margin-left: auto;
  margin-right: auto;
}
.launchpad_content .launchpad-task + button {
  margin-top: 0px !important;
}
.launchpad_content .launchpad-task button {
  padding: 5px 25px;
  margin: 0px auto 10px;
  min-width: 110px;
  display: block;
}
.launchpad_content .launchpad-task .content {
  background-color: var(--background-default);
  position: relative;
  margin: 35px auto;
  border: 1px solid var(--border-default);
  border-radius: 5px;
  padding: 5px;
  box-shadow: 0 1px 2px var(--border-default);
  max-width: 900px;
  min-width: 480px;
}
.launchpad_content .launchpad-task .content .settings {
  display: block;
  width: 100%;
  height: 500px;
}
.launchpad_content .launchpad-task .content .classic-form iframe {
  height: 550px;
}
.launchpad_content .launchpad-task .content .classic-form.update-profile iframe {
  height: 800px;
}
.launchpad_content .launchpad-task .content .video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 0px;
  height: 0;
  overflow: hidden;
}
.launchpad_content .launchpad-task .content .video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.launchpad_content .launchpad-task .content .add_agents textarea {
  width: 95%;
  padding-bottom: 20%;
  margin-top: 20px;
}
.launchpad_content .launchpad-task .content .benchmark {
  background-color: var(--background-recessed);
}
.launchpad_content .launchpad-task .content .benchmark .survey {
  margin: 3px auto;
  padding: 30px 10px;
}
.launchpad_content .launchpad-task .content .triangle-up {
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-bottom: 14px solid var(--border-default);
  top: -14px;
  position: absolute;
  margin-left: -20px;
  margin-right: auto;
  left: 50%;
}
.launchpad_content .launchpad-task .content .triangle-up:before {
  content: " ";
  z-index: 0;
  width: 0;
  height: 0;
  border-left: 19px solid transparent;
  border-right: 19px solid transparent;
  border-bottom: 13px solid var(--background-default);
  position: absolute;
  margin-left: -19px;
  left: 50%;
  top: 1px;
}
.launchpad_content .launchpad-task .content .screenshot {
  display: block;
  margin-left: auto;
  margin-right: auto;
  height: 438px;
}
.launchpad_content .launchpad-task .content .getting-started-lm {
  width: 100%;
  height: 438px;
  padding: 25px 0;
}
.launchpad_content .launchpad-task .content .getting-started-lm h1 {
  padding: 25px 130px;
}
.launchpad_content .launchpad-task .done {
  float: right;
  margin-top: 10px;
  background-color: var(--background-default);
  background-image: none;
}
.launchpad_content .launchpad-task .done:hover {
  background-color: rgb(var(--grey-200));
  /* Grey-200 */
}

.modal-add-twitter {
  width: 575px;
}
.modal-add-twitter h1 {
  font-size: 20px;
  margin-bottom: 10px;
}
.modal-add-twitter .modal-body {
  background-color: rgb(var(--grey-200));
  /* Grey-200 */
  padding: 10px;
  margin: 15px;
}
.modal-add-twitter .login {
  border-radius: 0;
  color: var(--background-default);
  display: inline-block;
  font-size: 14px;
  line-height: 16px;
  padding: 0 0 0 1px;
}
.modal-add-twitter .login.twitter {
  background: rgb(var(--product-twitter)) url("/images/twitter_newbird_boxed_whiteonblue.png") left -5px no-repeat;
  border-top: 1px solid rgb(var(--blue-500));
  border-bottom: 1px solid rgb(var(--blue-800));
}
.modal-add-twitter .login.twitter span {
  background: rgb(var(--product-twitter));
  margin: 1px 2px 0 35px;
  padding: 4px 6px 5px 6px;
  display: inline-block;
}
.modal-add-twitter .modal-header,
.modal-add-twitter .modal-footer {
  display: none;
}

.benchmark {
  position: relative;
}
.benchmark .global,
.benchmark .industry {
  background-color: var(--background-default);
  padding: 5px;
  width: 200px;
  height: 385px;
  text-align: center;
  border: 1px solid var(--border-default);
  border-radius: 1px;
  box-shadow: 0 0 6px rgb(var(--grey-600));
  cursor: default;
}
.benchmark .global .category,
.benchmark .industry .category {
  background-color: var(--foreground-default);
  /* Grey-800 */
  color: var(--background-default);
  font-size: 14px;
  height: 50px;
  padding-top: 5px;
  line-height: 15px;
}
.benchmark .global .data,
.benchmark .industry .data {
  color: rgb(var(--green-400));
  font-size: 53px;
  font-weight: 400;
  line-height: 45px;
  padding-top: 20px;
  margin: 5px 0;
  height: 85px;
  position: relative;
}
.benchmark .global .description,
.benchmark .industry .description {
  color: rgb(var(--grey-600));
  font-size: 14px;
  font-weight: 400;
  position: absolute;
  top: 70px;
  width: 100%;
  text-shadow: none;
  line-height: 15px;
}
.benchmark .global .description span,
.benchmark .industry .description span {
  display: table-cell;
  height: 30px;
  width: 200px;
  vertical-align: middle;
}
.benchmark .announcement {
  position: absolute;
  left: 550px;
  top: 75px;
}
.benchmark .global .category span {
  display: table-cell;
  height: 45px;
  width: 200px;
  vertical-align: middle;
  line-height: 18px;
}
.benchmark .global .data {
  background-color: rgb(var(--grey-200));
  /* Grey-200 */
  text-shadow: rgba(var(--black), var(--opacity-600)) -1px -1px 0;
}
.benchmark .industry {
  position: absolute;
  left: 740px;
  top: 85px;
}
.benchmark .industry .data {
  color: var(--foreground-default);
  /* Grey-800 */
  background-color: var(--background-recessed);
}
.benchmark .industry .dim {
  color: rgb(var(--grey-600));
  margin-bottom: 3px;
}
.benchmark .unit {
  font-size: 23px;
  text-shadow: none;
}
.benchmark .survey {
  width: 100%;
  min-width: 810px;
  position: relative;
  padding-top: 40px;
}
.benchmark .survey select {
  width: 95%;
  margin: 0px 0px 10px;
  border: 1px solid rgb(var(--grey-400));
  /* Grey-400 */
  padding: 2px 2px 2px 5px;
}
html[data-rtl-language="true"] .benchmark .survey select {
  padding: 2px 5px 2px 2px;
}
.benchmark .survey select option {
  background-color: var(--background-default);
}
.benchmark .survey select:hover {
  background-color: var(--background-recessed);
}
.benchmark .survey hr {
  margin-bottom: 35px;
}
.benchmark .survey .hr-label {
  position: absolute;
  left: 0;
  top: 0;
  padding: 0px 7px;
  background-color: rgb(var(--green-400));
  color: var(--background-default);
  font-size: 11px;
}
.benchmark .survey input[type="text"] {
  margin-top: 10px;
  margin-left: 5px;
  text-align: center;
  width: 91%;
  height: 16px;
}
.benchmark .survey .industry,
.benchmark .survey .global,
.benchmark .survey .selection {
  position: relative;
  top: 0px;
  left: auto;
  float: left;
  box-shadow: none;
}
html[data-rtl-language="true"] .benchmark .survey .industry,
html[data-rtl-language="true"] .benchmark .survey .global,
html[data-rtl-language="true"] .benchmark .survey .selection {
  right: auto;
  float: right;
}
.benchmark .survey .selection {
  width: 300px;
  margin-right: 30px;
  text-align: right;
}
html[data-rtl-language="true"] .benchmark .survey .selection {
  margin-left: 30px;
  margin-right: 0;
}
.benchmark .survey .selection button {
  float: right;
}
.benchmark .survey .selection .inputs {
  margin-bottom: 30px;
}
.benchmark .survey .submit {
  width: 95%;
}
.benchmark .survey .vs {
  float: left;
  margin: 25px 7px;
  color: rgb(var(--grey-400));
  /* Grey-400 */
  font-size: 17px;
}
html[data-rtl-language="true"] .benchmark .survey .vs {
  float: right;
}
.benchmark .contextual-tooltip {
  float: left;
  margin-left: 15px;
  margin-top: 30px;
  clear: both;
}
html[data-rtl-language="true"] .benchmark .contextual-tooltip {
  float: right;
  margin-left: 0;
}
.benchmark .contextual-tooltip .tip {
  bottom: 47px;
  width: 410px;
}

html[lang|="ja"] #wrapper.os-windows .launchpad_content .tour_page.slide .content h3,
html[lang|="ja"] #wrapper.os-windows .launchpad_content .tour_page.slide .content p {
  font-family: inherit;
}

html[lang|="ja"] #wrapper.os-windows .launchpad_content .tour_page.slide .content h3 {
  font-size: 4.5em;
}

html[lang|="ja"] #wrapper.os-windows .launchpad_content .tour_page.slide .content p {
  font-size: 1.5em;
}

html[lang|="ja"] #wrapper.os-windows .benchmark .unit,
html[lang|="ja"] #wrapper.os-windows .benchmark .industry .description,
html[lang|="ja"] #wrapper.os-windows .benchmark .global .description,
html[lang|="ja"] #wrapper.os-windows .benchmark .industry .category,
html[lang|="ja"] #wrapper.os-windows .benchmark .global .category {
  font-size: 15px;
  top: 65px;
}

html[lang|="ja"] #wrapper.os-windows .benchmark .unit {
  font-size: 25px;
}

html[lang|="ja"] #wrapper .launchpad_content .tour_page.slide .content h3,
html[lang|="ja"] #wrapper .launchpad_content .tour_page.slide .content p {
  width: 415px;
}

/* END ./app/assets/stylesheets/areas/launchpad.scss */
/* BEGIN ./app/assets/stylesheets/areas/stacked_menus.scss */
.stacked_menu_settings {
  padding: 0 20px 40px 20px;
}
html[data-rtl-language="true"] .stacked_menu_settings {
  direction: rtl;
}
.stacked_menu_settings .section .title {
  font-size: 12px;
  font-weight: 600;
  padding: 10px 10px 16px 0;
  margin: 20px 0 8px 0;
  border-bottom: 1px solid rgb(var(--grey-200));
  /* Grey-200 */
}
.stacked_menu_settings .section .title i {
  opacity: 0.9;
}
.stacked_menu_settings .section .new-label {
  color: rgb(var(--blue-600));
  padding-left: 3px;
  font-size: 9px;
  font-weight: 600;
}
.stacked_menu_settings .section .external-link-icon {
  display: inline-block;
  position: relative;
  top: 2px;
  width: 12px;
  height: 12px;
}
html[data-rtl-language="true"] .stacked_menu_settings .section .external-link-icon {
  transform: rotate(-90deg);
}

/* END ./app/assets/stylesheets/areas/stacked_menus.scss */
/* BEGIN ./app/assets/stylesheets/areas/audit_notification_modal.scss */
.audit-notification-modal .cancel {
  float: left;
}

.audit-notification-modal .modal-body {
  max-height: 550px;
  padding: 0;
}
.audit-notification-modal .modal-body .body {
  padding: 15px;
}
.audit-notification-modal .modal-body table {
  margin: 0;
  color: rgb(var(--grey-600));
}
.audit-notification-modal .modal-body table tr:first-child th {
  width: 1px;
  white-space: nowrap;
}
.audit-notification-modal .modal-body table tr:first-child td,
.audit-notification-modal .modal-body table tr:first-child th {
  border-top: 0;
}
.audit-notification-modal .modal-body table tr:last-child th,
.audit-notification-modal .modal-body table tr:last-child td {
  border-bottom: 1px solid var(--border-default);
}
.audit-notification-modal .modal-body table th {
  padding-left: 15px;
}

/* END ./app/assets/stylesheets/areas/audit_notification_modal.scss */
/* BEGIN ./app/assets/stylesheets/areas/suspended_ticket.scss */
.suspended-ticket-modal .cancel {
  float: left;
}

.suspended-ticket-modal .dropdown-menu strong {
  font-weight: 400;
}

.suspended-ticket-modal .modal-body {
  max-height: 550px;
  padding: 0;
}
.suspended-ticket-modal .modal-body .body {
  padding: 15px;
}
.suspended-ticket-modal .modal-body table {
  margin: 0;
  color: rgb(var(--grey-600));
}
.suspended-ticket-modal .modal-body table tr:first-child td,
.suspended-ticket-modal .modal-body table tr:first-child th {
  border-top: 0;
}
.suspended-ticket-modal .modal-body table tr:last-child th,
.suspended-ticket-modal .modal-body table tr:last-child td {
  border-bottom: 1px solid var(--border-default);
}
.suspended-ticket-modal .modal-body table th {
  padding-left: 15px;
}

ul.recovery_notification {
  margin: 0 0 8px 8px;
}
ul.recovery_notification li {
  list-style: none;
  margin-top: 8px;
}

/* END ./app/assets/stylesheets/areas/suspended_ticket.scss */
/* BEGIN ./app/assets/stylesheets/areas/remove_organization_modal.scss */
.remove-organization-modal button:first-of-type {
  float: left;
}

.remove-organization-modal li {
  padding-bottom: 10px;
}

.remove-organization-modal .modal-body p:last-of-type {
  padding-bottom: 0;
}

/* END ./app/assets/stylesheets/areas/remove_organization_modal.scss */
/* BEGIN ./app/assets/stylesheets/areas/shared_onboarding.scss */
.email-onboarding-animation {
  width: 275px;
  height: 80px;
  margin: 0 auto 60px auto;
  position: relative;
}
.email-onboarding-animation > span {
  font-size: 14px;
  padding-top: 60px;
  background-position: top center;
  background-repeat: no-repeat;
}
.email-onboarding-animation > span.left-customer {
  background-image: url(/agent/assets/onboarding/customer-5254bc68e1fe1046f91c647f01d3ba11.png);
  background-size: 52px 52px;
  float: left;
}
.email-onboarding-animation > span.right-deskzen {
  background-image: url(/agent/assets/onboarding/support-shape-8626bac58acfeaed1428dd53ffdbac81.svg);
  background-size: 50px 50px;
  float: right;
  text-align: right;
}
.email-onboarding-animation .moving-email {
  width: 120px;
  height: 24px;
  margin: 0 auto 5px auto;
}
.email-onboarding-animation .moving-email.email-ltr {
  background: url(/agent/assets/onboarding/arrow_ltr-ef608ce0f90abc8fbdbf7ca220d29f04.svg) center center no-repeat;
  top: 44px;
}
.email-onboarding-animation .moving-email.email-rtl {
  background: url(/agent/assets/onboarding/arrow_rtl-0814cf573fcd27153185f16505dcbd28.svg) center center no-repeat;
}

@keyframes sending {
  0% {
    background-size: 0 0;
    background-position: 0 center;
  }
  3% {
    background-size: 24px 24px;
  }
  25% {
    background-size: 24px 24px;
  }
  48% {
    background-size: 0 0;
  }
  50% {
    background-position: 120px center;
  }
}
.email-onboarding-animation .moving-email > span {
  display: block;
  height: 24px;
  background: url(/agent/assets/onboarding/email-b54fb39ad310e7f199f85144baa6c3eb.svg) no-repeat;
  background-size: 0 0;
  animation: sending 6s infinite;
  animation-timing-function: ease-in-out;
  animation-delay: 1s;
}
.email-onboarding-animation .moving-email.email-rtl > span {
  animation-delay: 4s;
  transform: scaleX(-1);
}

/* END ./app/assets/stylesheets/areas/shared_onboarding.scss */
/* BEGIN ./app/assets/stylesheets/areas/standalone_product.scss */
.zd-standalone-product {
  position: absolute;
  left: 0;
  top: 50px;
  right: 0;
  bottom: 0;
}
.zd-standalone-product.has-navigation {
  left: 60px;
}
.zd-standalone-product iframe {
  width: 100%;
  height: 100%;
}

/* END ./app/assets/stylesheets/areas/standalone_product.scss */
/* BEGIN ./app/assets/stylesheets/launchpad/email_v2.scss */
.email-v2-content .email-v2 {
  margin: 60px 15px 40px 15px;
  padding: 50px 30px;
  color: var(--foreground-default);
  width: auto;
  margin: 0 auto;
}
.email-v2-content .email-v2 label {
  display: inline;
}
.email-v2-content .email-v2 div,
.email-v2-content .email-v2 p,
.email-v2-content .email-v2 h4,
.email-v2-content .email-v2 h5 {
  cursor: default;
}
.email-v2-content .email-v2 a:hover {
  text-decoration: none;
}
.email-v2-content .email-v2 h4 {
  color: var(--foreground-default);
  margin-top: 40px;
  margin-bottom: 5px;
  font-weight: 400;
  font-size: 17px;
}
.email-v2-content .email-v2 h5 {
  color: var(--foreground-default);
  font-weight: 500;
  font-size: 16px;
}
.email-v2-content .email-v2 hr {
  margin: 30px auto;
  width: 82%;
}
.email-v2-content .email-v2 .title {
  font-size: 20px;
  font-weight: 400;
  color: var(--foreground-default);
}
.email-v2-content .email-v2 .title + p {
  margin: 5px auto 30px;
  color: rgb(var(--grey-600));
  /* Grey-600 */
  font-weight: 400;
}
.email-v2-content .email-v2 .action-button {
  background-color: rgb(var(--blue-600));
  /* Blue-600 */
  border-color: rgb(var(--blue-600));
  color: var(--background-default);
  box-shadow: none;
  border-radius: 4px;
  transition:
    background-color 0.25s ease 0s,
    color 0.25s ease 0s;
  display: inline-block;
  font-size: 14px;
  letter-spacing: 1px;
  margin-bottom: 0px;
  padding: 11px 25px 10px;
  vertical-align: bottom;
}
.email-v2-content .email-v2 .action-button:hover {
  background-color: rgb(var(--blue-500));
  /* Blue-500 */
  border-color: rgb(var(--blue-500));
  color: var(--background-default);
}
.email-v2-content .email-v2 .action-button:active,
.email-v2-content .email-v2 .action-button.active {
  background-color: rgb(var(--blue-600));
  border-color: rgb(var(--blue-600));
  color: var(--background-default);
}
.email-v2-content .email-v2 .back-icon {
  float: left;
  padding: 0px 15px;
  margin-left: 9%;
  margin-top: -35px;
  font-size: 35px;
  color: rgb(var(--grey-600));
  transition: color 0.25s ease 0s;
}
.email-v2-content .email-v2 .back-icon:hover {
  text-decoration: none;
  color: var(--foreground-default);
}
.email-v2-content .email-v2 .capsule {
  background-color: rgb(var(--grey-200));
  max-height: 46px;
  overflow: hidden;
  border: 1px solid var(--border-default);
  padding: 0px 0px 10px 0px;
  box-sizing: border-box;
  border-radius: 3px;
  transition: all 0.25s ease 0s;
}
.email-v2-content .email-v2 .capsule.collapsed:hover {
  background-color: rgb(var(--blue-300));
  border-color: rgb(var(--blue-400));
}
.email-v2-content .email-v2 .capsule.collapsed .header .arrow.down {
  display: inline-block;
}
.email-v2-content .email-v2 .capsule.expanded {
  max-height: 999px;
  background-color: var(--background-default);
  border: 1px solid rgb(var(--green-600));
}
.email-v2-content .email-v2 .capsule.expanded .header .arrow.up {
  display: inline-block;
}
.email-v2-content .email-v2 .capsule .header {
  padding: 15px 25px;
  color: var(--foreground-default);
  font-weight: 600;
  cursor: pointer;
  position: relative;
  border-radius: 3px;
}
.email-v2-content .email-v2 .capsule .header .arrow {
  transform: scale(2, 1);
  display: none;
  font-size: 7px;
  color: rgb(var(--grey-600));
  line-height: 15px;
  position: absolute;
  right: 28px;
}
.email-v2-content .email-v2 .capsule .descriptions {
  display: table-cell;
  width: 60%;
  padding: 5px 25px;
  line-height: 150%;
  white-space: normal;
}
.email-v2-content .email-v2 .capsule .field {
  display: table-cell;
  width: 40%;
  vertical-align: middle;
  padding: 10px 25px;
}
.email-v2-content .email-v2 .contextual-tooltip {
  margin-left: 5px;
}
.email-v2-content .email-v2 .contextual-tooltip .info-icon {
  vertical-align: middle;
  width: 16px;
  height: 16px;
  font-size: 13px;
}
.email-v2-content .email-v2 .contextual-tooltip .tip {
  top: 0px;
  left: 21px;
}
.email-v2-content .email-v2 .contextual-tooltip .tip h5 {
  font-size: 12px;
  font-weight: 600;
}
.email-v2-content .email-v2 .contextual-tooltip .tip p {
  width: auto;
  margin: 10px 15px;
  color: var(--foreground-default);
}
.email-v2-content .email-v2 .description {
  color: var(--foreground-default);
  margin-bottom: 20px;
}
.email-v2-content .email-v2 .heading {
  font-weight: 400;
  color: var(--foreground-default);
}
.email-v2-content .email-v2 .bold {
  font-weight: 500;
  color: var(--foreground-default);
  padding: 0 10px;
}
.email-v2-content .email-v2 input[type="checkbox"] {
  display: inline-block;
  vertical-align: middle;
  margin-right: 3px;
}
.email-v2-content .email-v2 .icon {
  font-family: "entypo";
}
.email-v2-content .email-v2 .icon.new-page {
  color: rgb(var(--grey-500));
  /* Grey-500 */
  font-size: 25px;
  margin-left: 2px;
  vertical-align: sub;
  line-height: 40%;
}
.email-v2-content .email-v2 .input-section {
  margin: 30px auto;
  width: 420px;
  text-align: left;
}
.email-v2-content .email-v2 .input-section span {
  margin: 5px 0;
}
.email-v2-content .email-v2 .section {
  margin-top: 15px;
  margin-bottom: 40px;
}
.email-v2-content .email-v2 .hint {
  color: var(--foreground-default);
  margin: 5px auto;
  width: 100%;
}
.email-v2-content .email-v2 .outer {
  margin: 0 auto;
}
.email-v2-content .email-v2 .outer .left {
  float: left;
  margin-left: 9%;
}
.email-v2-content .email-v2 .outer .right {
  float: right;
  margin-right: 9%;
}
.email-v2-content .email-v2 .error {
  display: none;
  color: rgb(var(--red-600));
  padding: 5px 0;
}
.email-v2-content .email-v2 .error .circle-icon {
  border: 1px solid rgb(var(--red-600));
  color: rgb(var(--red-600));
  cursor: default;
  font-weight: 600;
  vertical-align: top;
}
.email-v2-content .email-v2 .error .circle-icon:hover {
  border-color: rgb(var(--red-600));
  color: rgb(var(--red-600));
}
.email-v2-content .email-v2 .error .error-text {
  margin-left: 5px;
  margin-top: 1px;
  display: inline-block;
  max-width: 292px;
  white-space: normal;
}
.email-v2-content .email-v2 .error .error-description {
  display: block;
  margin-top: 5px;
  color: var(--foreground-default);
  white-space: normal;
  line-height: 1.5;
}
.email-v2-content .email-v2 .show {
  display: block;
}
.email-v2-content .email-v2 .invalid-text-border {
  border: 1px solid rgb(var(--red-600));
}
.email-v2-content .email-v2 .select-disabled {
  -webkit-touch-callout: none;
  user-select: none;
}
.email-v2-content .email-v2 .circle-icon {
  color: rgb(var(--grey-400));
  /* Grey-400 */
  border: 1px solid rgb(var(--grey-400));
  /* Grey-400 */
  border-radius: 50%;
  width: 15px;
  height: 15px;
  font-family:
    "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  transition:
    color 0.25s ease 0s,
    border 0.25s ease 0s;
  display: inline-block;
  text-align: center;
  cursor: pointer;
}
.email-v2-content .email-v2 .circle-icon:hover {
  color: var(--foreground-default);
  border-color: var(--foreground-default);
}
.email-v2-content .email-v2 .circle-icon.left {
  float: left;
}
.email-v2-content .email-v2 .email-list {
  text-align: left;
  margin-left: 80px;
}
.email-v2-content .email-v2 .email-list li {
  margin-top: 5px;
  margin-right: 9%;
  position: relative;
}
.email-v2-content .email-v2 .email-list li > div {
  padding: 5px 10px 0 10px;
}
.email-v2-content .email-v2 .email-list li .email-action {
  display: inline-block;
  position: absolute;
  right: 10px;
}
.email-v2-content .email-v2 .email-list .edit-column {
  display: inline-block;
  margin: 10px 0 10px 15px;
  vertical-align: top;
}
.email-v2-content .email-v2 .email-list .email-column {
  width: 240px;
}
.email-v2-content .email-v2 .email-list .email-column input {
  border: none;
}
.email-v2-content .email-v2 .email-list .email-column .email-local {
  width: 75px;
  padding-right: 5px;
  margin-right: -2px;
  text-align: right;
}
.email-v2-content .email-v2 .email-list .email-column .email-domain {
  width: 125px;
  background-color: var(--background-recessed);
  color: rgb(var(--grey-400));
  /* Grey-400 */
  padding-left: 5px;
  text-align: left;
}
.email-v2-content .email-v2 .email-list .name-column {
  width: 200px;
}
.email-v2-content .email-v2 .email-list .name-column input {
  border: 0px;
  width: 190px;
}
.email-v2-content .email-v2 .email-list .editing {
  background-color: rgb(var(--grey-200));
  /* Grey-200 */
}
.email-v2-content .email-v2 .highlight {
  display: inline-block;
  color: var(--foreground-default);
  font-weight: 500;
  font-size: 16px;
  margin: 5px auto;
  padding: 10px 100px;
  border-radius: 4px;
  border-bottom: 2px;
}
.email-v2-content .email-v2 .steps {
  margin: 15px auto;
  position: relative;
  display: inline-block;
}
.email-v2-content .email-v2 .steps hr {
  margin-top: -13px;
  width: 80%;
}
.email-v2-content .email-v2 .circle {
  border-radius: 50%;
  width: 25px;
  height: 25px;
  background-color: rgb(var(--grey-400));
  color: var(--background-default);
  display: inline-block;
  text-align: center;
  font-size: 15px;
  line-height: 26px;
  margin-left: 20px;
  margin-right: 20px;
  cursor: default;
}
.email-v2-content .email-v2 .circle.active {
  background-color: rgb(var(--green-600));
  color: var(--background-default);
}
.email-v2-content .email-v2 .line {
  border-bottom: 1px solid rgb(var(--grey-800));
  width: 50px;
}
.email-v2-content .email-v2.ready ul {
  width: 60%;
  margin: auto;
  text-align: left;
  list-style: disc;
}
.email-v2-content .email-v2.ready ul li {
  padding: 3px 0px;
}
.email-v2-content .email-v2.ready .graphics {
  margin: 30px auto 5px;
}
.email-v2-content .email-v2.ready .highlight {
  background-color: rgb(var(--grey-100));
  /* Grey-100 */
  margin-bottom: 15px;
  font-size: 18px;
  min-width: 40%;
}
.email-v2-content .email-v2.forwarding h4.highlight {
  font-size: 18px;
  color: rgb(var(--grey-600));
  padding: 30px 5px;
  margin: 7px 0px;
  min-width: 100%;
  text-align: center;
  box-sizing: border-box;
}
.email-v2-content .email-v2.forwarding .outer .action-button {
  margin-top: -8px;
  margin-right: 9%;
}
.email-v2-content .email-v2.forwarding .email-input {
  max-width: 450px;
  text-align: left;
  display: inline-block;
  white-space: nowrap;
}
.email-v2-content .email-v2.forwarding .email-input .hint {
  font-size: 13px;
  margin: 5px 0px;
  max-width: 100%;
  line-height: 130%;
}
.email-v2-content .email-v2.forwarding .email-input .forwarding-email-input {
  padding: 8px 15px;
  margin-top: 7px;
  width: 290px;
  font-size: 14px;
}
.email-v2-content .email-v2.forwarding .email-input label {
  color: var(--foreground-default);
  /* Grey-800 */
  display: block;
  font-weight: 500;
  white-space: normal;
  display: inline-block;
  padding: 0 15px;
}
html[data-rtl-language="true"] .email-v2-content .email-v2.forwarding .email-input label {
  text-align: right;
}
.email-v2-content .email-v2.forwarding .error-box {
  display: none;
  width: 60%;
  box-sizing: border-box;
  border: 1px solid rgb(var(--grey-200));
  /* Grey-200 */
  border-radius: 4px;
  padding: 15px 15px 20px;
  margin: 0px auto 25px;
  text-align: left;
  background-color: var(--background-subtle);
}
.email-v2-content .email-v2.forwarding .error-box.show {
  display: inherit;
}
.email-v2-content .email-v2.forwarding .error-box .error {
  display: inherit;
  margin-left: 25px;
  position: relative;
}
.email-v2-content .email-v2.forwarding .error-box .error .circle-icon {
  position: absolute;
  top: 4px;
  left: -25px;
}
.email-v2-content .email-v2.forwarding .error-box .error .error-text {
  margin-left: 0px;
  font-weight: 600;
  font-size: 13px;
}
.email-v2-content .email-v2.forwarding .error-box .message {
  margin: 0px 25px;
  width: auto;
  color: var(--foreground-default);
}
.email-v2-content .email-v2.forwarding .help-content {
  margin: 10px 0px;
}
.email-v2-content .email-v2.forwarding .help-content code {
  width: 100%;
  display: inline-block;
  text-align: center;
  border: 1px solid var(--border-default);
  padding: 4px 0px;
  color: rgb(var(--red-600));
}
.email-v2-content .email-v2.forwarding .help-content code.loading {
  background: url(/agent/assets/icons/spinners/dotted_bar-b0db0a3419081443c8a7ae0747b9937d.gif) no-repeat 50%;
  background-size: 15% 37%;
}
.email-v2-content .email-v2.forwarding .confirmation-checkbox {
  margin: 35px auto 10px;
  width: 89.5%;
}
.email-v2-content .email-v2.forwarding .confirmation-checkbox span {
  display: inline-block;
  width: 95%;
  vertical-align: top;
  line-height: 150%;
}
.email-v2-content .email-v2.forwarding .graphics {
  padding-top: 30px;
  overflow: hidden;
}
.email-v2-content .email-v2.forwarding .graphics .check-mark {
  display: inline-block;
  font-family: "entypo";
  font-size: 180px;
  color: rgb(var(--green-600));
  height: 150px;
  width: 150px;
  line-height: 88%;
  border-radius: 50%;
  border: 2px solid rgb(var(--green-600));
  margin-bottom: 25px;
  margin-top: -30px;
}
#wrapper.os-windows .email-v2-content .email-v2.forwarding .graphics .check-mark {
  line-height: 37%;
}
.email-v2-content .email-v2.forwarding .image-asset {
  width: 400px;
  height: 150px;
  margin: 0px auto;
  padding: 20px 0px 30px;
}
.email-v2-content .email-v2.forwarding .email-static {
  background: url(/agent/assets/launchpad/email.png) no-repeat 50%;
  background-size: 35%;
}
.email-v2-content .email-v2.forwarding .email-animation {
  filter: grayscale(1);
  background: url(/agent/assets/launchpad/email_forwarding.gif) no-repeat 50%;
  background-size: 100%;
}
.email-v2-content .email-v2.forwarding .readings {
  text-align: left;
  margin-top: 15px;
}
.email-v2-content .email-v2.forwarding .readings h5,
.email-v2-content .email-v2.forwarding .readings p {
  width: 60%;
}
.email-v2-content .email-v2.forwarding .readings h5 {
  font-weight: 400;
  margin: auto;
}
.email-v2-content .email-v2.forwarding .success-message {
  width: 60%;
  margin: auto;
}
.email-v2-content .email-v2.welcome h4 {
  font-size: 20px;
}
.email-v2-content .email-v2.welcome h4.highlight {
  padding: 8px 35px;
  margin-top: 10px;
}
.email-v2-content .email-v2.welcome .options {
  width: 84.5%;
  display: inline-block;
  margin: 25px auto 20px;
}
.email-v2-content .email-v2.welcome .option {
  display: inline-block;
  position: relative;
  width: 33.5%;
  vertical-align: top;
  margin: 30px 10px 10px;
  padding: 10px 3% 65px;
  background-color: rgb(var(--grey-100));
  /* Grey-100 */
  border-radius: 4px;
}
.email-v2-content .email-v2.welcome .option .icon {
  font-size: 120px;
  line-height: 110px;
}
#wrapper.os-windows .email-v2-content .email-v2.welcome .option .icon {
  line-height: 40%;
}
.email-v2-content .email-v2.welcome .option h5 {
  margin: 0;
}
.email-v2-content .email-v2.welcome .option .highlight {
  display: inline-block;
  margin-bottom: 15px;
}
.email-v2-content .email-v2.welcome .option .hint {
  font-size: 14px;
  margin: 5px 0 30px;
}
.email-v2-content .email-v2.welcome .option .action-footer {
  position: absolute;
  bottom: 25px;
  left: 0;
  text-align: center;
  width: 100%;
}

/* END ./app/assets/stylesheets/launchpad/email_v2.scss */
/* BEGIN ./app/assets/stylesheets/bootstrap-image-gallery.scss */
/**
 * Bootstrap Image Gallery CSS 2.5.2
 * https://github.com/blueimp/Bootstrap-Image-Gallery
 *
 * Copyright 2011, Sebastian Tschan
 * https://blueimp.net
 *
 * Licensed under the MIT license:
 * http://www.opensource.org/licenses/MIT
 */
.modal-gallery {
  width: auto !important;
  max-height: none;
  outline: none;
}

.modal-gallery .modal-body {
  max-height: none;
}

.modal-gallery .modal-title {
  display: inline-block;
  max-height: 54px;
  overflow: hidden;
}

.modal-gallery .modal-image {
  position: relative;
  margin: auto;
  min-width: 128px;
  min-height: 128px;
  overflow: hidden;
  cursor: pointer;
}

.modal-gallery .modal-image:hover:before,
.modal-gallery .modal-image:hover:after {
  content: "\2039";
  position: absolute;
  top: 50%;
  left: 15px;
  width: 40px;
  height: 40px;
  margin-top: -20px;
  font-size: 60px;
  line-height: 30px;
  color: var(--background-default);
  text-align: center;
  background: rgb(var(--grey-800));
  border: 3px solid var(--background-default);
  border-radius: 23px;
  opacity: 0.5;
  z-index: 1;
}

.modal-gallery .modal-image:hover:after {
  content: "\203A";
  left: auto;
  right: 15px;
}

.modal-single .modal-image:hover:before,
.modal-single .modal-image:hover:after {
  display: none;
}

.modal-loading .modal-image {
  background: url(/agent/assets/icons/spinners/loading_2x_ff-5a32811d96bf097f7015d132aba9765f.gif) center no-repeat;
}

.modal-gallery.fade .modal-image {
  transition:
    width 0.15s ease,
    height 0.15s ease;
}

.modal-gallery .modal-image * {
  position: absolute;
  top: 0;
  opacity: 0;
}

.modal-gallery.fade .modal-image * {
  transition: opacity 0.5s linear;
}

.modal-gallery .modal-image *.in {
  opacity: 1;
}

.modal-fullscreen {
  border: none;
  border-radius: 0;
  background: transparent;
  overflow: hidden;
}

.modal-fullscreen.modal-loading {
  border: 0;
  box-shadow: none;
}

.modal-fullscreen .modal-body {
  padding: 0;
}

.modal-fullscreen .modal-header,
.modal-fullscreen .modal-footer {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  opacity: 0;
  z-index: 2000;
}

.modal-fullscreen .modal-footer {
  top: auto;
  bottom: 0;
}

.modal-fullscreen .close,
.modal-fullscreen .modal-title {
  color: var(--background-default);
  text-shadow: 0 0 2px rgba(var(--grey-1000), var(--opacity-1000));
}

.modal-fullscreen .modal-header:hover,
.modal-fullscreen .modal-footer:hover {
  opacity: 1;
}

@media (max-width: 767px) {
  .modal-gallery .btn span {
    display: none;
  }
  .modal-fullscreen {
    right: 0;
    left: 0;
  }
}

.modal-footer .btn.modal-download {
  margin-left: 5px;
  float: left;
}
.modal-footer .btn.modal-download.legacy-download-link {
  display: none;
}

html[data-rtl-language="true"] .bidi {
  direction: rtl;
  text-align: right;
}
html[data-rtl-language="true"] label.bidi input {
  float: left;
}
html[data-rtl-language="true"] .zd-player {
  direction: ltr;
}
html[data-rtl-language="true"] .bidi-phone {
  direction: ltr;
  unicode-bidi: bidi-override;
}
html[data-rtl-language="true"] .bidi-time {
  direction: ltr;
  unicode-bidi: bidi-override;
  float: left;
  margin-left: 155px;
  margin-right: 5px;
}
html[data-rtl-language="true"] .bidi-override-ltr {
  direction: ltr;
  unicode-bidi: bidi-override;
}

/* New Organization Modal */
html[data-rtl-language="true"] .modal-header h3.bidi-element {
  float: right;
}
html[data-rtl-language="true"] a.close.bidi-element {
  float: inherit;
  margin-left: 5px;
}
html[data-rtl-language="true"] .btn-inverse.bidi-element {
  float: left;
}
html[data-rtl-language="true"] .btn.bidi-element {
  float: left;
}
html[data-rtl-language="true"] label.bidi > span.bidi-element {
  margin-top: 0;
}

/* Reset Sort Order Message Positioning */
html[data-rtl-language="true"] section.filters .right header h1 span {
  right: 125px;
}

/* Overrides for deskzen_menus.scss */
html[data-rtl-language="true"] .zd-icon-arrow-right,
html[data-rtl-language="true"] .zd-icon-arrow-left {
  left: 9px;
  right: inherit;
  transform: rotate(180deg);
}
html[data-rtl-language="true"] .zd-menu-item-icon {
  left: auto;
  right: 7px;
}

/* Overrides for _navs.scss */
html[data-rtl-language="true"] .nav {
  margin-right: 0;
}
html[data-rtl-language="true"] .filter-list-editor .nav-pills > li {
  float: right;
}
html[data-rtl-language="true"] .nav-pills > li > a {
  margin-left: 2px;
  margin-right: 0;
}

/* vendor overrides for rtl */
html[data-rtl-language="true"] .modal {
  direction: rtl;
}
html[data-rtl-language="true"] .modal.people_form {
  direction: inherit;
}
html[data-rtl-language="true"] .popover.ticket_summary {
  direction: rtl;
}
html[data-rtl-language="true"] .table-condensed td {
  text-align: right;
}

html[data-rtl-language="true"] .zd-tag-editor-holder .zd-searchmenu-base {
  text-align: right;
  padding-left: 3px;
  padding-right: 8px;
  margin-left: 0;
  margin-right: 1px;
}
html[data-rtl-language="true"] .zd-tag-item {
  margin: 0 0 3px 3px;
  padding: 3px 6px 4px 17px;
}
html[data-rtl-language="true"] .zd-tag-close {
  left: 1px;
  right: auto;
  padding: 3px;
  padding-left: 2px;
}
html[data-rtl-language="true"] .zd-icon-arrow-down {
  left: 7px;
  right: auto;
}
html[data-rtl-language="true"] .zd-icon-arrow-up {
  left: 7px;
  right: auto;
}
html[data-rtl-language="true"] .zd-selectmenu-base {
  text-align: right;
  padding: 0 5px 0 0;
}
html[data-rtl-language="true"] .macro-selector .zd-selectmenu-base .icon {
  margin: 2px 0 0 2px;
}
html[data-rtl-language="true"] .zd-selectmenu-base-content {
  direction: rtl;
  padding-left: 22px;
  padding-right: 0;
}
html[data-rtl-language="true"] .zd-menu-list-holder {
  direction: rtl;
  margin-right: 0;
}
html[data-rtl-language="true"] .zd-menu-item.group > a {
  padding-left: 0;
  padding-right: 27px;
}
html[data-rtl-language="true"] .zd-menu-item.agent > a {
  padding-left: 0;
  padding-right: 27px;
}
/*
 * SVG icons that can be reflected as in a mirror
 *
 * Example:
 *   <span class="svg-reflectible"><svg>...</svg></span>
 *
 */
html[data-rtl-language="true"] .svg-reflectible > svg {
  transform: scaleX(-1);
}

/* END ./app/assets/stylesheets/rtl.scss */
/* END ./app/assets/stylesheets/application.scss */

.l-float-right {
  float: right;
}

/* New Agent Home */
.AgentHome .pane,
.AgentHome .pane > .ember-view {
  bottom: 0;
}

/* Polaris conversation log layout and scrolling */

.polaris-react-component,
.polaris-react-component *,
.polaris-react-component *::after,
.polaris-react-component *::before {
  box-sizing: border-box;
}

.omni-conversation-pane .ember-view {
  max-width: 100%;
}

.omni-conversation-pane {
  display: flex;
  flex: 1;
  min-block-size: 0;
  min-inline-size: 0;
}

.omni-conversation-pane .ember-view:first-child {
  display: flex;
  flex: 1;
  min-block-size: 0;
  min-inline-size: 0;
  flex-direction: column;
}

.ticket.section.polaris {
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.conversation-polaris {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-block-size: 0;
  min-inline-size: 0;
}

.conversation-polaris__header {
  flex: 0 0 auto;
}

.conversation-polaris__body {
  flex: 1 0 0;
  overflow-x: hidden;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

.conversation-polaris__footer {
  background: var(--background-default);
  flex: 0 0 auto;
  padding: 0 20px;
}

.conversation-polaris__body--fixed {
  position: relative;
}

.conversation-polaris__body--reversed {
  flex-direction: column-reverse;
}

.conversation-polaris__body--fixed {
  flex: 1 0 0;
  display: flex;
  flex-direction: column;
  overflow: auto;
}

.conversation-polaris__body--reversed-child {
  flex-direction: column;
}

.conversation-polaris__body--reversed,
.conversation-polaris__body--reversed-child,
.conversation-polaris__body--reversed-child > .polaris-react-component {
  height: 100%;
}

/* Border hack for spacing last element in flex display. See https://www.chenhuijing.com/blog/flexbox-and-padding */
.conversation-polaris__body .comment_input_wrapper,
.conversation-polaris__footer .comment_input_wrapper {
  border-bottom: 20px solid transparent;
  min-height: initial;
}

.conversation-polaris__body .event-container {
  padding-top: 6px;
  flex: 1;
}

.conversation-polaris__footer .event .content {
  margin: 0;
}

.conversation-polaris__body .comment_input .options {
  margin: 0;
}

.conversation-polaris__body .add_comment_attachment_buttons {
  margin: 0;
}

.polaris .conversation-polaris__body .comment_input {
  padding-bottom: 0;
}

.conversation-polaris .deskzen-editor--rich-text-comment {
  min-height: 46px;
  box-sizing: border-box;
  overflow: auto;
}

.conversation-polaris .translation_attribution_wrapper {
  margin-right: 20px;
}

.rich_text .conversation-polaris__body .comment-actions {
  align-items: center;
  height: 40px;
  border: 1px solid var(--border-default);
  border-radius: 4px 4px 0 0;
  border-bottom: none;
  display: flex;
}

/* Editor tabs adjustment to look like the garden */

.rich_text .conversation-polaris__body .comment-actions .btn {
  line-height: 37px;
  padding: 0 28px;
  margin-right: 0;
}

.rich_text .conversation-polaris__body .comment-actions .btn.active {
  color: rgb(var(--blue-600));
}

.rich_text .conversation-polaris__body .editor .deskzen-editor--rich-text-comment {
  border-radius: 0 !important;
}

.rich_text .conversation-polaris__body .comment_input .content {
  margin: 0px 16px;
}

/* Editor voice button adjustments */

.rich_text .conversation-polaris__body .comment_input .call-back {
  margin: 4px 4px 0 auto;
  height: 32px;
  justify-self: flex-end;
  width: 32px;
  box-sizing: border-box;
}

.rich_text .conversation-polaris__body .comment_input .call-back:hover {
  box-shadow: var(--shadow-small);
  border-radius: 4px;
}

.rich_text .conversation-polaris__body .comment_input .call-back .icon {
  margin-top: 0;
}

.rich_text .conversation-polaris__body .comment_input .call-back .toggle {
  margin-top: 0;
  padding: 3px 5px 4px 1px;
}

.rich_text .conversation-polaris__body .comment_input .header .call-back .caret {
  top: 13px;
  right: 26px;
}

.rich_text .conversation-polaris__body .editor {
  margin: 0;
}

.rich_text .conversation-polaris__body .comment_input {
  padding: 0;
}

.conversation-polaris__body .deskzen-editor--rich-text-container {
  border-radius: 0;
}

.conversation-polaris__body .comment_input:not(.is-public) .deskzen-editor--rich-text-container {
  background-color: rgb(var(--lemon-100));
  border-color: rgb(var(--lemon-200));
}

.polaris .conversation-polaris__body .email-deliverability-warnings {
  color: rgb(var(--yellow-700));
  display: block;
  line-height: 12px;
  padding: 3px 0;
  margin-bottom: -20px;
}

.polaris .conversation-polaris__body .email-deliverability-warnings .warning-icon {
  width: 12px;
  height: 12px;
}

.polaris .conversation-polaris__body .email-deliverability-warnings .warning-text {
  font-size: 12px;
  line-height: 12px;
}

.polaris .conversation-polaris__body .email-deliverability-warnings .warning-icon circle {
  fill: currentColor;
}

.polaris .conversation-polaris__body .email-deliverability-warnings .warning-icon path {
  stroke: currentColor;
}

.polaris .event:not(.is-public) .comment {
  background-color: rgb(var(--lemon-100));
  border-color: rgb(var(--lemon-200));
  margin-bottom: 0;
}

.polaris .event {
  padding: 10px 0;
}

.polaris .event .header .meta {
  top: 7px;
}

.polaris .event .header .meta time {
  color: rgb(var(--grey-600));
}

.polaris .zd-comment .signature {
  white-space: normal;
}

.polaris .zd-comment .signature p {
  margin-bottom: revert;
}

.react-growl-container .jGrowl {
  position: static;
  padding: 5px 0;
  float: right;
}

html[data-rtl-language="true"] .react-growl-container .jGrowl {
  float: left;
}

.redacted-image-content {
  width: 180px;
  height: 100px;
  background: var(--background-subtle);
  display: inline-flex;
  justify-content: center;
  padding: 12px;
  align-items: center;
  font-size: 12px;
  color: var(--foreground-subtle);
}

/* Grid layout in ticket workspace */
.ticket-workspace-grid {
  max-width: calc(100vw - 60px);
  min-width: 528px;
  display: grid;
  grid-template-columns: minmax(40px, max-content) minmax(auto, 1fr) minmax(48px, max-content);
  grid-template-areas: "ticket-fields-panel main-conversation-panel context-panel";

  position: absolute;
  top: 101px;
  left: 60px;
  right: 0;
  bottom: 50px;
}

html[data-rtl-language="true"] .ticket-workspace-grid {
  direction: rtl;
  left: 0;
  right: 60px;
}
.grid-ticket-fields-panel [class~="ember-view"]:empty {
  display: none;
}

/* Grid layout in ticket workspace - ticket fields */
.grid-ticket-fields-panel {
  grid-area: ticket-fields-panel;
  position: relative;
  width: 308px;
  border-right: 1px solid var(--border-default);
  box-sizing: border-box;
}
html[data-rtl-language="true"] .grid-ticket-fields-panel {
  border-left: 1px solid var(--border-default);
  border-right: 0;
}
.grid-ticket-fields-panel .pane.left.section.with-omnipanel {
  position: absolute;
  width: 100%;
  z-index: 8;
}

.zd-searchmenu.requester-menu.zd-state-focus.zd-state-open.ticket-panes-grid
  .zd-menu-root.zd-menu-panel-root.zd-menu-autofit-mode.zd-state-zero {
  min-width: 240px;
}

/* grid layout within ticket fields */
.grid-ticket-fields-panel .ticket-sidebar .ticket_fields .property_box:first-child {
  padding-top: 16px;
}
.grid-ticket-fields-panel .ticket-sidebar .ticket_fields .property_box {
  width: 100%;
  box-sizing: border-box;
  grid-template-columns: repeat(auto-fit, minmax(max(80px, calc((100% - 100px) / 6)), 1fr));
  display: grid;
  row-gap: 16px;
  column-gap: 20px;
  padding: 16px 20px;
}
.grid-ticket-fields-panel .ticket-sidebar .property_box.ticket_properties {
  padding-top: 16px;
}
.grid-ticket-fields-panel .ticket_fields .notification {
  margin: 12px 0px;
  width: 100%;
  box-sizing: border-box;
}
.grid-ticket-fields-panel .ticket-sidebar .zd-tag-menu-root {
  margin-top: 4px;
}
.grid-ticket-fields-panel .ticket-sidebar .sidebar_box_container label {
  margin: 0 !important;
  line-height: 1.7;
}
.grid-ticket-fields-panel .ticket-sidebar .property_box > .ember-view {
  grid-column: span 2;
}
.grid-ticket-fields-panel .ticket-sidebar .property_box.ticket_properties > .ember-view.form_field--narrow {
  grid-column: span 1;
  width: 100%;
  margin: 0;
}
.grid-ticket-fields-panel
  .ticket-sidebar
  .property_box.ticket_properties
  > .ember-view.form_field--narrow.expand-width {
  grid-column: span 2;
}

.grid-ticket-fields-panel .ticket-sidebar .property_box div.form_field,
.grid-ticket-fields-panel .ticket-sidebar .property_box > :last-child {
  margin-bottom: 0;
}

/* full width footer */
.grid-ticket-fields-panel .pane.left.section.with-omnipanel.with-full-width-footer {
  bottom: 0px;
}

/* Grid layout in ticket workspace - main conversation */
.grid-main-conversation-panel {
  grid-area: main-conversation-panel;
  position: relative;
}
.grid-main-conversation-panel .pane.right.section {
  border-right: 1px solid var(--border-default);
}
html[data-rtl-language="true"] .grid-main-conversation-panel .pane.right.section {
  border-right: 0;
  border-left: 1px solid var(--border-default);
}
.grid-main-conversation-panel .pane.right.section {
  left: 0px !important;
  right: 0px !important;
}
.grid-main-conversation-panel .app.pane.omnipanel.collapsed {
  min-width: 48px;
}
html:not([data-rtl-language="true"]) .grid-main-conversation-panel .pane.right.section.with_omnipanel_selector_only {
  border-right: 0;
}
html[data-rtl-language="true"] .grid-main-conversation-panel .pane.right.section.with_omnipanel_selector_only {
  border-left: 0;
}

/* Grid layout in ticket workspace - context panel */
.grid-context-panel {
  grid-area: context-panel;
  position: relative;
}
.grid-context-panel .omnipanel.app.pane {
  position: static;
}
/* ticket apps sidebar */
.grid-context-panel .with_omnipanel .workspace.apps:not(.ticket_editor_app),
.main_panes.flexible_layout .grid-context-panel .ticket-app-sidebar {
  width: calc(100% - 48px);
  top: 0px;
  bottom: 0;
  border-right: 0px;
  border-left: 0px;
}
/* non-react ticket apps sidebar */
.main_panes.flexible_layout .grid-context-panel .with_omnipanel .workspace.apps .app_container {
  width: calc(100%);
}
.grid-context-panel .with_omnipanel .workspace.apps:not(.ticket_editor_app) {
  right: auto;
}
html[data-rtl-language="true"] .grid-context-panel .with_omnipanel .workspace.is_active.apps:not(.ticket_editor_app) {
  border-right: none;
  right: 0px;
}
.grid-context-panel .with_omnipanel .workspace.apps:not(.ticket_editor_app).is_active {
  left: 0px !important;
}
/* react ticket apps sidebar */
.main_panes.flexible_layout .grid-context-panel .ticket-app-sidebar {
  visibility: hidden;
  left: -200vw;
}
html[data-rtl-language="true"] .main_panes.flexible_layout .grid-context-panel .ticket-app-sidebar {
  right: auto;
}
.main_panes.flexible_layout .grid-context-panel .ticket-app-sidebar.active {
  visibility: visible;
  left: 0;
  right: auto;
}
html[data-rtl-language="true"] .main_panes.flexible_layout .grid-context-panel .ticket-app-sidebar.active {
  border-right: none;
  left: auto;
  right: 0px;
}
.instant-buy {
  /*
  Ember modal window is used only as a container for the React Instant Buy modal window that is shown above,
  so there is no need to make it visible.
  */
  opacity: 0;
}
/* This hides the IFRAME that is blocking the UI on a React error when running in development */
iframe[style*="2147483647"] {
  display: none;
}

/*
 * Add the red styling on the delete item
 */
.organization-delete-list-item a {
  color: rgb(var(--red-600)) !important;
}

.organization-delete-list-item a:hover {
  background-color: var(--background-default) !important;
}

/*
 * Disable all CSS animations
 */
html.noanimations *,
html.noanimations *::before,
html.noanimations *::after {
  animation: none !important;
  transition: none !important;
}

html.no-color-animations *,
html.no-color-animations *::before,
html.no-color-animations *::after {
  transition-property: color, background-color, border-color !important;
  transition-duration: 0s !important;
  transition-delay: 0s !important;
  transition-timing-function: step-end !important; /* Ensures immediate change */
}

.notifications-growl-container-fixed-width {
  width: 360px;
}

.notifications-growl-container-fixed-width button {
  text-decoration-line: none;
}

.notifications-growl-container-fixed-width button:last-child svg {
  height: 12px;
  width: 12px;
}

/* --------------------- */
/* profile menu dropdown */
/* --------------------- */
.hOqBCa {
  z-index: 1000;
  margin-top: 8px;
  line-height: 0;
  font-size: 0.01px;
  color-scheme: light only;
}

.hOqBCa > * {
  display: inline-block;
  position: relative;
  margin: 0px;
  box-sizing: border-box;
  border: 1px solid rgb(216, 220, 222);
  border-radius: 4px;
  cursor: default;
  padding: 0px;
  text-align: left;
  white-space: normal;
  font-size: 14px;
  font-weight: 400;
  box-shadow: rgba(10, 13, 14, 0.16) 0px 20px 24px 0px;
  background-color: rgb(255, 255, 255);
  color: rgb(41, 50, 57);
}

.hOqBCa > :focus {
  outline: none;
}

.hOqBCa.is-animated > * {
  animation: 0.2s cubic-bezier(0.15, 0.85, 0.35, 1.2) 0s 1 normal none running gSzxJj;
}

.gJuyiT {
  max-height: calc(-50px + 100vh);
  overflow-y: auto;
  position: static !important;
}

.gJuyiT::before,
.gJuyiT::after {
  position: absolute;
  border-width: inherit;
  border-style: inherit;
  background-color: inherit;
  width: 10.49px;
  height: 10.49px;
  content: "";
  box-sizing: inherit;
}

.gJuyiT::before {
  border-color: inherit;
  clip-path: polygon(100% 2px, 2px 100%, 100% 100%);
}

.gJuyiT::after {
  border-color: transparent;
  background-clip: content-box;
  clip-path: polygon(100% 0px, 0px 100%, 100% 100%);
}

.gJuyiT::before,
.gJuyiT::after {
  transform: rotate(-135deg);
  top: -3.94px;
  right: 10.49px;
}

.gJuyiT.is-animated::before,
.gJuyiT.is-animated::after {
  animation: 0.3s ease-in-out 0s 1 normal none running jAsLVO;
}

.iovkUw {
  width: 300px;
}

.iovkUw:empty {
  width: 0px;
}

.hzqnff {
  display: block;
  position: relative;
  z-index: 0;
  cursor: default;
  padding: 8px 36px;
  text-decoration: none;
  line-height: 20px;
  overflow-wrap: break-word;
  user-select: none;
  background-color: inherit;
  color: rgb(132, 143, 153);
}

.hzqnff:first-child {
  margin-top: 4px;
}

.hzqnff:last-child {
  margin-bottom: 4px;
}

.hzqnff:focus {
  outline: none;
}

.eiDqja {
  display: flex;
  padding: 4px 0px;
}

.jdBPLe {
  display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  transition:
    box-shadow 0.25s ease-in-out,
    color 0.1s ease-in-out;
  margin: 0px;
  vertical-align: middle;
  box-sizing: border-box;
  border-radius: 50%;
  background-color: transparent;
  width: 32px !important;
  height: 32px !important;
}

.jdBPLe::before {
  box-shadow: 0px 0px 0px 2px inset;
}

.jdBPLe.jdBPLe {
  color: rgb(255, 255, 255);
}

.jdBPLe::before {
  position: absolute;
  top: 0px;
  left: 0px;
  transition: box-shadow 0.25s ease-in-out;
  content: "";
}

.jdBPLe::before,
.jdBPLe.jdBPLe > img {
  border-radius: inherit;
  width: 100%;
  height: 100%;
}

.jdBPLe.jdBPLe > img {
  box-sizing: inherit;
  vertical-align: bottom;
  object-fit: cover;
}

.jdBPLe > .StyledStatusIndicator-sc-16t9if3-0 {
  position: absolute;
  right: -2px;
  bottom: -2px;
  transition: 0.25s ease-in-out;
}

.clPeMH {
  position: relative;
}

.hKKdLI {
  flex-shrink: 0;
  box-shadow: rgb(145, 156, 165) 0px 0px 0px 2px;
}

.hKKdLI::after {
  display: inline-block;
  background-color: rgb(145, 156, 165);
}

.byjiTL {
  float: left;
  width: 16px;
  height: 16px;
  margin-top: 2px !important;
}

.erZLHt {
  transition: inherit;
  border: 2px solid rgb(145, 156, 165);
  border-radius: 8px;
  min-width: 8px;
  height: 8px;
  line-height: 8px;
  background-color: rgb(255, 255, 255);
  color: rgb(255, 255, 255);
}

.eaQMSc {
  max-width: calc(2em + 6px);
  box-sizing: content-box;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
  font-weight: 600;
  box-shadow: rgb(255, 255, 255) 0px 0px 0px 2px;
}

.bnkpby {
  overflow: hidden;
  padding-left: 8px;
}

.chxmyq {
  display: inline-block;
  vertical-align: top;
  margin-left: 12px;
  margin-right: 12px;
}

.eRAXfm {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  direction: ltr;
}

.bAUohh {
  color: rgb(41, 50, 57);
  font-weight: bold;
}

.bRytF {
  display: block;
  line-height: 16px;
  color: rgb(132, 143, 153);
  font-size: 12px;
}

.HgjiS {
  display: flex;
  align-items: flex-start;
  margin: 0px -2px;
  font-size: 14px;
}

.kUmoQK > * {
  max-width: 120px;
  color: rgb(92, 105, 112);
  font-size: 14px;
  margin: 0px 2px;
}

.cdRCzs {
  overflow: auto;
  max-height: 264px;
  margin-bottom: -4px;
}

.mfFUZ {
  display: block;
  position: relative;
  z-index: 0;
  cursor: pointer;
  padding: 8px 36px;
  text-decoration: none;
  line-height: 20px;
  overflow-wrap: break-word;
  user-select: none;
  background-color: inherit;
  color: rgb(41, 50, 57);
}

.mfFUZ:first-child {
  margin-top: 4px;
}

.mfFUZ:last-child {
  margin-bottom: 4px;
}

.mfFUZ:focus {
  outline: none;
}

.iSKitu {
  display: flex;
  align-items: flex-start;
  overflow-wrap: anywhere;
  margin: 0px -2px;
}

.iSKitu > * {
  margin: 0px 6px;
}

.dhVgjm {
  display: inline-flex;
  flex-flow: row;
  transition: 0.25s ease-in-out;
  margin: 0px;
  box-sizing: content-box;
}

.cZFRCx {
  transition: inherit;
  border: 2px solid rgb(1, 177, 92);
  border-radius: 8px;
  min-width: 8px;
  height: 8px;
  line-height: 8px;
  background-color: rgb(1, 177, 92);
  color: rgb(255, 255, 255);
}

.USzLV {
  position: relative;
  box-sizing: content-box;
  margin-top: calc(4px);
}

.iAIGyR {
  margin-left: 8px;
  line-height: 1.42857;
  font-size: 14px;
}

.mfFUZ {
  display: block;
  position: relative;
  z-index: 0;
  cursor: pointer;
  padding: 8px 36px;
  text-decoration: none;
  line-height: 20px;
  overflow-wrap: break-word;
  user-select: none;
  background-color: inherit;
  color: rgb(41, 50, 57);
}

.mfFUZ:first-child {
  margin-top: 4px;
}

.mfFUZ:last-child {
  margin-bottom: 4px;
}

.mfFUZ:focus {
  outline: none;
}

.jRbuNl {
  transition: inherit;
  border: 2px solid rgb(229, 128, 53);
  border-radius: 8px;
  min-width: 8px;
  height: 8px;
  line-height: 8px;
  background-color: rgb(229, 128, 53);
  color: rgb(255, 255, 255);
}

.jRbuNl > svg {
  position: absolute;
  top: -2px;
  left: -2px;
  transform-origin: 50% 50%;
  animation: 0.25s ease 0s 1 normal none running lbWRkT;
  max-height: unset;
}

.jRbuNl > svg[data-icon-status="away"] circle {
  display: none;
}

.kCSSLt {
  transition: inherit;
  border: 2px solid rgb(75, 159, 238);
  border-radius: 8px;
  min-width: 8px;
  height: 8px;
  line-height: 8px;
  background-color: rgb(75, 159, 238);
  color: rgb(255, 255, 255);
}

.kCSSLt > svg {
  position: absolute;
  top: -2px;
  left: -2px;
  transform-origin: 50% 50%;
  animation: 0.25s ease 0s 1 normal none running lbWRkT;
  max-height: unset;
}

.kCSSLt > svg[data-icon-status="transfers"] {
  transform: scale(1, 1);
}

.fXJcum {
  display: block;
  margin: 4px 0px;
  border-bottom: 1px solid rgb(232, 234, 236);
}

.ezOaOh {
  display: flex;
}

.HgjiS {
  display: flex;
  align-items: flex-start;
  margin: 0px -2px;
  font-size: 14px;
}

.bcfRGB .StyledItemIcon-sc-pspm80-0 {
  right: 12px;
  left: auto;
}

.YyLDU {
  color: rgb(132, 143, 153);
}

.leSGzc {
  display: flex;
  position: absolute;
  top: 0px;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  transition: opacity 0.1s ease-in-out;
  opacity: 1;
  color: rgb(31, 115, 183);
  width: 16px;
  height: calc(36px);
}

.leSGzc > * {
  width: 16px;
  height: 16px;
}

.ixiDEi {
  color: rgb(31, 115, 183);
  position: absolute;
  left: 12px;
  right: 6px;
}

.StyledMenuWrapper-sc-u70fn3-0 li:not([role="separator"]):not(.hzqnff):hover {
  display: block;
  position: relative;
  z-index: 0;
  cursor: pointer;
  padding: 8px 36px;
  text-decoration: none;
  line-height: 20px;
  overflow-wrap: break-word;
  user-select: none;
  background-color: rgba(31, 115, 183, 0.08);
  color: rgb(41, 50, 57);
}

.rCZoi {
  position: absolute;
  top: 0px;
  left: 0px;
  transition: opacity 10ms;
  opacity: 1;
  z-index: 1;
}

.cfXjuC {
  max-width: 270px;
  width: max-content;
  padding: 20px !important;
  background-color: rgb(255, 255, 255);
}

.chMvxM {
  display: inline-block;
  border: 1px solid rgb(41, 50, 57);
  box-sizing: border-box;
  text-align: left;
  font-weight: 400;
  margin: 6px;
  border-radius: 4px;
  padding: 1em;
  max-width: 140px;
  line-height: 1.33333;
  white-space: normal;
  font-size: 12px;
  overflow-wrap: break-word;
  position: relative;
  box-shadow: rgba(10, 13, 14, 0.16) 0px 4px 8px 0px;
  color: rgb(255, 255, 255);
}

.chMvxM::before,
.chMvxM::after {
  transform: rotate(-135deg);
  top: -4.94px;
  right: 10.49px;
}
.chMvxM::before {
  border-color: inherit;
  clip-path: polygon(100% 2px, 2px 100%, 100% 100%);
}
.chMvxM::after {
  border-color: transparent;
  background-clip: content-box;
  clip-path: polygon(100% 0px, 0px 100%, 100% 100%);
}
.chMvxM::before,
.chMvxM::after {
  position: absolute;
  border-width: inherit;
  border-style: inherit;
  background-color: inherit;
  width: 10.49px;
  height: 10.49px;
  content: "";
  box-sizing: inherit;
}

.iijiRr {
  background-color: rgb(255, 255, 255);
  color: rgb(41, 50, 57);
}
.ehomeF {
  transition: color 0.1s ease-in-out;
  line-height: 20px;
  font-size: 14px;
  font-weight: 600;
  direction: ltr;
}

@-webkit-keyframes gSzxJj {
  0% {
    transform: translateY(-20px);
    pointer-events: none;
  }

  100% {
    pointer-events: auto;
  }
}

@keyframes gSzxJj {
  0% {
    transform: translateY(-20px);
    pointer-events: none;
  }

  100% {
    pointer-events: auto;
  }
}

@-webkit-keyframes jAsLVO {
  0%,
  66% {
    top: 2px;
    border: transparent;
  }
}

@keyframes jAsLVO {
  0%,
  66% {
    top: 2px;
    border: transparent;
  }
}

@-webkit-keyframes lbWRkT {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes lbWRkT {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

#profile_menu_tooltip {
  display: none;
}

#header_profile_menu_button:hover + #profile_menu_tooltip {
  display: block !important;
}

.cZFRCx {
  transition: inherit;
  border: 2px solid rgb(1, 177, 92);
  border-radius: 8px;
  min-width: 8px;
  height: 8px;
  line-height: 8px;
  background-color: rgb(1, 177, 92);
  color: rgb(255, 255, 255);
}

.kCSSLt {
  transition: inherit;
  border: 2px solid rgb(75, 159, 238);
  border-radius: 8px;
  min-width: 8px;
  height: 8px;
  line-height: 8px;
  background-color: rgb(75, 159, 238);
  color: rgb(255, 255, 255);
}

.knNctL {
  position: relative;
  height: 32px;
  width: 32px;
  border-radius: 50%;
  background-color: rgb(255, 255, 255);
  border-width: 1px;
  border-style: solid;
  border-color: rgb(232, 234, 236);
}