/*
This resource is dedicated and reserved for Hostfist - hostfist.com, hostfist.in, hostfist.co.in, hostfist.org
*/
:root{
    --color-theme:#FF8C00; --color-white:#f5f5f5; --color-primary:#1100ff75;
    --color-success:#0c610c;  --color-danger:#ff000060;  --color-warning:#ddff005b;
    --color-dark:#1b1b1b;  --color-grey:#808080;  --color-greyish:#D3D3D3;  --muted:#6b7280;

    --shadow-theme:0 0 8px rgba(0,0,0,0.5); --bs-theme:0 6px 18px rgba(0,0,0,0.5);
    --shadow-popup-theme:0 0 64px rgba(0,0,0,0.5);
    --webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}

*{margin:0; padding:0; box-sizing: border-box;}
html{font-size: 16px;}  body{ font-family: 'Comic Sans MS', sans-serif; }
*:hover,*:focus,*{transition: .35s;}
/* Apply scrollbar style only inside .customer-sidebar */
/* Modern slim scrollbar */
::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background-color: var(--color-theme,#FF8C00);
  border-radius: 10px;
  transition: background-color 0.3s ease;
}

::-webkit-scrollbar-thumb:hover {
  background-color: rgba(100, 100, 100, 0.7);
}
@media (prefers-color-scheme: dark) {
  ::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.2);
  }

  ::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255, 255, 255, 0.4);
  }
}


/*  background-color:var(--color-greyish,#D3D3D3);  */
a{text-decoration: none; cursor: pointer;}
/* body::after { content: "Confidential - User123"; position: fixed; top: 40%; left: 20%; font-size: 3rem; color: rgba(255, 0, 0, 0.2); transform: rotate(-30deg); pointer-events: none; } */

