@tailwind base;
@tailwind components;
@tailwind utilities;

.css-qiwgdb,
.css-1x5jdmq {
  padding: 12.5px 14px !important;
}

.MuiDataGrid-footerContainer {
  position: absolute;
  bottom: -42px;
  width: 100%;
}

.MuiDataGrid-footerContainer .MuiTablePagination-root {
  width: 100%;
}

.MuiDataGrid-footerContainer
  .MuiToolbar-root.MuiToolbar-gutters.MuiToolbar-regular {
  padding-left: 10px;
  display: flex;
}

.MuiDataGrid-footerContainer
  .css-rtrcn9-MuiTablePagination-root
  .MuiTablePagination-selectLabel {
  flex: 0 0 105px;
}

.MuiDataGrid-footerContainer .MuiTablePagination-displayedRows {
  flex: 1;
  text-align: right;
}

.MuiDataGrid-footerContainer .MuiInputBase-root.MuiInputBase-colorPrimary {
  margin-left: 0px;
}

.css-vqmohf-MuiButtonBase-root-MuiRadio-root {
  padding-top: 3px !important;
  padding-bottom: 3px !important;
}

.MuiDataGrid-footerContainer .MuiSelect-select.MuiTablePagination-select {
  padding-left: 0px;
}

.MuiDataGrid-footerContainer .MuiTablePagination-spacer,
.MuiDataGrid-footerContainer .css-1psng7p-MuiTablePagination-spacer {
  flex: none;
}

.single-jop-tab {
  border-bottom: 1px solid #c4c4c4;
}

.single-jop-tab button,
.single-jop-tab .Mui-selected {
  padding: 0;
  color: #484848 !important;
  font-size: 18px;
  text-transform: capitalize;
  margin-right: 50px;
}

.MuiTabs-indicator {
  background: #44a287 !important;
  height: 4px !important;
}

.single-jop-tab span {
  color: #484848;
  font-weight: 700;
}

[aria-label="Actions"] .MuiDataGrid-menuIcon,
[data-field="preview"] .MuiDataGrid-menuIcon {
  display: none !important;
}

.timepicker input,
.timepicker .MuiInputBase-root.MuiOutlinedInput-root,
.datepicker input,
.datepicker .MuiInputBase-root.MuiOutlinedInput-root {
  background: white;
}

.timepicker input,
.datepicker input {
  height: 6px;
}

.spacer:last-child span {
  display: none;
}

body .Mui-disabled.MuiButton-root {
  background-color: rgb(0 0 0 / 0.1) !important;
  color: rgb(0 0 0 / 0.6) !important;
}

.app-container {
  padding: 1.5rem;
  margin-left: 1.5rem;
  margin-right: 1.5rem;
  width: calc(100% - (5rem));
}

@media only screen and (max-width: 768px) {
  .app-container {
    margin: 0;
    padding: 1rem;
    width: 100%;
  }

  .drawer-container-menu {
    left: -65px;
    position: absolute;
  }

  .mobile-drawer.closed .MuiDrawer-paperAnchorDockedLeft {
    left: -65px;
  }

  .mobile-drawer.opened .MuiDrawer-paperAnchorDockedLeft {
    left: 0;
  }

  .drop-down-position {
    left: 72vw;
  }
}

@media only screen and (max-width: 680px) {
  .drop-down-position {
    left: 65vw;
  }
}

@media only screen and (max-width: 620px) {
  .drop-down-position {
    left: 60vw;
  }
}

@media only screen and (max-width: 580px) {
  .drop-down-position {
    left: 55vw;
  }
}

@media only screen and (max-width: 530px) {
  .drop-down-position {
    left: 50vw;
  }
}

@media only screen and (max-width: 480px) {
  .drop-down-position {
    left: 42vw;
  }
}

.datepicker input, .datepicker fieldset {
  outline: none !important;
  outline-offset: 0px !important;
  box-shadow: none !important;
}

.datepicker fieldset {
  border-color: rgb(0 0 0 / 0.87) !important;
}

.datepicker input:focus {
  outline: none !important;
}

.MuiAutocomplete-input {
  border-color: rgb(0 0 0 / 0.87) !important;
  outline: none !important;
}

.MuiAutocomplete-input:focus {

  box-shadow: none !important;
}
/*

 */

