@import url(https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap); .air-datepicker-cell.-year-.-other-decade-,.air-datepicker-cell.-day-.-other-month-{color:var(--adp-color-other-month)}.air-datepicker-cell.-year-.-other-decade-:hover,.air-datepicker-cell.-day-.-other-month-:hover{color:var(--adp-color-other-month-hover)}.-disabled-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-disabled-.-focus-.air-datepicker-cell.-day-.-other-month-{color:var(--adp-color-other-month)}.-selected-.air-datepicker-cell.-year-.-other-decade-,.-selected-.air-datepicker-cell.-day-.-other-month-{color:#fff;background:var(--adp-background-color-selected-other-month)}.-selected-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-selected-.-focus-.air-datepicker-cell.-day-.-other-month-{background:var(--adp-background-color-selected-other-month-focused)}.-in-range-.air-datepicker-cell.-year-.-other-decade-,.-in-range-.air-datepicker-cell.-day-.-other-month-{background-color:var(--adp-background-color-in-range);color:var(--adp-color)}.-in-range-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-in-range-.-focus-.air-datepicker-cell.-day-.-other-month-{background-color:var(--adp-background-color-in-range-focused)}.air-datepicker-cell.-year-.-other-decade-:empty,.air-datepicker-cell.-day-.-other-month-:empty{background:none;border:none}.air-datepicker-cell{border-radius:var(--adp-cell-border-radius);box-sizing:border-box;cursor:pointer;display:flex;position:relative;align-items:center;justify-content:center;z-index:1}.air-datepicker-cell.-focus-{background:var(--adp-cell-background-color-hover)}.air-datepicker-cell.-current-{color:var(--adp-color-current-date)}.air-datepicker-cell.-current-.-focus-{color:var(--adp-color)}.air-datepicker-cell.-current-.-in-range-{color:var(--adp-color-current-date)}.air-datepicker-cell.-disabled-{cursor:default;color:var(--adp-color-disabled)}.air-datepicker-cell.-disabled-.-focus-{color:var(--adp-color-disabled)}.air-datepicker-cell.-disabled-.-in-range-{color:var(--adp-color-disabled-in-range)}.air-datepicker-cell.-disabled-.-current-.-focus-{color:var(--adp-color-disabled)}.air-datepicker-cell.-in-range-{background:var(--adp-cell-background-color-in-range);border-radius:0}.air-datepicker-cell.-in-range-:hover{background:var(--adp-cell-background-color-in-range-hover)}.air-datepicker-cell.-range-from-{border:1px solid var(--adp-cell-border-color-in-range);background-color:var(--adp-cell-background-color-in-range);border-radius:var(--adp-cell-border-radius) 0 0 var(--adp-cell-border-radius)}.air-datepicker-cell.-range-to-{border:1px solid var(--adp-cell-border-color-in-range);background-color:var(--adp-cell-background-color-in-range);border-radius:0 var(--adp-cell-border-radius) var(--adp-cell-border-radius) 0}.air-datepicker-cell.-range-to-.-range-from-{border-radius:var(--adp-cell-border-radius)}.air-datepicker-cell.-selected-{color:#fff;border:none;background:var(--adp-cell-background-color-selected)}.air-datepicker-cell.-selected-.-current-{color:#fff;background:var(--adp-cell-background-color-selected)}.air-datepicker-cell.-selected-.-focus-{background:var(--adp-cell-background-color-selected-hover)} .air-datepicker-body{transition:all var(--adp-transition-duration) var(--adp-transition-ease)}.air-datepicker-body.-hidden-{display:none}.air-datepicker-body--day-names{display:grid;grid-template-columns:repeat(7, var(--adp-day-cell-width));margin:8px 0 3px}.air-datepicker-body--day-name{color:var(--adp-day-name-color);display:flex;align-items:center;justify-content:center;flex:1;text-align:center;text-transform:uppercase;font-size:.8em}.air-datepicker-body--day-name.-clickable-{cursor:pointer}.air-datepicker-body--day-name.-clickable-:hover{color:var(--adp-day-name-color-hover)}.air-datepicker-body--cells{display:grid}.air-datepicker-body--cells.-days-{grid-template-columns:repeat(7, var(--adp-day-cell-width));grid-auto-rows:var(--adp-day-cell-height)}.air-datepicker-body--cells.-months-{grid-template-columns:repeat(3, 1fr);grid-auto-rows:var(--adp-month-cell-height)}.air-datepicker-body--cells.-years-{grid-template-columns:repeat(4, 1fr);grid-auto-rows:var(--adp-year-cell-height)} .air-datepicker-nav{display:flex;justify-content:space-between;border-bottom:1px solid var(--adp-border-color-inner);min-height:var(--adp-nav-height);padding:var(--adp-padding);box-sizing:content-box}.-only-timepicker- .air-datepicker-nav{display:none}.air-datepicker-nav--title,.air-datepicker-nav--action{display:flex;cursor:pointer;align-items:center;justify-content:center}.air-datepicker-nav--action{width:var(--adp-nav-action-size);border-radius:var(--adp-border-radius);-webkit-user-select:none;-moz-user-select:none;user-select:none}.air-datepicker-nav--action:hover{background:var(--adp-background-color-hover)}.air-datepicker-nav--action:active{background:var(--adp-background-color-active)}.air-datepicker-nav--action.-disabled-{visibility:hidden}.air-datepicker-nav--action svg{width:32px;height:32px}.air-datepicker-nav--action path{fill:none;stroke:var(--adp-nav-arrow-color);stroke-width:2px}.air-datepicker-nav--title{border-radius:var(--adp-border-radius);padding:0 8px}.air-datepicker-nav--title i{font-style:normal;color:var(--adp-nav-color-secondary);margin-left:.3em}.air-datepicker-nav--title:hover{background:var(--adp-background-color-hover)}.air-datepicker-nav--title:active{background:var(--adp-background-color-active)}.air-datepicker-nav--title.-disabled-{cursor:default;background:none} .air-datepicker-buttons{display:grid;grid-auto-columns:1fr;grid-auto-flow:column}.air-datepicker-button{display:inline-flex;color:var(--adp-btn-color);border-radius:var(--adp-btn-border-radius);cursor:pointer;height:var(--adp-btn-height);border:none;background:rgba(255,255,255,0)}.air-datepicker-button:hover{color:var(--adp-btn-color-hover);background:var(--adp-btn-background-color-hover)}.air-datepicker-button:focus{color:var(--adp-btn-color-hover);background:var(--adp-btn-background-color-hover);outline:none}.air-datepicker-button:active{background:var(--adp-btn-background-color-active)}.air-datepicker-button span{outline:none;display:flex;align-items:center;justify-content:center;width:100%;height:100%} .air-datepicker-time{display:grid;grid-template-columns:max-content 1fr;grid-column-gap:12px;align-items:center;position:relative;padding:0 var(--adp-time-padding-inner)}.-only-timepicker- .air-datepicker-time{border-top:none}.air-datepicker-time--current{display:flex;align-items:center;flex:1;font-size:14px;text-align:center}.air-datepicker-time--current-colon{margin:0 2px 3px;line-height:1}.air-datepicker-time--current-hours,.air-datepicker-time--current-minutes{line-height:1;font-size:19px;font-family:"Century Gothic",CenturyGothic,AppleGothic,sans-serif;position:relative;z-index:1}.air-datepicker-time--current-hours:after,.air-datepicker-time--current-minutes:after{content:"";background:var(--adp-background-color-hover);border-radius:var(--adp-border-radius);position:absolute;left:-2px;top:-3px;right:-2px;bottom:-2px;z-index:-1;opacity:0}.air-datepicker-time--current-hours.-focus-:after,.air-datepicker-time--current-minutes.-focus-:after{opacity:1}.air-datepicker-time--current-ampm{text-transform:uppercase;align-self:flex-end;color:var(--adp-time-day-period-color);margin-left:6px;font-size:11px;margin-bottom:1px}.air-datepicker-time--row{display:flex;align-items:center;font-size:11px;height:17px;background:linear-gradient(to right, var(--adp-time-track-color), var(--adp-time-track-color)) left 50%/100% var(--adp-time-track-height) no-repeat}.air-datepicker-time--row:first-child{margin-bottom:4px}.air-datepicker-time--row input[type=range]{background:none;cursor:pointer;flex:1;height:100%;width:100%;padding:0;margin:0;-webkit-appearance:none}.air-datepicker-time--row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none}.air-datepicker-time--row input[type=range]::-ms-tooltip{display:none}.air-datepicker-time--row input[type=range]:hover::-webkit-slider-thumb{border-color:var(--adp-time-track-color-hover)}.air-datepicker-time--row input[type=range]:hover::-moz-range-thumb{border-color:var(--adp-time-track-color-hover)}.air-datepicker-time--row input[type=range]:hover::-ms-thumb{border-color:var(--adp-time-track-color-hover)}.air-datepicker-time--row input[type=range]:focus{outline:none}.air-datepicker-time--row input[type=range]:focus::-webkit-slider-thumb{background:var(--adp-cell-background-color-selected);border-color:var(--adp-cell-background-color-selected)}.air-datepicker-time--row input[type=range]:focus::-moz-range-thumb{background:var(--adp-cell-background-color-selected);border-color:var(--adp-cell-background-color-selected)}.air-datepicker-time--row input[type=range]:focus::-ms-thumb{background:var(--adp-cell-background-color-selected);border-color:var(--adp-cell-background-color-selected)}.air-datepicker-time--row input[type=range]::-webkit-slider-thumb{box-sizing:border-box;height:12px;width:12px;border-radius:3px;border:1px solid var(--adp-time-track-color);background:#fff;cursor:pointer;-webkit-transition:background var(--adp-transition-duration);transition:background var(--adp-transition-duration)}.air-datepicker-time--row input[type=range]::-moz-range-thumb{box-sizing:border-box;height:12px;width:12px;border-radius:3px;border:1px solid var(--adp-time-track-color);background:#fff;cursor:pointer;-moz-transition:background var(--adp-transition-duration);transition:background var(--adp-transition-duration)}.air-datepicker-time--row input[type=range]::-ms-thumb{box-sizing:border-box;height:12px;width:12px;border-radius:3px;border:1px solid var(--adp-time-track-color);background:#fff;cursor:pointer;-ms-transition:background var(--adp-transition-duration);transition:background var(--adp-transition-duration)}.air-datepicker-time--row input[type=range]::-webkit-slider-thumb{margin-top:calc(var(--adp-time-thumb-size)/2*-1)}.air-datepicker-time--row input[type=range]::-webkit-slider-runnable-track{border:none;height:var(--adp-time-track-height);cursor:pointer;color:rgba(0,0,0,0);background:rgba(0,0,0,0)}.air-datepicker-time--row input[type=range]::-moz-range-track{border:none;height:var(--adp-time-track-height);cursor:pointer;color:rgba(0,0,0,0);background:rgba(0,0,0,0)}.air-datepicker-time--row input[type=range]::-ms-track{border:none;height:var(--adp-time-track-height);cursor:pointer;color:rgba(0,0,0,0);background:rgba(0,0,0,0)}.air-datepicker-time--row input[type=range]::-ms-fill-lower{background:rgba(0,0,0,0)}.air-datepicker-time--row input[type=range]::-ms-fill-upper{background:rgba(0,0,0,0)} .air-datepicker{--adp-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";--adp-font-size: 14px;--adp-width: 246px;--adp-z-index: 100;--adp-padding: 4px;--adp-grid-areas: "nav" "body" "timepicker" "buttons";--adp-transition-duration: .3s;--adp-transition-ease: ease-out;--adp-transition-offset: 8px;--adp-background-color: #fff;--adp-background-color-hover: #f0f0f0;--adp-background-color-active: #eaeaea;--adp-background-color-in-range: rgba(92, 196, 239, .1);--adp-background-color-in-range-focused: rgba(92, 196, 239, .2);--adp-background-color-selected-other-month-focused: #8ad5f4;--adp-background-color-selected-other-month: #a2ddf6;--adp-color: #4a4a4a;--adp-color-secondary: #9c9c9c;--adp-accent-color: #4eb5e6;--adp-color-current-date: var(--adp-accent-color);--adp-color-other-month: #dedede;--adp-color-disabled: #aeaeae;--adp-color-disabled-in-range: #939393;--adp-color-other-month-hover: #c5c5c5;--adp-border-color: #dbdbdb;--adp-border-color-inner: #efefef;--adp-border-radius: 4px;--adp-border-color-inline: #d7d7d7;--adp-nav-height: 32px;--adp-nav-arrow-color: var(--adp-color-secondary);--adp-nav-action-size: 32px;--adp-nav-color-secondary: var(--adp-color-secondary);--adp-day-name-color: #ff9a19;--adp-day-name-color-hover: #8ad5f4;--adp-day-cell-width: 1fr;--adp-day-cell-height: 32px;--adp-month-cell-height: 42px;--adp-year-cell-height: 56px;--adp-pointer-size: 10px;--adp-poiner-border-radius: 2px;--adp-pointer-offset: 14px;--adp-cell-border-radius: 4px;--adp-cell-background-color-hover: var(--adp-background-color-hover);--adp-cell-background-color-selected: #5cc4ef;--adp-cell-background-color-selected-hover: #45bced;--adp-cell-background-color-in-range: rgba(92, 196, 239, 0.1);--adp-cell-background-color-in-range-hover: rgba(92, 196, 239, 0.2);--adp-cell-border-color-in-range: var(--adp-cell-background-color-selected);--adp-btn-height: 32px;--adp-btn-color: var(--adp-accent-color);--adp-btn-color-hover: var(--adp-color);--adp-btn-border-radius: var(--adp-border-radius);--adp-btn-background-color-hover: var(--adp-background-color-hover);--adp-btn-background-color-active: var(--adp-background-color-active);--adp-time-track-height: 1px;--adp-time-track-color: #dedede;--adp-time-track-color-hover: #b1b1b1;--adp-time-thumb-size: 12px;--adp-time-padding-inner: 10px;--adp-time-day-period-color: var(--adp-color-secondary);--adp-mobile-font-size: 16px;--adp-mobile-nav-height: 40px;--adp-mobile-width: 320px;--adp-mobile-day-cell-height: 38px;--adp-mobile-month-cell-height: 48px;--adp-mobile-year-cell-height: 64px}.air-datepicker-overlay{--adp-overlay-background-color: rgba(0, 0, 0, .3);--adp-overlay-transition-duration: .3s;--adp-overlay-transition-ease: ease-out;--adp-overlay-z-index: 99} .air-datepicker{background:var(--adp-background-color);border:1px solid var(--adp-border-color);box-shadow:0 4px 12px rgba(0,0,0,.15);border-radius:var(--adp-border-radius);box-sizing:content-box;display:grid;grid-template-columns:1fr;grid-template-rows:repeat(4, max-content);grid-template-areas:var(--adp-grid-areas);font-family:var(--adp-font-family),sans-serif;font-size:var(--adp-font-size);color:var(--adp-color);width:var(--adp-width);position:absolute;transition:opacity var(--adp-transition-duration) var(--adp-transition-ease),transform var(--adp-transition-duration) var(--adp-transition-ease);z-index:var(--adp-z-index)}.air-datepicker:not(.-custom-position-){opacity:0}.air-datepicker.-from-top-{transform:translateY(calc(var(--adp-transition-offset) * -1))}.air-datepicker.-from-right-{transform:translateX(var(--adp-transition-offset))}.air-datepicker.-from-bottom-{transform:translateY(var(--adp-transition-offset))}.air-datepicker.-from-left-{transform:translateX(calc(var(--adp-transition-offset) * -1))}.air-datepicker.-active-:not(.-custom-position-){transform:translate(0, 0);opacity:1}.air-datepicker.-active-.-custom-position-{transition:none}.air-datepicker.-inline-{border-color:var(--adp-border-color-inline);box-shadow:none;position:static;left:auto;right:auto;opacity:1;transform:none}.air-datepicker.-inline- .air-datepicker--pointer{display:none}.air-datepicker.-is-mobile-{--adp-font-size: var(--adp-mobile-font-size);--adp-day-cell-height: var(--adp-mobile-day-cell-height);--adp-month-cell-height: var(--adp-mobile-month-cell-height);--adp-year-cell-height: var(--adp-mobile-year-cell-height);--adp-nav-height: var(--adp-mobile-nav-height);--adp-nav-action-size: var(--adp-mobile-nav-height);position:fixed;width:var(--adp-mobile-width);border:none}.air-datepicker.-is-mobile- *{-webkit-tap-highlight-color:rgba(0,0,0,0)}.air-datepicker.-is-mobile- .air-datepicker--pointer{display:none}.air-datepicker.-is-mobile-:not(.-custom-position-){transform:translate(-50%, calc(-50% + var(--adp-transition-offset)))}.air-datepicker.-is-mobile-.-active-:not(.-custom-position-){transform:translate(-50%, -50%)}.air-datepicker.-custom-position-{transition:none}.air-datepicker-global-container{position:absolute;left:0;top:0}.air-datepicker--pointer{--pointer-half-size: calc(var(--adp-pointer-size) / 2);position:absolute;width:var(--adp-pointer-size);height:var(--adp-pointer-size);z-index:-1}.air-datepicker--pointer:after{content:"";position:absolute;background:#fff;border-top:1px solid var(--adp-border-color-inline);border-right:1px solid var(--adp-border-color-inline);border-top-right-radius:var(--adp-poiner-border-radius);width:var(--adp-pointer-size);height:var(--adp-pointer-size);box-sizing:border-box}.-top-left- .air-datepicker--pointer,.-top-center- .air-datepicker--pointer,.-top-right- .air-datepicker--pointer,[data-popper-placement^=top] .air-datepicker--pointer{top:calc(100% - var(--pointer-half-size) + 1px)}.-top-left- .air-datepicker--pointer:after,.-top-center- .air-datepicker--pointer:after,.-top-right- .air-datepicker--pointer:after,[data-popper-placement^=top] .air-datepicker--pointer:after{transform:rotate(135deg)}.-right-top- .air-datepicker--pointer,.-right-center- .air-datepicker--pointer,.-right-bottom- .air-datepicker--pointer,[data-popper-placement^=right] .air-datepicker--pointer{right:calc(100% - var(--pointer-half-size) + 1px)}.-right-top- .air-datepicker--pointer:after,.-right-center- .air-datepicker--pointer:after,.-right-bottom- .air-datepicker--pointer:after,[data-popper-placement^=right] .air-datepicker--pointer:after{transform:rotate(225deg)}.-bottom-left- .air-datepicker--pointer,.-bottom-center- .air-datepicker--pointer,.-bottom-right- .air-datepicker--pointer,[data-popper-placement^=bottom] .air-datepicker--pointer{bottom:calc(100% - var(--pointer-half-size) + 1px)}.-bottom-left- .air-datepicker--pointer:after,.-bottom-center- .air-datepicker--pointer:after,.-bottom-right- .air-datepicker--pointer:after,[data-popper-placement^=bottom] .air-datepicker--pointer:after{transform:rotate(315deg)}.-left-top- .air-datepicker--pointer,.-left-center- .air-datepicker--pointer,.-left-bottom- .air-datepicker--pointer,[data-popper-placement^=left] .air-datepicker--pointer{left:calc(100% - var(--pointer-half-size) + 1px)}.-left-top- .air-datepicker--pointer:after,.-left-center- .air-datepicker--pointer:after,.-left-bottom- .air-datepicker--pointer:after,[data-popper-placement^=left] .air-datepicker--pointer:after{transform:rotate(45deg)}.-top-left- .air-datepicker--pointer,.-bottom-left- .air-datepicker--pointer{left:var(--adp-pointer-offset)}.-top-right- .air-datepicker--pointer,.-bottom-right- .air-datepicker--pointer{right:var(--adp-pointer-offset)}.-top-center- .air-datepicker--pointer,.-bottom-center- .air-datepicker--pointer{left:calc(50% - var(--adp-pointer-size)/2)}.-left-top- .air-datepicker--pointer,.-right-top- .air-datepicker--pointer{top:var(--adp-pointer-offset)}.-left-bottom- .air-datepicker--pointer,.-right-bottom- .air-datepicker--pointer{bottom:var(--adp-pointer-offset)}.-left-center- .air-datepicker--pointer,.-right-center- .air-datepicker--pointer{top:calc(50% - var(--adp-pointer-size)/2)}.air-datepicker--navigation{grid-area:nav}.air-datepicker--content{box-sizing:content-box;padding:var(--adp-padding);grid-area:body}.-only-timepicker- .air-datepicker--content{display:none}.air-datepicker--time{grid-area:timepicker}.air-datepicker--buttons{grid-area:buttons}.air-datepicker--buttons,.air-datepicker--time{padding:var(--adp-padding);border-top:1px solid var(--adp-border-color-inner)}.air-datepicker-overlay{position:fixed;background:var(--adp-overlay-background-color);left:0;top:0;width:0;height:0;opacity:0;transition:opacity var(--adp-overlay-transition-duration) var(--adp-overlay-transition-ease),left 0s,height 0s,width 0s;transition-delay:0s,var(--adp-overlay-transition-duration),var(--adp-overlay-transition-duration),var(--adp-overlay-transition-duration);z-index:var(--adp-overlay-z-index)}.air-datepicker-overlay.-active-{opacity:1;width:100%;height:100%;transition:opacity var(--adp-overlay-transition-duration) var(--adp-overlay-transition-ease),height 0s,width 0s} @charset "UTF-8"; .toast-title { font-weight: 700; } .toast-message { -ms-word-wrap: break-word; word-wrap: break-word; } .toast-message a, .toast-message label { color: #FFF; } .toast-message a:hover { color: #CCC; text-decoration: none; } .toast-close-button { position: relative; right: -0.3em; top: -0.3em; float: right; font-size: 20px; font-weight: 700; color: #FFF; -webkit-text-shadow: 0 1px 0 #fff; text-shadow: 0 1px 0 #fff; opacity: 0.8; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); filter: alpha(opacity=80); line-height: 1; } .toast-close-button:focus, .toast-close-button:hover { color: #000; text-decoration: none; cursor: pointer; opacity: 0.4; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40); filter: alpha(opacity=40); } .rtl .toast-close-button { left: -0.3em; float: left; right: 0.3em; } button.toast-close-button { padding: 0; cursor: pointer; background: 0 0; border: 0; -webkit-appearance: none; } .toast-top-center { top: 0; right: 0; width: 100%; } .toast-bottom-center { bottom: 0; right: 0; width: 100%; } .toast-top-full-width { top: 0; right: 0; width: 100%; } .toast-bottom-full-width { bottom: 0; right: 0; width: 100%; } .toast-top-left { top: 12px; left: 12px; } .toast-top-right { top: 12px; right: 12px; } .toast-bottom-right { right: 12px; bottom: 12px; } .toast-bottom-left { bottom: 12px; left: 12px; } #toast-container { position: fixed; z-index: 999999; pointer-events: none; } #toast-container * { box-sizing: border-box; } #toast-container > div { position: relative; pointer-events: auto; overflow: hidden; margin: 0 0 6px; padding: 15px 15px 15px 50px; width: 300px; border-radius: 3px; background-position: 15px center; background-repeat: no-repeat; box-shadow: 0 0 12px #999; color: #FFF; opacity: 0.8; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); filter: alpha(opacity=80); } #toast-container > div.rtl { direction: rtl; padding: 15px 50px 15px 15px; background-position: right 15px center; } #toast-container > div:hover { box-shadow: 0 0 12px #000; opacity: 1; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); filter: alpha(opacity=100); cursor: pointer; } #toast-container > .toast-info { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=) !important; } #toast-container > .toast-error { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=) !important; } #toast-container > .toast-success { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==) !important; } #toast-container > .toast-warning { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=) !important; } #toast-container.toast-bottom-center > div, #toast-container.toast-top-center > div { width: 300px; margin-left: auto; margin-right: auto; } #toast-container.toast-bottom-full-width > div, #toast-container.toast-top-full-width > div { width: 96%; margin-left: auto; margin-right: auto; } .toast { background-color: #030303; } .toast-success { background-color: #51A351; } .toast-error { background-color: #BD362F; } .toast-info { background-color: #2F96B4; } .toast-warning { background-color: #F89406; } .toast-progress { position: absolute; left: 0; bottom: 0; height: 4px; background-color: #000; opacity: 0.4; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40); filter: alpha(opacity=40); } @media all and (max-width: 240px) { #toast-container > div { padding: 8px 8px 8px 50px; width: 11em; } #toast-container > div.rtl { padding: 8px 50px 8px 8px; } #toast-container .toast-close-button { right: -0.2em; top: -0.2em; } #toast-container .rtl .toast-close-button { left: -0.2em; right: 0.2em; } } @media all and (min-width: 241px) and (max-width: 480px) { #toast-container > div { padding: 8px 8px 8px 50px; width: 18em; } #toast-container > div.rtl { padding: 8px 50px 8px 8px; } #toast-container .toast-close-button { right: -0.2em; top: -0.2em; } #toast-container .rtl .toast-close-button { left: -0.2em; right: 0.2em; } } @media all and (min-width: 481px) and (max-width: 768px) { #toast-container > div { padding: 15px 15px 15px 50px; width: 25em; } #toast-container > div.rtl { padding: 15px 50px 15px 15px; } } [data-tg-tour] { scroll-margin: 30px 0; } .tg-backdrop { position: absolute; align-items: center; justify-content: center; display: none; z-index: 99; border-radius: 7px; box-shadow: rgba(33, 33, 33, 0.8) 0 0 1px 2px, rgba(33, 33, 33, 0.8) 0 0 0 1000vh; border: 1px solid rgba(193, 192, 232, 0.5); top: 50vh; left: 50vw; width: 0; height: 0; } .tg-backdrop.tg-backdrop-animate { transition: all 300ms; } .tg-dialog { border-radius: 12px; animation-delay: 100ms; min-height: 120px; background: #fff; color: #252525; max-width: 340px; width: -moz-max-content; width: max-content; z-index: 9999; display: none; position: absolute; top: 0; left: 0; padding: 0; font-size: 0.9rem; } .tg-dialog .tg-dialog-header { display: flex; align-items: center; padding: 25px 25px 0 25px; } .tg-dialog .tg-dialog-header .tg-dialog-title { font-size: 1rem; font-weight: 700; margin-right: auto; } .tg-dialog .tg-dialog-header .tg-dialog-title + .tg-dialog-body { padding: 18.75px 25px 18.75px 25px; } .tg-dialog .tg-dialog-header .tg-dialog-close-btn { width: 12px; height: 12px; margin-left: 10px; opacity: 0.4; cursor: pointer; white-space: nowrap; } .tg-dialog .tg-dialog-header .tg-dialog-close-btn:hover { opacity: 8; } .tg-dialog .tg-dialog-header .tg-dialog-close-btn:focus { opacity: 1; } .tg-dialog .tg-dialog-header .tg-dialog-spinner { display: none; opacity: 0.4; margin-top: -1px; animation: tg-spin 1s linear infinite; } @keyframes tg-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(359deg); } } .tg-dialog .tg-dialog-progress-bar { background: #f1f1f1; height: 5px; display: block; margin-top: 18.75px; position: relative; } .tg-dialog .tg-dialog-progress-bar > .tg-bar { position: absolute; top: 0; left: 0; min-width: 4px; background: #414144; height: 100%; display: block; transition: all 300ms; } .tg-dialog .tg-dialog-body { padding: 25px; font-weight: 400; } .tg-dialog .tg-dialog-dots { display: flex; align-items: center; justify-content: center; padding: 15px 0; margin-bottom: 10px; border-top: 1px solid #dedee7; border-bottom: 1px solid #dedee7; } .tg-dialog .tg-dialog-dots > span.tg-dot { display: inline-block; width: 9px; height: 9px; background: #c2c7ce; border-radius: 12px; margin: 0 4px; } .tg-dialog .tg-dialog-dots > span.tg-dot.tg-dot-active { background: #5362d9; } .tg-dialog .tg-dialog-footer { padding: 12.5px 25px 25px 25px; display: flex; align-items: center; } .tg-dialog .tg-dialog-footer button.tg-dialog-btn { padding: 5px 10px; border: 1px solid #cbcfd5; color: #6f727e; border-radius: 4px; font-weight: 500; font-size: 0.82rem; white-space: nowrap; } .tg-dialog .tg-dialog-footer button.tg-dialog-btn + button { margin-left: auto; } .tg-dialog .tg-dialog-footer button.tg-dialog-btn.disabled { pointer-events: none; opacity: 0.6; } .tg-dialog .tg-dialog-footer button.tg-dialog-btn:hover { color: #464852; border: 1px solid #b5b7c2; outline: none; box-shadow: none; } .tg-dialog .tg-dialog-footer button.tg-dialog-btn:focus { outline: none; box-shadow: none; } .tg-dialog .tg-dialog-footer button.tg-dialog-btn:active { color: #4655cb; background: #f1f2ff; border: 1px solid #5362d9; outline: none; box-shadow: none; } .tg-dialog .tg-dialog-footer .tg-dialog-footer-sup { margin: 0 auto; padding: 0 10px; text-align: center; line-height: 1; } .tg-dialog .tg-dialog-footer .tg-dialog-footer-sup .tg-step-progress { font-size: 0.78rem; font-weight: 700; margin: 0 auto; opacity: 0.4; letter-spacing: 1px; display: inline-block; } .tg-dialog .tg-dialog-footer .tg-dialog-footer-sup .tg-dialog-dots { padding: 0; margin: 0; border: none; } .tg-dialog .tg-dialog-footer .tg-dialog-footer-sup .tg-dialog-dots > span.tg-dot { width: 8px; height: 8px; margin: 0 3px; } .tg-dialog .tg-dialog-footer .tg-dialog-footer-sup .tg-dialog-dots + .tg-step-progress { margin-top: 10px; font-size: 0.68rem; } .tg-dialog .tg-arrow { position: absolute; background: #fff; width: 9px; height: 9px; border-radius: 1px; transform: rotate(45deg); } .tg-dialog.tg-dialog-fixed { transition: none; animation-delay: 0ms; } .tg-dialog.animate-position { transition: all 300ms; } .tg-dialog.tg-dialog-loading .tg-dialog-header .tg-dialog-title { opacity: 0.4; } .tg-dialog.tg-dialog-loading .tg-dialog-header .tg-dialog-close-btn { display: none; } .tg-dialog.tg-dialog-loading .tg-dialog-header .tg-dialog-spinner { display: inline-block; } .tg-dialog.tg-dialog-loading .tg-dialog-body { opacity: 0.4; pointer-events: none; } .tg-dialog.tg-dialog-loading .tg-dialog-footer { pointer-events: none; opacity: 0.4; } /** Library **/ /** Variables **/ /** Main Rules **/ /** * Main rules * * Author : Thibaud Magniez */ body { background: #fff; font-family: "Poppins", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; overflow-x: hidden; } h1 { display: flex; font-size: 18px; color: #222a40; margin-top: 12px; } h1 i { font-size: 13px; margin: auto 10px; } h2 { font-size: 16px; color: #222a40; } span.conversation_users { display: block; } .hidden { display: none !important; } /***** Link *****/ a { color: #ff9551; } a:hover { color: #222a40; } /***** Cursors *****/ .cursor-pointer { cursor: pointer !important; } /***** Text *****/ .strikethrough-text { text-decoration: line-through !important; } .text-primary { color: #ff9551 !important; } .no-overflow { overflow: unset !important; } .overflow-y-scroll { overflow-y: scroll; } /***** Background *****/ .bg-white { background-color: #fff; } .bg-blue { background-color: #222a40; } .bg-light-blue { background-color: #e7eaf3; } .bg-light-orange { background-color: rgb(255, 240, 231); } /***** Border *****/ .border-blue { border: 1px solid #e7eaf3; } .border-radius-24 { border-radius: 24px; } .border-radius-16 { border-radius: 16px; } /***** Width & Height *****/ .min-h-auto { min-height: auto !important; } .w-5px { width: 5px !important; } .max-w-5px { max-width: 5px; } .min-w-5px { min-width: 5px; } .h-5px { height: 5px !important; } .max-h-5px { max-height: 5px; } .min-h-5px { min-height: 5px; } .w-10px { width: 10px !important; } .max-w-10px { max-width: 10px; } .min-w-10px { min-width: 10px; } .h-10px { height: 10px !important; } .max-h-10px { max-height: 10px; } .min-h-10px { min-height: 10px; } .w-15px { width: 15px !important; } .max-w-15px { max-width: 15px; } .min-w-15px { min-width: 15px; } .h-15px { height: 15px !important; } .max-h-15px { max-height: 15px; } .min-h-15px { min-height: 15px; } .w-20px { width: 20px !important; } .max-w-20px { max-width: 20px; } .min-w-20px { min-width: 20px; } .h-20px { height: 20px !important; } .max-h-20px { max-height: 20px; } .min-h-20px { min-height: 20px; } .w-25px { width: 25px !important; } .max-w-25px { max-width: 25px; } .min-w-25px { min-width: 25px; } .h-25px { height: 25px !important; } .max-h-25px { max-height: 25px; } .min-h-25px { min-height: 25px; } .w-30px { width: 30px !important; } .max-w-30px { max-width: 30px; } .min-w-30px { min-width: 30px; } .h-30px { height: 30px !important; } .max-h-30px { max-height: 30px; } .min-h-30px { min-height: 30px; } .w-35px { width: 35px !important; } .max-w-35px { max-width: 35px; } .min-w-35px { min-width: 35px; } .h-35px { height: 35px !important; } .max-h-35px { max-height: 35px; } .min-h-35px { min-height: 35px; } .w-40px { width: 40px !important; } .max-w-40px { max-width: 40px; } .min-w-40px { min-width: 40px; } .h-40px { height: 40px !important; } .max-h-40px { max-height: 40px; } .min-h-40px { min-height: 40px; } .w-45px { width: 45px !important; } .max-w-45px { max-width: 45px; } .min-w-45px { min-width: 45px; } .h-45px { height: 45px !important; } .max-h-45px { max-height: 45px; } .min-h-45px { min-height: 45px; } .w-50px { width: 50px !important; } .max-w-50px { max-width: 50px; } .min-w-50px { min-width: 50px; } .h-50px { height: 50px !important; } .max-h-50px { max-height: 50px; } .min-h-50px { min-height: 50px; } .w-55px { width: 55px !important; } .max-w-55px { max-width: 55px; } .min-w-55px { min-width: 55px; } .h-55px { height: 55px !important; } .max-h-55px { max-height: 55px; } .min-h-55px { min-height: 55px; } .w-60px { width: 60px !important; } .max-w-60px { max-width: 60px; } .min-w-60px { min-width: 60px; } .h-60px { height: 60px !important; } .max-h-60px { max-height: 60px; } .min-h-60px { min-height: 60px; } .w-65px { width: 65px !important; } .max-w-65px { max-width: 65px; } .min-w-65px { min-width: 65px; } .h-65px { height: 65px !important; } .max-h-65px { max-height: 65px; } .min-h-65px { min-height: 65px; } .w-70px { width: 70px !important; } .max-w-70px { max-width: 70px; } .min-w-70px { min-width: 70px; } .h-70px { height: 70px !important; } .max-h-70px { max-height: 70px; } .min-h-70px { min-height: 70px; } .w-75px { width: 75px !important; } .max-w-75px { max-width: 75px; } .min-w-75px { min-width: 75px; } .h-75px { height: 75px !important; } .max-h-75px { max-height: 75px; } .min-h-75px { min-height: 75px; } .w-80px { width: 80px !important; } .max-w-80px { max-width: 80px; } .min-w-80px { min-width: 80px; } .h-80px { height: 80px !important; } .max-h-80px { max-height: 80px; } .min-h-80px { min-height: 80px; } .w-85px { width: 85px !important; } .max-w-85px { max-width: 85px; } .min-w-85px { min-width: 85px; } .h-85px { height: 85px !important; } .max-h-85px { max-height: 85px; } .min-h-85px { min-height: 85px; } .w-90px { width: 90px !important; } .max-w-90px { max-width: 90px; } .min-w-90px { min-width: 90px; } .h-90px { height: 90px !important; } .max-h-90px { max-height: 90px; } .min-h-90px { min-height: 90px; } .w-95px { width: 95px !important; } .max-w-95px { max-width: 95px; } .min-w-95px { min-width: 95px; } .h-95px { height: 95px !important; } .max-h-95px { max-height: 95px; } .min-h-95px { min-height: 95px; } .w-100px { width: 100px !important; } .max-w-100px { max-width: 100px; } .min-w-100px { min-width: 100px; } .h-100px { height: 100px !important; } .max-h-100px { max-height: 100px; } .min-h-100px { min-height: 100px; } .w-105px { width: 105px !important; } .max-w-105px { max-width: 105px; } .min-w-105px { min-width: 105px; } .h-105px { height: 105px !important; } .max-h-105px { max-height: 105px; } .min-h-105px { min-height: 105px; } .w-110px { width: 110px !important; } .max-w-110px { max-width: 110px; } .min-w-110px { min-width: 110px; } .h-110px { height: 110px !important; } .max-h-110px { max-height: 110px; } .min-h-110px { min-height: 110px; } .w-115px { width: 115px !important; } .max-w-115px { max-width: 115px; } .min-w-115px { min-width: 115px; } .h-115px { height: 115px !important; } .max-h-115px { max-height: 115px; } .min-h-115px { min-height: 115px; } .w-120px { width: 120px !important; } .max-w-120px { max-width: 120px; } .min-w-120px { min-width: 120px; } .h-120px { height: 120px !important; } .max-h-120px { max-height: 120px; } .min-h-120px { min-height: 120px; } .w-125px { width: 125px !important; } .max-w-125px { max-width: 125px; } .min-w-125px { min-width: 125px; } .h-125px { height: 125px !important; } .max-h-125px { max-height: 125px; } .min-h-125px { min-height: 125px; } .w-130px { width: 130px !important; } .max-w-130px { max-width: 130px; } .min-w-130px { min-width: 130px; } .h-130px { height: 130px !important; } .max-h-130px { max-height: 130px; } .min-h-130px { min-height: 130px; } .w-135px { width: 135px !important; } .max-w-135px { max-width: 135px; } .min-w-135px { min-width: 135px; } .h-135px { height: 135px !important; } .max-h-135px { max-height: 135px; } .min-h-135px { min-height: 135px; } .w-140px { width: 140px !important; } .max-w-140px { max-width: 140px; } .min-w-140px { min-width: 140px; } .h-140px { height: 140px !important; } .max-h-140px { max-height: 140px; } .min-h-140px { min-height: 140px; } .w-145px { width: 145px !important; } .max-w-145px { max-width: 145px; } .min-w-145px { min-width: 145px; } .h-145px { height: 145px !important; } .max-h-145px { max-height: 145px; } .min-h-145px { min-height: 145px; } .w-150px { width: 150px !important; } .max-w-150px { max-width: 150px; } .min-w-150px { min-width: 150px; } .h-150px { height: 150px !important; } .max-h-150px { max-height: 150px; } .min-h-150px { min-height: 150px; } .w-155px { width: 155px !important; } .max-w-155px { max-width: 155px; } .min-w-155px { min-width: 155px; } .h-155px { height: 155px !important; } .max-h-155px { max-height: 155px; } .min-h-155px { min-height: 155px; } .w-160px { width: 160px !important; } .max-w-160px { max-width: 160px; } .min-w-160px { min-width: 160px; } .h-160px { height: 160px !important; } .max-h-160px { max-height: 160px; } .min-h-160px { min-height: 160px; } .w-165px { width: 165px !important; } .max-w-165px { max-width: 165px; } .min-w-165px { min-width: 165px; } .h-165px { height: 165px !important; } .max-h-165px { max-height: 165px; } .min-h-165px { min-height: 165px; } .w-170px { width: 170px !important; } .max-w-170px { max-width: 170px; } .min-w-170px { min-width: 170px; } .h-170px { height: 170px !important; } .max-h-170px { max-height: 170px; } .min-h-170px { min-height: 170px; } .w-175px { width: 175px !important; } .max-w-175px { max-width: 175px; } .min-w-175px { min-width: 175px; } .h-175px { height: 175px !important; } .max-h-175px { max-height: 175px; } .min-h-175px { min-height: 175px; } .w-180px { width: 180px !important; } .max-w-180px { max-width: 180px; } .min-w-180px { min-width: 180px; } .h-180px { height: 180px !important; } .max-h-180px { max-height: 180px; } .min-h-180px { min-height: 180px; } .w-185px { width: 185px !important; } .max-w-185px { max-width: 185px; } .min-w-185px { min-width: 185px; } .h-185px { height: 185px !important; } .max-h-185px { max-height: 185px; } .min-h-185px { min-height: 185px; } .w-190px { width: 190px !important; } .max-w-190px { max-width: 190px; } .min-w-190px { min-width: 190px; } .h-190px { height: 190px !important; } .max-h-190px { max-height: 190px; } .min-h-190px { min-height: 190px; } .w-195px { width: 195px !important; } .max-w-195px { max-width: 195px; } .min-w-195px { min-width: 195px; } .h-195px { height: 195px !important; } .max-h-195px { max-height: 195px; } .min-h-195px { min-height: 195px; } .w-200px { width: 200px !important; } .max-w-200px { max-width: 200px; } .min-w-200px { min-width: 200px; } .h-200px { height: 200px !important; } .max-h-200px { max-height: 200px; } .min-h-200px { min-height: 200px; } .w-205px { width: 205px !important; } .max-w-205px { max-width: 205px; } .min-w-205px { min-width: 205px; } .h-205px { height: 205px !important; } .max-h-205px { max-height: 205px; } .min-h-205px { min-height: 205px; } .w-210px { width: 210px !important; } .max-w-210px { max-width: 210px; } .min-w-210px { min-width: 210px; } .h-210px { height: 210px !important; } .max-h-210px { max-height: 210px; } .min-h-210px { min-height: 210px; } .w-215px { width: 215px !important; } .max-w-215px { max-width: 215px; } .min-w-215px { min-width: 215px; } .h-215px { height: 215px !important; } .max-h-215px { max-height: 215px; } .min-h-215px { min-height: 215px; } .w-220px { width: 220px !important; } .max-w-220px { max-width: 220px; } .min-w-220px { min-width: 220px; } .h-220px { height: 220px !important; } .max-h-220px { max-height: 220px; } .min-h-220px { min-height: 220px; } .w-225px { width: 225px !important; } .max-w-225px { max-width: 225px; } .min-w-225px { min-width: 225px; } .h-225px { height: 225px !important; } .max-h-225px { max-height: 225px; } .min-h-225px { min-height: 225px; } .w-230px { width: 230px !important; } .max-w-230px { max-width: 230px; } .min-w-230px { min-width: 230px; } .h-230px { height: 230px !important; } .max-h-230px { max-height: 230px; } .min-h-230px { min-height: 230px; } .w-235px { width: 235px !important; } .max-w-235px { max-width: 235px; } .min-w-235px { min-width: 235px; } .h-235px { height: 235px !important; } .max-h-235px { max-height: 235px; } .min-h-235px { min-height: 235px; } .w-240px { width: 240px !important; } .max-w-240px { max-width: 240px; } .min-w-240px { min-width: 240px; } .h-240px { height: 240px !important; } .max-h-240px { max-height: 240px; } .min-h-240px { min-height: 240px; } .w-245px { width: 245px !important; } .max-w-245px { max-width: 245px; } .min-w-245px { min-width: 245px; } .h-245px { height: 245px !important; } .max-h-245px { max-height: 245px; } .min-h-245px { min-height: 245px; } .w-250px { width: 250px !important; } .max-w-250px { max-width: 250px; } .min-w-250px { min-width: 250px; } .h-250px { height: 250px !important; } .max-h-250px { max-height: 250px; } .min-h-250px { min-height: 250px; } .w-255px { width: 255px !important; } .max-w-255px { max-width: 255px; } .min-w-255px { min-width: 255px; } .h-255px { height: 255px !important; } .max-h-255px { max-height: 255px; } .min-h-255px { min-height: 255px; } .w-260px { width: 260px !important; } .max-w-260px { max-width: 260px; } .min-w-260px { min-width: 260px; } .h-260px { height: 260px !important; } .max-h-260px { max-height: 260px; } .min-h-260px { min-height: 260px; } .w-265px { width: 265px !important; } .max-w-265px { max-width: 265px; } .min-w-265px { min-width: 265px; } .h-265px { height: 265px !important; } .max-h-265px { max-height: 265px; } .min-h-265px { min-height: 265px; } .w-270px { width: 270px !important; } .max-w-270px { max-width: 270px; } .min-w-270px { min-width: 270px; } .h-270px { height: 270px !important; } .max-h-270px { max-height: 270px; } .min-h-270px { min-height: 270px; } .w-275px { width: 275px !important; } .max-w-275px { max-width: 275px; } .min-w-275px { min-width: 275px; } .h-275px { height: 275px !important; } .max-h-275px { max-height: 275px; } .min-h-275px { min-height: 275px; } .w-280px { width: 280px !important; } .max-w-280px { max-width: 280px; } .min-w-280px { min-width: 280px; } .h-280px { height: 280px !important; } .max-h-280px { max-height: 280px; } .min-h-280px { min-height: 280px; } .w-285px { width: 285px !important; } .max-w-285px { max-width: 285px; } .min-w-285px { min-width: 285px; } .h-285px { height: 285px !important; } .max-h-285px { max-height: 285px; } .min-h-285px { min-height: 285px; } .w-290px { width: 290px !important; } .max-w-290px { max-width: 290px; } .min-w-290px { min-width: 290px; } .h-290px { height: 290px !important; } .max-h-290px { max-height: 290px; } .min-h-290px { min-height: 290px; } .w-295px { width: 295px !important; } .max-w-295px { max-width: 295px; } .min-w-295px { min-width: 295px; } .h-295px { height: 295px !important; } .max-h-295px { max-height: 295px; } .min-h-295px { min-height: 295px; } .w-300px { width: 300px !important; } .max-w-300px { max-width: 300px; } .min-w-300px { min-width: 300px; } .h-300px { height: 300px !important; } .max-h-300px { max-height: 300px; } .min-h-300px { min-height: 300px; } .w-305px { width: 305px !important; } .max-w-305px { max-width: 305px; } .min-w-305px { min-width: 305px; } .h-305px { height: 305px !important; } .max-h-305px { max-height: 305px; } .min-h-305px { min-height: 305px; } .w-310px { width: 310px !important; } .max-w-310px { max-width: 310px; } .min-w-310px { min-width: 310px; } .h-310px { height: 310px !important; } .max-h-310px { max-height: 310px; } .min-h-310px { min-height: 310px; } .w-315px { width: 315px !important; } .max-w-315px { max-width: 315px; } .min-w-315px { min-width: 315px; } .h-315px { height: 315px !important; } .max-h-315px { max-height: 315px; } .min-h-315px { min-height: 315px; } .w-320px { width: 320px !important; } .max-w-320px { max-width: 320px; } .min-w-320px { min-width: 320px; } .h-320px { height: 320px !important; } .max-h-320px { max-height: 320px; } .min-h-320px { min-height: 320px; } .w-325px { width: 325px !important; } .max-w-325px { max-width: 325px; } .min-w-325px { min-width: 325px; } .h-325px { height: 325px !important; } .max-h-325px { max-height: 325px; } .min-h-325px { min-height: 325px; } .w-330px { width: 330px !important; } .max-w-330px { max-width: 330px; } .min-w-330px { min-width: 330px; } .h-330px { height: 330px !important; } .max-h-330px { max-height: 330px; } .min-h-330px { min-height: 330px; } .w-335px { width: 335px !important; } .max-w-335px { max-width: 335px; } .min-w-335px { min-width: 335px; } .h-335px { height: 335px !important; } .max-h-335px { max-height: 335px; } .min-h-335px { min-height: 335px; } .w-340px { width: 340px !important; } .max-w-340px { max-width: 340px; } .min-w-340px { min-width: 340px; } .h-340px { height: 340px !important; } .max-h-340px { max-height: 340px; } .min-h-340px { min-height: 340px; } .w-345px { width: 345px !important; } .max-w-345px { max-width: 345px; } .min-w-345px { min-width: 345px; } .h-345px { height: 345px !important; } .max-h-345px { max-height: 345px; } .min-h-345px { min-height: 345px; } .w-350px { width: 350px !important; } .max-w-350px { max-width: 350px; } .min-w-350px { min-width: 350px; } .h-350px { height: 350px !important; } .max-h-350px { max-height: 350px; } .min-h-350px { min-height: 350px; } .w-355px { width: 355px !important; } .max-w-355px { max-width: 355px; } .min-w-355px { min-width: 355px; } .h-355px { height: 355px !important; } .max-h-355px { max-height: 355px; } .min-h-355px { min-height: 355px; } .w-360px { width: 360px !important; } .max-w-360px { max-width: 360px; } .min-w-360px { min-width: 360px; } .h-360px { height: 360px !important; } .max-h-360px { max-height: 360px; } .min-h-360px { min-height: 360px; } .w-365px { width: 365px !important; } .max-w-365px { max-width: 365px; } .min-w-365px { min-width: 365px; } .h-365px { height: 365px !important; } .max-h-365px { max-height: 365px; } .min-h-365px { min-height: 365px; } .w-370px { width: 370px !important; } .max-w-370px { max-width: 370px; } .min-w-370px { min-width: 370px; } .h-370px { height: 370px !important; } .max-h-370px { max-height: 370px; } .min-h-370px { min-height: 370px; } .w-375px { width: 375px !important; } .max-w-375px { max-width: 375px; } .min-w-375px { min-width: 375px; } .h-375px { height: 375px !important; } .max-h-375px { max-height: 375px; } .min-h-375px { min-height: 375px; } .w-380px { width: 380px !important; } .max-w-380px { max-width: 380px; } .min-w-380px { min-width: 380px; } .h-380px { height: 380px !important; } .max-h-380px { max-height: 380px; } .min-h-380px { min-height: 380px; } .w-385px { width: 385px !important; } .max-w-385px { max-width: 385px; } .min-w-385px { min-width: 385px; } .h-385px { height: 385px !important; } .max-h-385px { max-height: 385px; } .min-h-385px { min-height: 385px; } .w-390px { width: 390px !important; } .max-w-390px { max-width: 390px; } .min-w-390px { min-width: 390px; } .h-390px { height: 390px !important; } .max-h-390px { max-height: 390px; } .min-h-390px { min-height: 390px; } .w-395px { width: 395px !important; } .max-w-395px { max-width: 395px; } .min-w-395px { min-width: 395px; } .h-395px { height: 395px !important; } .max-h-395px { max-height: 395px; } .min-h-395px { min-height: 395px; } .w-400px { width: 400px !important; } .max-w-400px { max-width: 400px; } .min-w-400px { min-width: 400px; } .h-400px { height: 400px !important; } .max-h-400px { max-height: 400px; } .min-h-400px { min-height: 400px; } .w-405px { width: 405px !important; } .max-w-405px { max-width: 405px; } .min-w-405px { min-width: 405px; } .h-405px { height: 405px !important; } .max-h-405px { max-height: 405px; } .min-h-405px { min-height: 405px; } .w-410px { width: 410px !important; } .max-w-410px { max-width: 410px; } .min-w-410px { min-width: 410px; } .h-410px { height: 410px !important; } .max-h-410px { max-height: 410px; } .min-h-410px { min-height: 410px; } .w-415px { width: 415px !important; } .max-w-415px { max-width: 415px; } .min-w-415px { min-width: 415px; } .h-415px { height: 415px !important; } .max-h-415px { max-height: 415px; } .min-h-415px { min-height: 415px; } .w-420px { width: 420px !important; } .max-w-420px { max-width: 420px; } .min-w-420px { min-width: 420px; } .h-420px { height: 420px !important; } .max-h-420px { max-height: 420px; } .min-h-420px { min-height: 420px; } .w-425px { width: 425px !important; } .max-w-425px { max-width: 425px; } .min-w-425px { min-width: 425px; } .h-425px { height: 425px !important; } .max-h-425px { max-height: 425px; } .min-h-425px { min-height: 425px; } .w-430px { width: 430px !important; } .max-w-430px { max-width: 430px; } .min-w-430px { min-width: 430px; } .h-430px { height: 430px !important; } .max-h-430px { max-height: 430px; } .min-h-430px { min-height: 430px; } .w-435px { width: 435px !important; } .max-w-435px { max-width: 435px; } .min-w-435px { min-width: 435px; } .h-435px { height: 435px !important; } .max-h-435px { max-height: 435px; } .min-h-435px { min-height: 435px; } .w-440px { width: 440px !important; } .max-w-440px { max-width: 440px; } .min-w-440px { min-width: 440px; } .h-440px { height: 440px !important; } .max-h-440px { max-height: 440px; } .min-h-440px { min-height: 440px; } .w-445px { width: 445px !important; } .max-w-445px { max-width: 445px; } .min-w-445px { min-width: 445px; } .h-445px { height: 445px !important; } .max-h-445px { max-height: 445px; } .min-h-445px { min-height: 445px; } .w-450px { width: 450px !important; } .max-w-450px { max-width: 450px; } .min-w-450px { min-width: 450px; } .h-450px { height: 450px !important; } .max-h-450px { max-height: 450px; } .min-h-450px { min-height: 450px; } .w-455px { width: 455px !important; } .max-w-455px { max-width: 455px; } .min-w-455px { min-width: 455px; } .h-455px { height: 455px !important; } .max-h-455px { max-height: 455px; } .min-h-455px { min-height: 455px; } .w-460px { width: 460px !important; } .max-w-460px { max-width: 460px; } .min-w-460px { min-width: 460px; } .h-460px { height: 460px !important; } .max-h-460px { max-height: 460px; } .min-h-460px { min-height: 460px; } .w-465px { width: 465px !important; } .max-w-465px { max-width: 465px; } .min-w-465px { min-width: 465px; } .h-465px { height: 465px !important; } .max-h-465px { max-height: 465px; } .min-h-465px { min-height: 465px; } .w-470px { width: 470px !important; } .max-w-470px { max-width: 470px; } .min-w-470px { min-width: 470px; } .h-470px { height: 470px !important; } .max-h-470px { max-height: 470px; } .min-h-470px { min-height: 470px; } .w-475px { width: 475px !important; } .max-w-475px { max-width: 475px; } .min-w-475px { min-width: 475px; } .h-475px { height: 475px !important; } .max-h-475px { max-height: 475px; } .min-h-475px { min-height: 475px; } .w-480px { width: 480px !important; } .max-w-480px { max-width: 480px; } .min-w-480px { min-width: 480px; } .h-480px { height: 480px !important; } .max-h-480px { max-height: 480px; } .min-h-480px { min-height: 480px; } .w-485px { width: 485px !important; } .max-w-485px { max-width: 485px; } .min-w-485px { min-width: 485px; } .h-485px { height: 485px !important; } .max-h-485px { max-height: 485px; } .min-h-485px { min-height: 485px; } .w-490px { width: 490px !important; } .max-w-490px { max-width: 490px; } .min-w-490px { min-width: 490px; } .h-490px { height: 490px !important; } .max-h-490px { max-height: 490px; } .min-h-490px { min-height: 490px; } .w-495px { width: 495px !important; } .max-w-495px { max-width: 495px; } .min-w-495px { min-width: 495px; } .h-495px { height: 495px !important; } .max-h-495px { max-height: 495px; } .min-h-495px { min-height: 495px; } .w-500px { width: 500px !important; } .max-w-500px { max-width: 500px; } .min-w-500px { min-width: 500px; } .h-500px { height: 500px !important; } .max-h-500px { max-height: 500px; } .min-h-500px { min-height: 500px; } /** * Visibility rules */ .mobile-only { display: none; } @media (max-width: 767px) { .hide-mobile { display: none !important; } .mobile-only { display: block !important; } } /** * Animation */ @keyframes rotate { to { transform: rotate(360deg); } } /** * Scroll bar */ .hide-scroll-bar { -ms-overflow-style: none; scrollbar-width: none; } .hide-scroll-bar::-webkit-scrollbar { display: none; } /** * Disable highlight selection */ .no-select { -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ /* Konqueror HTML */ -moz-user-select: none; /* Old versions of Firefox */ /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */ } /** * Disable box shadow */ .no-box-shadow, .no-box-shadow * { box-shadow: none !important; } /** * Separator */ hr.separator { border-top: 1px solid #E5E5E5; } /* * Backgrounds */ .bg-primary { background-color: #ff9551 !important; } .bg-gray-light { background: #F8F8F8 !important; } /** Text **/ .text-gray { color: #737373 !important; } /* * Inputs */ label { font-weight: 400; } input:focus, textarea:focus { border-color: inherit !important; box-shadow: none !important; } input:focus, input:active, select:focus, select:active, textarea:focus, textarea:active { outline: none !important; box-shadow: none !important; border-color: #D8D9DD !important; } /* * Modal */ .modal-backdrop.show { opacity: 0.5; } /* * Ui Autocomplete */ .ui-autocomplete { z-index: 1500 !important; border: 1px solid #F8F8F8 !important; font-size: 13px !important; } .ui-autocomplete .ui-menu-item-wrapper { border: none !important; border-bottom: 1px solid #F8F8F8 !important; } .ui-autocomplete .ui-menu-item-wrapper.ui-state-active { margin: 0 !important; color: #222a40 !important; background-color: #F8F8F8 !important; border: none !important; border-bottom: 1px solid #F8F8F8 !important; } .nav-main-link .nav-main-link-icon { color: #222a40; } .invalid-feedback, .valid-feedback { font-size: 12px; } .fc.fc-theme-standard { font-size: 0.9em; } /** * Auth style * * Author : Thibaud Magniez */ .auth-block .logo img { max-width: 175px; width: 100%; } .error-page .logo { margin: 0 auto 20px auto; max-width: 180px; } .error-page .logo img { width: 100%; } .error-page h1 { justify-content: center; font-size: 30px; color: #ff9551; margin: 50px 0 20px 0; } .error-page h2 { text-align: center; font-size: 18px; margin-bottom: 20px; } .error-page .error-text { margin: 0 auto 0 auto; max-width: 800px; text-align: center; } .error-page .error-link { display: block; max-width: -moz-fit-content; max-width: fit-content; margin: 40px auto 0 auto; padding: 15px 30px; font-size: 14px; } /** Components **/ .ekip-charts .block { border-radius: 18px; /*overflow: hidden;*/ box-shadow: none; } .ekip-charts .block .block-header { background-color: #F8F8F8; } .ekip-charts .block .block-header .block-title { font-size: 14px; font-weight: 500; color: #222a40; } .ekip-charts .block .block-content { background-color: #F8F8F8; } .ekip-charts .block .block-content .chart { min-height: 300px; } .chart-container { display: flex; align-items: center; justify-content: center; } .ekip-datas .custom-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; grid-gap: 10px; } .ekip-datas .custom-grid.has-4-cols { grid-template-columns: 1fr 1fr 1fr 1fr; } @media screen and (max-width: 768px) { .ekip-datas .custom-grid { grid-template-columns: 1fr 1fr !important; } } .ekip-datas .block { background-color: #F8F8F8; box-shadow: none; border-radius: 18px; overflow: hidden; } .ekip-datas .block .title { font-size: 17px; font-weight: 500; color: #222a40; } .ekip-datas .block .data { font-weight: 700; font-size: 22px; color: #ff9551; } #gantt-chart { /** Round the edge **/ } #gantt-chart.gantt_default_main { border-color: #f8f8f8; /* Area menu */ /* Left corner */ /* Horizontal divider */ /** Row header */ /** Default splitter **/ /** Time header **/ } #gantt-chart.gantt_default_main .area-open-menu { font-size: 14px; border: 1px solid #fff; box-sizing: border-box; background-color: #ff9551; color: #fff; text-align: center; padding: 1px; cursor: pointer; } #gantt-chart.gantt_default_main .gantt_default_rowheader_scroll { background: #fff; } #gantt-chart.gantt_default_main .gantt_default_corner .gantt_default_corner_inner { background-color: #f8f8f8; } #gantt-chart.gantt_default_main .gantt_default_corner .gantt_default_columnheader .gantt_default_columnheader_inner { /*background-color: $blue-color; color: $bgColor;*/ /* Header divider */ } #gantt-chart.gantt_default_main .gantt_default_corner .gantt_default_columnheader .gantt_default_columnheader_inner .gantt_default_columnheader_cell { font-weight: 400; } #gantt-chart.gantt_default_main .gantt_default_corner .gantt_default_columnheader .gantt_default_columnheader_inner .gantt_default_columnheader_cell .gantt_default_columnheader_cell_inner { padding-left: 10px; } #gantt-chart.gantt_default_main .gantt_default_corner .gantt_default_columnheader .gantt_default_columnheader_inner .gantt_default_columnheader_splitter { background-color: #fff; opacity: 1; } #gantt-chart.gantt_default_main .gantt_default_corner .gantt_default_divider { background-color: #fff; } #gantt-chart.gantt_default_main .gantt_default_divider_horizontal { background-color: #f8f8f8; } #gantt-chart.gantt_default_main .gantt_default_rowheader { background-color: #fff; } #gantt-chart.gantt_default_main .gantt_default_rowheader .gantt_default_rowheader_inner { border-right: 3px solid #f8f8f8; } #gantt-chart.gantt_default_main .gantt_default_rowheader .gantt_default_rowheader_inner .gantt_default_tree_image_expand { background-position: 0 4px; top: -1px !important; padding: 4px 100px 4px 0; } #gantt-chart.gantt_default_main .gantt_default_rowheader .gantt_default_resourcedivider { border-bottom: 3px solid #f8f8f8 !important; } #gantt-chart.gantt_default_main .gantt_default_divider.gantt_default_splitter { background: #f8f8f8; } #gantt-chart.gantt_default_main .gantt_default_timeheader_scroll .gantt_default_timeheadergroup.gantt_default_timeheader_cell .gantt_default_timeheader_float_inner, #gantt-chart.gantt_default_main .gantt_default_timeheader_scroll .gantt_default_timeheadergroup.gantt_default_timeheader_cell .gantt_default_timeheader_cell_inner { color: #fff; text-transform: capitalize; } #gantt-chart.gantt_default_main .gantt_default_timeheader_scroll .gantt_default_timeheadercol_inner.gantt_default_timeheader_cell_inner { border-right: 2px solid #f8f8f8; background-color: #fff; } #gantt-chart .gantt_default_columnheader { border-top-left-radius: 8px; } #gantt-chart .gantt_default_timeheader_scroll { border-top-left-radius: 8px; border-top-right-radius: 8px; } #gantt-chart.gantt_default_main { overflow: hidden; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; } /** Gantt menu **/ .menu_default_main { z-index: 9999 !important; } .menu_default_main a { cursor: pointer !important; } /** Bubble **/ .bubble_default_main .task-buble p { margin: 0; } /** Navigation **/ #calendar-nav-container { position: absolute; z-index: 999; } @keyframes loading-bar { 0% { left: 0%; right: 100%; width: 0%; } 10% { left: 0%; right: 75%; width: 25%; } 90% { right: 0%; left: 75%; width: 25%; } 100% { left: 100%; right: 0%; width: 0%; } } .badge.badge-pill { color: var(--text-color, #2b3e71); background-color: var(--bg-color, #F4F6FF); border-radius: 20px; padding: 5px 8px; font-size: 11px; max-height: 40px; width: -moz-fit-content; width: fit-content; font-weight: 500; } .badge.badge-pill.green { background-color: #e3f8ed; color: #00a44e; } .badge.badge-pill.red { background-color: #ffddd0; color: #e04f1a; } .badge.badge-pill.orange { background-color: #ff9551; color: #fff; } .badge.badge-pill.blue { background-color: #2b3e71; color: #fff; } .badge.badge-pill.premium { font-size: 10px; font-weight: 300; } .badge.badge-pill.dark-blue { background-color: #1b2932; color: #fff; } .badge.badge-pill.default { color: #2b3e71; } .badge.badge-pill:empty { display: none; } /** * Context menu Style * * Author : Thibaud Magniez */ .context-menu { position: fixed; z-index: 999; min-width: 100px; max-width: 180px; display: none; } .context-menu ul { list-style: none; border-radius: 8px; padding: 5px; background-color: #fff; border: 1px solid #F7F7F8; box-shadow: 0px 8px 8px 0px rgba(41, 43, 50, 0.1); } .context-menu li { border-bottom: 0.5px solid #F7F7F8; } .context-menu li:last-child { border: none; } .context-menu li a { display: block; padding: 2px 5px; text-decoration: none; border-radius: 4px; color: #222a40; font-size: 13px; } .context-menu li a:hover { background: rgb(255, 240, 231); } /** * Form Style * * Author : Thibaud Magniez */ form { margin: 0; } form .required { color: #e04f1a; } form .required:after { /*content: '*';*/ } .form-group .form-control { font-size: 13px; } .form-group .form-check label { font-size: 13px; } .form-group .form-check .form-check-input { margin-top: 0.4rem; } .invalid-feedback { padding: 5px 0 0 2px; margin: 0; } .btn { font-size: 13px; } .icon { cursor: pointer; } .icon.has-light-background:before { display: inline-flex; justify-content: center; align-items: center; height: 35px; width: 35px; background-color: #F8F8F8; background-repeat: no-repeat !important; background-size: 15px !important; background-position: center !important; border-radius: 50%; margin-right: 10px; } .ekip-rounded-block { background: #F8F8F8 0% 0% no-repeat padding-box; border-radius: 18px !important; opacity: 1; box-shadow: none; padding: 10px 15px; } .ekip-rounded-block.is-dark { background: #e7eaf3 0% 0% no-repeat padding-box; } .ekip-rounded-block.bg-light { background: #fff !important; } .ekip-rounded-block.no-padding:not(.block-mode-fullscreen) { padding: 0; } .ekip-rounded-block.no-padding:not(.block-mode-fullscreen) .block-content { padding: 0; } .ekip-rounded-block.block-mode-fullscreen { position: fixed !important; height: unset !important; overflow: auto; } .ekip-rounded-block .block-header { border-top-left-radius: 18px; border-top-right-radius: 18px; } .ekip-rounded-block .block-header, .ekip-rounded-block .block-title { font-size: 15px; font-weight: 500; color: #222a40; letter-spacing: 0px; background: #F8F8F8; padding: 10px; } .ekip-rounded-block .block-header i, .ekip-rounded-block .block-title i { font-size: 9px; } @media (max-width: 768px) { .ekip-rounded-block .block-header, .ekip-rounded-block .block-title { flex-wrap: wrap; } } .ekip-rounded-block .block-options { margin: auto 0 auto 0; } .ekip-rounded-block .block-options i { font-size: unset; color: #222a40; font-weight: 600; } .ekip-rounded-block .block-content { padding: 10px; } .ekip-rounded-block .block-title { margin-bottom: 1.85rem; font-size: 18px; } .ekip-rounded-block .w-title { font-size: 15px; color: #2b3e71; } .ekip-rounded-block .w-title .block-options { width: unset; } .ekip-rounded-block .form-group { margin-bottom: 0; } .ekip-rounded-block hr { border-color: #939293; opacity: 0.19; margin: 30px 0; } .ekip-rounded-block.large-titles .block-header, .ekip-rounded-block.large-titles .block-title { font-size: 17px; } .ekip-rounded-block .inside-block { margin: 15px; background-color: #fff !important; } @media (max-width: 767px) { .ekip-rounded-block .inside-block { margin: 5px 0; } } .ekip-rounded-block[data-toggle=modal] { cursor: pointer; } .ekip-rounded-block[data-toggle=modal] i { font-size: 15px; color: #222a40; margin-right: 5px; } /** Resizeable **/ .is-resizeable:not(.block-mode-fullscreen).vertically { resize: vertical; overflow: hidden; } .is-resizeable:not(.block-mode-fullscreen).horizontally { resize: horizontal; overflow: hidden; } ::-webkit-scrollbar-track { border-radius: 10px; background-color: #ffffff; } ::-webkit-scrollbar { width: 6px; height: 6px; background-color: #ffffff; } ::-webkit-scrollbar-thumb { border-radius: 10px; background-color: #737373; } #sidebar { background: #F8F8F8; /** Favorites List **/ } #sidebar .content-header { padding-left: 2.5rem; } #sidebar .content-header .logo { max-height: 35px; } #sidebar .content-header .sub-text { margin: 0 0 0 20px; font-weight: 400; font-size: 11px; } #sidebar .content-header .sub-text.boxed { background-color: #ff9551; color: #fff; border-radius: 2px; padding: 2px 4px; } #sidebar .separator { width: 100%; height: 0.5px; background: #9D9D9D; opacity: 0.17; margin: 6px 0; } #sidebar .nav-main-heading { padding-left: 1.4rem; color: #222a40; font-weight: 600; font-size: 13px; text-transform: none; padding-top: 5px; letter-spacing: 0px; } #sidebar .nav-main-submenu { background-color: transparent; } #sidebar .nav-main-submenu .nav-main-item.active a { color: #ff9551; } #sidebar .nav-main-item.open > .nav-main-link-submenu::after { color: #2b3e71; } #sidebar .nav-messaging .nav-main-item.active a { color: #ff9551; } #sidebar a.head-title { padding-left: 1.4rem; color: #222a40; font-weight: 600; font-size: 13px; text-transform: none; padding-top: 5px; letter-spacing: 0px; background-color: transparent !important; } #sidebar .nav-main-link-name { display: flex; justify-content: space-between; align-items: center; } #sidebar .favorites-list { list-style-type: none; padding-left: 1.6em; font-size: 13px; } #sidebar .favorites-list .title { font-weight: 600; } #side-overlay { border-radius: 24px; overflow-x: hidden; z-index: 1050; } #side-overlay .simplebar-mask { border-radius: 24px; } #side-overlay #create-field-form tbody tr.placeholder .remove-dropdown-option { display: none; } #sidebar .content-header, #side-overlay .content-header { padding: 0 30px; } .content-side { padding: 15px 30px 0 30px; } @media (min-width: 992px) { #side-overlay, #page-container.side-scroll #side-overlay .content-header, #page-container.side-scroll #side-overlay .content-side { width: 450px !important; } #side-overlay { height: calc(100% - 40px); margin: 20px; } } /** * Options table */ #dropdown-options tbody tr:not(:last-child) td { border-bottom: 1px solid #e2e8f2; } #columns-list-container .columns-container { max-height: calc(100vh - 225px); } .todolist-content .block-content ul { margin: 0; padding: 0; list-style-type: none; } .todolist-content .block-content ul li { position: relative; display: flex; justify-content: space-between; align-items: center; background-color: var(--state-bg-color, #F8F8F8); color: var(--state-text-color, #000); border-radius: 8px; padding: 6px 12px; font-size: 12px; } .todolist-content .block-content ul li:not(:last-child) { margin-bottom: 10px; } .todolist-content .block-content ul li a { color: inherit; } .todolist-content .block-content ul li a:hover { text-decoration: none; } .todolist-content .block-content ul li .delete { font-size: 11px; cursor: pointer; } .todolist-content .block-content ul li textarea { min-width: 90%; min-height: 70px; margin-right: 10px; background: transparent; border: none; border-radius: 2px; } .ekip-table-container { position: relative; /** Table wrapper **/ /** Table header **/ /** Table footer **/ /** Table **/ /** Inputs & Selects **/ } .ekip-table-container:not(.initialized) { overflow: hidden; } .ekip-table-container .dt-layout-table { position: relative; } .ekip-table-container .blur-header .dt-scroll .dt-scroll-head table thead, .ekip-table-container .blur-header .dt-wrapper-table table thead { position: relative; } .ekip-table-container .blur-header .dt-scroll .dt-scroll-head table thead:before, .ekip-table-container .blur-header .dt-wrapper-table table thead:before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 998; backdrop-filter: blur(1px); -webkit-backdrop-filter: blur(1px); background: rgba(255, 255, 255, 0.2); border-radius: 10px; } .ekip-table-container .dt-save-btn { position: absolute; right: 25px; top: 5px; z-index: 999; cursor: pointer; transition: max-height 0.2s; max-height: 0; overflow: hidden; } .ekip-table-container .dt-save-btn.visible { max-height: 35px; } .ekip-table-container .dt-save-btn button { height: 35px; justify-content: center; } .ekip-table-container .ekip-table-wrapper { max-width: 100%; overflow-x: auto; } .ekip-table-container.hide-page-selector .dataTables_length { display: none; } .ekip-table-container.hide-page-selector .dataTables_paginate { margin: auto !important; } .ekip-table-container .dt-column-header { flex-direction: row !important; } .ekip-table-container .ekip-table-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; width: 100%; } @media screen and (max-width: 767px) { .ekip-table-container .ekip-table-header { flex-wrap: wrap; } } .ekip-table-container .ekip-table-header .dt-search { position: relative; margin: 0; font-family: "Font Awesome 6 Free"; font-weight: 900; } .ekip-table-container .ekip-table-header .dt-search input { padding-right: 40px; } @media screen and (max-width: 767px) { .ekip-table-container .ekip-table-header .dt-search input { margin: 0; } } .ekip-table-container .ekip-table-header .dt-search:after { content: "\f002"; position: absolute; top: 50%; right: 15px; transform: translateY(-50%); } .ekip-table-container .ekip-table-header .dt-buttons .btn, .ekip-table-container .ekip-table-header .dt-buttons .btn:hover, .ekip-table-container .ekip-table-header .dt-buttons .btn:focus, .ekip-table-container .ekip-table-header .dt-buttons .btn:active { background: #fff !important; border: none !important; color: #222a40; font-weight: 500; font-size: 14px; box-shadow: none; } .ekip-table-container .ekip-table-header .dt-buttons .btn i, .ekip-table-container .ekip-table-header .dt-buttons .btn:hover i, .ekip-table-container .ekip-table-header .dt-buttons .btn:focus i, .ekip-table-container .ekip-table-header .dt-buttons .btn:active i { margin-right: 6px; } @media screen and (max-width: 767px) { .ekip-table-container .ekip-table-header .dt-buttons { width: -moz-fit-content; width: fit-content; margin: auto auto auto 0; } } .ekip-table-container .ekip-table-header .block-options > span { display: flex; width: 40px; height: 40px; padding: 8px; justify-content: center; align-items: center; gap: 8px; cursor: pointer; border-radius: 50%; border: 1px solid #D8D9DD; background: #FFF; /* shadow/xs */ box-shadow: 0px 2px 2px 0px rgba(41, 43, 50, 0.05); } .ekip-table-container .ekip-table-header .block-options > span i { font-size: 12px; } .ekip-table-container .ekip-table-footer { margin-top: 10px; padding-top: 10px; border-top: 1px solid #E7EAF3; font-size: 12px; width: 100%; } .ekip-table-container .ekip-table-footer .dt-paging { margin-right: 15px; } .ekip-table-container .ekip-table-footer .dt-paging .pagination { gap: 12px; } .ekip-table-container .ekip-table-footer .dt-paging li.page-item a { display: flex; align-items: center; height: 100%; padding: 0; font-weight: 500; } .ekip-table-container .ekip-table-footer .dt-paging li.active .page-link { display: flex; justify-content: center; height: 25px; width: 25px; border-radius: 50%; font-weight: 400; background-color: rgba(255, 149, 81, 0.1019607843); color: #ff9551; line-height: 10px; } .ekip-table-container .ekip-table-footer .dt-paging li.active .page-link:hover { background-color: #ff9551; border-color: #ff9551; color: #fff; } .ekip-table-container .ekip-table-footer .dt-paging li .page-link, .ekip-table-container .ekip-table-footer .dt-paging li .page-link:hover { background: transparent; border-color: transparent; font-weight: 400; color: #797D8A; } .ekip-table-container .ekip-table-footer .dt-length select { cursor: pointer; position: relative; background: transparent; z-index: 10; } .ekip-table-container .ekip-table-footer .dt-length:after { content: "▼"; position: absolute; right: 29px; top: 34px; color: #4f4f4f; font-size: 10px; z-index: 9; } .ekip-table-container .dt-scroll, .ekip-table-container .dt-wrapper-table { border: 1px solid #E7EAF3; border-radius: 12px; overflow: hidden; } .ekip-table-container .dt-empty { padding: 15px !important; } .ekip-table-container table.dataTable { width: 100%; margin: 0 !important; } .ekip-table-container table.dataTable .ck-col { max-width: 80px !important; min-width: 80px !important; width: 80px !important; } .ekip-table-container table.dataTable .dtfc-fixed-start { z-index: 99; } .ekip-table-container table.dataTable.small-radius { border-radius: 5px; } .ekip-table-container table.dataTable.hide-thead thead { display: none; } .ekip-table-container table.dataTable thead { font-size: 13px; } .ekip-table-container table.dataTable thead th { padding: 12px 24px 12px 16px; font-weight: 500; color: #667085; background-color: #F8F8F8; border-bottom: 1px solid #EAECF0; } .ekip-table-container table.dataTable thead th.no_sort:before, .ekip-table-container table.dataTable thead th.no_sort:after { display: none; } .ekip-table-container table.dataTable thead th.sorting:after, .ekip-table-container table.dataTable thead th.sorting:before, .ekip-table-container table.dataTable thead th.sorting_asc:after, .ekip-table-container table.dataTable thead th.sorting_asc:before, .ekip-table-container table.dataTable thead th.sorting_desc:after, .ekip-table-container table.dataTable thead th.sorting_desc:before { bottom: 50%; transform: translateY(50%); } .ekip-table-container table.dataTable tbody { font-size: 12px; position: relative; } .ekip-table-container table.dataTable tbody.is-loading:before { content: ""; display: block; height: 3px; width: 100%; position: absolute; top: 0; left: 0; background: linear-gradient(to right, rgb(255, 240, 231), #ff9551); background-size: 200% 100%; animation: loading 3s linear infinite; z-index: 999; } .ekip-table-container table.dataTable tbody .cell-content[data-type=textarea] { display: flex; align-items: center; height: 100%; } .ekip-table-container table.dataTable tbody .cell-content[data-type=textarea] p { margin: 0; } .ekip-table-container table.dataTable tbody .cell-content[data-type=textarea] .form-group { height: calc(100% - 10px); } .ekip-table-container table.dataTable tbody .cell-content[data-type=textarea] .form-group .ekip-input-group { height: 100%; padding: 10px; } .ekip-table-container table.dataTable tbody .cell-content[data-type=textarea] .form-group .ekip-input-group textarea { font-size: 11px; } .ekip-table-container table.dataTable tbody tr.visit-url { cursor: pointer; } .ekip-table-container table.dataTable tbody tr:not(:last-child) td { border-bottom: 1px solid #EAECF0; } .ekip-table-container table.dataTable tbody tr.editable:hover td { background: #F8F8F8; } .ekip-table-container table.dataTable tbody tr.editable .ekip-input-group { padding: 0 10px; height: 25px; } .ekip-table-container table.dataTable tbody tr.editable .select2-selection__rendered .initial { min-height: 15px; max-height: 15px; min-width: 15px; max-width: 15px; } .ekip-table-container table.dataTable tbody tr.loading-row { position: relative; } .ekip-table-container table.dataTable tbody tr.loading-row:after { content: ""; position: absolute; border-radius: 10px; right: 100%; bottom: 0; left: 0; background: #ff9551; width: 0; height: 1.5px; animation: loading-bar 2s linear infinite; } .ekip-table-container table.dataTable tbody td { background: #fff; padding: 0 12px; height: 50px; color: #2b3e71; } .ekip-table-container table.dataTable tbody .limit-line { overflow: hidden; display: -webkit-inline-box; -webkit-line-clamp: 1; /* number of lines to show */ line-clamp: 1; -webkit-box-orient: vertical; } .ekip-table-container table.dataTable tfoot .total-row td, .ekip-table-container table.dataTable tfoot .new-row td { border-top: 1px solid #EAECF0; padding: 10px 12px; color: #222a40; font-weight: 400; font-size: 12px; } .ekip-table-container table.dataTable tfoot .total-row td.title, .ekip-table-container table.dataTable tfoot .new-row td.title { color: #222a40; font-weight: 600; } .ekip-table-container table.dataTable tfoot .total-row td.td-btn:hover, .ekip-table-container table.dataTable tfoot .new-row td.td-btn:hover { color: #ff9551; } .ekip-table-container table.dataTable tfoot .inputs-row td { padding: 10px; border-top: 3px solid #EAECF0; } .ekip-table-container table.dataTable tfoot .inputs-row td .attachments-counter { display: flex; align-items: center; justify-content: center; margin-top: 2px; font-size: 11px; } .ekip-table-container table.dataTable tfoot .inputs-row .edit-buttons { display: flex; gap: 8px; } .ekip-table-container table.dataTable tfoot .inputs-row .edit-buttons .save { color: #222a40; } .ekip-table-container table.dataTable tfoot .inputs-row .edit-buttons .cancel { color: #e04f1a; } .ekip-table-container table.dataTable tfoot .inputs-row .edit-buttons span { cursor: pointer; } .ekip-table-container table.dataTable tfoot .inputs-row .edit-buttons.hidden { display: none; } .ekip-table-container table.dataTable .dataTables_empty { vertical-align: middle; } .ekip-table-container .table-input-container .form-control, .ekip-table-container .dataTables_filter .form-control { border: 1px solid #D8D9DD; background: #fff; height: 40px; box-shadow: 0px 2px 2px 0px rgba(41, 43, 50, 0.05); border-radius: 12px; color: #797D8A; font-size: 14px; font-weight: 400; padding: 10px 12px; } .ekip-table-container.overflow { overflow: visible; } .ekip-table-container.overflow .ekip-table-wrapper { overflow: visible; } .ekip-table-container.overflow table.dataTable { overflow: visible; } /** Table column size **/ table .tw-7 { width: 7%; } table .tw-8 { width: 8%; } table .tw-9 { width: 9%; } table .tw-10 { width: 10%; } table .tw-15 { width: 15%; } table .tw-20 { width: 20%; } table .tw-25 { width: 25%; } table .tw-30 { width: 30%; } table .tw-35 { width: 35%; } table .tw-40 { width: 40%; } table .tw-25px { width: 25px; } table .tw-min-25px { min-width: 25px; width: 25px; } table .tw-max-25px { max-width: 25px; } table .tw-30px { width: 30px; } table .tw-min-30px { min-width: 30px; width: 30px; } table .tw-max-30px { max-width: 30px; } table .tw-35px { width: 35px; } table .tw-min-35px { min-width: 35px; width: 35px; } table .tw-max-35px { max-width: 35px; } table .tw-40px { width: 40px; } table .tw-min-40px { min-width: 40px; width: 40px; } table .tw-max-40px { max-width: 40px; } table .tw-45px { width: 45px; } table .tw-min-45px { min-width: 45px; width: 45px; } table .tw-max-45px { max-width: 45px; } table .tw-50px { width: 50px; } table .tw-min-50px { min-width: 50px; width: 50px; } table .tw-max-50px { max-width: 50px; } table .tw-55px { width: 55px; } table .tw-min-55px { min-width: 55px; width: 55px; } table .tw-max-55px { max-width: 55px; } table .tw-60px { width: 60px; } table .tw-min-60px { min-width: 60px; width: 60px; } table .tw-max-60px { max-width: 60px; } table .tw-65px { width: 65px; } table .tw-min-65px { min-width: 65px; width: 65px; } table .tw-max-65px { max-width: 65px; } table .tw-70px { width: 70px; } table .tw-min-70px { min-width: 70px; width: 70px; } table .tw-max-70px { max-width: 70px; } table .tw-75px { width: 75px; } table .tw-min-75px { min-width: 75px; width: 75px; } table .tw-max-75px { max-width: 75px; } table .tw-80px { width: 80px; } table .tw-min-80px { min-width: 80px; width: 80px; } table .tw-max-80px { max-width: 80px; } table .tw-85px { width: 85px; } table .tw-min-85px { min-width: 85px; width: 85px; } table .tw-max-85px { max-width: 85px; } table .tw-90px { width: 90px; } table .tw-min-90px { min-width: 90px; width: 90px; } table .tw-max-90px { max-width: 90px; } table .tw-95px { width: 95px; } table .tw-min-95px { min-width: 95px; width: 95px; } table .tw-max-95px { max-width: 95px; } table .tw-100px { width: 100px; } table .tw-min-100px { min-width: 100px; width: 100px; } table .tw-max-100px { max-width: 100px; } table .tw-105px { width: 105px; } table .tw-min-105px { min-width: 105px; width: 105px; } table .tw-max-105px { max-width: 105px; } table .tw-110px { width: 110px; } table .tw-min-110px { min-width: 110px; width: 110px; } table .tw-max-110px { max-width: 110px; } table .tw-115px { width: 115px; } table .tw-min-115px { min-width: 115px; width: 115px; } table .tw-max-115px { max-width: 115px; } table .tw-120px { width: 120px; } table .tw-min-120px { min-width: 120px; width: 120px; } table .tw-max-120px { max-width: 120px; } table .tw-125px { width: 125px; } table .tw-min-125px { min-width: 125px; width: 125px; } table .tw-max-125px { max-width: 125px; } table .tw-130px { width: 130px; } table .tw-min-130px { min-width: 130px; width: 130px; } table .tw-max-130px { max-width: 130px; } table .tw-135px { width: 135px; } table .tw-min-135px { min-width: 135px; width: 135px; } table .tw-max-135px { max-width: 135px; } table .tw-140px { width: 140px; } table .tw-min-140px { min-width: 140px; width: 140px; } table .tw-max-140px { max-width: 140px; } table .tw-145px { width: 145px; } table .tw-min-145px { min-width: 145px; width: 145px; } table .tw-max-145px { max-width: 145px; } table .tw-150px { width: 150px; } table .tw-min-150px { min-width: 150px; width: 150px; } table .tw-max-150px { max-width: 150px; } table .tw-155px { width: 155px; } table .tw-min-155px { min-width: 155px; width: 155px; } table .tw-max-155px { max-width: 155px; } table .tw-160px { width: 160px; } table .tw-min-160px { min-width: 160px; width: 160px; } table .tw-max-160px { max-width: 160px; } table .tw-165px { width: 165px; } table .tw-min-165px { min-width: 165px; width: 165px; } table .tw-max-165px { max-width: 165px; } table .tw-170px { width: 170px; } table .tw-min-170px { min-width: 170px; width: 170px; } table .tw-max-170px { max-width: 170px; } table .tw-175px { width: 175px; } table .tw-min-175px { min-width: 175px; width: 175px; } table .tw-max-175px { max-width: 175px; } table .tw-180px { width: 180px; } table .tw-min-180px { min-width: 180px; width: 180px; } table .tw-max-180px { max-width: 180px; } table .tw-185px { width: 185px; } table .tw-min-185px { min-width: 185px; width: 185px; } table .tw-max-185px { max-width: 185px; } table .tw-190px { width: 190px; } table .tw-min-190px { min-width: 190px; width: 190px; } table .tw-max-190px { max-width: 190px; } table .tw-195px { width: 195px; } table .tw-min-195px { min-width: 195px; width: 195px; } table .tw-max-195px { max-width: 195px; } table .tw-200px { width: 200px; } table .tw-min-200px { min-width: 200px; width: 200px; } table .tw-max-200px { max-width: 200px; } table .tw-205px { width: 205px; } table .tw-min-205px { min-width: 205px; width: 205px; } table .tw-max-205px { max-width: 205px; } table .tw-210px { width: 210px; } table .tw-min-210px { min-width: 210px; width: 210px; } table .tw-max-210px { max-width: 210px; } table .tw-215px { width: 215px; } table .tw-min-215px { min-width: 215px; width: 215px; } table .tw-max-215px { max-width: 215px; } table .tw-220px { width: 220px; } table .tw-min-220px { min-width: 220px; width: 220px; } table .tw-max-220px { max-width: 220px; } table .tw-225px { width: 225px; } table .tw-min-225px { min-width: 225px; width: 225px; } table .tw-max-225px { max-width: 225px; } table .tw-230px { width: 230px; } table .tw-min-230px { min-width: 230px; width: 230px; } table .tw-max-230px { max-width: 230px; } table .tw-235px { width: 235px; } table .tw-min-235px { min-width: 235px; width: 235px; } table .tw-max-235px { max-width: 235px; } table .tw-240px { width: 240px; } table .tw-min-240px { min-width: 240px; width: 240px; } table .tw-max-240px { max-width: 240px; } table .tw-245px { width: 245px; } table .tw-min-245px { min-width: 245px; width: 245px; } table .tw-max-245px { max-width: 245px; } table .tw-250px { width: 250px; } table .tw-min-250px { min-width: 250px; width: 250px; } table .tw-max-250px { max-width: 250px; } table .tw-255px { width: 255px; } table .tw-min-255px { min-width: 255px; width: 255px; } table .tw-max-255px { max-width: 255px; } table .tw-260px { width: 260px; } table .tw-min-260px { min-width: 260px; width: 260px; } table .tw-max-260px { max-width: 260px; } table .tw-265px { width: 265px; } table .tw-min-265px { min-width: 265px; width: 265px; } table .tw-max-265px { max-width: 265px; } table .tw-270px { width: 270px; } table .tw-min-270px { min-width: 270px; width: 270px; } table .tw-max-270px { max-width: 270px; } table .tw-275px { width: 275px; } table .tw-min-275px { min-width: 275px; width: 275px; } table .tw-max-275px { max-width: 275px; } /** Simple table **/ .ekip-simple-table thead { font-size: 13px; color: #737373; } .ekip-simple-table thead th { padding: 15px 5px; } .ekip-simple-table tbody td { padding: 3px; } .ekip-simple-table tbody td .prefix, .ekip-simple-table tbody td .suffix { font-size: 13px; font-weight: 600; } .ekip-simple-table tbody td .has-left-border { display: flex; align-items: center; } .ekip-simple-table tbody td .has-left-border:before { content: ""; display: block; height: 15px; min-width: 3px; max-width: 3px; border-radius: 5px; margin-right: 10px; background-color: var(--border-color); } .ekip-simple-table tbody td .has-left-border.default-blue:before { background-color: #222a40; } .ekip-simple-table tbody td .has-left-border.default-gray:before { background-color: #737373; } .ekip-simple-table tbody td .has-left-border.default-green:before { background-color: #00a44e; } .ekip-simple-table tbody td .has-left-border.default-red:before { background-color: #e04f1a; } .ekip-simple-table tbody td .badge { padding: 12px 13px; font-size: 12px; } .ekip-simple-table tfoot tr td.total-col { position: relative; padding: 25px 0 0 0; } .ekip-simple-table tfoot tr td.total-col:before { display: block; content: ""; position: absolute; top: 15px; left: 0; width: calc(100% + 3px); height: 0.5px; background-color: #222a40; } .ekip-simple-table tfoot tr td { font-size: 14px; } .ekip-simple-table.bg-lines { border-collapse: separate; border-spacing: 3px; } .ekip-simple-table.bg-lines thead th { padding: 5px 0; } .ekip-simple-table.bg-lines tbody tr td { background: #fff; padding: 8px 12px; font-size: 14px; } .ekip-simple-table.bg-lines tbody tr td:first-child { border-top-left-radius: 5px; border-bottom-left-radius: 5px; } .ekip-simple-table.bg-lines tbody tr td:last-child { border-top-right-radius: 5px; border-bottom-right-radius: 5px; } .ekip-simple-table.bg-lines tbody tr td.bg-orange { background: rgb(255, 240, 231); } /** Table loading **/ .table-loading { display: flex; align-items: center; justify-content: center; } .table-loading figure { width: 80px; margin: 0; } /** Filters buttons **/ .buttons-slot .btn .icon .count { display: none; font-size: 12px; } .buttons-slot .btn .icon.has-filters { display: flex; padding: 0 8px; justify-content: center; align-items: center; gap: 4px; border-radius: 24px; background: #FF8A48; color: #fff; } .buttons-slot .btn .icon.has-filters .count { display: block; } .dropdown-toggle:after { display: none !important; } .dropdown .badge { display: flex; width: 40px; height: 40px; padding: 8px; justify-content: center; align-items: center; gap: 8px; font-size: 12px; cursor: pointer; border-radius: 50%; border: 1px solid #D8D9DD; background: #FFF; box-shadow: 0px 2px 2px 0px rgba(41, 43, 50, 0.05); } .dropdown .badge.h-20 { height: 20px !important; width: 20px !important; } .dropdown .badge.h-20 i { font-size: 9px; } .dropdown .badge.h-25 { height: 25px !important; width: 25px !important; } .dropdown .badge.h-30 { height: 30px !important; width: 30px !important; } .dropdown .badge.h-35 { height: 35px !important; width: 35px !important; } .dropdown-menu { /*min-width: fit-content;*/ min-width: -moz-fit-content !important; min-width: fit-content !important; font-size: 13px; z-index: 9999; } .dropdown-menu.position-top { top: 0; bottom: unset; right: 40px; } .dropdown-menu .dropdown-item:hover, .dropdown-menu .dropdown-item:focus, .dropdown-menu .dropdown-item:active, .dropdown-menu .dropdown-item.active { background-color: #f6f6f6; color: #222a40; font-size: 13px; } .dropdown-menu .dropdown-item.disabled { background-color: #c5c5c5; color: #fff !important; } .max-3-lines, .max-2-lines, .max-1-line { display: -webkit-box !important; -webkit-box-orient: vertical; overflow: hidden; } .max-3-lines { -webkit-line-clamp: 3; line-clamp: 3; } .max-2-lines { -webkit-line-clamp: 2; line-clamp: 2; } .max-1-line { -webkit-line-clamp: 1; line-clamp: 1; } .break-text { display: inline-block !important; max-width: 100% !important; word-break: break-all !important; overflow-wrap: anywhere !important; white-space: normal !important; } .text-warning { color: #ff9551 !important; } /** Text content as list **/ ul.text-content { list-style-type: none; margin: 0; padding: 0; font-size: 15px; } ul.text-content li { display: grid; align-items: center; grid-template-columns: 1fr 1fr; padding: 5px 0; } ul.text-content.has-icon li { grid-template-columns: 40px 1fr; } /** Text colors **/ .font-color-orange { color: #ff9551; } .font-color-blue { color: #222a40; } .font-color-lightblue { color: #2b3e71; } .font-color-gray { color: #737373; } .font-color-gray-light { color: #989BA5 !important; } .font-color-gray-lighter { color: #d4d4d4; } /** Line Height **/ /** Font size **/ .font-size-xl { font-size: 17px !important; } .font-size-md { font-size: 14px !important; } .font-size-xs { font-size: 12px; } /** Font Weight **/ .fw-100 { font-weight: 100; } .fw-200 { font-weight: 200; } .fw-300 { font-weight: 300; } .fw-400 { font-weight: 400; } .fw-500 { font-weight: 500; } .fw-600 { font-weight: 600; } .fw-700 { font-weight: 700; } .fw-800 { font-weight: 800; } .fw-900 { font-weight: 900; } .ekip-nav { display: flex; align-items: center; justify-content: space-between; } .ekip-nav .nav-main-item { margin-right: 10px; margin-bottom: 5px; } .ekip-nav .nav-main-item .nav-main-link { background: #F8F8F8; border-radius: 8px; opacity: 1; width: 140px; justify-content: space-between; } .ekip-nav .nav-main-item .nav-main-link.width-auto { width: auto; } .ekip-nav .nav-main-item .nav-main-link.width-auto .nav-main-link-name { max-width: none; } .ekip-nav .nav-main-item .nav-main-link .nav-main-link-name { max-width: 105px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .ekip-nav .nav-main-item .nav-main-link input { display: none; background: transparent; border: 1px solid #fff; color: #fff; font-size: 12px; width: calc(100% - 30px); max-height: 19px; border-radius: 5px; } .ekip-nav .nav-main-item .nav-main-link.edit-mode input { display: block; } .ekip-nav .nav-main-item .nav-main-link.edit-mode .nav-main-link-name { display: none; } .ekip-nav .nav-main-item .nav-main-link:hover, .ekip-nav .nav-main-item .nav-main-link.edit-mode { background: #222a40; color: #fff; } .ekip-nav .nav-main-item .nav-main-link:hover .edit-item, .ekip-nav .nav-main-item .nav-main-link.edit-mode .edit-item { display: block; height: 20px; width: 20px; background-repeat: no-repeat !important; background-size: 12px !important; background-position: center !important; background-image: url("../media/icons/white/edit_w.png"); border: 1px solid transparent; border-radius: 3px; } .ekip-nav .nav-main-item .nav-main-link:hover .edit-item:hover, .ekip-nav .nav-main-item .nav-main-link.edit-mode .edit-item:hover { border-color: #fff; } .ekip-nav .nav-main-item .dropdown .btn { background: #F8F8F8; border-radius: 8px; opacity: 1; width: 140px; justify-content: space-between; position: relative; display: flex; align-items: center; padding: 0.5rem 0.625rem; margin: 2px 0; color: #222a40; } .ekip-nav .nav-main-item .dropdown .dropdown-menu { max-height: 300px; overflow-x: auto; } .ekip-nav .nav-main-item .dropdown .dropdown-menu form:not(:last-child) a { margin-bottom: 8px; } .ekip-nav .nav-main-item .dropdown .dropdown-menu .nav-main-link-name { max-width: 300px; } .ekip-nav .nav-main-item .dropdown a.nav-main-link { width: 100%; max-width: 300px; } .ekip-nav .nav-main-item .dropdown a.nav-main-link:not(:last-child) { margin-bottom: 8px; } .ekip-nav .nav-main-item .nav-main-submenu { background: transparent; box-shadow: none; } .ekip-nav .nav-main-item .nav-main-submenu li { width: 140px; overflow: hidden; } .ekip-nav .nav-main-item .nav-main-submenu .nav-main-link { border-radius: 0; } .ekip-nav .nav-main-item:hover > .nav-main-link-submenu { border-radius: 8px; } .ekip-nav .nav-main-item.create-btn .nav-main-link { width: 35px; height: 35px; border-radius: 50%; border: none; } .ekip-nav .nav-main-item.create-btn .nav-main-link:disabled { width: auto; border-radius: 8px; } .ekip-nav .nav-main-item.create-btn .nav-main-link .fa { margin-left: 2px; } .ekip-nav .nav-main-item .nav-main-link.active { background: #222a40; color: #fff; } .ekip-nav .action-container { display: flex; justify-content: space-between; } .ekip-nav-simple .nav-tabs { margin-bottom: 16px; padding: 0; gap: 25px; } .ekip-nav-simple .nav-tabs .nav-item { cursor: pointer; } .ekip-nav-simple .nav-tabs .nav-item .nav-link { border: none; color: #222a40; font-weight: 400; font-size: 13px; padding: 0 0 16px 0; } .ekip-nav-simple .nav-tabs .nav-item .nav-link.active { position: relative; color: #ff9551; } .ekip-nav-simple .nav-tabs .nav-item .nav-link.active:after { display: block; content: ""; width: 100%; height: 2px; background: #ff9551; position: absolute; bottom: 0; } #page-loading { position: fixed; background-color: #fff; width: 100vw; height: 100vh; z-index: 999999999999; display: flex; align-items: center; justify-content: center; } #page-loading .loader:before { display: flex; align-items: center; justify-content: center; width: 100px; height: 100px; content: "\f110"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 50px; z-index: 9999; transform-origin: center; animation: rotate 1.5s linear infinite; } @media (max-width: 768px) { #page-loading .loader:before { left: 40%; } } .loading { display: flex; align-items: center; justify-content: center; position: relative; min-height: 85px; } .loading:after { position: absolute; display: flex; align-items: center; justify-content: center; width: auto; height: auto; content: "\f110"; font-family: "Font Awesome 6 Free"; font-weight: 900; z-index: 10; font-size: 50px; animation: rotate 1.5s linear infinite; } .progress { height: 6px !important; } .progress .progress-dark { background-color: #ffffff !important; } .progress .progress-bar-darkblue { background-color: #222a40; border-radius: 0.3rem; } .progress .progress-bar.blue { background-color: #2b3e71; } .progress.is-over { background-color: #ff9551; } .progress-container { position: relative; } .progress-container .percent-title { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-weight: 600; position: absolute; color: #ff9551; font-size: 13px; } .progress-container .percent-title.as-title { position: unset; justify-content: flex-start; } .progress-container .progress { height: 25px; } .progress-values { display: flex; justify-content: space-between; font-size: 13px; font-weight: 600; } .grid { display: grid; gap: 20px; } .grid.grid-cols-2 { grid-template-columns: 1fr 1fr; } .grid.grid-cols-3 { grid-template-columns: 1fr 1fr 1fr; } @media screen and (max-width: 767px) { .grid { grid-template-columns: 1fr !important; } } .tg-backdrop { z-index: 99998 !important; } .tg-dialog { z-index: 99999 !important; } .skeleton { width: 100%; margin-bottom: 1.75rem; } .skeleton .wrapper { padding: 25px; background-color: #F8F8F8; border-radius: 18px; } .skeleton.no-padding { /*padding: 0;*/ } .skeleton .skeleton-line, .skeleton .skeleton-content { background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%); background-size: 200% 100%; animation: loading 1.5s infinite; } .skeleton .skeleton-line { width: 50%; height: 35px; border-radius: 8px; margin-bottom: 20px; } .skeleton .skeleton-content { width: 100%; height: 120px; border-radius: 18px; } @keyframes loading { from { background-position: 200% 0; } to { background-position: -200% 0; } } /* * Head style * * Author: Thibaud Magniez */ #page-header { box-shadow: none !important; border-bottom: 1px solid #F8F8F8; } #page-header .header-menu { display: flex; flex-basis: 80%; max-width: 80%; /*overflow: hidden;*/ align-items: center; } #page-header .header-menu .btn { font-size: 17px; margin-right: 20px; } #page-header .header-menu .btn.has-icon { padding: 20px; height: 38px; width: 25px; background-repeat: no-repeat !important; background-size: 20px !important; background-position: center !important; align-items: center; justify-content: center; /* With Fonts */ position: relative; } #page-header .header-menu .btn.has-icon:before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 1.4rem; } #page-header .header-menu .btn.has-icon:hover, #page-header .header-menu .btn.has-icon.active { background: #ff9551; /* With Fonts */ } #page-header .header-menu .btn.has-icon:hover:before, #page-header .header-menu .btn.has-icon:hover i, #page-header .header-menu .btn.has-icon.active:before, #page-header .header-menu .btn.has-icon.active i { color: #fff; } #page-header .header-menu .btn.todo-active:before { content: ""; display: block; width: 20px; height: 20px; background-image: url("../media/icons/dark-blue/star_full_db.png"); background-size: cover; } #page-header .header-menu .btn:focus, #page-header .header-menu .btn:active { outline: none; box-shadow: none; } #page-header .search-btn, #page-header .toggle-sidebar-btn { font-size: 17px; margin-top: 6px; } #page-header #page-header-user-dropdown { display: flex; align-items: center; } #page-header .dropdown-menu .dropdown-item { font-size: 13px; margin: 0; } #page-header .dropdown-menu .dropdown-title { padding: 0.375rem 0.75rem; } @media (max-width: 768px) { #page-header .header-menu .btn { margin-right: 8px; } #page-header .header-menu .btn.has-icon { padding: 12px; height: 25px; width: 20px; background-size: 15px !important; margin: 0; } } /***** Search *****/ #page-header-search { z-index: 10; position: initial; /* right: 0 !important; left: unset !important; min-width: 600px; max-width: 600px; */ } @media screen and (max-width: 965px) { #page-header-search { position: absolute; } } #page-header-search .input-group { min-width: 280px; } #page-header-search .input-group input { border: 1px solid #f0f0f0 !important; font-size: 13px; } #page-header-search .input-group .reset-main-search { display: flex; align-items: center; justify-content: center; min-width: 50px; } #page-header-search .input-group .reset-main-search img { display: none; width: 23px; } #page-header-search .input-group .reset-main-search.is-loading { cursor: initial; } #page-header-search .input-group .reset-main-search.is-loading img { display: block; } #page-header-search .input-group .reset-main-search.is-loading i { display: none; } #page-header-search .input-group .reset-main-search.is-loading:hover { background-color: #ff9551 !important; } #page-search-results { top: 67px; } #page-search-results .search-results { position: absolute; padding: 0 25px 20px 25px !important; display: none; width: 100%; max-height: 450px; overflow-y: scroll; background-color: #F8F8F8; } #page-search-results.show .search-results { display: block; padding: 0 1.75rem; box-shadow: 0px 2px 1px 0px #e8e8e8; } #page-search-results.show .search-results .results { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; grid-gap: 15px; } @media screen and (max-width: 768px) { #page-search-results.show .search-results .results { grid-template-columns: 1fr 1fr; } } #page-search-results.show .search-results .results h2 { grid-column: 1/7; max-width: 125px; color: #2b3e71; border-bottom: 1px solid #ff9551; padding: 10px 0; margin: 15px 0; } @media screen and (max-width: 768px) { #page-search-results.show .search-results .results h2 { grid-column: 1/3; } } #page-search-results.show .search-results .results .result { padding: 10px 20px; background-color: #fff; border-radius: 0 2px 2px 0; border-left: 3.5px solid var(--border-color); color: #222a40; cursor: pointer; } #page-search-results.show .search-results .results .result .title { display: block; font-size: 13px; font-weight: 600; margin-bottom: 4px; } #page-search-results.show .search-results .results .result .info { font-size: 12px; } #page-search-results.show .search-results .results .result:hover { background-color: #ff9551; } #page-search-results.show .search-results .results .result.archived { background-color: #F8F8F8; border: 1px solid #fff; color: #737373; } #page-search-results.show .search-results .results .result.archived i { font-size: 10px; } #page-search-results.show .search-results .results .no-result { font-size: 13px; font-style: italic; } .dropdown-notifications { position: relative; } .dropdown-notifications button { position: relative; } .dropdown-notifications button i { font-size: 18px; margin-top: 5px; } .dropdown-notifications button.has-badge i { animation: shake 2s ease-in-out infinite; } .dropdown-notifications button.has-badge .badge { display: flex; } .dropdown-notifications button .badge { display: none; align-items: center; justify-content: center; position: absolute; top: 0; right: 0; height: 18px; width: 18px; border-radius: 50%; background-color: #ff9551; color: #fff; font-weight: 400; } .dropdown-notifications .scrollable-list { max-height: 225px; overflow-y: auto; } .dropdown-notifications .scrollable-list::-webkit-scrollbar { width: 3px; height: 3px; } .dropdown-notifications .notifications-content { display: block; position: absolute; right: 0; min-width: 280px; background: #fff; border: 1px solid #ebebeb; box-shadow: 0 0.25rem 2rem rgba(0, 0, 0, 0.08); } .dropdown-notifications .notifications-content.hidden { display: none; } .dropdown-notifications .notifications-content h3 { font-size: 17px; text-align: center; padding: 5px 0 8px 0; border-bottom: 2px solid #ff9551; font-weight: 500; margin: 0 0 10px 0; } .dropdown-notifications .notifications-content span.empty-list { display: block; font-size: 13px; text-align: center; } .dropdown-notifications .notifications-content span.empty-list.hidden { display: none; } .dropdown-notifications .notifications-content ul { padding: 0 10px; margin: 0; } .dropdown-notifications .notifications-content ul li { display: flex; padding-bottom: 10px; } .dropdown-notifications .notifications-content ul li .notification-icon:before { color: #222a40; } .dropdown-notifications .notifications-content ul li .item-info { display: flex; align-items: center; justify-content: flex-start; min-width: 30px; max-width: 30px; } .dropdown-notifications .notifications-content ul li .item-content { width: 100%; } .dropdown-notifications .notifications-content ul li .item-content a { font-size: 13px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } .dropdown-notifications .notifications-content ul li .item-content a:hover { color: #222a40; } .dropdown-notifications .notifications-content ul li .item-content .text-muted { font-size: 12px; } .dropdown-notifications .notifications-content ul li .item-action { display: flex; align-items: center; justify-content: flex-end; cursor: pointer; min-width: 20px; max-width: 20px; text-align: right; } .dropdown-notifications .notifications-content ul li .item-action:hover { color: #ff9551; } .dropdown-notifications .notifications-content ul li:not(:last-child) { border-bottom: 1px solid #dcdcdc; } .dropdown-notifications .notifications-content ul li:not(:first-child) { padding-top: 10px; } .dropdown-notifications .notifications-content .actions-container { display: flex; align-items: center; justify-content: space-between; text-align: center; font-size: 13px; font-weight: 600; margin-top: 10px; } .dropdown-notifications .notifications-content .actions-container a { color: #222a40; } .dropdown-notifications .notifications-content .actions-container a:hover { text-decoration: underline; } .dropdown-notifications .notifications-content .actions-container a i { color: #ff9551; } @keyframes shake { 0% { transform: rotateZ(0); } 1% { transform: rotateZ(30deg); } 3% { transform: rotateZ(-28deg); } 5% { transform: rotateZ(34deg); } 7% { transform: rotateZ(-32deg); } 9% { transform: rotateZ(30deg); } 11% { transform: rotateZ(-28deg); } 13% { transform: rotateZ(26deg); } 15% { transform: rotateZ(-24deg); } 17% { transform: rotateZ(22deg); } 19% { transform: rotateZ(-20deg); } 21% { transform: rotateZ(18deg); } 23% { transform: rotateZ(-16deg); } 25% { transform: rotateZ(14deg); } 27% { transform: rotateZ(-12deg); } 29% { transform: rotateZ(10deg); } 31% { transform: rotateZ(-8deg); } 33% { transform: rotateZ(6deg); } 35% { transform: rotateZ(-4deg); } 37% { transform: rotateZ(2deg); } 39% { transform: rotateZ(-1deg); } 41% { transform: rotateZ(1deg); } 43% { transform: rotateZ(0); } 100% { transform: rotateZ(0); } } /** Ekip DatePicker **/ .ekip-datepicker { position: absolute; box-shadow: 0px 0px 6px 2px rgba(0, 0, 0, 0.15); padding: 0; z-index: 9999; } .ekip-datepicker .datepicker-container { padding: 10px 15px; } .ekip-datepicker .datepicker-container .flatpickr-months { margin: 0 0 5px 0 !important; } .ekip-datepicker .datepicker-container .flatpickr-months .flatpickr-prev-month, .ekip-datepicker .datepicker-container .flatpickr-months .flatpickr-next-month { top: 0 !important; padding: 3px; height: auto; } .ekip-datepicker .datepicker-container .flatpickr-months .flatpickr-prev-month { padding-left: 0; } .ekip-datepicker .datepicker-container .flatpickr-months .flatpickr-current-month { font-size: 12px; } .ekip-datepicker .datepicker-container .flatpickr-months .flatpickr-current-month select { text-transform: capitalize; margin-right: 10px; } .ekip-datepicker .datepicker-container .flatpickr-months .flatpickr-next-month { padding-right: 0; } .ekip-datepicker .datepicker-container .flatpickr-time .numInputWrapper { min-width: 60px; } .ekip-datepicker .datepicker-container .flatpickr-time .numInputWrapper input { font-weight: normal; } .ekip-datepicker .datepicker-container .flatpickr-time .numInputWrapper input::-moz-selection { background: transparent; color: inherit; /* Keep the text color unchanged */ } .ekip-datepicker .datepicker-container .flatpickr-time .numInputWrapper input::selection { background: transparent; color: inherit; /* Keep the text color unchanged */ } .ekip-datepicker .datepicker-container .flatpickr-calendar.inline { max-height: none !important; box-shadow: none; } .ekip-datepicker .datepicker-container .flatpickr-calendar.inline .flatpickr-weekday { font-weight: 400; color: #ff9551; } .ekip-datepicker .datepicker-container .flatpickr-calendar.inline .flatpickr-calendar { width: 231px; } .ekip-datepicker .datepicker-container .flatpickr-calendar.inline .dayContainer { width: 231px; min-width: 231px; max-width: 231px; } .ekip-datepicker .datepicker-container .flatpickr-calendar.inline .flatpickr-days { width: 231px; } .ekip-datepicker .datepicker-container .flatpickr-calendar.inline .flatpickr-day { max-width: 33px; height: 33px; line-height: 33px; } .ekip-datepicker .datepicker-container .flatpickr-calendar.inline .flatpickr-day.selected { background-color: #ff9551; border-color: #ff9551; } .ekip-datepicker .buttons { padding: 15px; border-top: 1px solid #e6e6e6; } .ekip-datepicker .buttons .custom-switch label { font-size: 12px; } .ekip-datepicker #select-day-duration .btn:focus { background: #f8f8f8 !important; border-color: #f8f8f8 !important; color: #222a40 !important; } .ekip-datepicker #select-day-duration .btn:hover { background: #222a40 !important; border-color: #222a40 !important; color: #fff !important; } .ekip-editor { background-color: #fff; border: 1px solid #D8D9DD; box-shadow: 0 2px 2px 0 rgba(41, 43, 50, 0.0509803922); border-radius: 12px; font-size: 13px; } .ekip-editor:not(.not-resizeable) { resize: vertical; overflow: auto; } .ekip-editor textarea { display: none; } .ekip-editor.hide-toolbar .ck-editor .ck.ck-editor__top { order: 2; } .ekip-editor.hide-toolbar .ck-editor .ck.ck-editor__top .ck-toolbar { display: none; } .ekip-editor .ck-editor { display: flex; flex-direction: column; } .ekip-editor .ck-editor .ck.ck-editor__top .ck-toolbar { border: none; border-bottom: 1px solid #ebebeb; background-color: #f9f9f9 !important; } .ekip-editor .ck-editor .ck.ck-editor__top .ck-toolbar .ck-toolbar__items { background-color: #f9f9f9; } .ekip-editor .ck-editor .ck-placeholder:before { color: #a7a7a7; } .ekip-editor .ck-editor .ck.ck-content { border: none; padding: 0 8px 5px 8px; border-radius: 5px; box-shadow: none; min-height: 150px; font-size: 13px; } .ekip-editor .ck-editor .ck.ck-content h2 { font-size: 20px; } .ekip-editor .ck-editor .ck.ck-content h3 { font-size: 18px; } .ekip-editor .ck-editor .ck.ck-content h4 { font-size: 16px; } .ekip-editor .ck-editor .ck.ck-content:focus { box-shadow: none; } .ekip-editor .ck-editor .ck.ck-content .mention { background-color: #fff2ea; color: #ff9551; } .ekip-editor .ck-on { color: inherit !important; background: inherit !important; } .ekip-editor .ck-on:hover { background: var(--ck-color-button-default-hover-background) !important; } /** Hide CKEditor 5 Powered **/ .ck-body-wrapper .ck.ck-balloon-panel { border: none !important; } .ck-body-wrapper .ck.ck-powered-by { display: none !important; } .ck-body-wrapper .custom-mention-item { display: block; width: 100% !important; padding: 0 0 0 6px !important; cursor: pointer !important; } .ck-body-wrapper .custom-mention-item.ck-on { background-color: #ff9551 !important; } /** Force Z-Index for balloon in CK Editor **/ .ck.ck-balloon-panel.ck-balloon-panel_arrow_nw.ck-balloon-panel_visible.ck-balloon-panel_with-arrow { z-index: 9999; } /* * Inputs style * * Author: Thibaud Magniez */ .ekip-label { color: #292B32; font-size: 12px; margin: 0; font-weight: 500; } .ekip-input-group { display: flex; align-items: center; background: #fff; border-radius: 12px; overflow: hidden; color: #292B32; border: 1px solid #D8D9DD; box-shadow: 0 2px 2px 0 rgba(41, 43, 50, 0.0509803922); min-height: 40px; /** Coloris **/ /** Simple file upload **/ /** Bs multi select **/ /** Select 2 in ekip input group */ } .ekip-input-group.transparent { background: transparent; border: none; box-shadow: none; } .ekip-input-group.has-error { border-color: #e04f1a !important; } .ekip-input-group.dark-bg { background: #F8F8F8; } .ekip-input-group.dark-bg input, .ekip-input-group.dark-bg select, .ekip-input-group.dark-bg textarea { background-color: #F8F8F8; } .ekip-input-group.small { height: auto; padding: 0; } .ekip-input-group.has-editor { height: auto; } .ekip-input-group.disabled { background: #ededed; } .ekip-input-group.disabled .select2-selection, .ekip-input-group.disabled .select2-selection--multiple { background: #ededed !important; } .ekip-input-group .clr-field { width: 100%; } .ekip-input-group .clr-field button { height: 15px; width: 15px; border-radius: 50%; } .ekip-input-group .clr-field input { font-size: 12px; } .ekip-input-group .small-file-upload { display: none; } .ekip-input-group .small-file-upload-label { display: flex; align-items: center; justify-content: center; width: 100%; cursor: pointer; margin: 0 !important; font-size: 14px; padding: 4px 0; } .ekip-input-group.has-bs-multi-select { overflow: unset; } .ekip-input-group.has-bs-multi-select .multiselect-native-select { width: 100%; } .ekip-input-group.has-bs-multi-select .multiselect-native-select .btn-group { width: 100%; } .ekip-input-group.has-bs-multi-select .multiselect-native-select .btn-group .multiselect { position: relative; max-width: unset; min-width: unset; border: none; border-radius: 12px; background: #fff; } .ekip-input-group.has-bs-multi-select .multiselect-native-select .btn-group::after { position: absolute; content: "\f107"; right: 5px; top: 0; display: flex; align-items: center; height: 100%; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 13px; } .ekip-input-group.has-bs-multi-select.disabled .btn-group .multiselect { background: transparent !important; } .ekip-input-group.height-auto { height: auto; align-items: flex-start; } .ekip-input-group.height-auto i { margin-top: 15px; } .ekip-input-group input, .ekip-input-group textarea, .ekip-input-group select { border: none; color: inherit; font-weight: 500; font-size: 13px; } .ekip-input-group input:-moz-read-only, .ekip-input-group textarea:-moz-read-only, .ekip-input-group select:-moz-read-only { background-color: inherit; cursor: initial; } .ekip-input-group input:read-only, .ekip-input-group textarea:read-only, .ekip-input-group select:read-only { background-color: inherit; cursor: initial; } .ekip-input-group input::-moz-placeholder, .ekip-input-group textarea::-moz-placeholder, .ekip-input-group select::-moz-placeholder { color: #2b3e71; } .ekip-input-group input::placeholder, .ekip-input-group textarea::placeholder, .ekip-input-group select::placeholder { color: #2b3e71; } .ekip-input-group input:disabled + div .fa-pen, .ekip-input-group textarea:disabled + div .fa-pen, .ekip-input-group select:disabled + div .fa-pen { display: none; } .ekip-input-group select { width: 100%; background-color: transparent; cursor: pointer; } .ekip-input-group textarea { color: #222a40; resize: none; min-height: 245px; } .ekip-input-group textarea.small { min-height: 100px; } .ekip-input-group .select2 .select2-selection { border: none !important; box-shadow: none; } .ekip-input-group .select2 .select2-selection .select2-selection__choice { display: flex; align-items: center; order: 1; height: 25px; padding: 2px; border-radius: 50px; background-color: var(--background-color, #f3f3f3); color: #222a40; border: none; font-weight: 400; font-size: 12px; } .ekip-input-group .select2 .select2-selection .select2-selection__choice .select2-selection__choice__remove { order: 2; font-weight: 300; font-size: 20px; color: #292B32; margin: 2.5px 5px 0 3px; } .ekip-input-group .select2 .select2-selection .select2-selection__choice .select2-selection__choice__remove:hover { color: #ff9551; } .ekip-input-group .select2.select2-container--disabled + div { display: none; } .ekip-input-group .select2.select2-container--disabled .select2-selection--multiple { background: #fff; } .ekip-input-group .select2.select2-container--disabled .select2-selection__arrow { display: none; } .ekip-input-group .select2 .select2-selection__placeholder { color: #2b3e71 !important; font-weight: 400; font-size: 13px; } .ekip-input-group .select2 .select2-selection__arrow b { position: relative !important; top: 4px !important; border: none !important; } .ekip-input-group .select2 .select2-selection__arrow b:before { content: "\f078"; font-family: "Font Awesome 6 Free"; font-size: 10px; } .ekip-input-group.adjust-select2-arrow { padding: 10px 25px 10px 12px !important; } .ekip-input-group.adjust-select2-arrow .select2-selection__arrow { right: -20px !important; } .ekip-input-group i { font-size: 11px; margin-right: 4px; color: inherit; } .ekip-input-group i.fa-plus { cursor: pointer; } .ekip-input-group .view-password { cursor: pointer; } .ekip-input-group.color-only { align-items: stretch; min-width: 35px; padding: 0 !important; } .ekip-input-group.color-only input { position: absolute; top: 0; left: 10px; z-index: -1; } .ekip-input-group.color-only button { top: 0; left: 0; width: 100%; height: 100%; transform: none; border-radius: 0; cursor: pointer; pointer-events: all; z-index: 9; } .ekip-btn-radio { display: flex; gap: 10px; } .ekip-btn-radio input[type=radio] { position: absolute; left: -9999px; /* complètement hors flux, pas en absolute dans le label */ } .ekip-btn-radio label span { display: inline-block; padding: 10px 12px; /* ici plus de bug */ border-radius: 12px; border: 1px solid #D8D9DD; cursor: pointer; } .ekip-btn-radio input:checked + label span { background: orange; color: #fff; } .ekip-btn-radio { display: flex; gap: 10px; } .ekip-btn-radio label { display: inline-block; cursor: pointer; border-radius: 12px; border: 1px solid #D8D9DD; box-shadow: 0px 2px 2px 0px rgba(41, 43, 50, 0.05); padding: 8px 10px; } .ekip-btn-radio label i { margin: auto; } .ekip-btn-radio input:checked + label { background: #ff9551; color: #fff; } .ekip-btn-radio input:disabled + label { background: #ededed; color: #6c757d; cursor: default; } .ekip-radio { position: relative; display: flex; align-items: baseline; justify-content: flex-start; width: 100%; height: 40px; border-radius: 5px; overflow: hidden; background-color: #fff; } .ekip-radio label { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; } .ekip-radio label .label { background: #fff; border-radius: 17px; opacity: 1; font-size: 11px; color: #A3A3A3; padding: 2px 14px; } .ekip-radio label input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } .ekip-radio label input:checked ~ .checkmark.custom-color { background-color: var(--text-color) !important; } .ekip-radio label input:checked ~ .checkmark.orange { background-color: #ff9551; } .ekip-radio label input:checked ~ .checkmark.yellow { background-color: #fbdd56; } .ekip-radio label input:checked ~ .checkmark.blue { background-color: #2b3e71; } .ekip-radio label input:checked ~ .checkmark.green { background-color: #00a44e; } .ekip-radio label input:checked ~ .label { color: #fff; } .ekip-radio label input:checked ~ .label.custom-color { background-color: var(--bg-color) !important; color: var(--text-color) !important; } .ekip-radio label input:checked ~ .label.orange { background-color: #ff9551; } .ekip-radio label input:checked ~ .label.yellow { background-color: #fbdd56; } .ekip-radio label input:checked ~ .label.blue { background-color: #2b3e71; } .ekip-radio label input:checked ~ .label.green { background-color: #00a44e; } .ekip-radio label .checkmark { content: ""; position: absolute; top: 20px; height: 9px; width: 9px; border-radius: 50%; background-color: transparent; z-index: 9; } .ekip-radio:after { content: ""; position: absolute; opacity: 0.17; width: calc(100% - 16px); bottom: 15px; height: 1.5px; background: #9d9d9d; border-radius: 5px; z-index: 8; } .label-file { cursor: pointer; } .input-file { border: none; padding: 5px 0; } .btn-orange { background-color: #ff9551; color: white; font-size: 14px; } .btn-orange:focus, .btn-orange:active { background-color: #ff9551; } .btn { border-radius: 8px; } .btn:focus, .btn:active { outline: none; box-shadow: none; } .btn.disabled, .btn:disabled { opacity: 0.3; } /** * Select2 dropdown */ .select2-container { font-size: 12px; } .select2-container .select2-results__option { padding: 2px 5px; white-space: nowrap; } .select2-container .select2-results__option:has(.user-item) { padding: 0 !important; } .select2-container .select2-search__field { border-color: #ededed !important; } .select2-container.select2-container--disabled .select2-selection--single { background-color: #ededed !important; } /** * Upload file */ .input-file-container { position: relative; width: -moz-fit-content; width: fit-content; cursor: pointer; } .input-file-container.js .input-file-trigger { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; /* number of lines to show */ line-clamp: 1; -webkit-box-orient: vertical; text-align: center; background: transparent; border: 1.5px solid #222a40; border-radius: 5px; color: #222a40; font-size: 12px; transition: all 0.4s; cursor: pointer; padding: 0.375rem 0.75rem; } .input-file-container.js .label-file-btn { background-color: #ff9551 !important; border-radius: 8px; line-height: 1.5; color: #fff !important; padding: 8px 10px; width: -moz-fit-content; width: fit-content; cursor: pointer; } .input-file-container.js .label-file-btn:hover { background-color: #ff9551 !important; } .input-file-container.js .input-file { position: absolute; top: 0; left: 0; opacity: 0; padding: 14px 0; cursor: pointer; } .input-file-container.js .input-file.input-file-logo { cursor: pointer; } .input-file-container.js .input-file.input-file-logo + label { background: transparent; border: none; color: #737373; font-size: 13px; font-weight: 400; margin: 0; text-align: left; cursor: pointer; justify-content: flex-start; } .input-file-container.js .input-file:hover + .input-file-trigger, .input-file-container.js .input-file:focus + .input-file-trigger, .input-file-container.js .input-file:hover, .input-file-container.js .input-file:focus { background: #222a40; color: #ff9551; } .input-file-container.js .file-return { margin: 0; font-style: italic; font-size: 0.9em; font-weight: bold; } .input-file-container.js .file-return:not(:empty) { margin: 1em 0; } .input-file-container.js .file-return:not(:empty):before { content: "Fichier :"; font-style: normal; font-weight: normal; } /** Profile Image Container **/ ._illustration_container { position: relative; max-width: -moz-fit-content; max-width: fit-content; } ._illustration_container .delete_img { display: flex; align-items: center; justify-content: center; font-size: 12px; height: 20px; width: 20px; border-radius: 50%; position: absolute; top: 0; right: 15px; font-weight: bold; background-color: #e04f1a; color: #fff; z-index: 99; cursor: pointer; } ._illustration_container .delete_img:hover { background-color: #fff; color: #e04f1a; } ._illustration_container figure { position: relative; display: flex; align-items: center; justify-content: center; width: 95px; height: 95px; border-radius: 50%; overflow: hidden; margin: 0; } ._illustration_container figure img { width: 100%; height: -moz-fit-content; height: fit-content; } /** * Custom radio * */ .custom-radio { display: flex; flex-direction: column; gap: 5px; } .custom-radio label { display: flex; align-items: center; margin: 0; font-size: 13px; cursor: pointer; } .custom-radio label input { margin-right: 12px; height: 15px; width: 15px; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #bebebe; border-radius: 50%; outline: none; transition: box-shadow 0.3s ease; display: flex; align-items: center; justify-content: center; } .custom-radio label input:before { content: ""; display: block; width: 11px; height: 11px; border-radius: 50%; } .custom-radio label input:checked:before { background: #ff9551; } /** * Custom switch * */ .custom-switch .custom-control-input:focus ~ .custom-control-label::before { box-shadow: none; } .custom-switch .custom-control-input:checked ~ .custom-control-label::before { background: #ff9551; border-color: #ff9551; } .custom-switch .custom-control-input:not(:disabled):active ~ .custom-control-label::before { color: #fff; background-color: #e2e8f2; border-color: #e2e8f2; } .custom-switch .custom-control-label, .custom-switch .custom-checkbox .custom-control-label { font-size: 13px; padding-top: 2px; font-weight: 400; cursor: pointer; } .custom-switch.switch-only { max-width: 32px; } .custom-switch.small .custom-control-label { padding-top: 1px; } .custom-switch.small .custom-control-label:before { height: 1.05rem; width: 1.8rem; } .custom-switch.small .custom-control-label:after { height: 0.75rem; width: 0.75rem; } .custom-switch .form-control:disabled { opacity: 0; } .custom-switch .form-control ~ .custom-control-label::before { background-color: #c1c1c1; } @media (max-width: 768px) { .ekip-input-group { margin-bottom: 8px; } .ekip-radio label .label { padding: 2px 5px; font-size: 9px; } } /** * Sortable */ .custom-control-label.ui-sortable-handle { cursor: move; } /**; * Label */ .custom-control-primary.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before, .custom-control-primary.custom-checkbox .custom-control-input:active ~ .custom-control-label::before { background-color: #ff9551; } .custom-control-primary.custom-checkbox .custom-control-label::before { box-shadow: none !important; } /** * Bootstrap multi select * */ .multiselect-native-select { /** Hide first item when placeholder **/ } .multiselect-native-select .dropdown-toggle:after { content: none; } .multiselect-native-select .dropdown-toggle:focus { border-color: #d3e0e8 !important; box-shadow: none; } .multiselect-native-select .multiselect { min-width: 150px; max-width: 150px; text-align: left !important; } .multiselect-native-select .multiselect span { font-size: 13px; font-weight: 500; color: #2b3e71; } .multiselect-native-select .multiselect.disabled { background-color: #ededed; } .multiselect-native-select .form-check-input { opacity: 0; } .multiselect-native-select .form-check-input + .form-check-label:before { position: absolute; left: 0; top: 6px; content: ""; display: block; width: 13px; height: 13px; border: 1px solid #d9d9d9; border-radius: 2px; } .multiselect-native-select .form-check-input:checked + .form-check-label:before { background-color: #d9d9d9; } .multiselect-native-select .form-check-input:checked + .form-check-label:after { position: absolute; left: 2px; top: 6px; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f00c"; font-size: 9px; } .multiselect-native-select .multiselect-container { width: 100% !important; max-width: 400px; } .multiselect-native-select .multiselect-container .dropdown-item { background-color: #fff !important; margin: 0; } .multiselect-native-select .multiselect-container .dropdown-item label { font-weight: 300; font-size: 13px; } .multiselect-native-select .multiselect-container .dropdown-item:hover { background-color: rgb(255, 240, 231) !important; } .multiselect-native-select .multiselect-container .dropdown-item-text { font-size: 13px !important; font-weight: 600; } .multiselect-native-select .multiselect-container button.multiselect-option.dropdown-item { pointer-events: none; } .multiselect-native-select .multiselect-container button.multiselect-option.multiselect-group-option-indented { padding-left: 1rem; } .multiselect-native-select .multiselect-container span.form-check input, .multiselect-native-select .multiselect-container span.form-check label { pointer-events: all; } .multiselect-native-select .multiselect-search { font-size: 13px; min-height: 35px; } .multiselect-native-select .multiselect-search:focus { border-radius: 0 !important; } .multiselect-native-select .bs-multi-select.placeholder + .btn-group .multiselect-container .dropdown-item.disabled:nth-child(2) { display: none; } .bs-multi-select-container.small .btn-group .multiselect { padding-top: 0; padding-bottom: 0; max-height: 30px; } .bs-multi-select-container.small .btn-group .multiselect .multiselect-selected-text { font-size: 12px; } .bs-multi-select-container.bs-w-80px .btn-group .multiselect { min-width: 80px; max-width: 80px; } /** * Roles selector * */ .ekip-roles-selector { border: none; font-size: 12px; max-width: 80px; padding: 5px; } .ekip-roles-selector.state-1 { background-color: #8bd198; } .ekip-roles-selector.state-0 { background-color: #e47a7a; } .ekip-roles-selector.state-owner_only { background-color: rgb(255, 240, 231); } /** * Users list * */ .select2-container .user-item, .select2-container .group-item { display: flex; align-items: center; } .select2-container .user-item .initial, .select2-container .user-item .profile-img, .select2-container .group-item .initial, .select2-container .group-item .profile-img { display: flex; align-items: center; justify-content: center; min-height: 22px; max-height: 22px; min-width: 22px; max-width: 22px; font-weight: 400; font-size: 8px; border-radius: 50%; margin-right: 5px; } .select2-container .user-item .initial, .select2-container .group-item .initial { background-color: var(--initial-color, #ff9551); border: 1px solid var(--initial-color, #ff9551); color: #fff; } .select2-container .user-item .profile-img, .select2-container .group-item .profile-img { overflow: hidden; margin-bottom: 0; } .select2-container .user-item .profile-img img, .select2-container .group-item .profile-img img { width: 100%; } .select2-container .select2-results .user-item { padding: 6px 5px; } .select2-container .select2-selection__rendered .user-item.hide-title .title { display: none; } .select2-container .select2-selection__rendered li:has(.group-item) { display: none !important; } /** * Tom Select */ .ekip-input-group.has-tom-select { overflow: visible; height: auto !important; padding: 0 !important; } .ekip-input-group.has-tom-select .ts-control { border: none; border-radius: 12px; } .ekip-input-group.has-tom-select .ts-control span.strikethrough { text-decoration: line-through; } .ekip-input-group.has-tom-select .disabled .ts-control { opacity: 1; background-color: #ededed; } .ekip-input-group.has-tom-select .ts-wrapper { width: 100%; } .ekip-input-group.has-tom-select.read-only { background: transparent !important; border: none !important; box-shadow: none !important; } .ekip-input-group.has-tom-select.read-only .ts-control { background: transparent !important; } .ekip-input-group.has-tom-select.read-only .ts-control .remove { display: none !important; } .ts-dropdown { border: none; z-index: 9999 !important; } .ts-dropdown .dropdown-input-wrap input { padding: 6px !important; max-height: none !important; } .plugin-dropdown_input.focus.dropdown-active .ts-control { border: none !important; } .tom-select.hide-border .ts-control, .ts-dropdown.hide-border .ts-control { border: none !important; } .tom-select .ts-select-all, .ts-dropdown .ts-select-all { color: #ff9551; font-size: 11px; font-weight: 600; } .tom-select.user-select .item, .ts-dropdown.user-select .item { padding: 0 !important; } .tom-select .item, .tom-select .option, .ts-dropdown .item, .ts-dropdown .option { width: initial; height: initial; } .tom-select .item .rounded-circle, .tom-select .option .rounded-circle, .ts-dropdown .item .rounded-circle, .ts-dropdown .option .rounded-circle { width: 22px; min-width: 22px; max-width: 22px; height: 22px; min-height: 22px; max-height: 22px; font-size: 8px; } .tom-select .remove, .ts-dropdown .remove { border: none !important; font-size: 18px; margin: 0 !important; } .tom-select .remove:hover, .ts-dropdown .remove:hover { background: transparent !important; color: #ff9551 !important; } .tom-select.multi .item, .ts-dropdown.multi .item { border-radius: 25px; } /** Coloris **/ .clr-picker { z-index: 3333 !important; } /** * Dropzone */ .dropzone { border: 1px dashed #E5E5E5 !important; border-radius: 12px; min-height: auto !important; text-align: center; } .dropzone.size-sm .dz-message { margin-top: 10px !important; margin-bottom: 0 !important; } .dropzone.size-sm .dz-message .info { margin-bottom: 10px; } .dropzone.size-xs { padding: 0; max-height: 25px; overflow: hidden; } .dropzone.size-xs .dz-message { margin: 3px 10px; font-size: 11px; } .dropzone.size-xs .dz-message i, .dropzone.size-xs .dz-message .extension { display: none !important; } .dropzone.size-xs .dz-preview { margin: 1.5px; } .dropzone.size-xs .dz-preview .dz-image { height: 20px; } .dropzone.size-xs .dz-preview .dz-details { padding: 0; } .dropzone.size-xs .dz-preview .dz-details .dz-size { display: none; } .dropzone.size-xs .dz-preview .dz-details .dz-filename { font-size: 11px; } .dropzone .dz-message { font-style: normal; } .dropzone .dz-message i { font-size: 25px; margin-bottom: 15px; } .dropzone:hover .dz-message { color: inherit; } .range-slider { width: 100%; --primary-color: #ff9551; --value-offset-y: var(--ticks-gap); --value-active-color: white; --value-background: transparent; --value-background-hover: var(--primary-color); --value-font: 700 12px/1 Arial; --fill-color: var(--primary-color); --progress-background: #eee; --progress-radius: 5px; --track-height: calc(var(--thumb-size) / 2); --min-max-font: 12px Arial; --min-max-opacity: 0.5; --min-max-x-offset: 10%; --thumb-size: 25px; --thumb-color: white; --thumb-shadow: 0 0 3px rgba(0, 0, 0, 0.4), 0 0 1px rgba(0, 0, 0, 0.5) inset, 0 0 0 99px var(--thumb-color) inset; --thumb-shadow-active: 0 0 0 calc(var(--thumb-size) / 4) inset var(--thumb-color), 0 0 0 99px var(--primary-color) inset, 0 0 3px rgba(0, 0, 0, 0.4); --thumb-shadow-hover: var(--thumb-shadow); --ticks-thickness: 1px; --ticks-height: 5px; --ticks-gap: var( --ticks-height, 0 ); --ticks-color: silver; --step: 1; --ticks-count: Calc(var(--max) - var(--min)) / var(--step); --maxTicksAllowed: 30; --too-many-ticks: Min(1, Max(var(--ticks-count) - var(--maxTicksAllowed), 0)); --x-step: Max( var(--step), var(--too-many-ticks) * (var(--max) - var(--min)) ); --tickInterval: 100/ ((var(--max) - var(--min)) / var(--step)) * var(--tickEvery, 1); --tickIntervalPerc: calc( (100% - var(--thumb-size)) / ((var(--max) - var(--min)) / var(--x-step)) * var(--tickEvery, 1) ); --value-a: Clamp( var(--min), var(--value, 0), var(--max) ); --value-b: var(--value, 0); --text-value-a: var(--text-value, ""); --completed-a: calc( (var(--value-a) - var(--min)) / (var(--max) - var(--min)) * 100 ); --completed-b: calc( (var(--value-b) - var(--min)) / (var(--max) - var(--min)) * 100 ); --ca: Min(var(--completed-a), var(--completed-b)); --cb: Max(var(--completed-a), var(--completed-b)); --thumbs-too-close: Clamp( -1, 1000 * (Min(1, Max(var(--cb) - var(--ca) - 5, -1)) + 0.001), 1 ); --thumb-close-to-min: Min(1, Max(var(--ca) - 2, 0)); --thumb-close-to-max: Min(1, Max(98 - var(--cb), 0)); display: inline-block; height: max(var(--track-height), var(--thumb-size)); background: linear-gradient(to right, var(--ticks-color) var(--ticks-thickness), transparent 1px) repeat-x; background-size: var(--tickIntervalPerc) var(--ticks-height); background-position-x: calc(var(--thumb-size) / 2 - var(--ticks-thickness) / 2); background-position-y: var(--flip-y, bottom); padding-bottom: var(--flip-y, var(--ticks-gap)); padding-top: calc(var(--flip-y) * var(--ticks-gap)); position: relative; z-index: 1; } .range-slider[data-ticks-position=top] { --flip-y: 1; } .range-slider::before, .range-slider::after { --offset: calc(var(--thumb-size) / 2); content: counter(x); display: var(--show-min-max, block); font: var(--min-max-font); position: absolute; font-size: 0.8rem; color: #222a40; font-weight: 700; bottom: var(--flip-y, -2.5ch); top: calc(-2.5ch * var(--flip-y)); transform: translateX(calc(var(--min-max-x-offset) * var(--before, -1) * -1)) scale(var(--at-edge)); pointer-events: none; } .range-slider::before { --before: 1; --at-edge: var(--thumb-close-to-min); counter-reset: x var(--min); left: var(--offset); } .range-slider::after { --at-edge: var(--thumb-close-to-max); counter-reset: x var(--max); right: var(--offset); } .range-slider__values { position: relative; top: 50%; line-height: 0; text-align: justify; width: 100%; pointer-events: none; margin: 0 auto; z-index: 5; } .range-slider__values::after { content: ""; width: 100%; display: inline-block; height: 0; background: red; } .range-slider__progress { --start-end: calc(var(--thumb-size) / 2); --clip-end: calc(100% - (var(--cb)) * 1%); --clip-start: calc(var(--ca) * 1%); --clip: inset(-20px var(--clip-end) -20px var(--clip-start)); position: absolute; left: var(--start-end); right: var(--start-end); top: calc(var(--ticks-gap) * var(--flip-y, 0) + var(--thumb-size) / 2 - var(--track-height) / 2); height: calc(var(--track-height)); background: var(--progress-background, #eee); pointer-events: none; z-index: -1; border-radius: var(--progress-radius); } .range-slider__progress::before { content: ""; position: absolute; left: 0; right: 0; clip-path: var(--clip); top: 0; bottom: 0; background: var(--fill-color, black); box-shadow: var(--progress-flll-shadow); z-index: 1; border-radius: inherit; } .range-slider__progress::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #fff; box-shadow: var(--progress-shadow); pointer-events: none; border-radius: inherit; } .range-slider > input { -webkit-appearance: none; width: 100%; height: var(--thumb-size); margin: 0; position: absolute; left: 0; top: calc(50% - max(var(--track-height), var(--thumb-size)) / 2 + var(--ticks-gap) / 2 * var(--flip-y, -1)); cursor: grab; outline: none; background: none; } .range-slider > input:not(:only-of-type) { pointer-events: none; } .range-slider > input::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; height: var(--thumb-size); width: var(--thumb-size); transform: var(--thumb-transform); border-radius: var(--thumb-radius, 50%); background: var(--thumb-color); box-shadow: var(--thumb-shadow); border: none; pointer-events: auto; -webkit-transition: 0.1s; transition: 0.1s; } .range-slider > input::-moz-range-thumb { -moz-appearance: none; appearance: none; height: var(--thumb-size); width: var(--thumb-size); transform: var(--thumb-transform); border-radius: var(--thumb-radius, 50%); background: var(--thumb-color); box-shadow: var(--thumb-shadow); border: none; pointer-events: auto; -moz-transition: 0.1s; transition: 0.1s; } .range-slider > input::-ms-thumb { appearance: none; height: var(--thumb-size); width: var(--thumb-size); transform: var(--thumb-transform); border-radius: var(--thumb-radius, 50%); background: var(--thumb-color); box-shadow: var(--thumb-shadow); border: none; pointer-events: auto; -ms-transition: 0.1s; transition: 0.1s; } .range-slider > input:hover { --thumb-shadow: var(--thumb-shadow-hover); } .range-slider > input:hover + output { --value-background: var(--value-background-hover); --y-offset: -5px; color: var(--value-active-color); box-shadow: 0 0 0 3px var(--value-background); } .range-slider > input:active { --thumb-shadow: var(--thumb-shadow-active); cursor: grabbing; z-index: 2; } .range-slider > input:active + output { transition: 0s; } .range-slider > input:nth-of-type(1) { --is-left-most: Clamp(0, (var(--value-a) - var(--value-b)) * 99999, 1); } .range-slider > input:nth-of-type(1) + output { --value: var(--value-a); --x-offset: calc(var(--completed-a) * -1%); } .range-slider > input:nth-of-type(1) + output:not(:only-of-type) { --flip: calc(var(--thumbs-too-close) * -1); } .range-slider > input:nth-of-type(1) + output::after { content: var(--prefix, "") var(--text-value-a) var(--suffix, ""); } .range-slider > input:nth-of-type(2) { --is-left-most: Clamp(0, (var(--value-b) - var(--value-a)) * 99999, 1); } .range-slider > input:nth-of-type(2) + output { --value: var(--value-b); } .range-slider > input:only-of-type ~ .range-slider__progress { --clip-start: 0; } .range-slider > input + output { --flip: -1; --x-offset: calc(var(--completed-b) * -1%); --pos: calc( ((var(--value) - var(--min)) / (var(--max) - var(--min))) * 100% ); pointer-events: none; position: absolute; z-index: 5; background: var(--value-background); border-radius: 10px; padding: 2px 4px; left: var(--pos); transform: translate(var(--x-offset), calc(150% * var(--flip) - (var(--y-offset, 0px) + var(--value-offset-y)) * var(--flip))); transition: all 0.12s ease-out, left 0s; } .range-slider > input + output::after { content: var(--prefix, "") var(--text-value-b) var(--suffix, ""); font: var(--value-font); } .form-group-range label { margin-bottom: 3rem; } .range-slider.grad { --progress-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2) inset; --progress-flll-shadow: var(--progress-shadow); --fill-color: linear-gradient(to right, var(--primary-color), var(--primary-color)); --thumb-shadow: 0 0 4px rgba(0, 0, 0, 0.3), -3px 9px 9px rgba(255, 255, 255, 0.33) inset, -1px 3px 2px rgba(255, 255, 255, 0.33) inset, 0 0 0 99px var(--primary-color) inset; width: 100%; } .range-slider.grad input:hover { --thumb-transform: scale(1.2); } .range-slider.grad input:active { --thumb-shadow: inherit; --thumb-transform: scale(1); } /** * Btn primary */ /** Main **/ .btn { display: flex; align-items: center; height: 40px; border-radius: 12px; font-weight: 400; } .btn.active:hover { opacity: 0.65; box-shadow: none; } .btn.btn-sm { font-size: 13px; } .btn.radius-sm { border-radius: 8px; } .btn.radius-md { border-radius: 12px; } .btn.radius-lg { border-radius: 18px; } .btn.btn-default { border: 1px solid #D8D9DD; box-shadow: 0 2px 2px 0 rgba(41, 43, 50, 0.0509803922); color: #151C20; } /** Orange Button **/ .btn-primary { color: #fff; background-color: #ff9551; border-color: #ff9551; } .btn-primary:not(:disabled):not(.disabled):hover, .btn-primary:not(:disabled):not(.disabled):active { background-color: #ff9551 !important; border-color: #ff9551 !important; } .btn-primary:focus, .btn-primary:disabled, .btn-primary.disabled { background-color: #ff9551; border-color: #ff9551; } /** Light Orange Button **/ .btn-alt-primary { background-color: #ffc092; border-color: #ffc092; color: #222a40; } .btn-alt-primary:hover, .btn-alt-primary:active { background-color: #f7b98c !important; border-color: #f7b98c !important; color: #222a40; box-shadow: none; } .btn-alt-primary:focus { background-color: #ffcda8; border-color: #ffcda8; color: #222a40; } /** Blue Button **/ .btn-info { background-color: #222a40; border-color: #222a40; color: #fff; } .btn-info:not(:disabled):not(.disabled):hover, .btn-info:not(:disabled):not(.disabled):active { outline: none; box-shadow: none !important; background-color: #2b3e71; border-color: #2b3e71; color: #fff; } .btn-info:focus, .btn-info:disabled, .btn-info.disabled { background-color: #2b3e71; border-color: #2b3e71; } /** Light Blue Button **/ .btn-light:not(:disabled):not(.disabled) { background-color: #f8f8f8; border-color: #f8f8f8; color: #222a40; } .btn-light:not(:disabled):not(.disabled):hover, .btn-light:not(:disabled):not(.disabled):focus, .btn-light:not(:disabled):not(.disabled):active { outline: none; box-shadow: none !important; background-color: #222a40; border-color: #222a40; color: #fff; } /** Gray Button **/ .btn-secondary:not(:disabled):not(.disabled) { background-color: #c4c4c4; border-color: #c4c4c4; color: #fff; } .btn-secondary:not(:disabled):not(.disabled):hover, .btn-secondary:not(:disabled):not(.disabled):focus, .btn-secondary:not(:disabled):not(.disabled):active { outline: none; box-shadow: none !important; background-color: #d9d9d9; border-color: #d9d9d9; color: #fff; } /** Outline Orange Button **/ .btn-outline-primary { border-color: #ff9551; color: #ff9551; } .btn-outline-primary:not(:disabled):not(.disabled):hover, .btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled):active:focus { background-color: #ff9551 !important; border-color: #ff9551 !important; box-shadow: none; color: #fff; outline: none; } .btn-outline-primary.disabled { color: #ff9551; opacity: 1; } .btn-outline-primary.disabled:hover { border-color: #ff9551; } /** Outline Blue Button **/ .btn-outline-info { border-color: #222a40; color: #222a40; } .btn-outline-info:not(:disabled):not(.disabled):hover, .btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled):active:focus { background-color: #222a40 !important; box-shadow: none; color: #fff; outline: none; } .btn-outline-info.disabled { color: #222a40; opacity: 1; } .btn-outline-info.disabled:hover { border-color: #222a40; } button.has-link { border: none; background: transparent; } /** * Btn with shadow and icon */ .btn-shadow { display: flex; justify-content: center; align-items: center; gap: 8px; border: 1px solid #D8D9DD; background: #fff; box-shadow: 0px 2px 2px 0px rgba(41, 43, 50, 0.05); } #toast-container .toast { font-size: 13px; box-shadow: 0 0 10px 0px #c9c9c9 !important; border: none; background-image: none !important; } #toast-container .toast:before { font-family: "Font Awesome 5 Free"; font-weight: 900; position: absolute; left: 15px; font-size: 18px; top: 50%; transform: translateY(-50%); color: #222a40; } #toast-container .toast.toast-success { background-color: #e6f0db; } #toast-container .toast.toast-success:before { content: "\f00c"; } #toast-container .toast.toast-error { background-color: #f9dcd1; } #toast-container .toast.toast-error:before { content: "\f00d"; } #toast-container .toast .toast-progress { height: 2px; } #toast-container .toast .toast-message { color: #222a40; } #toast-container .toast .toast-close-button { color: #222a40; } #toast-container .toast:hover { box-shadow: 0 0 12px #999; } /** * Bootstrap Modal */ .modal-dialog { border-radius: 24px !important; } @media screen and (max-width: 965px) { .modal-dialog { max-width: none; margin-left: 15px; margin-right: 15px; } } .modal-dialog .modal-content { border-radius: 24px !important; padding: 24px; overflow: hidden; background-color: #fff; border: 1px solid #F7F7F8; box-shadow: 0px 8px 8px 0px rgba(41, 43, 50, 0.1); /** Form **/ /** Multi select **/ /** End form **/ /** Modal accordion **/ } .modal-dialog .modal-content .block-header { padding: 0 0 16px 0; border-bottom: 1px solid #D8D9DD; margin-bottom: 32px; } .modal-dialog .modal-content .block-header .block-title { font-size: 20px; font-weight: 600; color: #292B32; } .modal-dialog .modal-content .block-header .btn-close-modal { color: #222a40; } .modal-dialog .modal-content .block-header .block-options.absolute { position: absolute; top: 20px; right: 20px; z-index: 99; } .modal-dialog .modal-content .ekip-input-group, .modal-dialog .modal-content .multiselect-native-select .multiselect { border-radius: 12px; border: 1px solid #D8D9DD; box-shadow: 0px 2px 2px 0px rgba(41, 43, 50, 0.05); padding: 10px 12px; height: unset; } .modal-dialog .modal-content .ekip-input-group.has-bs-multi-select, .modal-dialog .modal-content .multiselect-native-select .multiselect.has-bs-multi-select { padding: 8px 12px; } .modal-dialog .modal-content .ekip-input-group .multiselect, .modal-dialog .modal-content .multiselect-native-select .multiselect .multiselect { box-shadow: none; padding: 0; } .modal-dialog .modal-content .ekip-input-group input, .modal-dialog .modal-content .ekip-input-group select, .modal-dialog .modal-content .ekip-input-group textarea, .modal-dialog .modal-content .multiselect-native-select .multiselect input, .modal-dialog .modal-content .multiselect-native-select .multiselect select, .modal-dialog .modal-content .multiselect-native-select .multiselect textarea { padding: 0; max-height: 20px; font-weight: 400; } .modal-dialog .modal-content .ekip-input-group textarea, .modal-dialog .modal-content .multiselect-native-select .multiselect textarea { min-height: 80px; } .modal-dialog .modal-content .ekip-input-group .fa-calendar, .modal-dialog .modal-content .multiselect-native-select .multiselect .fa-calendar { color: #989BA5; } .modal-dialog .modal-content .ekip-input-group.has-single-select2, .modal-dialog .modal-content .multiselect-native-select .multiselect.has-single-select2 { padding: 5.5px 12px; } .modal-dialog .modal-content .ekip-input-group.has-select2, .modal-dialog .modal-content .multiselect-native-select .multiselect.has-select2 { padding: 0 12px; } .modal-dialog .modal-content .ekip-input-group.has-select2 .select2-container, .modal-dialog .modal-content .multiselect-native-select .multiselect.has-select2 .select2-container { padding: 10px 0; } .modal-dialog .modal-content .ekip-input-group.no-border, .modal-dialog .modal-content .multiselect-native-select .multiselect.no-border { padding: 0; box-shadow: none; border: none; } .modal-dialog .modal-content .ekip-input-group.no-bg .select2-selection--single, .modal-dialog .modal-content .multiselect-native-select .multiselect.no-bg .select2-selection--single { background: transparent !important; } .modal-dialog .modal-content .ekip-input-group.small-select2, .modal-dialog .modal-content .multiselect-native-select .multiselect.small-select2 { padding-top: 6px !important; padding-bottom: 6px !important; } .modal-dialog .modal-content .ekip-input-group.file-input label, .modal-dialog .modal-content .multiselect-native-select .multiselect.file-input label { font-weight: 400; font-size: 13px; } .modal-dialog .modal-content label { font-size: 14px; margin: 0; font-weight: 500; color: #292B32; margin-bottom: 4px; } .modal-dialog .modal-content .row .multiselect-native-select .btn-group { width: 100%; } .modal-dialog .modal-content .row .multiselect-native-select .multiselect { max-width: none; } .modal-dialog .modal-content .file-input-container { display: flex; align-items: center; background-color: #F7F7F8; border-radius: 24px; padding: 12px; } .modal-dialog .modal-content .file-input-container figure { display: flex; align-items: center; justify-content: center; height: 48px; width: 48px; background-color: #fff; margin: 0; border-radius: 12px; overflow: hidden; } .modal-dialog .modal-content .file-input-container figure.default { padding: 10px; } .modal-dialog .modal-content .file-input-container .input-file { padding: 0; cursor: pointer; } .modal-dialog .modal-content .file-input-container .label-file-btn { background-color: transparent !important; height: 34px; cursor: pointer; padding: 0; margin-left: 16px !important; color: #ff9551 !important; font-weight: 400 !important; } .modal-dialog .modal-content .block-content { padding: 0; /*color: $modal-gray-color;*/ color: #4f4f4f; font-weight: 300; } .modal-dialog .modal-content .footer-content, .modal-dialog .modal-content .buttons { display: grid; grid-template-columns: 1fr; grid-gap: 12px; margin-top: 32px; } .modal-dialog .modal-content .footer-content .btn, .modal-dialog .modal-content .buttons .btn { display: flex; height: 44px; padding: 10px 12px; justify-content: center; align-items: center; gap: 8px; align-self: stretch; border-radius: 12px; font-size: 16px; font-weight: 300 !important; border: none !important; } .modal-dialog .modal-content .footer-content .btn.btn-sm, .modal-dialog .modal-content .buttons .btn.btn-sm { padding: 6px 12px; height: auto; font-size: 13px; } .modal-dialog .modal-content .footer-content .btn.btn-default, .modal-dialog .modal-content .buttons .btn.btn-default { border: 1px solid #D8D9DD !important; background: #fff; box-shadow: 0px 2px 2px 0px rgba(41, 43, 50, 0.05); } .modal-dialog .modal-content .modal-accordion .block { margin: 0; border-bottom: 1px solid #D8D9DD; } .modal-dialog .modal-content .modal-accordion .block .block-header { display: block; background: transparent; padding: 16px; margin: 0; border: none; } .modal-dialog .modal-content .modal-accordion .block .block-header a { display: flex; justify-content: space-between; align-items: center; color: #292B32; font-size: 14px; font-weight: 400 !important; } .modal-dialog .modal-content .modal-accordion .block .block-header a i { font-size: 12px; } .modal-dialog .modal-content .modal-accordion .block .block-content { padding: 0 16px 16px 16px; } .modal-dialog .text-item .item-title { font-weight: 500; color: #1b2932; font-size: 15px; } .modal-dialog .text-item .item-content { font-size: 14px; } .modal-dialog ._buttons .disabled { cursor: default; } .modal-dialog .modal-body { position: initial; padding: 0; flex: none; } .modal-dialog .modal-body.loading { min-height: 150px; } .modal-dialog .modal-body.loading:before { background: white; } /** * DayPilot Modal */ .modal_default_main { border-radius: 24px !important; border: none !important; overflow: hidden; background-color: #fff; border: 1px solid #F7F7F8; box-shadow: 0px 8px 8px 0px rgba(41, 43, 50, 0.1); } .modal_default_main .modal_default_inner { padding: 24px !important; } .modal_default_main .modal_default_inner .modal_default_form_item_label { font-size: 14px !important; margin: 0 !important; font-weight: 500 !important; color: #292B32 !important; margin-bottom: 4px !important; } .modal_default_main .modal_default_inner input, .modal_default_main .modal_default_inner select { border-radius: 12px; border: 1px solid #D8D9DD; box-shadow: 0px 2px 2px 0px rgba(41, 43, 50, 0.05); padding: 10px 12px; } .modal_default_main .modal_default_inner input:focus, .modal_default_main .modal_default_inner input:active, .modal_default_main .modal_default_inner select:focus, .modal_default_main .modal_default_inner select:active { outline: none; } .modal_default_main .modal_default_buttons { display: grid; grid-template-columns: 1fr; grid-gap: 12px; margin-top: 32px; } .modal_default_main .modal_default_buttons button { display: flex; width: 100%; height: 44px; padding: 10px 12px; justify-content: center; align-items: center; align-self: stretch; border-radius: 12px; font-size: 16px; font-weight: 300 !important; border: none !important; } .modal_default_main .modal_default_buttons .modal_default_ok { background-color: #ff9551; color: #fff; } .modal_default_main .modal_default_buttons .modal_default_ok:hover { background-color: rgb(255, 240, 231) !important; } .modal_default_main .modal_default_buttons .modal_default_cancel { border: 1px solid #D8D9DD !important; background: #fff; box-shadow: 0px 2px 2px 0px rgba(41, 43, 50, 0.05); } .swal2-popup .btn { font-size: 13px !important; } .swal2-popup h2 { font-size: 22px; } .swal2-popup .swal2-html-container { font-size: 17px; } @media screen and (max-width: 965px) { .swal2-popup .btn { font-size: 12px !important; } .swal2-popup h2 { font-size: 17px; } .swal2-popup .swal2-html-container { font-size: 13px; } .swal2-popup .swal2-icon { height: 50px; width: 50px; } .swal2-popup .swal2-icon .swal2-icon-content { font-size: 30px; } } .tooltip { z-index: 9999; } .tooltip .arrow:before { display: none; border-bottom-color: #2b3e71; } .tooltip .tooltip-inner { text-align: left; font-size: 12px; font-weight: 500; background-color: #EAEDF2 !important; color: #222a40; } .search-results { display: flex; flex-wrap: wrap; } .search-results .img-link { text-align: center; position: relative; margin: 0 10px 20px 10px; } .search-results .img-link .title { font-size: 12px; margin: 5px 0 0 0; max-width: 65px; overflow: hidden; } .search-results .img-link .remove { position: absolute; top: -5px; right: -5px; cursor: pointer; display: block; width: 20px; height: 20px; background-repeat: no-repeat; background-size: contain; background-position: center; background-image: url("../media/icons/orange/bin_o.png"); } .search-results .img-link .user-pic-circle { margin: auto; } .result-search-text { font-size: 12px; } .ui-autocomplete .custom-list-item { display: flex; align-items: center; padding: 6px !important; } .ui-autocomplete .custom-list-item .initial { display: flex; align-items: center; justify-content: center; height: 20px; width: 20px; font-weight: 600; font-size: 8px; border-radius: 50%; background-color: var(--initial-color, #ff9551); border: 1px solid var(--initial-color, #ff9551); color: #fff; margin-right: 8px; } .ui-autocomplete .custom-list-item .initial.bordered { background-color: #fff; border: 1px solid #ff9551; color: #ff9551; } .ui-autocomplete .custom-list-item .group { font-weight: 600; } .ui-autocomplete .custom-list-item .group:before { content: "-"; font-weight: normal; margin: 0 10px; } .ui-autocomplete .custom-list-item .tag { margin: auto 0 auto auto; font-size: 10px; padding: 1px 4px; background: #F8F8F8; border-radius: 5px; } /* * User pic circle * * Author: Thibaud Magniez */ .user-pic-circle { display: flex !important; align-items: center; justify-content: center; width: 40px; height: 40px; font-size: 16px; border-radius: 50%; background: var(--user-color, #ff9551); border: 1px solid #fff; color: #fff; font-weight: 400; margin: 0; overflow: hidden; } .user-pic-circle img { width: 100%; height: -moz-fit-content; height: fit-content; } .user-pic-circle.medium { width: 32px; height: 32px; font-size: 11px; } .user-pic-circle.small { width: 25px; height: 25px; font-size: 9px; } .user-pic-circle.more-item { position: relative; font-weight: 400; font-size: 13px; } .user-pic-circle.bordered { background: #fff; border: 1px solid #ff9551; color: #ff9551; } .user-pic-circle.inactive { background-color: #c9c9c9 !important; background-repeat: no-repeat; background-size: contain; background-position: center; background-image: url("../media/icons/inactive.png"); } figure.user-pic-circle { background: #fff; } /** Calendar **/ .calendar-options { display: flex; justify-content: space-between; margin-bottom: 25px; } .calendar-options a:not(.btn) { color: #222a40; } .calendar-options a.btn i { color: #fff; } @media screen and (max-width: 768px) { .calendar-options { gap: 10px; margin-top: 25px; margin-bottom: 0; } .calendar-options a.btn { margin: 0; text-transform: capitalize; font-size: 12px; } .calendar-options a.btn i { margin-right: 5px; } } /** Btn options **/ .calendar-btn { background-color: #303e50; color: #fff; font-size: 11px; padding: 4px 8px; } .calendar-btn.active, .calendar-btn:hover { background-color: #1a252f; color: #fff; } .calendar-btn.has-radius { border-radius: 4px; } .custom_calendar .fc-header-toolbar .fc-toolbar-chunk { display: flex; align-items: center; } @media (max-width: 768px) { .custom_calendar .fc-header-toolbar { flex-wrap: wrap; } .custom_calendar .fc-header-toolbar .fc-toolbar-title { margin: 0 0 10px 0; } .custom_calendar .fc-header-toolbar .fc-toolbar-chunk .fc-button-group { margin: 5px 0; } } .custom_calendar .fc-header-toolbar .fc-toolbar-title { font-size: 17px; text-transform: capitalize; } .custom_calendar .fc-header-toolbar .fc-button { font-size: 11px; } .custom_calendar .fc-view-harness { font-size: 12px; } .custom_calendar .fc-event { cursor: pointer; } .custom_calendar .fc-event[data-meeting] .fc-event-title { color: #222A40; } .custom_calendar .fc-event.fc-bg-event { opacity: 1; } .custom_calendar .fc-event .fc-event-main { display: flex; flex-wrap: wrap; padding: 5px 0 0 0; overflow: hidden; height: auto; } .custom_calendar .fc-event .fc-event-main .fc-event-title, .custom_calendar .fc-event .fc-event-main .fc-event-time { font-size: 10px; margin-left: 10px; } .custom_calendar .fc-event .fc-event-main .fc-event-title { margin-left: 10px; } .custom_calendar table { overflow: hidden; } .custom_calendar table .fc-col-header-cell a { color: #222a40; } .custom_calendar table td.fc-day a { color: #222a40; } .custom_calendar table td.fc-day.day-off { background-color: #eeeeee; } .custom_calendar table td .fc-timegrid-slot-label-frame { text-align: center; } .custom_calendar table colgroup { background: #fff; } .custom_calendar .fc-dayGridMonth-view .fc-daygrid-day:not(.fc-day-today):not(.day-off) { background-color: #fff; } .custom_calendar .fc-dayGridMonth-view .fc-daygrid-day-frame { min-height: 95px; height: 100%; } .custom_calendar .fc-daygrid-day-frame .fc-daygrid-bg-harness { position: initial; } .custom_calendar .fc-daygrid-day-frame .fc-daygrid-bg-harness .fc-event { position: initial; } .custom_calendar .fc-view:not(.fc-dayGridMonth-view) .fc-day-today { background: transparent; } .custom_calendar .fc-view { background-color: #FFFFFF; } .custom_calendar .fc-timeGridWeek-view .fc-event, .custom_calendar .fc-timeGridDay-view .fc-event { overflow: hidden; } .custom_calendar .fc-timeGridWeek-view .fc-event .fc-event-main, .custom_calendar .fc-timeGridDay-view .fc-event .fc-event-main { padding: 0; } .custom_calendar .fc-timeGridWeek-view .fc-event .fc-event-main .fc-daygrid-event-dot, .custom_calendar .fc-timeGridDay-view .fc-event .fc-event-main .fc-daygrid-event-dot { display: none; } .custom_calendar .fc-timegrid-now-indicator-line { border-color: #ff9551; } .custom_calendar .fc-timegrid-now-indicator-arrow { border-color: #ff9551; border-top-color: transparent; border-bottom-color: transparent; } .export-calendar-to-pdf { cursor: pointer; } .export-calendar-to-pdf.loading { cursor: default; } /** * Flatpickr * */ .flatpickr-calendar { font-size: 13px !important; } .flatpickr-calendar .flatpickr-months { margin: 10px 0 15px 0; } .flatpickr-calendar .flatpickr-prev-month, .flatpickr-calendar .flatpickr-next-month { top: 5px !important; } .flatpickr-calendar.inline { width: 100%; max-height: 285px !important; overflow: hidden; } .datepicker-inline { background-color: #fff; padding: 8px; width: 100% !important; margin: 0 !important; font-size: 12px; } .datepicker-inline .datepicker-switch { text-transform: capitalize; } .datepicker-inline .table-condensed { width: 100%; } .scheduler-full-height:not(.block-mode-fullscreen) { height: calc(100vh - 180px); margin-bottom: 0; } @media screen and (max-width: 768px) { .scheduler-full-height:not(.block-mode-fullscreen) { height: 100vh; } } .scheduler-full-height:not(.block-mode-fullscreen) .block-content { height: 100%; } .scheduler-full-height:not(.block-mode-fullscreen) .block-content .scheduler-container { height: calc(100% - 50px); } @media screen and (max-width: 768px) { .scheduler-full-height:not(.block-mode-fullscreen) .block-content .scheduler-container { height: 100%; padding-bottom: 245px; } } .scheduler-full-height.screen-landscape { height: -moz-fit-content !important; height: fit-content !important; } .scheduler-full-height.block-mode-fullscreen .block-content { height: calc(100% - 85px); } .scheduler-full-height.block-mode-fullscreen .block-content .scheduler-container { height: calc(100% - 60px); } .scheduler-full-height.block-mode-fullscreen .block-content .scheduler-container .scroll-buttons { z-index: 1036; } @media screen and (max-width: 768px) { .scheduler-full-height.block-mode-fullscreen .block-content .scheduler-container { padding-bottom: 125px; } } .scheduler-full-height.block-mode-fullscreen .multiselect-container.dropdown-menu { z-index: 1037; } .scheduler-container { position: relative; min-height: 80px; /* Cells for absences */ } .scheduler-container .scroll-buttons { position: absolute; background-color: #F8F8F8; z-index: 99; top: 0; left: 0; padding: 15px; display: flex; align-items: center; justify-content: center; } .scheduler-container .scroll-buttons span { display: flex; align-items: center; justify-content: center; background-color: #fff; border: 1px solid #e6e6e6; color: #ff9551; border-radius: 50%; min-height: 30px; min-width: 30px; cursor: pointer; } .scheduler-container .scroll-buttons span:first-child { margin-right: 10px; } .scheduler-container .scroll-buttons span:hover { color: #fff; background-color: #ff9551; } .scheduler-container .scheduler_default_matrix .scheduler_default_cell.resource_off { background-color: #e4e4e4; } .scheduler-container .scheduler_default_matrix_vertical_break { display: none; } .scheduler-container.zoom_level_0 .scheduler_default_matrix .scheduler_default_cell.resource_off { position: relative; background-color: #fff; } .scheduler-container.zoom_level_0 .scheduler_default_matrix .scheduler_default_cell.resource_off:before { content: ""; display: block; margin: 0 auto; height: 100%; width: 2px; background-color: #e4e4e4; border-right: 1px solid #d6d6d6; border-left: 1px solid #d6d6d6; } #dp-scheduler { /** Years & Months **/ /** Days / Time heading */ /** Divider under the date heading **/ /** Left columns : Header **/ /** Horizontal divider for rows **/ /** Vertical divider for rows **/ /* Event */ /* Scrollbar */ /* Message */ /* Cells */ } #dp-scheduler.scheduler_default_main { border-color: transparent; } #dp-scheduler .scheduler_default_timeheadergroup { background-color: #fff; font-weight: 600; /* Text color */ } #dp-scheduler .scheduler_default_timeheadergroup div:first-letter { text-transform: uppercase; } #dp-scheduler .scheduler_default_timeheadergroup .scheduler_default_timeheadergroup_inner { border-color: #f8f8f8; } #dp-scheduler .scheduler_default_timeheadergroup .scheduler_default_timeheadergroup_inner.scheduler_default_timeheader_cell_inner { background-color: #222a40; } #dp-scheduler .scheduler_default_timeheadergroup .scheduler_default_timeheader_float_inner { color: #fff; } #dp-scheduler .scheduler_default_timeheadergroup .scheduler_default_timeheader_cell_inner { color: #fff; } #dp-scheduler .scheduler_default_timeheadercol { background-color: #fff; } #dp-scheduler .scheduler_default_timeheadercol .scheduler_default_timeheadercol_inner, #dp-scheduler .scheduler_default_timeheadercol .scheduler_default_timeheader_float { border-color: #f8f8f8; color: #222a40; font-weight: 500; } #dp-scheduler .scheduler_default_divider_horizontal { background-color: #f8f8f8; } #dp-scheduler .scheduler_default_corner { background-color: transparent; } #dp-scheduler .scheduler_default_corner .scheduler_default_corner_inner { border-color: #f8f8f8; } #dp-scheduler .scheduler_default_divider_horizontal { background-color: #f8f8f8; height: 2px !important; } #dp-scheduler .scheduler_default_rowheader_scroll { /** Divider for the heading left column **/ } #dp-scheduler .scheduler_default_rowheader_scroll .scheduler_default_rowheader:not(:empty) { background-color: #fff; } #dp-scheduler .scheduler_default_rowheader_scroll .scheduler_default_rowheader:not(:empty) .scheduler_default_rowheader_inner { border-color: #f8f8f8; } #dp-scheduler .scheduler_default_rowheader_scroll .scheduler_default_rowheader:not(:empty) .scheduler_default_rowheader_inner_text .user_title { display: flex; align-items: center; } #dp-scheduler .scheduler_default_rowheader_scroll .scheduler_default_rowheader:not(:empty) .scheduler_default_rowheader_inner_text .user_title .icon { display: flex; align-items: center; justify-content: center; height: 30px; width: 30px; border-radius: 50%; color: #fff; background: var(--user-color, #ff9551); font-weight: 600; margin-right: 10px; } #dp-scheduler .scheduler_default_rowheader_scroll .scheduler_default_rowheader:not(:empty) .scheduler_default_rowheader_inner_text .user_title .title { font-weight: 400; } #dp-scheduler .scheduler_default_rowheader_scroll .scheduler_default_resourcedivider { border-bottom: 3px solid #f8f8f8 !important; } #dp-scheduler .scheduler_default_matrix_horizontal_line { height: 2px !important; background-color: #f8f8f8 !important; } #dp-scheduler .scheduler_default_matrix_vertical_line { background-color: #f8f8f8 !important; } #dp-scheduler .scheduler_default_divider.scheduler_default_splitter { background-color: #f8f8f8; } #dp-scheduler .scheduler_default_event { /*overflow: unset !important;*/ } #dp-scheduler .scheduler_default_event .scheduler_default_event_inner { border: none; padding: 0 8px; font-size: 12px; border-radius: 8px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: grid; } #dp-scheduler .scheduler_default_scrollable::-webkit-scrollbar { height: 10px; width: 10px; } #dp-scheduler .scheduler_default_scrollable::-webkit-scrollbar-thumb { background-color: #ff9551; } #dp-scheduler .scheduler_default_message { display: flex; align-items: center; justify-content: center; background-color: #ff9551; min-height: 25px; font-size: 14px; opacity: 1; color: #000; } #dp-scheduler .scheduler_default_message .separator { margin: 0 10px; } #dp-scheduler .scheduler_default_matrix .scheduler_default_cell { cursor: pointer; } #dp-scheduler .event-item { background-color: #00C4A6; border-radius: 8px; } #dp-scheduler .event-item .scheduler_default_event_inner { background: transparent !important; } #dp-scheduler .absence-item { background-color: #e4e4e4; border-radius: 8px; font-weight: 600; } #dp-scheduler .absence-item .scheduler_default_event_inner { background: transparent !important; } #dp-scheduler .has-icon .scheduler_default_event_inner { padding-right: 24px; } #dp-scheduler .default-cursor { cursor: default !important; } .scheduler-options { display: flex; align-items: center; justify-content: space-between; margin-bottom: 40px; } .scheduler-options .actions-btn { display: flex; justify-content: space-between; align-items: center; margin: auto 0 2px auto; } @media screen and (min-width: 800px) and (max-width: 950px) { .scheduler-options .actions-btn { margin-top: 20px !important; margin-left: 0 !important; } } .scheduler-options #dp-scheduler-zoom-controls { display: flex; align-items: center; justify-content: stretch; border-radius: 4px; overflow: hidden; } .scheduler-options a.export { color: #000; } .scheduler-options a.export i { margin-right: 5px; } .scheduler-options a.export:hover { color: #ff9551; } .bubble_default_main { z-index: 1040 !important; } .navigation-container { position: relative; margin-right: 30px; } .navigation-container .toggle-navigation { cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none; font-size: 13px; } .navigation-container .toggle-navigation i { margin-right: 5px; } .navigation-container .toggle-navigation:hover { color: #ff9551; } .navigation-container .calendar { position: absolute; z-index: 999; margin-top: 10px; left: 0; } .navigation-container .calendar.hidden { display: none; } #calendar-nav, #scheduler-nav { /* Title */ } #calendar-nav .navigator_default_title, #calendar-nav .navigator_default_titleleft, #calendar-nav .navigator_default_titleright, #scheduler-nav .navigator_default_title, #scheduler-nav .navigator_default_titleleft, #scheduler-nav .navigator_default_titleright { background-color: #222a40; color: #fff; } #calendar-nav .navigator_default_title, #scheduler-nav .navigator_default_title { font-weight: 600; } #calendar-nav .navigator_default_title:first-letter, #scheduler-nav .navigator_default_title:first-letter { text-transform: uppercase; } #calendar-nav .navigator_default_select .navigator_default_daybox.navigator_default_cell_box, #scheduler-nav .navigator_default_select .navigator_default_daybox.navigator_default_cell_box { background-color: #ff9551; } #calendar-nav .navigator_default_select .navigator_default_todaybox, #scheduler-nav .navigator_default_select .navigator_default_todaybox { background-color: #ff9551; opacity: 1; border-color: #ff9551; } /** Home **/ /** Main **/ #home-content h1 { font-size: 22px; color: #2b3e71; font-weight: 400; text-transform: capitalize; } #home-content h1 strong { margin-left: 5px; text-transform: initial; } @media screen and (min-width: 767px) { #home-content .widgets-list .widget-container:nth-child(1) .widget-home, #home-content .widgets-list .widget-container:nth-child(4) .widget-home, #home-content .widgets-list .widget-container:nth-child(5) .widget-home, #home-content .widgets-list .widget-container:nth-child(8) .widget-home, #home-content .widgets-list .widget-container:nth-child(9) .widget-home, #home-content .widgets-list .widget-container:nth-child(12) .widget-home { background: #e7eaf3; } #home-content .widgets-list .widget-container:nth-child(1) .widget-home .title i, #home-content .widgets-list .widget-container:nth-child(4) .widget-home .title i, #home-content .widgets-list .widget-container:nth-child(5) .widget-home .title i, #home-content .widgets-list .widget-container:nth-child(8) .widget-home .title i, #home-content .widgets-list .widget-container:nth-child(9) .widget-home .title i, #home-content .widgets-list .widget-container:nth-child(12) .widget-home .title i { background-color: #222a40; } } @media screen and (max-width: 767px) { #home-content .widgets-list .widget-container:nth-child(odd) .widget-home { background: #e7eaf3; } #home-content .widgets-list .widget-container:nth-child(odd) .widget-home .title i { background-color: #222a40; } } /** Widget **/ .widget-home { padding-top: 25px; padding-bottom: 15px; } .widget-home .w-title { display: flex; justify-content: space-between; align-items: center; margin: 0 0 25px 0; font-size: 14px; } .widget-home .w-title .title i { margin-right: 5px; display: inline-flex; align-items: center; justify-content: center; height: 30px; width: 30px; border-radius: 8px; background-color: #ff9551; color: #fff; } .widget-home .w-title .abs-dropdown { position: absolute; right: 40px; top: 35px; } .widget-home .w-title a { font-weight: 400; color: #222a40; } .widget-home .w-title a i { margin-left: 5px; font-size: 11px; } .widget-home .w-title a.dropdown-item { font-size: 12px; } .widget-home .block-content { padding-top: 0; padding-bottom: 0; } .widget-home .block-content:not(:last-child) { margin-bottom: 13px; } .widget-home .block-body { min-height: 275px; max-height: 275px; overflow-y: auto; } .widget-home .block-body.is-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; } @media screen and (max-width: 767px) { .widget-home .block-body.is-empty { min-height: auto; } } .widget-home .block-body.is-empty .empty-text { display: block; width: 100%; text-align: center; } .widget-home .table-container { overflow-x: unset; padding-bottom: 0; } .widget-home .table-container .dd-item .dd-handle { height: 100%; max-height: unset; margin-bottom: 0; } .widget-home .ekip-simple-table tbody td { font-size: 12px !important; font-weight: 500; } .widget-home.absences .user-badge { background-color: var(--user-bg-color, #F8F8F8); color: var(--user-color, #222a40); } .widget-home.tasks-small-table .dd-item .dd-handle .name { order: 1; } .widget-home.tasks-small-table .dd-item .dd-handle .state { order: 2; max-width: none; border-radius: 0; display: flex; justify-content: center; align-items: center; max-width: none; } .widget-home.tasks-small-table .dd-item .dd-handle .state .state-badge { max-width: -moz-fit-content; max-width: fit-content; font-weight: 500; } .widget-home.tasks-small-table .dd-item .dd-handle .dates { order: 3; } .notepad-grid { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 15px; overflow: hidden; } .notepad-grid .grid-item { position: relative; width: 100%; } .notepad-grid .grid-item .delete-notepad, .notepad-grid .grid-item .save-in-todolist { position: absolute; top: 0; right: 8px; padding: 10px; font-size: 10px; } .notepad-grid .grid-item .delete-notepad:hover, .notepad-grid .grid-item .save-in-todolist:hover { color: #ff9551; } .notepad-grid .grid-item .save-in-todolist { right: 25px; } /** Folder **/ .project-search { max-width: 450px; } .folders-search { max-width: 400px; margin: 0 0 25px 0; } #archives-table td { padding: 12px; } .folders-list { display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 15px 20px; padding: 1rem 0.625rem; list-style-type: none; max-width: 450px; /***** Large *****/ } @media (max-width: 991px) { .folders-list { grid-template-columns: repeat(3, 1fr); } } .folders-list li { padding: 0; text-align: center; cursor: pointer; font-size: 11px; line-height: 13px; color: #737373; } .folders-list li a { position: relative; display: flex; flex-direction: column; align-items: center; height: 100%; width: 100%; color: inherit; } .folders-list li figure { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: #fff; border-radius: 10px; margin: 0 auto 8px auto; overflow: hidden; position: relative; z-index: -1; } .folders-list li figure img { width: auto; height: 100%; } .folders-list li figure.default { padding: 10px; } .folders-list li span { max-height: 25px; display: block; position: relative; z-index: -1; max-width: 87px; overflow-wrap: break-word; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; /* number of lines to show */ line-clamp: 2; -webkit-box-orient: vertical; } .folders-list li.active { color: #ff9551; } .folders-list li.active figure { border: 2px solid #ff9551; } .folders-list li .toggle-favorite { position: absolute; display: none; height: 18px; width: 18px; top: -5px; right: 5px; z-index: 99; } @media (max-width: 767px) { .folders-list li .toggle-favorite { display: block !important; } } .folders-list li .toggle-favorite i { font-size: 15px; } .folders-list li :hover .toggle-favorite { display: block; } .folders-list li.open-folder-modal .fa-plus { display: block; height: 48px; font-size: 22px; line-height: 48px; } .folders-list.large { max-width: none; grid-template-columns: repeat(7, max-content); justify-content: space-between; } .folders-list.large li { z-index: 99; max-width: 75px; } .folders-list.large figure { height: 75px; width: 75px; } .folders-list.large span.title { margin-top: 15px; font-size: 13px; } .folders-list.large span.toggle-favorite { right: -5px; } @media (max-width: 768px) { .btn-orange.create-folder { margin: 10px 0 20px 0; } } #project-resume-container { display: flex; align-items: flex-start; background-color: #e7eaf3; font-size: 13px; font-family: inherit; padding: 20px 32px; border-radius: 18px; overflow: hidden; } #project-resume-container .detail-container { flex-grow: 1; position: relative; height: 80px; } #project-resume-container .detail-container .head-title { display: block; font-weight: 600; font-size: 14px; color: #222a40; margin-bottom: 12px; } #project-resume-container .detail-container.dates-container .badge { width: 110px; background-color: #fff; color: #ff9551; font-weight: 500; font-size: 13px; padding: 14px 0px; border-radius: 10rem; } #project-resume-container .detail-container.dates-container .badge:first-child { margin-right: 10px; } #project-resume-container .detail-container.progress-container .progress { background: #fff !important; height: 6px; width: 100%; max-width: 180px; } #project-resume-container .detail-container.progress-container .progress-bar-orange { background-color: #ff9551 !important; border-radius: 0.3rem; } #project-resume-container .detail-container:not(:first-child):before { content: ""; display: block; position: absolute; top: 0; left: -15%; height: 100%; width: 1.5px; background: #fff; opacity: 0.7; } #project-resume-container .img-group { display: flex; justify-content: flex-start; align-items: center; align-content: center; padding-top: 0px !important; } #project-resume-container .img-group .img-avatar40 { height: 40px; width: 40px; border: 2px solid #E7EAF3; } #project-resume-container .orange-text { font-size: 13px; font-weight: bold; color: #ff9551; } @media (max-width: 768px) { #project-resume-container .detail-container:not(:first-child):before { display: none; } } @media (max-width: 1100px) { #project-resume-container { flex-direction: column; justify-content: space-between; padding: 2rem !important; align-items: flex-start !important; height: 100% !important; width: auto !important; } #project-resume-container .detail-container { max-width: 100% !important; margin: 10px 0; } } ul.nav-tabs.nav-tabs-alt { border-bottom: 1px solid #e7eaf3; } ul.nav-tabs.nav-tabs-alt li a { padding: 12px 16px 16px 16px; color: #222a40; font-weight: 500; font-size: 13px; height: 100%; margin: 0; border-radius: 0; box-shadow: inset 0 -2px transparent; width: 135px; cursor: pointer; background: transparent; } ul.nav-tabs.nav-tabs-alt li a.disabled { color: #c5c5c5; } ul.nav-tabs.nav-tabs-alt li a.active, ul.nav-tabs.nav-tabs-alt li a:not(.disabled):hover, ul.nav-tabs.nav-tabs-alt li a:not(.disabled):focus { box-shadow: inset 0 -2px #ff9551; color: #ff9551; } /** * Form style * * Author : Thibaud Magniez */ .task-form .breadcrumb-task a { color: #404040; } @media screen and (max-width: 767px) { .task-form .save-form-container { flex-direction: column; } .task-form .save-form-container .btn-submit { margin: 25px auto 0 0; } } .task-form .task-states-container { position: relative; overflow-x: auto; width: auto; max-width: 550px; } .task-form .task-states-container #task-states { overflow: auto; position: initial; background-color: transparent; } .task-form .task-states-container #task-states::-webkit-scrollbar { width: 4px; height: 4px; } .task-form .task-states-container #task-states::-webkit-scrollbar-thumb { background-color: #ff9551; } .task-form .task-states-container #task-states label { min-width: -moz-fit-content; min-width: fit-content; } .task-form .task-states-container #task-states label:not(:last-child) { margin-right: 10px; } .task-form .task-states-container #task-states.ekip-radio { background-color: transparent; } .task-form .task-states-container #task-states.ekip-radio .label { overflow: hidden; text-wrap: nowrap; padding: 0.5px 5px; font-weight: 500; font-size: 11px; } .task-form .task-states-container #task-states.ekip-radio input:disabled + .label { background-color: #999999; color: #f1f1f1; } .task-form .task-states-container .empty-state { font-size: 13px; } .task-form .task-states-container .empty-state a { font-weight: 600; color: #ff9551; } .task-form .change-task-group-state .fa { font-size: 11px; } .task-form .ekip-form-row { display: flex; } .task-form .ekip-form-row .ekip-form-col.grow { flex-grow: 1; } .task-form .ekip-form-row .ekip-form-col.small { flex-basis: 158px; } .task-form span.btn-icon { display: flex; align-items: center; justify-content: center; font-size: 17px; color: #222a40; background: #fff; border-radius: 50%; max-height: 35px; min-height: 35px; max-width: 35px; min-width: 35px; cursor: pointer; } .task-form span.btn-icon:not(:last-child) { margin-right: 25px; } .task-form .task-form-btn-group { display: flex; margin: 0; width: 100%; height: 100%; align-items: center; justify-content: flex-start; } .task-form .task-form-btn-group.ekip-row { flex-direction: column; padding: 0 20px 0 0; } .task-form .task-form-btn-group.ekip-row .item { display: flex; align-items: center; justify-content: flex-start; cursor: pointer; width: 100%; } .task-form .task-form-btn-group.ekip-row .item:first-child { margin-top: 25px; } .task-form .task-form-btn-group.ekip-row .item figure, .task-form .task-form-btn-group.ekip-row .item .icon-group { background: #fff; height: 35px; width: 35px; min-width: 35px; min-height: 35px; display: flex; align-items: center; justify-content: center; border-radius: 50%; margin: auto 15px auto 0; } .task-form .task-form-btn-group.ekip-row .item figure img, .task-form .task-form-btn-group.ekip-row .item .icon-group img { height: 13px; } .task-form .task-form-btn-group.ekip-row .item span, .task-form .task-form-btn-group.ekip-row .item label { color: #a7a7a7; font-size: 11px; } .task-form .task-form-btn-group.ekip-row .item label { margin-left: 8px; padding-left: 18px; } /***** Comments *****/ #task-comments #comments-list { max-height: 450px; overflow-y: auto; padding-right: 10px; } #task-comments #comments-list::-webkit-scrollbar { width: 2px; height: 2px; } #task-comments .comment-item { display: flex; } #task-comments .comment-item .profile-item { margin: 0 15px 0 0; } @media (max-width: 768px) { #task-comments .comment-item .profile-item .user-pic-circle { height: 30px; width: 30px; font-size: 12px; } } #task-comments .comment-item:last-child .content-item.comment { margin-bottom: 0; } #task-comments .comment-item .content-item { width: 100%; margin-bottom: 10px; } #task-comments .comment-item .content-item.comment { margin-bottom: 25px; } #task-comments .comment-item .content-item.comment .content-title { display: flex; font-size: 13px; color: #525252; margin-bottom: 5px; } #task-comments .comment-item .content-item.comment .content-title .name { font-weight: 500; } #task-comments .comment-item .content-item.comment .content-title .date { color: #737373; font-size: 12px; } #task-comments .comment-item .content-item.comment .comment-text { font-size: 13px; color: #1b2932; } #task-comments .comment-item .content-item.comment .comment-text p { margin: 0; } #task-comments .comment-item .content-item.comment .comment-text p:last-child { margin: 0; } #task-comments .comment-item .content-item.comment .comment-text span.mention { color: #ff9551; font-weight: 500; } #task-comments .btn-container { display: flex; justify-content: flex-end; margin-top: 15px; } #task-comments .btn-container .btn { font-weight: 400; font-size: 13px; } .files-table { overflow: hidden; } .files-table thead { font-size: 13px; } .files-table thead td:last-child { width: 100px; } .files-table tbody { font-size: 11px; } .files-table tbody td { padding: 5px; } .files-table tbody td a { display: block; color: #222a40; text-overflow: ellipsis; overflow: hidden; max-width: 250px; white-space: nowrap; } .files-table tbody td:last-child { width: 100px; } .files-table tbody button { font-size: 10px; padding: 2px 6px; } @media (max-width: 768px) { .ekip-form-row { flex-wrap: wrap; } .ekip-form-row .ekip-form-col { flex-basis: 100% !important; padding: 0 10px; } .task-form-btn-group.ekip-row { flex-direction: row !important; align-items: center; flex-wrap: wrap; } .task-form-btn-group.ekip-row .item { flex-basis: 50%; margin: 0 !important; } } /** * Accordion style * * Author : Thibaud Magniez */ .ekip-accordion .block-rounded { background: #F8F8F8; border-radius: 18px; box-shadow: none; margin-bottom: 10px !important; } .ekip-accordion .block-rounded .block-header { background: #F8F8F8; padding: 20px 30px; border-radius: 18px; } .ekip-accordion .block-rounded .block-header a { display: flex; align-items: center; color: #2b3e71; font-weight: 600; font-size: 15px; letter-spacing: 0px; } .ekip-accordion .block-rounded .block-header a .fa-chevron-down { background: #2b3e71; height: 18px; width: 18px; font-size: 9px; color: #fff; border-radius: 50%; text-align: center; line-height: 19px; margin-right: 10px; } .ekip-accordion .block-rounded .block-header a .edit { margin-left: 20px; font-size: 12px; } .ekip-accordion .block-rounded .block-header a .edit-input { background: transparent; border: 1px solid #222a40; border-radius: 5px; color: #222a40; display: none; max-height: 22px; } .ekip-accordion .block-rounded .block-header a.edit-mode .edit-input { display: block; } .ekip-accordion .block-rounded .block-header a.edit-mode .name { display: none; } .ekip-accordion .block-rounded .block-header .dropdown-options .dropdown-item { font-size: 13px; font-weight: 400; } .ekip-accordion .block-rounded .block-header span.delete-group, .ekip-accordion .block-rounded .block-header span.duplicate-group { display: flex; align-items: center; justify-content: center; color: #fff; width: 20px; height: 20px; border-radius: 50%; background: #e04f1a; font-weight: bold; font-size: 10px; padding-top: 2px; cursor: pointer; } .ekip-accordion .block-rounded .block-header span.delete-group:hover, .ekip-accordion .block-rounded .block-header span.duplicate-group:hover { background: #ff9551; } .ekip-accordion .block-rounded .block-header span.duplicate-group { background: #ff9551; } .ekip-accordion .block-rounded .block-header span.delete-group { margin: 0 10px 0 auto; } .ekip-accordion .block .block-header a .fa-chevron-down { transform: rotate(180deg); } .ekip-accordion .block .block-header a.collapsed .fa-chevron-down { transform: rotate(0deg); } .ekip-accordion .add-task { display: block; font-size: 13px; letter-spacing: 0px; color: #2b3e71; font-weight: 500; margin: 35px 0 15px 10px; border: none; background-color: transparent; } /** * Table style * * Author : Thibaud Magniez */ .task-table-container.locked .task-table-item .edit { cursor: not-allowed; } .task-table-container.locked .task-table-item .edit .task-options .dropdown-menu { display: none !important; } .task-table-container .table-container { max-width: 100%; padding-bottom: 5px; overflow-y: hidden; } .table-container.no-overflow { overflow-x: unset; } .table-container ol { list-style-type: none; margin: 0; padding: 0; } .table-container ol li { margin: 0; padding: 0; font-size: initial; min-height: initial; line-height: initial; } .table-container .dd { max-width: initial; font-size: initial; line-height: initial; padding: initial; margin: initial; } @media (max-width: 850px) { .sortable-table { overflow-y: scroll; } } .sortable-table .table-row, .dd-dragel .table-row { display: flex !important; gap: 3px; } .sortable-table .table-row .cell-content[data-type=textarea] p, .dd-dragel .table-row .cell-content[data-type=textarea] p { margin: 0; } .sortable-table .table-row.dd-handle, .dd-dragel .table-row.dd-handle { cursor: pointer; height: 55px; max-height: 55px; padding: 2px 0; border: none; font-weight: initial; color: initial; margin: 0; background: initial; } .sortable-table .table-row .state-badge, .dd-dragel .table-row .state-badge { font-weight: 400; background-color: var(--state-color); } .sortable-table .table-row .has-left-border:before, .dd-dragel .table-row .has-left-border:before { content: ""; display: block; float: left; height: 15px; min-width: 3px; max-width: 3px; border-radius: 5px; margin-right: 10px; background-color: var(--state-color); } .sortable-table .table-row figure, .dd-dragel .table-row figure { display: inline; margin: auto; } .sortable-table .table-row figure img, .dd-dragel .table-row figure img { height: 36px; width: 36px; border: 2px solid #E7EAF3; } .sortable-table .table-row .table-cell .cell-content, .dd-dragel .table-row .table-cell .cell-content { display: flex; align-items: center; color: #2b3e71; font-weight: 500; border-top: none; font-size: 12px; padding: 0 12px; background: #fff; height: 100%; overflow-wrap: anywhere; overflow-y: hidden; } .sortable-table .table-row .table-cell .cell-content .state-badge, .dd-dragel .table-row .table-cell .cell-content .state-badge { color: var(--text-color, #fff); } .sortable-table .table-row .table-cell:not(.hidden):first-child .cell-content, .dd-dragel .table-row .table-cell:not(.hidden):first-child .cell-content { border-top-left-radius: 5px; border-bottom-left-radius: 5px; } .sortable-table .table-row .table-cell:not(.hidden):last-child .cell-content, .dd-dragel .table-row .table-cell:not(.hidden):last-child .cell-content { border-top-right-radius: 5px; border-bottom-right-radius: 5px; } .sortable-table .table-row .table-cell.cell-auto, .dd-dragel .table-row .table-cell.cell-auto { flex: 1; } .sortable-table .table-row .table-cell.cell-60px, .dd-dragel .table-row .table-cell.cell-60px { flex: 0 0 60px; min-width: 60px; max-width: 60px; } .sortable-table .table-row .table-cell.cell-100px, .dd-dragel .table-row .table-cell.cell-100px { flex: 0 0 100px; min-width: 100px; max-width: 100px; } .sortable-table .table-row .table-cell.cell-115px, .dd-dragel .table-row .table-cell.cell-115px { flex: 0 0 115px; min-width: 115px; max-width: 115px; } .sortable-table .table-row .table-cell.cell-150px, .dd-dragel .table-row .table-cell.cell-150px { flex: 0 0 150px; min-width: 150px; max-width: 150px; } @media (max-width: 850px) { .sortable-table .table-row .hide-m, .dd-dragel .table-row .hide-m { display: none !important; } } .sortable-table .table-header .table-cell, .dd-dragel .table-header .table-cell { color: #737373; height: auto; font-weight: 600; font-size: 12px; padding-bottom: 15px; } .sortable-table .table-body .dd-list, .dd-dragel .table-body .dd-list { padding-left: 15px !important; } .sortable-table .task-options a, .dd-dragel .task-options a { font-size: 13px; } .ui-state-highlight { height: 2em !important; } @media (max-width: 1550px) { .img-group { display: flex; justify-content: center; align-items: center; align-content: center; padding-top: 8px !important; } } /** Report **/ #drag-and-drop-grid { margin: 0; padding: 0; list-style: none; -webkit-user-select: none; -moz-user-select: none; user-select: none; display: grid; grid-gap: 15px; grid-template-rows: repeat(5, auto); grid-template-columns: repeat(4, 1fr); grid-auto-flow: row dense; } #drag-and-drop-grid:not(.disabled) .drag-item { cursor: move; } #drag-and-drop-grid .h1w1 { grid-area: span 1/span 1; } #drag-and-drop-grid .h1w2 { grid-area: span 1/span 2; } #drag-and-drop-grid .h1w3 { grid-area: span 1/span 3; } #drag-and-drop-grid .h1w4 { grid-area: span 1/span 4; } #drag-and-drop-grid .h2w1 { grid-area: span 2/span 1; } #drag-and-drop-grid .h2w2 { grid-area: span 2/span 2; } #drag-and-drop-grid .h2w3 { grid-area: span 2/span 3; } #drag-and-drop-grid .h2w4 { grid-area: span 2/span 4; } #drag-and-drop-grid .drag-item { display: flex; flex-direction: column; padding: 15px; font-size: 15px; margin: 0; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); background-color: #F8F8F8; border-radius: 8px; position: relative; } @media screen and (max-width: 965px) { #drag-and-drop-grid .drag-item { grid-area: span 1/span 4; } } #drag-and-drop-grid .drag-item.item-title .block-header .title-content { width: 100%; } #drag-and-drop-grid .drag-item.item-title .block-header .title-content * { margin: 0; padding: 0; } #drag-and-drop-grid .drag-item.item-title .block-header .title-content h2 { font-size: 25px; } #drag-and-drop-grid .drag-item.item-title .block-header .title-content h3 { font-size: 20px; } #drag-and-drop-grid .drag-item.item-title .block-header .title-content h4 { font-size: 18px; } #drag-and-drop-grid .drag-item .block-content { height: calc(100% - 40px); } #drag-and-drop-grid .drag-item .block-options { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 0 0 0 auto; } #drag-and-drop-grid .drag-item .block-options.floating { position: absolute; right: 25px; top: 20px; } #drag-and-drop-grid .drag-item .block-options button { padding: 0; } #drag-and-drop-grid .drag-item .block-options button i { font-size: 12px; } #drag-and-drop-grid .drag-item .description p:last-child { margin-bottom: 0; } #drag-and-drop-grid .drag-item .loading:after { top: 20px; } #drag-and-drop-grid .drag-item .chart { width: 100% !important; max-height: 155px !important; } #drag-and-drop-grid .drag-item .chart-number { display: flex; width: 100%; height: 100%; font-size: 2rem; justify-content: center; align-items: center; } #drag-and-drop-grid .drag-item.highlight { background-color: rgb(255, 240, 231); } #drag-and-drop-grid .drag-item.highlight * { background-color: transparent; } #drag-and-drop-grid .drag-item:not(.block-mode-fullscreen):hover { position: relative; /*z-index: 9;*/ } #drag-and-drop-grid .ghost { border: 1px dashed #000; background-color: #fff; } #drag-and-drop-grid .custom-drag-ghost { /* The original cloned element must not take place up in the page and must not be visible */ position: absolute; top: -99999px; left: -99999px; /* Just for appearance */ background-color: #edb458; border: 1px solid #e8871e; } #drag-and-drop-grid .hidden-drag-ghost { opacity: 0; } #drag-and-drop-grid .transition { transition: all 2s ease-out 0.5s; top: 0; } /** Report actions buttons **/ #report-actions-buttons { position: fixed; right: 25px; bottom: 380px; display: flex; gap: 10px; flex-direction: column; background: #F8F8F8; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); color: #fff; padding: 10px; border-radius: 8px; } #report-actions-buttons .open-report-item-modal { color: #fff; background: #1b2932; padding: 4px 6px; font-size: 13px; border-radius: 8px; cursor: pointer; } #report-actions-buttons .open-report-item-modal:hover { background: #ff9551; color: #fff; } #empty-report h1 { display: block; width: 100%; text-align: center; margin: 35px 0; } #empty-report .report-placeholder { display: block; width: 60%; margin: 0 auto; } @media screen and (max-width: 767px) { #empty-report .report-placeholder { width: 100%; } } #empty-report .report-placeholder img { width: 100%; } /** Settings **/ /** Organization Logo **/ .__organization_logo ._illustration_container { position: absolute; right: calc(45px + 1.25rem); top: 45px; } .__organization_logo ._illustration_container ._logo { background-color: #fff; border-radius: 50%; overflow: hidden; height: 100px; width: 100px; display: flex; justify-content: center; align-items: center; } @media (max-width: 768px) { .__organization_logo ._illustration_container ._logo { height: 100px; width: 100px; position: relative; left: 15px; top: 0; right: inherit; margin: 0.5rem 0 1.5rem; } } .__organization_logo ._illustration_container ._logo img { max-width: 100%; height: -moz-fit-content; height: fit-content; } .__organization_logo .__attachment { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; cursor: pointer; width: 100%; } .__organization_logo .__attachment figure { background: #fff; height: 35px; width: 35px; min-width: 35px; min-height: 35px; display: flex; align-items: center; justify-content: center; border-radius: 50%; margin: auto 15px auto 0; } .__organization_logo .__attachment figure img { height: 13px; } .__organization_logo .__attachment .label-file { cursor: pointer; } .words-wrapper { text-align: center; line-height: 1.06; letter-spacing: -0.02em; margin-top: 25px; } .words-wrapper .color-text { color: #ff9551; } .words-wrapper .words { display: flex; justify-content: center; height: 45px; position: relative; overflow: hidden; margin: 10px 0; } .words-wrapper .words .word { display: block; box-sizing: border-box; position: absolute; transform: translateY(100%); padding: 5px 0; font-size: 16px; } .words-wrapper .words .word:nth-child(odd) span { background: #ff9551; } .words-wrapper .words .word:nth-child(even) span { background: #222a40; } .words-wrapper .words .word span { display: block; color: #fff; padding: 8px; border-radius: 6px; } .words-wrapper .words .word[data-show] { transform: translateY(0); transition: 0.5s transform ease-in-out; } .words-wrapper .words .word[data-up] { transform: translateY(-100%); transition: 0.5s transform ease-in-out; } #groups-container { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 25px; } @media screen and (max-width: 767px) { #groups-container { grid-template-columns: 1fr; } } #groups-container .group-block { display: flex; flex-direction: column; background-color: #fff; border-radius: 5px; padding: 15px; height: 100%; overflow: hidden; } #groups-container .group-block .group-title { display: flex; align-items: center; justify-content: space-between; font-weight: 600; margin-bottom: 10px; cursor: pointer; } #groups-container .group-block ul { padding: 0; margin: 0 0 25px 0; list-style-type: none; } #groups-container .group-block ul li { padding: 0; font-size: 13px; } #groups-container .group-block .footer { display: flex; margin: auto 10px 0 0; } #plans { /** Plans Periods **/ /** Nav Pills **/ /** Tab content **/ } #plans .plans-period { border: 1px solid #e9e9e9; border-radius: 6px; padding: 5px; max-width: -moz-fit-content; max-width: fit-content; margin: auto auto 25px auto; } #plans .plans-period .btn { font-size: 14px; } #plans .plans-period .btn.active { background: #F8F8F8; } #plans .nav-pills .nav-item { margin-bottom: 20px; } #plans .nav-pills .nav-item .nav-link { display: flex; align-items: center; padding: 15px 25px; min-height: 100px; border: 1px dashed #bebebe; border-radius: 6px; font-weight: 500; color: #1b2932; /** Radio **/ /** Hover **/ /** Price **/ } #plans .nav-pills .nav-item .nav-link:before { content: ""; display: block; height: 20px; width: 20px; border-radius: 50px; background: #e9e9e9; margin: 0 20px 0 0; } #plans .nav-pills .nav-item .nav-link:hover { background: unset; } #plans .nav-pills .nav-item .nav-link.active, #plans .nav-pills .nav-item .nav-link.active:hover { background-color: #2b3e71; border: none; color: #fff; } #plans .nav-pills .nav-item .nav-link.active:before, #plans .nav-pills .nav-item .nav-link.active:hover:before { border: 5px solid #ff9551; } #plans .nav-pills .nav-item .nav-link .price { margin: 0 0 0 auto; font-size: 20px; } #plans .tab-content { background-color: #F8F8F8; padding: 25px; } #plans .tab-content h2 { font-size: 17px; } #plans .tab-content p.description { font-size: 13px; } #plans .tab-content ul.features { list-style-type: none; margin: 0; padding: 0; } #plans .tab-content ul.features li { display: flex; justify-content: space-between; align-items: center; margin: 5px 0; } #plans .tab-content ul.features li:after { display: flex; justify-content: center; align-items: center; height: 20px; width: 20px; border-radius: 50px; background-color: #dbdfe9; padding-top: 1px; color: #aaafbc; content: "\f00d"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 12px; } #plans .tab-content ul.features li.active:after { content: "\f00c"; background-color: #cff5d7; padding-top: 1px; color: #00a44e; } .form-saves p { font-size: 0.9rem; margin-bottom: 0.75rem; } /** Backup **/ #restoreBackupForm .valid-feedback { font-size: 15px; } /* Subtitle in template */ @media (max-width: 768px) { .__subtitle { padding: 0 1.25rem; } } /* Notifications Input spacing */ @media (max-width: 768px) { .custom-checkbox { margin-bottom: 1rem !important; } } /* Input Disabled */ .ekip-input-disabled { cursor: not-allowed; } .ekip-input-disabled input:disabled { background-color: #fff; cursor: not-allowed; } /* Table - All users */ @media (max-width: 768px) { .__all_users .table-container { padding-left: 0.4375rem !important; padding-right: 0.4375rem !important; margin-left: 0 !important; margin-right: 0 !important; overflow: visible; } } .__all_users .flex-table { grid-template-columns: 2fr 1fr; } @media (max-width: 768px) { .__all_users .flex-table { grid-template-columns: 1fr; grid-gap: 0 !important; flex-direction: column; } } @media (max-width: 768px) { .__all_users .flex-table.header .flex-row:not(:first-of-type) { display: none; } } @media (max-width: 768px) { .__all_users .flex-table:not(.header) .flex-row { text-align: center !important; } } @media (max-width: 768px) { .__all_users .flex-table:not(.header) .row-btn { min-width: 100% !important; padding-bottom: 1.5rem !important; } } .table-container { display: grid; grid-gap: 5px; } @media (max-width: 768px) { .table-container { margin-left: 0.4375rem; margin-right: 0.4375rem; padding-left: 0 !important; padding-right: 0 !important; padding-bottom: 1.5rem; overflow: scroll; } .table-container::-webkit-scrollbar { height: 3px; background-color: transparent; -webkit-transition: background-color 0.3s ease-in-out; transition: background-color 0.3s ease-in-out; } .table-container::-webkit-scrollbar-thumb { border-radius: 5px; background-color: #ff9551; -webkit-transition: background-color 0.3s ease-in-out; transition: background-color 0.3s ease-in-out; } } .table-container .flex-table { display: flex; grid-gap: 5px; align-items: center; } .table-container .flex-table.header .flex-row { font-weight: 600; font-size: 14px; color: #737373; background-color: transparent; padding: 0 0 5px 0; } @media (max-width: 768px) { .table-container .flex-table.header .flex-row { font-size: 13px; } } .table-container .flex-table:not(.header) .flex-row:first-of-type { font-weight: 500; text-align: left; } @media (max-width: 768px) { .table-container .flex-table:not(.header) .flex-row:first-of-type { min-width: 50vw; } } .table-container .flex-table:not(.header) .row-btn { padding: 0; height: 100%; display: flex; align-items: center; justify-content: center; } @media (max-width: 768px) { .table-container .flex-table:not(.header) .row-btn { padding: 0 1.5rem 0 2rem; } } .table-container .flex-row { padding: 15px; background-color: #fff; border-radius: 5px; text-align: center; font-size: 14px; width: 100%; } .table-container .flex-row .btn { height: auto; padding: 0.6rem 20px; } .ajax-form-project > .row { align-items: flex-end; } .ajax-form-project > .row .btn { min-height: 60px; padding: 0 3rem; } #notificationsSettingsForm h2 { margin: 20px 0 10px 0; color: #ff9551; } #notificationsSettingsForm ul { margin: 20px 0 40px 0; font-size: 13px; list-style-type: none; padding: 0; } #notificationsSettingsForm ul li span { display: block; margin-bottom: 10px; color: #222a40; } #notificationsSettingsForm ul li:not(:last-child) { margin-bottom: 15px; } #notifications-table tr .title a { color: #222a40; } #notifications-table tr .title a:hover { color: #ff9551; } #notifications-table tr.unread .title a { font-weight: 600; } #notifications-table .flex-table .flex-row { text-wrap: nowrap; } #notifications-table .flex-table .title-content { display: block; max-width: 600px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #notifications-table .flex-table .notification-icon:before { color: #ff9551; } /** Notifications icons **/ .notification-icon { /** Calendar **/ /** Task **/ /** Reminder **/ /** Report **/ } .notification-icon:before { font-family: "Font Awesome 5 Free"; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; font-weight: 900; } .notification-icon.icon-default:before { content: "\f0f3"; } .notification-icon.icon-welcome:before { content: "\f0f3"; } .notification-icon.icon-ask-absence:before { content: "\f011"; } .notification-icon.icon-edit-meeting:before { content: "\f4ff"; } .notification-icon.icon-event-cancelled:before { content: "\f05e"; } .notification-icon.icon-new-meeting:before { content: "\f500"; } .notification-icon.icon-set-absence:before { content: "\f011"; } .notification-icon.icon-new-suggestion:before { content: "\f128"; } .notification-icon.icon-approved-absence:before { content: "\f274"; } .notification-icon.icon-refused-absence:before { content: "\f273"; } .notification-icon.icon-approved-meeting:before { content: "\f274"; } .notification-icon.icon-refused-meeting:before { content: "\f273"; } .notification-icon.icon-approved-suggestion:before { content: "\f274"; } .notification-icon.icon-refused-suggestion:before { content: "\f273"; } .notification-icon.icon-mention-task:before { content: "\f10d"; } .notification-icon.icon-assigned-task:before { content: "\f46d"; } .notification-icon.icon-due-task:before { content: "\f017"; } .notification-icon.icon-approve-task:before { content: "\f164"; } .notification-icon.icon-today-task:before { content: "\f783"; } .notification-icon.icon-updated-task:before { content: "\f303"; } .notification-icon.icon-reminder:before { content: "\f0f3"; } .notification-icon.icon-new-shared-report:before { content: "\e098"; } #tasks-state-table .flex-table { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; } #tasks-state-table .flex-table.six-cols { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; } #tasks-state-table .flex-table .order-row { display: flex; flex-direction: column !important; background: transparent; } #tasks-state-table .flex-table .order-row span { display: none; cursor: pointer; } #tasks-state-table .flex-table:hover .order-row span { display: block; } #tasks-state-table .delete-row { cursor: pointer; } #tasks-state-table .delete-row i { margin: 0; color: #222a40; } #tasks-state-table .delete-row:hover i { color: #ff9551; } #tasks-state-table .custom-switch { max-width: 33px; } #tasks-state-table .multiselect-native-select .btn-group { max-width: 85px; } #tasks-state-table .multiselect-native-select .btn-group .multiselect-selected-text { font-size: 11px; } #tasks-state-table .clr-field button { right: 7px; } #tasks-state-table .clr-field input { color: transparent; cursor: pointer; } /** Administration **/ #users-table tbody tr.owner-name td { font-weight: 600; background-color: #e7eaf3; color: #222a40; } #users-table tbody tr.user-item:hover td { background-color: #F8F8F8; }