@import url('https://fonts.googleapis.com/css2?family=Mulish:wght@200;300;400;500;600;700;800;900&display=swap');

.dark:root {
--link-clr: #fafafa;
--linkHover:#9d7135;
--text-light: #767676;
--btn-bg: #272424;
--btn-bg-hover: #232323;
--primary-textclr: #fafafa;
--bgdark: #121212;
--bgsite: rgb(1 5 12);
--bglight:#1e1e1e;
--fsbody: 15px;
--asideWidth: 280px;
--borderClr: #232323;
--boxshadow:5px 5px 10px rgb(0 0 0 / 6%);
--border-radius: 5px;
 
}

.collapse-aside { 
--asideWidth: 70px; 
 
}

:root {
 
--link-clr: #222222;
--linkHover:#9d7135;
--text-light: #7e7a7a;
--btn-bg: #e3e2e2;
--btn-bg-hover: #e3e2e2;
--primary-textclr: #222222;
--bglight:#EFEFEF;
--bgdark: var(--whiteclr);
--bgsite: rgb(243 242 239 / 47%);
--primary-font:  'Mulish', sans-serif;
--fsbody: 15px;
--asideWidth: 280px;
--borderClr: #a7a7a7;
--boxshadow:0 0 30px 0 #e7f0f3;
--border-radius: 5px;
--whiteclr: #ffffff;

--gradient: linear-gradient(93.54deg, #FF5A63 23.08%, #FF7D6B 102.91%);
--btn-hover-bg-clr: linear-gradient(93.54deg, #e13a43 23.08%, #f86d59 102.99%);
 
}


.tcolor{color: var(--linkHover);}
.bg-site {background-color: var(--bgdark); }
.bg-light{ background-color: var(--bglight) !important;} 
.bg-dark {background-color: var(--bgdark);  } 
.bg-transparent{background: transparent !important;}
.text-light{color:var(--text-light);} 
.rtl{direction: rtl;}
.rtl i.ri-arrow-right-s-line {   transform: rotate(180deg);}

*{box-sizing: border-box; padding: 0px; margin: 0px; word-break: break-word;}

/*body:before{content: ""; position: absolute; opacity: 0.25; 
    background: radial-gradient(ellipse at top right, rgb(255, 255, 255) 0%, rgb(13 16 23) 100%);}*/
body{ font-family: var(--primary-font);  font-size: var(--fsbody); font-weight: 400;color: var(--primary-textclr); 
  line-height: 1.7;     background-color: var(--bgsite);}
a{color: var(--link-clr);text-decoration:none;outline: none;}
a:hover{color: var(--linkHover); text-decoration: none;}
a,
.btn,
.transition,
button{-webkit-transition: all .3s;-moz-transition: all .3s;-o-transition: all .3s;transition: all .3s; }
 
h1, h2, h3, h4, h5, h6{ font-family: var(--primary-font); font-weight: 700; line-height: 1.2;  
margin-bottom: 10px; color: var(--primary-textclr); margin: 0px 0px 15px;} 
h1{font-size: 25px;}
h2, .heading-h2{font-size: 20px; }
h3{font-size: 17px;}
h4{font-size: 15px;}
h5{font-size: 14px;}
h6{font-size: 12px;}
img{max-width: 100%;}


button, .btn, input[type="submit"]{ padding:7px 12.5px;cursor: pointer;position: relative;
  font-family: var(--primary-font); box-shadow: none !important;color: var(--primary-textclr);background: var(--btn-bg);letter-spacing: 0;
       font-size: 15px;   font-weight: 400;border-radius: var(--border-radius);text-transform: capitalize; border: 0px; 
       display:flex; height:40px; align-items:center; justify-content:center;
           gap: 5px; }

[type=reset]:hover, [type=submit]:hover, 
button:hover, .btn:hover, html [type=button]:hover  {
  background: var(--btn-bg-hover);  color: var(--primary-textclr);  cursor: pointer;}
[type=reset]:focus, 
[type=submit]:focus,
button:focus, 
.btn:focus, 
html [type=button]:focus { outline: 0; box-shadow: none;}
input[type="file"] { font-size: 16px;   -webkit-appearance: none;}

.dark-btn { background: var(--bgdark);}
.dark-btn:hover,
.dark-btn.active { background: var(--linkHover);}
.dark-btn.btn-hover::before { border-color: var(--linkHover); }
.dark-btn svg path {   fill: var(--primary-textclr);}

html:not(.dark) .dark-btn:hover,
html:not(.dark) .dark-btn.active { color: var(--whiteclr);}

html:not(.dark) .dark-btn:hover svg path,
html:not(.dark) .dark-btn:active svg path {   fill: var(--whiteclr);}



.fill-btn {font-family:Estedad-M; display: inline-block; padding: 13px 20px; height: auto; font-weight: 500; background: var(--linkHover); 
    border-radius: 30px; color: var(--whiteclr);}
.vam{vertical-align: middle;}
.field {margin-bottom: 20px; width: 100%; float: left;}
.field-sm { float: left;  width: 50%;  padding: 0px 10px;}
.field .field-sm:first-child { padding-left: 0px;}
.field .field-sm:last-child { padding-right: 0px;}
.form-group label {display: block;  margin-bottom: 10px;}

.icon-switch_btn .c-active, 
.icon-switch_btn.active .d-active { display: none;}
.icon-switch_btn.active .c-active { display: block;}


form{display: inline-block;width: 100%;}
.form-control {
  outline: none !important;
  padding: 14px 15px;
  border-radius: var(--border-radius);
  border: 1px solid var(--linkHover);
  background: transparent;
  box-shadow:none !important;
  font-size: 15px;
  font-weight: 400;
  color: var(
  --link-clr);
  font-family: var(
  --primary-font);
  width: 100%;
  }
 .form-control:focus {  background-color: transparent;  border-color: inherit;} 
select.form-control:not([size]):not([multiple]) { height: 49px; -webkit-appearance: none;   background-image: url(images/select-arrow.png);
    background-position: 95% center;    background-repeat: no-repeat;}


blockquote { padding: 25px 48px 25px 25px;  border-left: 4px solid #000;
   background: var(--bgbluelight);   font-weight: 400;   position: relative;  line-height: 28px; }
blockquote strong{font-weight:500;}
blockquote:before {content: "";  position: absolute;   top: 0;   right: 0;   border-style: solid;  border-width: 0 41px 41px 0;  
    border-color: #ddd var(--whiteclr);   transition: all ease .5s;}

ul, ol{list-style: none;}
.custom-btn { border-radius: 100%; height: 40px; width: 40px; position: relative; } 
.btn-hover { position: relative; } 
.btn-hover:before {height: 35px; width: 35px; content: ""; position: absolute;   border: 1px solid var(--borderClr); border-radius: 100%;
   opacity: 0; -webkit-transition: all .3s;    -moz-transition: all .3s;    -o-transition: all .3s;    transition: all .3s;  }
.btn-hover:is(:hover):before{animation: btnHover .5s ease-in-out;}
.btn-hover:is(:hover){background: transparent;}
.smbtn-hover:before {height: 25px; width: 25px; }

 /* nochange*/
 
.font-medium{ font-weight: 500;}
.underline {text-decoration: underline;}
 strong { font-weight: 700;}
.font-light{font-weight: 300;}
.font-semi-bold{font-weight: 600;}
button i { vertical-align: middle;}
.br-5{border-radius: var(--border-radius);}
.br-10{border-radius: var(--border-radius);}
.box-shadow{ -webkit-box-shadow: var(--boxshadow);   -moz-box-shadow: var(--boxshadow); -ms-box-shadow: var(--boxshadow); 
    -o-box-shadow: var(--boxshadow);    box-shadow: var(--boxshadow);}  
.object-fit {overflow: hidden;}
.object-fit img { width: 100% !important; height: 100% !important;  object-fit: cover;}
.zoom-hover img {-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
    transition-timing-function: cubic-bezier(0.7,0,0.3,1);
    transition: all .5s;}
.zoom-hover:hover img {transform: scale(1.1);}
.list-style {padding: 0px; list-style: none;}
.list-style li { display: inline-block;}
.ellipse{overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; white-space: normal;}
.ellipse.ellipse2{  -webkit-line-clamp: 2; }
.ellipse.ellipse3{  -webkit-line-clamp: 3;}
.ellipse.ellipse4{  -webkit-line-clamp: 4;}
.border-1 {  border: 1px solid var(--borderClr);}
.bo-bottom{border-bottom: 1px solid;}
.bo-top{border-top: 1px solid;}
.bo-left{border-left: 1px solid; }
.bo-right{border-right: 1px solid;} 
.bo-none{border: 0px !important;}
.bo-bottom,
.bo-top,
.bo-left,
.bo-right{ border-color: var(--borderClr);}  

.absolute{position: absolute;}
.relative{position: relative;}

.white-placeholder .form-control::placeholder {  color:var(--whiteclr); opacity: 1;  }
.white-placeholder .form-control::-webkit-input-placeholder { color:var(--whiteclr); opacity: 1;}
.white-placeholder .form-control::-moz-placeholder {color:var(--whiteclr); opacity:1;}
.white-placeholder .form-control:-ms-input-placeholder {color:var(--whiteclr); opacity: 1;}
.white-placeholder .form-control:-moz-placeholder {color:var(--whiteclr); opacity: 1;}



article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}
audio,canvas,progress,video{display:inline-block;vertical-align:baseline}
.underline {text-decoration: underline;} 
strong { font-weight: 700;} 
.fw-light{font-weight: 300;} 
.float-right{float:right!important}
.float-left{float:left!important}
.fw-normal{ font-weight: 400;} 
.fw-medium{ font-weight: 500;} 
.fw-semibold{font-weight: 600;} 
.fw-bold{font-weight: 700;} 
.ps-1{padding-inline-start: 10px;} 
.ps-2{padding-inline-start: 20px;} 
.ps-3{padding-inline-start: 30px;} 
.ps-4{padding-inline-start: 40px;} 
.ps-5{padding-inline-start: 50px;} 
.pe-1{padding-inline-end: 10px;} 
.pe-2{padding-inline-end: 20px;} 
.pe-3{padding-inline-end: 30px;} 
.pe-4{padding-inline-end: 40px;} 
.pe-5{padding-inline-end: 50px;} 
.pt-1{padding-block-start: 10px;} 
.pt-2{padding-block-start: 20px;} 
.pt-3{padding-block-start: 30px;} 
.pt-4{padding-block-start: 40px;} 
.pt-5{padding-block-start: 50px;} 
.pb-1{padding-block-end: 10px;} 
.pb-2{padding-block-end: 20px;} 
.pb-3{padding-block-end: 30px;} 
.pb-4{padding-block-end: 40px;} 
.pb-5{padding-block-end: 50px;} 

.p1{padding: 10px !important;}
.p2{padding: 20px !important;}
.p3{padding: 30px !important;}
.p4{padding: 40px !important;}
.p5{padding: 50px !important;}


.ms-1{margin-inline-start: 10px;} 
.ms-15{margin-inline-start: 15px;} 
.ms-2{margin-inline-start: 20px;} 
.ms-3{margin-inline-start: 30px;} 
.ms-4{margin-inline-start: 40px;} 
.ms-5{margin-inline-start: 50px;} 

.me-1{margin-inline-end: 10px;} 
.me-2{margin-inline-end: 20px;} 
.me-3{margin-inline-end: 30px;} 
.me-4{margin-inline-end: 40px;} 
.me-5{margin-inline-end: 50px;} 
.me-15{margin-inline-end: 15px;} 

.mt-1{margin-block-start: 10px;} 
.mt-15{margin-block-start: 15px;} 
.mt-2{margin-block-start: 20px;} 
.mt-3{margin-block-start: 30px;} 
.mt-4{margin-block-start: 40px;} 
.mt-5{margin-block-start: 50px;} 

.mb-1{margin-block-end: 10px;} 
.mb-15{margin-block-end: 15px;} 
.mb-2{margin-block-end: 20px;} 
.mb-3{margin-block-end: 30px;} 
.mb-4{margin-block-end: 40px;} 
.mb-5{margin-block-end: 50px;}
.mb-6{margin-block-end: 6px;}


.ps-0{padding-inline-start: 0px !important;}
.pe-0{padding-inline-end: 0px !important;}
.pt-0{padding-block-start: 0px !important;}
.pb-0{padding-block-end: 0px !important;}
.p-0{padding: 0px !important;}
.ms-auto{margin-inline-start: auto !important;}
.ms-0{margin-inline-start: 0px !important;}
.me-0{margin-inline-end: 0px !important;}
.mt-0{margin-block-start: 0px !important;}
.mb-0{margin-block-end: 0px !important;}
.m-0{margin: 0px !important;}
.fs-italic{font-style: italic;}
.m-auto{margin:auto !important;}
.m-inline-auto{margin-inline:auto !important;}
.grid { display: grid;}
.grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr));}
.grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr));}
.grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr));}
.grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr));}
.grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr));}
.grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr));}
.grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr));}
.grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr));}
.grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr));}
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr));}
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr));}
.grid-flow-row { grid-auto-flow: row;}