@font-face {
  font-family: 'Inter var';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-italic.extra.var-3fc5a58c563463be34bd032085bd4217fe507d613a83a48b1a57f553d932c981.woff2) format('woff2');
  unicode-range: U+E000,U+E002-E081,U+E093-E097,U+E0A5-E0E7,U+E0F3-E11D,U+E11E-E165,U+EE01,U+F6C3;
  font-named-instance: 'Italic';
}
/* alternates */
@font-face {
  font-family: 'Inter var';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-italic.alternates.var-3fc5a58c563463be34bd032085bd4217fe507d613a83a48b1a57f553d932c981.woff2) format('woff2');
  unicode-range: U+E000,U+E002-E081,U+E093-E097,U+E0A5-E0E7,U+E0F3-E11D,U+E11E-E165,U+EE01,U+F6C3;
  font-named-instance: 'Italic';
}
/* symbols */
@font-face {
  font-family: 'Inter var';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-italic.symbols.var-1b01a78da1dcd61ac126a19a6248166d0141d76435cbf0ec4ace3094b2c4d839.woff2) format('woff2');
  unicode-range: U+20DD-20DF,U+2190-219A,U+21A9-21AB,U+21B0-21B2,U+21B3-21B6,U+21BA-21BC,U+21D0,U+21D2,U+21D4,U+21DE-21E0,U+21E4-21E6,U+21E7,U+21EA,U+2303,U+2305,U+2318,U+2325-2328,U+232B,U+2380,U+2387,U+238B,U+23CE-23D0,U+2460-2469,U+24B6-24D0,U+24EA,U+25A0-25A3,U+25B2-25B4,U+25B6-25B8,U+25BA-25BE,U+25C0-25C2,U+25C4-25C8,U+25CB,U+25CF,U+25EF,U+2600,U+2605-2607,U+263C,U+2661,U+2665,U+26A0,U+2713,U+2717,U+2756,U+2764,U+2780-2789,U+27F5-27FB,U+2B06,U+2B12-2B14,U+2B1C,U+E000,U+E12B-E164,U+1F130-1F14A,U+1F850,U+1F852;
  font-named-instance: 'Italic';
}
/* cyrillic */
@font-face {
  font-family: 'Inter var';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-italic.cyrillic.var-23aaa0302451c235bbb69f9c9da1650a9361bd985f285ff91e6157602604ca2b.woff2) format('woff2');
  unicode-range: U+0400-049E,U+04A0-0500,U+052F,U+20B4,U+2116,U+2DFF,U+A69F;
  font-named-instance: 'Italic';
}
/* greek */
@font-face {
  font-family: 'Inter var';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-italic.greek.var-b1bf94de3633982c23ab309a647836639602909cfbcdb79351cbc78835230e3e.woff2) format('woff2');
  unicode-range: U+0370-0378,U+037A-0380,U+0384-038B,U+038C,U+038E-03A2,U+03A3-03E2,U+03F0-0400,U+1F00-1F16,U+1F18-1F1E,U+1F20-1F46,U+1F48-1F4E,U+1F50-1F58,U+1F59,U+1F5B,U+1F5D,U+1F5F-1F7E,U+1F80-1FB5,U+1FB6-1FC5,U+1FC6-1FD4,U+1FD6-1FDC,U+1FDD-1FF0,U+1FF2-1FF5,U+1FF6-1FFF;
  font-named-instance: 'Italic';
}
/* vietnamese */
@font-face {
  font-family: 'Inter var';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-italic.vietnamese.var-c8bd98cbed934796d599c2026bb8db136d2139dccf57937a095718f940d967b6.woff2) format('woff2');
  unicode-range: U+0102-0104,U+0110-0112,U+0128-012A,U+0168-016A,U+01A0-01A2,U+01AF-01B1,U+1EA0-1EFA,U+20AB;
  font-named-instance: 'Italic';
}
/* latin-ext */
@font-face {
  font-family: 'Inter var';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-italic.latin-ext.var-726d4d8d9195b8d34eb0fe6b5faf4bac267f65fca8a5a578bab918ebaa75d847.woff2) format('woff2');
  unicode-range: U+0100-0149,U+014A-01C4,U+01C5-0250,U+0259,U+1E00-1F00,U+2020,U+20A0-20AC,U+20AD-20C0,U+2113,U+2C7C,U+2C7F,U+A7FF;
  font-named-instance: 'Italic';
}
/* latin */
@font-face {
  font-family: 'Inter var';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-italic.latin.var-96a181ef239603aaf44ae2c29962c907a96d0edd1003d929a755b63abd7a4254.woff2) format('woff2');
  unicode-range: U+0000-007F,U+00A0-0100,U+0131,U+0152-0154,U+02BB-02BD,U+02C6,U+02DA,U+02DC,U+2000-200C,U+2010-2028,U+202F-2060,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+FEFF;
  font-named-instance: 'Italic';
}
/* extra */
@font-face {
  font-family: 'Inter var';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-roman.extra.var-16a024b93c15dcd9c81a978486a0a22220e29a8d85f873bd9a2f3239e5c4924a.woff2) format('woff2');
  unicode-range: U+E000,U+E002-E081,U+E093-E097,U+E0A5-E0E7,U+E0F3-E11D,U+E11E-E165,U+EE01,U+F6C3;
  font-named-instance: 'Regular';
}
/* alternates */
@font-face {
  font-family: 'Inter var';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-roman.alternates.var-16a024b93c15dcd9c81a978486a0a22220e29a8d85f873bd9a2f3239e5c4924a.woff2) format('woff2');
  unicode-range: U+E000,U+E002-E081,U+E093-E097,U+E0A5-E0E7,U+E0F3-E11D,U+E11E-E165,U+EE01,U+F6C3;
  font-named-instance: 'Regular';
}
/* symbols */
@font-face {
  font-family: 'Inter var';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-roman.symbols.var-026aef00b3b3ed4c849292f9cbc3494ad209c72669ab22c35fe90b7962bb99b4.woff2) format('woff2');
  unicode-range: U+20DD-20DF,U+2190-219A,U+21A9-21AB,U+21B0-21B2,U+21B3-21B6,U+21BA-21BC,U+21D0,U+21D2,U+21D4,U+21DE-21E0,U+21E4-21E6,U+21E7,U+21EA,U+2303,U+2305,U+2318,U+2325-2328,U+232B,U+2380,U+2387,U+238B,U+23CE-23D0,U+2460-2469,U+24B6-24D0,U+24EA,U+25A0-25A3,U+25B2-25B4,U+25B6-25B8,U+25BA-25BE,U+25C0-25C2,U+25C4-25C8,U+25CB,U+25CF,U+25EF,U+2600,U+2605-2607,U+263C,U+2661,U+2665,U+26A0,U+2713,U+2717,U+2756,U+2764,U+2780-2789,U+27F5-27FB,U+2B06,U+2B12-2B14,U+2B1C,U+E000,U+E12B-E164,U+1F130-1F14A,U+1F850,U+1F852;
  font-named-instance: 'Regular';
}
/* cyrillic */
@font-face {
  font-family: 'Inter var';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-roman.cyrillic.var-2b041087baa224903c767e87df3ee493f16742bdada85a433a2af5283b725022.woff2) format('woff2');
  unicode-range: U+0400-049E,U+04A0-0500,U+052F,U+20B4,U+2116,U+2DFF,U+A69F;
  font-named-instance: 'Regular';
}
/* greek */
@font-face {
  font-family: 'Inter var';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-roman.greek.var-c0a6dfbbf1378ce4f0882b386f83a7923efd3bcdf82974005463f1d47e783d36.woff2) format('woff2');
  unicode-range: U+0370-0378,U+037A-0380,U+0384-038B,U+038C,U+038E-03A2,U+03A3-03E2,U+03F0-0400,U+1F00-1F16,U+1F18-1F1E,U+1F20-1F46,U+1F48-1F4E,U+1F50-1F58,U+1F59,U+1F5B,U+1F5D,U+1F5F-1F7E,U+1F80-1FB5,U+1FB6-1FC5,U+1FC6-1FD4,U+1FD6-1FDC,U+1FDD-1FF0,U+1FF2-1FF5,U+1FF6-1FFF;
  font-named-instance: 'Regular';
}
/* vietnamese */
@font-face {
  font-family: 'Inter var';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-roman.vietnamese.var-296760dfa7f8cba08982d6a471c39b28c89a4ac20f9f86e705e4b1307a335c8d.woff2) format('woff2');
  unicode-range: U+0102-0104,U+0110-0112,U+0128-012A,U+0168-016A,U+01A0-01A2,U+01AF-01B1,U+1EA0-1EFA,U+20AB;
  font-named-instance: 'Regular';
}
/* latin-ext */
@font-face {
  font-family: 'Inter var';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-roman.latin-ext.var-3ba4c2e265928ab67ab56e7798589af662f6d9b0416bfe019665039464f11087.woff2) format('woff2');
  unicode-range: U+0100-0149,U+014A-01C4,U+01C5-0250,U+0259,U+1E00-1F00,U+2020,U+20A0-20AC,U+20AD-20C0,U+2113,U+2C7C,U+2C7F,U+A7FF;
  font-named-instance: 'Regular';
}
/* latin */
@font-face {
  font-family: 'Inter var';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/Inter-roman.latin.var-ed49892e9d93b7d64fc0fc07e0f43a343c0e2cac89277079f89d0f217499d45a.woff2) format('woff2');
  unicode-range: U+0000-007F,U+00A0-0100,U+0131,U+0152-0154,U+02BB-02BD,U+02C6,U+02DA,U+02DC,U+2000-200C,U+2010-2028,U+202F-2060,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+FEFF;
  font-named-instance: 'Regular';
}