/* Hostfist Colors Begins */
.bg-theme{background-color:var(--color-theme,#FF8C00) !important;}
.bg-primary{background-color:var(--color-primary,#1100ff75) !important;}
.bg-success{background-color:var(--color-success,#0c610c) !important;}
.bg-danger{background-color:var(--color-danger,#ff000060) !important;}
.bg-warning{background-color:var(--color-warning,#ddff005b) !important;}
.bg-dark{background-color:var(--color-dark,#1b1b1b) !important;}
.bg-white{background-color:var(--color-white,#f5f5f5) !important;}
.bg-purewhite{background-color:var(--color-purewhite,#FFFFFF) !important;}
.bg-grey{background-color:var(--color-grey,#808080) !important;}
.bg-greyish{background-color:var(--color-greyish,#D3D3D3) !important;}


.text-theme{ color:var(--color-theme,#FF8C00) !important;}
.text-primary{ color:var(--color-primary,#1100ff75) !important;}
.text-success{ color:var(--color-success,#0c610c) !important;}
.text-danger{ color:var(--color-danger,#ff000060) !important;}
.text-warning{ color:var(--color-warning,#ddff005b) !important;}
.text-dark{ color:var(--color-dark,#1b1b1b) !important;}
.text-white{ color:var(--color-white,#f5f5f5) !important;}
.text-purewhite{ color:var(--color-purewhite,#FFFFFF) !important;}
.text-grey{ color:var(--color-grey,#808080) !important;}
.text-greyish{ color:var(--color-greyish,#D3D3D3) !important;}


.border-theme{ border-color:var(--color-theme,#FF8C00) !important;}
.border-primary{ border-color:var(--color-primary,#1100ff75) !important;}
.border-success{ border-color:var(--color-success,#0c610c) !important;}
.border-danger{ border-color:var(--color-danger,#ff000060) !important;}
.border-warning{ border-color:var(--color-warning,#ddff005b) !important;}
.border-dark{ border-color:var(--color-dark,#1b1b1b) !important;}
.border-white{ border-color:var(--color-white,#f5f5f5) !important;}
.border-purewhite{ border-color:var(--color-purewhite,#FFFFFF) !important;}
.border-grey{ border-color:var(--color-grey,#808080) !important;}
.border-greyish{ border-color:var(--color-greyish,#D3D3D3) !important;}
/* Hostfist Colors Ends */

/* Hostfist Fonts Begins */
.fw-normal{font-weight:normal !important;} .fw-600,.fw-lightbold{font-weight:600 !important;} .fw-700{font-weight:700 !important;}  .fw-800,.fw-bold{font-weight:800 !important;}

.fs-quart{font-size:.35rem !important;} .fs-half{font-size:.75rem !important;} .fs-1{font-size:1rem !important;} .fs-125{font-size:1.25rem !important;} .fs-15{font-size:1.5rem !important;} .fs-2{font-size:2rem !important;} .fs-3{font-size:3rem !important;} .fs-4{font-size:4rem !important;}
/* Hostfist Fonts Ends */

/* Hostfist Display Begins */
.d-flex-row{display:flex; flex-direction: column;}
.d-none{display:none;} .d-flex{display: flex;} .d-grid,.d-grid-res-none{display:grid;} .gap-1{grid-gap:1rem; gap:1rem;}
.grid-2,.grid-res-2{grid-template-columns: auto auto;}
.grid-3,.grid-res-3{grid-template-columns: auto auto auto;}
.grid-4,.grid-res-4{grid-template-columns: auto auto auto auto;}
.grid-5,.grid-res-5{grid-template-columns: auto auto auto auto auto;}
/* Hostfist Display Ends */

/* Hostfist Padding Begins */
.p-0{padding:0 !important;} .p-1{padding:1rem !important;} .p-2,.p-res-2{padding:2rem !important;} .p-3,.p-res-3{padding:3rem !important;}
.pt-0{padding-top:0 !important;} .pt-1{padding-top:1rem !important;} .pt-2{padding-top:2rem !important;} .pt-3{padding-top:3rem !important;}
.pb-0{padding-bottom:0 !important;} .pb-1{padding-bottom:1rem !important;} .pb-2{padding-bottom:2rem !important;} .pb-3{padding-bottom:3rem !important;}
.ptb-0{padding-top:0rem !important; padding-bottom:0rem !important;} .ptb-1{padding-top:1rem !important; padding-bottom:1rem !important;} .ptb-2{padding-top:2rem !important; padding-bottom:2rem !important;} .ptb-3{padding-top:3rem !important; padding-bottom:3rem !important;}
/* Hostfist Padding Ends */

/* Hostfist Margin Begins */
.m-auto{margin:auto !important;}
.mt-0{margin-top:0 !important;} .mt-1{margin-top:1rem !important;} .mt-2{margin-top:2rem !important;} .mt-3{margin-top:3rem !important;}
.mtb-0{margin-top:0rem !important; margin-bottom:0rem !important;} .mtb-1{margin-top:1rem !important; margin-bottom:1rem !important;} .mtb-2{margin-top:2rem !important; margin-bottom:2rem !important;} .mtb-3{margin-top:3rem !important; margin-bottom:3rem !important;}
/* Hostfist Margin Ends */


.bs-theme{box-shadow:var(--bs-theme,0 6px 18px rgba(0,0,0,0.5)) !important;}

.border-50{border-radius:50%;}

.place-center{place-items: center;} .align-center{align-items: center;} .justify-center{justify-content: center;}  .text-center{text-align: center;} .text-right{text-align: right;}

.td-strike{text-decoration: line-through;}

.banner-res{width:18rem;}

/* Hostfist Navbar Begins */
.nav{display:grid; grid-template-columns: auto auto; background-color: var(--color-white,#f5f5f5); padding:.75rem 1rem; box-shadow: var(--shadow-theme,0 0 8px rgba(0,0,0,0.5)); z-index:9999; }
.nav-fixed{position:fixed; width:100%; top:0; left:0;} .nav-brand-link{display:flex; align-items: center; font-size:1.5rem; color:var(--color-theme,#FF8C00);} .nav-brand{display:grid; justify-content: center;}
.nav-toggle,.customer-sidebar-toggle{display:none;}
.nav-menu{list-style-type: none; display:flex; flex-wrap: nowrap; align-items: center;}
.nav-menu li{padding:0 2rem; position:relative; width:100%; } .nav-link{padding:0.2rem 2rem; color:var(--color-dark,#1b1b1b); }
.nav-link:hover,.nav-link:focus{ color:var(--color-grey,#808080); }
.nav-dropdown{position:relative;} .nav-dropdown:after{content:"\276E"; display:inline-block; transform: rotate(-90deg); position: absolute; right:0;}
.nav-dropdown-list{ position: absolute; top:150%; display:none; grid-gap:1rem; background-color: var(--color-white,#f5f5f5); box-shadow: var(--shadow-theme-bottom,0 2px 4px rgba(0,0,0,0.5)); padding:1rem; border-radius: .25rem; z-index:9998;}
.nav-center > .nav-link{display:grid; place-items: center;}
/* Hostfist Navbar Ends */
/* Hostfist Footer Begins */
.footer{background-color: var(--color-white,#f5f5f5);}  .footer-head{text-transform: uppercase; font-weight: 600;}
.footer-link{text-transform: capitalize; color:var(--color-grey,#898089);}
.footer-link:hover,.footer-link:focus{color:var(--color-dark,#1b1b1b);}
.footer-copy{background-color: var(--color-greyish,#D3D3D3); padding:.5rem; text-align: center;}
/* Hostfist Footer Ends */


/* Hostfist Buttons Begins */
.btn{padding:.5rem 1.5rem; border:none; border-radius: .25rem; border:.05rem solid; text-transform: capitalize; cursor:pointer;}
.btn-theme{ border-color:var(--color-theme,#FF8C00); background-color:var(--color-theme,#FF8C00); color:var(--color-white,#f5f5f5); }
.btn-theme:hover,.btn-theme:hover{color:var(--color-primary,#FF8C00); background-color:var(--color-white,#f5f5f5); }
.btn-primary{ border-color:var(--color-primary,#1100ff75); background-color:var(--color-primary,#1100ff75); color:var(--color-white,#f5f5f5); }
.btn-primary:hover,.btn-primary:hover{color:var(--color-primary,#1100ff75); background-color:var(--color-white,#f5f5f5); }
.btn-cross{position:absolute; left:-0.5rem; top:-1.5rem; font-weight:700; background-color: transparent; border:none; outline:none; font-size:1.25rem; cursor: pointer; }
/* Hostfist Buttons Ends */

/* Hostfist Cards Begins */
.card{ margin:.5rem; border-radius:.25rem; box-shadow: var(--shadow-theme,0 0 8px rgba(0,0,0,0.5)); }
.card-head{font-size:1.5rem; font-weight:600; text-align: right; position:relative; }
/* Hostfist Cards Ends */

/* Hostfist Form Begins */
.label{display:block; font-weight:600;}
.input{width:100%; font-size:1rem; border:none; border-bottom:2px solid var(--color-dark,#1b1b1b); padding:.35rem 1.25rem; outline:none; resize:none; }
textarea{ border:2px solid var(--color-dark,#1b1b1b); outline:2px solid var(--color-grey,#808080); }
/* Hostfist Form Ends */

/* Hostfist Horizontal Slideshow Begins */
.swiper-container {position: relative; width: 100%; padding: 20px 0; overflow: hidden; }
.swiper-slide { background-color: var(--color-primary,#1100ff75); display: grid; justify-content: center; align-items: center; font-size: 18px; height: auto; overflow: hidden; border-radius: 10px;  }
.swiper-button-next, .swiper-button-prev { color: var(--color-dark,#1b1b1b); }
/* Hostfist Horizontal Slideshow Ends */


/* Hostfist Icons Begins */
.icon-point-right:after{content:"\2799";} .icon-quote-open:after{content:"\275D";}
.icon-quote-close:after{content:"\275E";} .icon-tick-success:after{content:"\2714"; color:var(--color-success,#0c610c);}
/* Hostfist Icons Ends */


/* Legal Style Begins */
nav.toc{ display:grid; grid-template-columns: auto auto auto auto auto auto; margin:18px 0; border-left:5px solid var(--color-theme); padding-left:14px; }
nav.toc a{ color:#0b71d0; text-decoration:none; display:inline-block; margin:6px 0; font-size:15px; }
.meta{ color:var(--muted);  font-size:13px; } .small{  color:var(--muted);  font-size:13px; }
/* Legal Style Ends */


/* LoggedIn Customer CSS Begins */
.customer-section{width:100%; display:flex; }
.customer-menus{width:20%;} .customer-content{width:80%; padding:1rem; max-height:calc(100vh - 5rem); height:auto;  overflow-y:auto; overflow-x:hidden; }
.customer-sidebar{position:relative; width:100%; max-height:calc(100vh - 5rem); height:auto; display:grid; grid-template-columns: auto; overflow-y:auto; overflow-x:hidden; box-shadow:var(--bs-theme,0 6px 18px rgba(0,0,0,0.5));}
.side-menu-profile{ border-radius: 50%; box-shadow:var(--bs-theme,0 6px 18px rgba(0,0,0,0.5)); }
.side-menu-urls{position: relative;}
.side-menu-urls .side-menu-link{padding:1rem 0.5rem; transition: 0.35s; border-bottom: 2px solid var(--color-greyish,#D3D3D3); color:var(--color-dark,#1b1b1b); display: flex; align-items:center; gap:1rem; }
.side-menu-urls .side-menu-link:hover,.side-menu-urls .side-menu-link:focus,.side-menu-urls .side-menu-link.active{ background-color:var(--color-greyish,#D3D3D3);}
.border-bottom{ border-bottom: 2px solid var(--color-greyish,#D3D3D3); }
.cutomer-sidebar-popup{ bottom:3rem; right: 3rem; }
.cutomer-sidebar-popup,.customer-popup{position:fixed; z-index:999;}
.customer-popup{top:25%; left:35%; width:50%; }
.customer-popup .card{box-shadow: var(--shadow-popup-theme,0 0 64px rgba(0,0,0,0.5));}
/* LoggedIn Customer CSS Ends */





@media only screen and (max-width:996px){ .grid-res-5{ grid-template-columns: auto auto auto; }  }
@media only screen and (max-width:768px){ html{font-size:15px;} .nav-toggle{display:block; text-align:right;}
.nav-menu{left:0; position:fixed; width:100%; height:100%; background-color:var(--color-white,#f5f5f5); display:none; z-index:12999; }
    .nav-menu li{margin-top:2rem;} .nav{ grid-template-columns: auto auto auto;}
    .nav-dropdown-list{width:100%; left:0; top:100%; } .d-grid-res-none,.customer-sidebar-toggle{display:block;}
    .w-vw-full{width:calc(100vw - 2vw);} .d-res-grid-center{display:grid; text-align: center;}
    .grid-res-2,.grid-res-3,.grid-res-4,.grid-res-5{grid-template-columns: auto;}
    .p-res-2,.p-res-3{padding:1rem !important;} .customer-section{display: grid;}
    .customer-content{width:100%;} .customer-menus{display:none;}
    .customer-sidebar{position:fixed; z-index:999; background-color:var(--color-white,#f5f5f5); width:75%; max-height:calc(100vh - 3.5rem); }
    .customer-popup{top:20%; left:2.5%; width:95%; }
}
@media only screen and (max-width:1120px){ nav.toc{  grid-template-columns: auto auto auto; } }
@media only screen and (max-width:996px){ nav.toc{  grid-template-columns: auto auto; } }
@media only screen and (max-width:768px){ nav.toc{  grid-template-columns: auto; } }
@media only screen and (max-width:300px){ .customer-sidebar{  width:100%; } }