.grid-rows-12 {  grid-template-rows: repeat(12, minmax(0, 1fr));}
.grid-rows-11 {  grid-template-rows: repeat(11, minmax(0, 1fr));}
.grid-rows-10 {  grid-template-rows: repeat(10, minmax(0, 1fr));}
.grid-rows-9 {  grid-template-rows: repeat(9, minmax(0, 1fr));}
.grid-rows-8 {  grid-template-rows: repeat(8, minmax(0, 1fr));}
.grid-rows-7 {  grid-template-rows: repeat(7, minmax(0, 1fr));}
.grid-rows-6 {  grid-template-rows: repeat(6, minmax(0, 1fr));}
.grid-rows-5 {  grid-template-rows: repeat(5, minmax(0, 1fr));}
.grid-rows-4 {  grid-template-rows: repeat(4, minmax(0, 1fr));}
.grid-rows-3 {  grid-template-rows: repeat(3, minmax(0, 1fr));}
.grid-rows-2 {  grid-template-rows: repeat(2, minmax(0, 1fr));}
.grid-rows-1 {  grid-template-rows: repeat(1, minmax(0, 1fr));}
 
.grid-item2-auto-fit{grid-template-columns: repeat(auto-fit, minmax(482px, 1fr));}
.grid-item3-auto-fit{grid-template-columns: repeat(auto-fit, minmax(382px, 1fr));}
.grid-item4-auto-fit{grid-template-columns: repeat(auto-fit, minmax(282px, 1fr));}
.grid-item5-auto-fit{grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));}