.login-page {
  width: 500px;
  height: 400px;
  background-color: #ffffff;
  /* Center vertically and horizontally */
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 25px;
  margin: -200px 0 0 -250px; /* Apply negative top and left margins to truly center the element */
}
.btn {
  position: relative;
  clear: both;
  float: none;
  width: 70%;
  background-color: #21b194;
  border-radius: 2px;
  color: #ffffff;
  cursor: pointer;
  display: inline-block;
  font-family: "SSSB";
  font-size: 16px;
  letter-spacing: 0.05em;
  padding: 1rem;
  text-transform: uppercase;
}

/*
 * Page: Login & Register
 * ----------------------
 */
.login-logo,
.register-logo {
  font-size: 35px;
  text-align: center;
  margin-bottom: 25px;
  font-weight: 300;
}
.login-logo a,
.register-logo a {
  color: #444;
}
.login-page,
.register-page {
  background: #d2d6de;
}
.login-box,
.register-box {
  width: 84%;
  margin: 7% auto;
}
@media (max-width: 768px) {
  .login-box,
  .register-box {
    width: 90%;
    margin-top: 20px;
  }
}
.login-box-body,
.register-box-body {
  background: #fff;
  padding: 2rem 20px 20px 20px;
  width: 100%;
  border-top: 0;
  color: #666;
}
.login-box-body .form-control-feedback,
.register-box-body .form-control-feedback {
  color: #777;
}
.login-box-msg,
.register-box-msg {
  margin: 0;
  text-align: center;
  padding: 0 20px 20px 20px;
}
.social-auth-links {
  margin: 10px 0;
}