.place-item-center{ place-items: center;}
.place-item-flex-end{ place-items: flex-end;}
.place-item-flex-start{    place-items: flex-start;}
.flex-wrap{flex-wrap: wrap;}

.items-center { align-items: center;}
.text-left {text-align: left;}
.text-center {text-align: center;}
.text-right {text-align: right;}
.text-justify {text-align: justify;}
.pointer{cursor: pointer;}
.d-grid {display: grid!important;}
.w-100{width: 100% !important;}
.gap-10 {gap: 10px;}
.gap-6{gap: 10px;}

.d-flex { display: flex;}
.justify-space-between { justify-content: space-between;}
.justify-content-center { justify-content: center;}

.flex-column{flex-direction: column;}
 
.d-block { display: block;}
.d-in-block { display: inline-block;}
.h-100{height: 100%;}
.h-auto{height: initial !important;}
.dvh-100{height: 100dvh;}
.gap-5 { gap: 5px;}
.gap-10 { gap: 10px;}
.gap-15 { gap: 15px;}
.gap-20 { gap: 20px;}
.gap-30 { gap: 30px;}
.gap-40 { gap: 40px;}

.rgap-5 { row-gap: 5px;}
.rgap-10 { row-gap: 10px;}
.rgap-15 { row-gap: 15px;}
.rgap-20 { row-gap: 20px;}
.rgap-30 { row-gap: 30px;}
.rgap-40 { row-gap: 40px;}

.cgap-5 { column-gap: 5px;}
.cgap-10 { column-gap: 10px;}
.cgap-15 { column-gap: 15px;}
.cgap-20 { column-gap: 20px;}
.cgap-30 { column-gap: 30px;}
.cgap-40 { column-gap: 40px;}

.row { display: flex; flex-wrap: wrap; margin-inline-start: -15px; margin-inline-end: -15px;}
.w-10{flex: 0 0 auto; width: 100%;}
.w-20{flex: 0 0 auto; width: 100%;}
.w-30{flex: 0 0 auto; width: 100%;}
.w-40{flex: 0 0 auto; width: 100%;}
.w-50{flex: 0 0 auto; width: 100%;}
.w-60{flex: 0 0 auto; width: 100%;}
.w-70{flex: 0 0 auto; width: 100%;}
.w-80{flex: 0 0 auto; width: 100%;}
.w-90{flex: 0 0 auto; width: 100%;}
.w-100{flex: 0 0 auto; width: 100%;}

.col{padding-inline-start: 15px; padding-inline-end: 15px;}
.xsw-10{flex: 0 0 auto; width: 10%;}
.xsw-20{flex: 0 0 auto; width: 20%;}
.xsw-30{flex: 0 0 auto; width: 30%;}
.xsw-40{flex: 0 0 auto; width: 40%;}
.xsw-50{flex: 0 0 auto; width: 50%;}
.xsw-60{flex: 0 0 auto; width: 60%;}
.xsw-70{flex: 0 0 auto; width: 70%;}
.xsw-80{flex: 0 0 auto; width: 80%;}
.xsw-90{flex: 0 0 auto; width: 90%;}
.xsw-100{flex: 0 0 auto; width: 100%;}