.login-form-wrapper {
  display: flex;
  height: 100vh;
}

.login-form-header {
  border-radius: 12px 12px 0px 0px;
  background: #21b194;
  height: 116px;
  display: flex;
  align-items: center;
}

.login-form-content {
  display: flex;
  flex-direction: column;
}

.login-form-content label {
  color: #484848;
  font-family: Roboto;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  margin-bottom: 10px;
}

.login-form-content input[type="text"] {
  height: 40px;
  width: 100%;
  flex-shrink: 0;
  border-radius: 4px;
  border: 1px solid #676767;
}

.login-form-content p {
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  color: #767676;
  text-align: center;
  margin: 60px auto 30px;
  display: flex;
  align-items: center;
}

.login-form-content p::before {
  content: "";
  display: inline-block;
  width: 100px;
  background-color: #767676;
  height: 1px;
  margin-right: 15px;
}

.login-form .webex-button {
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  border: 1px solid #2f6e8c;
  background: #fff;
  width: 100%;
  height: 44px;
  color: #2f6e8c;
  margin-bottom: 40px;
  display: flex;

  font-size: 18px;
  font-style: normal;
  font-weight: 400;
}

.login-form .webex-button img {
  margin-right: 10px;
}

.login-form-content p::after {
  content: "";
  display: inline-block;
  width: 100px;
  background-color: #767676;
  height: 1px;
  margin-left: 15px;
}

.login-form-content .continue-button {
  border-radius: 4px;
  background: #2f6e8c;
  height: 44px;
  color: white;
  margin-top: 30px;
  font-size: 18px;
  width: 100%;
  cursor: pointer;
  font-style: normal;
  font-weight: 700;
}

.login-form {
  width: 548px;
  margin: auto;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0px 5px 5px 0px rgba(18, 18, 18, 0.1);
}

@media only screen and (max-width: 650px) {
  .login-form {
    width: 90%;
  }
}

@media only screen and (max-width: 500px) {
  .login-form-header {
    height: 80px;
  }

  .login-box-body {
    padding: 1rem 20px 1rem 20px;
  }

  .login-form-content p {
    margin: 40px auto 20px;
  }
}

@media only screen and (max-width: 450px) {
  .login-form-content p::before {
    width: 20px;
  }

  .login-form-content p::after {
    width: 20px;
  }
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */

:disabled, .disabled {
  opacity: 0.7;
}

.quill-custom-variable-blot {
  display: inline-block;
  background-color: #f3f4f6;
  padding: 4px 8px 4px 8px;
  font-size: 12px;
  max-width: 320px;
  border-radius: 5px;
  color: #1075c9;
  margin: 2px 2px 2px 2px;
}