.modal { position: fixed; top: 0; left: 0; z-index: 1060; display: none; width: 100%; height: 100%; overflow-x: hidden; 
    overflow-y: auto; outline: 0; -webkit-backdrop-filter: blur(4px);  backdrop-filter: blur(4px);   background: rgba(0,0,0,.6); padding: 15px;} 
.fade { transition: opacity .15s linear; }
.modal.show{display: block;}
.modal.show .modal-dialog { transform: none;}
.modal.fade .modal-dialog { transition: transform .3s ease-out;   }
.modal-dialog-centered { display: flex;  align-items: center;  min-height: calc(100% - 1rem);}
.modal-dialog {position: relative; width: auto;  margin: 0.5rem;  pointer-events: none;}
.modal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; 
         background-color: var(--btn-bg-hover); background-clip: padding-box;  border-radius: 0.3rem; outline: 0; 
         border: 1px solid     background-color: var(--bgsite);}
.modal-header { display: flex; flex-shrink: 0;  align-items: center; justify-content: space-between; padding: 1rem 1rem;
     border-top-left-radius: calc(0.3rem - 1px); border-top-right-radius: calc(0.3rem - 1px);}
.modal-body { position: relative;  flex: 1 1 auto; padding: 1rem;}
.cls-btn { position: absolute;  inset-block-start: -20px;  inset-inline-end: -43px;}
.hover-2:hover {background: var(--bgdark);}
html:not(.dark) .modal-content { background: var(--whiteclr);}
html:not(.dark) .hover-2:hover {  background-color: var(--btn-bg-hover);}
html:not(.dark) .txt .radio_btn{background: var(--whiteclr);}
html:not(.dark) .radio_btn:has(input[type="radio"]:checked) {   color: var(--whiteclr);}
html:not(.dark) .chat_content .avtar-icon { background: var(--primary-textclr);}





@media (min-width: 767px){ 
.lg-hide{display: none;}
.w-10{flex: 0 0 auto; width:  10%;}
.w-20{flex: 0 0 auto; width:  20%;}
.w-30{flex: 0 0 auto; width:  30%;}
.w-40{flex: 0 0 auto; width:  40%;}
.w-50{flex: 0 0 auto; width:  50%;}
.w-60{flex: 0 0 auto; width:  60%;}
.w-70{flex: 0 0 auto; width:  70%;}
.w-80{flex: 0 0 auto; width:  80%;}
.w-90{flex: 0 0 auto; width:  90%;}
.w-100{flex: 0 0 auto; width: 100%;}
 
}

@media (min-width: 576px){
.modal-dialog {  width: min(100%, 900px);  margin: 1.75rem auto;}
.modal-dialog-centered { min-height: calc(100% - 3.5rem);}
}


@media (max-width: 991px){ 
.sm-show {display: block !important;}

}

@media (max-width: 767px){ 
.col-xs-12 { -webkit-box-flex: 0;   -ms-flex: 0 0 100%;   flex: 0 0 100%;    max-width: 100%;}
.grid-item2-auto-fit,
.grid-item3-auto-fit,
.grid-item4-auto-fit,
.grid-item5-auto-fit{grid-template-columns: repeat(1, minmax(0, 1fr));}
.xs-scroll{overflow-x: auto;}
}


 
 @keyframes btnHover {

   0% {
       transform: scale(1); 
      opacity: 0;
  }
  50% {
       transform: scale(1.4); 
      opacity: 1;
   }
   100% {
       transform: scale(1.6); 
      opacity: 1;
  }

 }